/*
Copyright (c) 2007, Meltmedia. All rights reserved.
version: 0.0.1
*/

/**
 * The SlideDeck Widget mangages a series of images to be displayed in a slide show format.
 *
 * @namespace meltmedia.widget
 * @module SlideDeck
 */

/**
 * SlideDeck
 */
meltmedia.widget.SlideDeck = function(el, userConfig) {
    if(arguments.length > 0) {
        meltmedia.widget.SlideDeck.superclass.constructor.call(this, el, userConfig);
    }
};

YAHOO.extend(meltmedia.widget.SlideDeck, YAHOO.widget.Panel);

// Define the CSS class for the SlideDeck
meltmedia.widget.SlideDeck.CSS_SLIDEDECK = "slidedeck";

// Define the HTML Footer for the SlideDeck
meltmedia.widget.SlideDeck.NAV_FOOTER_HTML = "<a id=\"$dlDeck.id\" href='javascript:void(null)' class='deck' target='_blank'>Download Entire Deck</a><a id=\"$back.id\" href=\"javascript:void(null)\" class=\"back\">Previous</a><a id=\"$next.id\" href=\"javascript:void(null)\" class=\"next\">Next</a><a id='$dlSlide.id' href='javascript:void(null)' class='slide' target='_blank'>Download Current Slide</a>";

/**
 * Override the setFooter command to draw the footer from the HTML Contents
 * @method setFooter
 * @param footerContent
 */

meltmedia.widget.SlideDeck.prototype.setFooter = function(footerContent) {
		if (! this.footer) {
			this.footer = document.createElement("div");
			this.footer.className = YAHOO.widget.Module.CSS_FOOTER;
		}

    if(typeof footerContent == "undefined") {
        var html = this.footer.innerHTML.toString();
        html = html.replace("$dlDeck.id",this.id+"_deck").replace("$back.id",this.id+"_back").replace("$next.id",this.id+"_next").replace("$dlSlide.id",this.id+"_slide");
        this.footer.innerHTML = html;
    } else if (typeof footerContent == "string") {
        this.footer.innerHTML = footerContent;
		} else {
        this.footer.innerHTML = "";
        this.footer.appendChild(footerContent);
		}

		this.changeFooterEvent.fire(footerContent);
		this.changeContentEvent.fire();
}

/**
 * Initialize the SlideDeck and set the footer content
 * @method init
 */
meltmedia.widget.SlideDeck.prototype.init = function(el, userConfig) {
    meltmedia.widget.SlideDeck.superclass.init.call(this, el);
    
    this.beforeInitEvent.fire(meltmedia.widget.SlideDeck);
    YAHOO.util.Dom.addClass(this.innerElement, meltmedia.widget.SlideDeck.CSS_SLIDEDECK);

    if(userConfig) {
        this.cfg.applyConfig(userConfig, true);
    }
    
    this.setFooter();
    
    this.renderEvent.subscribe(function() {
            var back = document.getElementById(this.id+"_back");
            var next = document.getElementById(this.id+"_next");
            var dlSlide = document.getElementById(this.id+"_slide");
            var dlDeck = document.getElementById(this.id+"_deck");
            
            YAHOO.util.Event.addListener(back, "mousedown", this.back, this, true);
            YAHOO.util.Event.addListener(next, "mousedown", this.next, this, true);
            YAHOO.util.Event.addListener(dlSlide, "mousedown", this.dlSlide, this, true);
            YAHOO.util.Event.addListener(dlDeck, "mousedown", this.dlDeck, this, true);
        }, this, true);

    this.initEvent.fire(meltmedia.widget.SlideDeck);
};

/**
 * Set up the SlideDeck's "slide" property for creating the list of slides
 * @method initDefaultConfig
 */
meltmedia.widget.SlideDeck.prototype.initDefaultConfig = function() {
    meltmedia.widget.SlideDeck.superclass.initDefaultConfig.call(this);

    this.cfg.addProperty("count", {handler:this.configCounter, suppressEvent:true});        
    this.cfg.addProperty("slides", {handler:this.configSlides, suppressEvent:true});
    this.cfg.addProperty("fulldeck", {handler:this.setDeckURL, suppressEvent:true});
};

/**
 * Handler executed if counter is enabled
 * @method updateCount
 */

meltmedia.widget.SlideDeck.prototype.configCounter = function(type, args, obj) {
    if(args[0]) this.counter = args[0];
}

/**
 * Handler executed when the "fulldeck" property is modified
 * @method setDeckURL
 */
meltmedia.widget.SlideDeck.prototype.setDeckURL = function(type, args, obj) {
    if(args[0]) this.fulldeck = args[0];
}

/**
 * Handler executed when the "slides" property is modified
 * @method configPhotos
 */
meltmedia.widget.SlideDeck.prototype.configSlides = function(type, args, obj) {
    var slides = args[0];

    if (slides) {
        this.images = [];

        if (! (slides instanceof Array)) {
            slides = [slides];
        }

        this.currentImage = 0;

        if (slides.length == 1) {
            this.footer.style.display = "none";
        }

	this.getImage(slides[0]);
        this.setImage(0);
    }
};

meltmedia.widget.SlideDeck.prototype.getImage = function(slide) {
    var img = new Image();
    img.src = slide.src;
    img.title = slide.title;
    img.description = slide.description;
    img.id = this.id + "_img";
    img.width = 400;
    this.images[this.images.length] = img;
}

// Sets the current image displayed in the SlideDeck to the corresponding image in the slide dataset, 
// and determines whether back and forward arrows should be diplsayed, based on the position in the dataset
meltmedia.widget.SlideDeck.prototype.setImage = function(index) {
    var slides = this.cfg.getProperty("slides");

    if (slides) {
        if (! (slides instanceof Array)) {
            slides = [slides];
        }

        var back = document.getElementById(this.id + "_back");
        var next = document.getElementById(this.id + "_next");
        var img =  document.getElementById(this.id + "_img");
        var title = document.getElementById(this.id + "_title");
        var desc = document.getElementById(this.id + "_desc");

        this.currentImage = index;

        var count;
        if(this.counter == true) {
            count = document.getElementById(this.id + "_counter");
            count.innerHTML = this.currentImage+1 + " of " + slides.length;
        }

        var current = this.images[index];
	if(this.images[index+1] == undefined && slides.length > index+1) {
	    this.getImage(slides[index+1]);
	}

	var imgNode = document.createElement("IMG");
	imgNode.setAttribute("src",current.src);
	imgNode.setAttribute("title",current.title);
	imgNode.setAttribute("width",500);
	imgNode.setAttribute("id",current.id);

        img.parentNode.replaceChild((this.browser == "safari"?imgNode:current), img);

        this.body.style.height = "auto";

        title.innerHTML = current.title;
        desc.innerHTML = current.description;

        if (this.currentImage == 0) {
            back.style.display = "none";

            // Special case to center nav buttons
            back.parentNode.style.left = "37px";
        } else {
            back.style.display = "block";
            
            // Special case to center nav buttons
            back.parentNode.style.left = "0";
        }

        if (this.currentImage == (slides.length-1)) {
            next.style.display = "none";
        } else {
            next.style.display = "block";
        }
    }
};

/**
 * Navigation controls for going forward and backwards as well as download methods
 * @method next
 * @method back
 * @method dlSlide
 * @method dlDeck
 */

// Navigates to the next image
meltmedia.widget.SlideDeck.prototype.next = function() {	
    if (typeof this.currentImage == 'undefined') {
        this.currentImage = 0;
    }
    
    this.setImage(this.currentImage+1);
};

// Navigates to the previous image
meltmedia.widget.SlideDeck.prototype.back = function() {
    if (typeof this.currentImage == 'undefined') {
        this.currentImage = 0;
    }

    this.setImage(this.currentImage-1);
};

// Downloads the current slide
meltmedia.widget.SlideDeck.prototype.dlSlide = function() {
    var dlSlide = document.getElementById(this.id + "_slide");
    dlSlide.href = this.getCurrentSlide().src;
};

// Downloads the full slide deck
meltmedia.widget.SlideDeck.prototype.dlDeck = function() {
    var dlDeck = document.getElementById(this.id + "_deck");
    dlDeck.href = this.fulldeck;
};

/**
 * Method to handle acquiring the current active slide to obtain the slide download information
 * @Method getCurrentSlide
 */
meltmedia.widget.SlideDeck.prototype.getCurrentSlide = function () {
    var slides = this.cfg.getProperty("slides");

    if(slides) {
        return slides[this.currentImage];
    }
    return false;
}