﻿function Viewer(viewerElement, coverElement)
{
    this.m_Viewer = viewerElement;
    this.m_Title = FP_getObjectByID('imageTitle', viewerElement);
    this.m_Pic = FP_getObjectByID("pictureLayer", viewerElement);
    this.m_Links = FP_getObjectByID("tagLinks", viewerElement);
    this.m_PicImage = FP_getObjectByID("image", this.m_Pic);
    this.m_Image = null;
    this.m_Controls = new ViewerControls(viewerElement);
}

Viewer.prototype.visible = function(show)
{
    ///<summary>Shows or hides the image viewer.</summary>
    log('showViewer(visible = ' + show + ')', 0);
    if(this.m_Viewer)
    {
        this.m_Viewer.style.visibility = (show == true ? "visible" : "hidden");
    }
    
    if(this.m_Controls)
    {
        this.m_Controls.visible(show);
    }
}

Viewer.prototype.showImage = function(pictures, index) {
    ///<summary>Shows the main image for the picture.</summary>
    var pictureElement = pictures[index];
    var oImage = selectSingleNode(pictureElement, "Image[@type='GalleryImage']");
    if (oImage == null) {
        log('Image has no GalleryImage', 3);

        oImage = pictureElement.childNodes[0];
    }

    this.m_Image = oImage;
    this.m_PicImage.title = pictureElement.getAttribute('description');
    this.m_PicImage.src = oImage.getAttribute('src');

    this.m_Title.innerHTML = pictureElement.getAttribute('description');

    var tagNodes = selectNodes(pictureElement, "Tag");
    if (tagNodes != null) {
        var tagLinks = new String();

        for (i = 0; i < tagNodes.length; i++) {
            var tag = tagNodes[i];
            if (i != 0) {
                tagLinks += " ; ";
            }
            tagLinks += "<a href='Gallery.html?" + tag.getAttribute("id") + "'>" + tag.getAttribute("name") + "</a>";
        }

        this.m_Links.innerHTML = tagLinks;
    }
    else {
        this.m_Links.innerHTML = '';
    }
    
    if(this.m_Controls)
    {
        this.m_Controls.Update(index, pictures.length);
    }
}

Viewer.prototype.refreshImage = function() {
    ///<summary>Updates the image after it's loaded.</summary>
    this.m_Pic.style.width = this.m_Image.getAttribute('width') + "px";
    this.m_PicImage.style.width = this.m_Image.getAttribute('width') + "px";
    this.m_PicImage.style.height = this.m_Image.getAttribute('height') + "px";
}