ChaptersPanel = function ChaptersPanel(container, containingWindow, id) {
    ChaptersPanel.initializeBase(this, [container, containingWindow, id, false]);
}
ChaptersPanel.prototype = {
    _chaptersContainer: null,
    _chaptersMessage: null,
    _closeButton: null,
    _chaptersTitleText: null,
    _isHeightInitialized: false,
    IsShowing: false,

    OnLoad: function ChaptersPanel$OnLoad() {
        this._initialize();
    },

    OnUnLoad: function ChaptersPanel$OnUnLoad() {
    },

    _initialize: function ChaptersPanel$_initialize() {
        if (Manifest.Chapters.length < 1) {
            if ($('btnChapters')) {$('btnChapters').style.display = "none";}
            this.Hide();
            return;
        }

        this._chaptersTitleText = $('ChapterPointsPanelTitleText');
        SfKernel.Util.SetText(this._chaptersTitleText, Localization.ThumbnailsResource.Chapters);

        this._closeButton = $('ChapterPointsPanelCloseButton');
        this._closeButton.setAttribute('title', Localization.LinksResource.Close);
        this._closeButton.observe('mouseover', Function.createDelegate(this, this._closeButtonOnMouseOver));
        this._closeButton.observe('mouseout', Function.createDelegate(this, this._closeButtonOnMouseOut));
        this._closeButton.observe('click', Function.createDelegate(this, this._closeButtonOnClick));
        this._chaptersMessage = $('ChapterPointsPanelDialogMessage');
        this.elements = new Array(Manifest.Chapters.length);
        for (var i = 0; i < Manifest.Chapters.length; ++i) {
            this._addChapterElement(i + 1);
            this.elements[i] = new ChapterPointElement(this, i + 1, Manifest.Chapters[i].Time);
            this.elements[i].addEvents();
        }
        this._chaptersContainer = $('ChapterPointsPanel');
    },

    Show: function ChaptersPanel$Show() {
        $(this.ID).style.display = 'block';
        this.IsShowing = true;
        // firefox 2 on mac has an issue with scrollbars showing through, so we disable them when we pop a box.
        if ($('CurrentSlideArea').offsetLeft == ($('PresentationCardArea').offsetLeft + 1)) {
            $('PresentationCardAreaScrollDiv').style.overflowY = 'hidden';
        }
    },

    Hide: function ChaptersPanel$Hide() {
        $(this.ID).style.display = 'none';
        this.IsShowing = false;
    },

    _initializeHeight: function ChaptersPanel$_initializeHeight() {
        var containerHeight = this.GetDiv().getHeight() - $(this.ID + 'Heading').getHeight() - 2;
        $(this.ID + 'Container').setStyle({ height: containerHeight + 'px' });
        this._isHeightInitialized = true;
    },

    _onPlay: function ChaptersPanel$_onPlay(sender, args) {
    },

    _closeButtonOnMouseOver: function ChaptersPanel$_closeButtonOnMouseOver(sender, args) {
        this._closeButton.className = 'dialogCloseButtonOver';
    },

    _closeButtonOnMouseOut: function ChaptersPanel$_closeButtonOnMouseOut(sender, args) {
        this._closeButton.className = 'dialogCloseButtonNormal';
    },

    _closeButtonOnClick: function ChaptersPanel$_closeButtonOnClick(sender, args) {
        this._closeButton.className = 'dialogCloseButtonNormal'; //add onclick state?
        this.Hide();
    },

    _addChapterElement: function(chapterNumber) {
        var div1 = this._createDiv('chapterDiv' + chapterNumber, 'chapterItem', null);
        this._chaptersMessage.appendChild(div1);
        var div2 = this._createDiv('chapterNumberSpan' + chapterNumber, 'chapterNumber', 'Chapter ' + chapterNumber);
        div1.appendChild(div2);
        var div3 = this._createDiv('chapterTimeSpan' + chapterNumber, 'chapterTime', SfKernel.GetDisplayDuration(Manifest.Chapters[chapterNumber - 1].Time));
        div1.appendChild(div3);
        var div4 = this._createDiv('chapterTitleSpan' + chapterNumber, 'chapterTitle', SfKernel.EncodeClean(Manifest.Chapters[chapterNumber - 1].Text));
        div4.title = SfKernel.EncodeClean(Manifest.Chapters[chapterNumber - 1].Text);
        div1.appendChild(div4);
    },

    _createDiv: function(id, className, text) {
        var element = $(document.createElement('div'));
        element.setAttribute('id', id);
        element.className = className;
        if (text) {
            SfKernel.Util.SetText(element, text);
        }
        return element;
    }
}    

ChapterPointElement = function(parentArea, chapterNumber, timing) {
    this._parentArea = parentArea;
    this._chapterNumber = chapterNumber;
    this._timing = timing;
    this._titleElement = $('chapterTitleSpan' + this._chapterNumber);
    this._chapterElement = $('chapterDiv' + this._chapterNumber);

    this.addEvents = function() {
        this._chapterElement.observe('mouseover', Function.createDelegate(this, function(sender, args) {
            this._chapterElement.className = 'chapterItemOver';
            this._titleElement.className = 'chapterTitleOver';
            SfKernel.Util.SetCursor(this._chapterElement, SfKernel.CursorType.Hand);
        }));
        this._chapterElement.observe('mouseout', Function.createDelegate(this, function(sender, args) {
            this._chapterElement.className = 'chapterItem';
            this._titleElement.className = 'chapterTitle';
            SfKernel.Util.SetCursor(this._chapterElement, SfKernel.CursorType.Default);
        }));
        this._chapterElement.observe('click', Function.createDelegate(this, function(sender, args) {
            mPlayer.EventManager.PostCommandEvent(SfKernel.CommandEventId.NavigateToChapter, this, { Number: this._chapterNumber, Time: this._timing });
        }));
        this._chapterElement.observe('dblclick', Function.createDelegate(this, function(sender, args) {
            mPlayer.EventManager.PostCommandEvent(SfKernel.CommandEventId.NavigateToChapter, this, { Number: this._chapterNumber, Time: this._timing });
            mPlayer.btnSlideShowInstance.OnClick();
        }));
    }
}

LinksPanel = function LinksPanel(container, containingWindow, id) {
    LinksPanel.initializeBase(this, [ container, containingWindow, id, false ]);
}
LinksPanel.prototype = {
    _linksContainer: null,
    _closeButton: null,
    _linksTitleText: null,
    _isHeightInitialized: false,
    IsShowing: false,
    
    OnLoad: function LinksPanel$OnLoad() {
        this._initialize();
    }, 
    
    OnUnLoad: function LinksPanel$OnUnLoad() {
    },
    
    _initialize: function LinksPanel$_initialize() {
        if (Manifest.SupportingLinks.length < 1) {
            this.Hide();
            return;
        }
        
        this._linksTitleText = $(this.ID + 'LinksTitleText');
        SfKernel.Util.SetText(this._linksTitleText, Localization.LinksResource.PresentationLinks);
        
        this._closeButton = $(this.ID + 'CloseButton');
        this._closeButton.setAttribute('title', Localization.LinksResource.Close);
        this._closeButton.observe('mouseover', Function.createDelegate(this, this._closeButtonOnMouseOver));
        this._closeButton.observe('mouseout', Function.createDelegate(this, this._closeButtonOnMouseOut));
        this._closeButton.observe('click', Function.createDelegate(this, this._closeButtonOnClick));
        
        this._linksContainer = $(this.ID + 'Container');
        for (var i = 0; i < Manifest.SupportingLinks.length; ++i) 
        {
            this._appendLinkElement(Manifest.SupportingLinks[i], (!(i % 2)));
        }
    },
    
    Show: function LinksPanel$Show() {
        $(this.ID).style.display = 'block';
        this.IsShowing = true;
        // firefox 2 on mac has an issue with scrollbars showing through, so we disable them when we pop a box.
        if($('CurrentSlideArea').offsetLeft == ($('PresentationCardArea').offsetLeft+1))
        {
            $('PresentationCardAreaScrollDiv').style.overflowY = 'hidden';
        }	
    },
    
    Hide: function LinksPanel$Hide() {
        $(this.ID).style.display = 'none';
        this.IsShowing = false;
    },
    
    _initializeHeight: function LinksPanel$_initializeHeight() {
        var containerHeight = this.GetDiv().getHeight() - $(this.ID + 'Heading').getHeight() - 2;
        $(this.ID + 'Container').setStyle({ height: containerHeight + 'px' });
        this._isHeightInitialized = true;
    },
    
    _onPlay: function LinksPanel$_onPlay(sender, args) {
    },
    
    _closeButtonOnMouseOver: function LinksPanel$_closeButtonOnMouseOver(sender, args) {
        this._closeButton.className = 'dialogCloseButtonOver';
    },
    
    _closeButtonOnMouseOut: function LinksPanel$_closeButtonOnMouseOut(sender, args) {
        this._closeButton.className = 'dialogCloseButtonNormal';
    }, 
     
    _closeButtonOnClick: function LinksPanel$_closeButtonOnClick(sender, args) {
        this._closeButton.className = 'dialogCloseButtonNormal'; //add onclick state?
        this.Hide();
    },   
    
    _appendLinkElement: function LinksPanel$_appendLinkElement(link, isEven) {
        var element = document.createElement('div');
        this._linksContainer.appendChild(element);
        element.className = (isEven) ? 'linksItem' : 'linksItemAlt';
        var a = document.createElement('a');
        element.appendChild(a);
        a.setAttribute('href', link.Url);
        a.setAttribute('target', 'new');
        a.setAttribute('title', link.Url);
        a.appendChild(document.createTextNode(link.Description));
    }
}