// -------------------------------------------------------------------
// Image Thumbnail Viewer Script- By Belogix Limited
// -------------------------------------------------------------------

var thumbnailviewer =
{
    targetlinks: [], //Array to hold links with rel="thumbnail"

    // Load image function that gets attached to each link on the page with rel="thumbnail"
    loadimage: function(link) {
        //Construct HTML for shown image
        var imageHTML = '<img src="' + link.getAttribute("href") + '" />'
        imageHTML += '<br />' + link.getAttribute("title")

        //Populate thumbImage div with shown image's HTML (while still hidden)
        //document.getElementById("thumbImage").innerHTML=imageHTML
        document.getElementById("imgMain").src = link.getAttribute("href")
        document.getElementById("lblDescription").innerHTML = link.getAttribute("title")

    },


    // Clean up routine on page unload
    cleanup: function() {
        // Clear down all the onclick events in the <a> elements
        for (var i = 0; i < this.targetlinks.length; i++)
            this.targetlinks[i].onclick = null
    },


    // Assign a function to execute to an event handler (ie: onunload)
    dotask: function(target, functionref, tasktype) {
        // Get the task type
        var tasktype = (window.addEventListener) ? tasktype : "on" + tasktype
        if (target.addEventListener)
            target.addEventListener(tasktype, functionref, false)
        else if (target.attachEvent)
            target.attachEvent(tasktype, functionref)
    },


    // Initialize thumbnail viewer script by scanning page and attaching appropriate function to links with rel="thumbnail"
    init: function() {
        // Get all <a> elements on the page
        var pagelinks = document.getElementsByTagName("a")
        for (var i = 0; i < pagelinks.length; i++) {
            // If the rel attribute is set to "thumbnail" then we want to manipulate
            if (pagelinks[i].getAttribute("rel") && pagelinks[i].getAttribute("rel") == "belogixthumbnail") {

                // Load the first image
                this.loadimage(pagelinks[i]);

                // Set the onclick event to this function...
                pagelinks[i].onclick = function() {
                    // Wire up to the loadimage function
                    thumbnailviewer.loadimage(this)
                    return false
                }

                // Store the link in the array
                this.targetlinks[this.targetlinks.length] = pagelinks[i]
            }
        }

        // Load the first image
        this.loadimage(this.targetlinks[0]);

    }

}	// End thumbnailviewer


// Wire the page load and unload events
thumbnailviewer.dotask(window, function(){thumbnailviewer.init()}, "load") //Initialize script on page load
thumbnailviewer.dotask(window, function(){thumbnailviewer.cleanup()}, "unload")