YAHOO.namespace("example.container");

// BEGIN PHOTOBOX SUBCLASS //
YAHOO.widget.PhotoBox = function(el, userConfig) {
    if (arguments.length > 0) {
        YAHOO.widget.PhotoBox.superclass.constructor.call(this, el, userConfig);
    }
}

// Inherit from YAHOO.widget.Panel
YAHOO.extend(YAHOO.widget.PhotoBox, YAHOO.widget.Panel);

// Define the CSS class for the PhotoBox
YAHOO.widget.PhotoBox.CSS_PHOTOBOX = "photobox";

// Define the HTML for the footer navigation
YAHOO.widget.PhotoBox.NAV_FOOTER_HTML = "<a id=\"$back.id\" href=\"javascript:void(null)\" class=\"back\"><img src=\"http://vidofon-gmbh.webseiten.cc/relaunch_0702/img/ybox-back.gif\" /></a><a id=\"$next.id\" href=\"javascript:void(null)\" class=\"next\"><img src=\"http://vidofon-gmbh.webseiten.cc/relaunch_0702/img/ybox-next.gif\" /></a>";

// Initialize the PhotoBox by setting up the footer navigation
YAHOO.widget.PhotoBox.prototype.init = function(el, userConfig) {
    
    YAHOO.widget.PhotoBox.superclass.init.call(this, el);

    this.beforeInitEvent.fire(YAHOO.widget.PhotoBox);

    YAHOO.util.Dom.addClass(this.innerElement, YAHOO.widget.PhotoBox.CSS_PHOTOBOX);

    if (userConfig) {
        this.cfg.applyConfig(userConfig, true);
    }

    this.setFooter(YAHOO.widget.PhotoBox.NAV_FOOTER_HTML.replace("$back.id",this.id+"_back").replace("$next.id",this.id+"_next"));

    this.renderEvent.subscribe(function() {
        var back = document.getElementById(this.id + "_back");
        var next = document.getElementById(this.id + "_next");

        YAHOO.util.Event.addListener(back, "mousedown", this.back, this, true);
        YAHOO.util.Event.addListener(next, "mousedown", this.next, this, true);

    }, this, true);

    this.initEvent.fire(YAHOO.widget.PhotoBox);
};

// Set up the PhotoBox's "photos" property for setting up the list of photos
YAHOO.widget.PhotoBox.prototype.initDefaultConfig = function() {
    YAHOO.widget.PhotoBox.superclass.initDefaultConfig.call(this);

    this.cfg.addProperty("photos", { handler:this.configPhotos, suppressEvent:true });
};

// Handler executed when the "photos" property is modified
YAHOO.widget.PhotoBox.prototype.configPhotos = function(type, args, obj) {
    var photos = args[0];

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

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

        this.currentImage = 0;

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

        for (var p=0;p<photos.length;p++) {
            var photo = photos[p];
            var img = new Image();
            img.src = photo.src;
            img.title = photo.caption;
            img.id = this.id + "_img";
            img.width = 500
            this.images[this.images.length] = img;
        }

        this.setImage(0);
    }
};

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

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

        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");

        this.currentImage = index;

        var current = this.images[index];

        if (current.src.indexOf('swf') > 0) {
            var html_movie = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="290" height="218"><param name="flash_component" value="ImageViewer.swc" /><param name="autoplay" value="false"><param name="movie" value="'+photos[index].src+'" /><param name="quality" value="high" /><param name="FlashVars" value="flashlet={imageLinkTarget:\'_blank\',captionFont:\'Verdana\',titleFont:\'Verdana\',showControls:true,frameShow:false,slideDelay:5,captionSize:10,captionColor:#333333,titleSize:10,transitionsType:\'Random\',titleColor:#333333,slideAutoPlay:false,imageURLs:[\'img1.jpg\',\'img2.jpg\',\'img3.jpg\'],slideLoop:false,frameThickness:2,imageLinks:[\'http://macromedia.com/\',\'http://macromedia.com/\',\'http://macromedia.com/\'],frameColor:#333333,bgColor:#FFFFFF,imageCaptions:[]}" /><embed src="'+photos[index].src+'" quality="high" autoplay="false" flashvars="flashlet={imageLinkTarget:\'_blank\',captionFont:\'Verdana\',titleFont:\'Verdana\',showControls:true,frameShow:false,slideDelay:5,captionSize:10,captionColor:#333333,titleSize:10,transitionsType:\'Random\',titleColor:#333333,slideAutoPlay:false,imageURLs:[\'img1.jpg\',\'img2.jpg\',\'img3.jpg\'],slideLoop:false,frameThickness:2,imageLinks:[\'http://macromedia.com/\',\'http://macromedia.com/\',\'http://macromedia.com/\'],frameColor:#333333,bgColor:#FFFFFF,imageCaptions:[]}" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="290" height="218"></embed></object>';
			document.getElementById(this.id + "_movie").innerHTML = html_movie;
        } else {
            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 = photos[index].caption;

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

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

// Navigates to the next image
YAHOO.widget.PhotoBox.prototype.next = function() {
    if (typeof this.currentImage == 'undefined') {
        this.currentImage = 0;
    }

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

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

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

// Overrides the handler for the "modal" property with special animation-related functionality
YAHOO.widget.PhotoBox.prototype.configModal = function(type, args, obj) {
    var modal = args[0];

    if (modal) {
        this.buildMask();

        if (typeof this.maskOpacity == 'undefined') {
            this.mask.style.visibility = "hidden";
            this.mask.style.display = "block";
            this.maskOpacity = YAHOO.util.Dom.getStyle(this.mask,"opacity");
            this.mask.style.display = "none";
            this.mask.style.visibility = "visible";
        }

        if (! YAHOO.util.Config.alreadySubscribed( this.beforeShowEvent, this.showMask, this ) ) {
            this.beforeShowEvent.subscribe(this.showMask, this, true);
        }
        if (! YAHOO.util.Config.alreadySubscribed( this.hideEvent, this.hideMask, this) ) {
            this.hideEvent.subscribe(this.hideMask, this, true);
        }
        if (! YAHOO.util.Config.alreadySubscribed( YAHOO.widget.Overlay.windowResizeEvent, this.sizeMask, this ) ) {
            YAHOO.widget.Overlay.windowResizeEvent.subscribe(this.sizeMask, this, true);
        }
        if (! YAHOO.util.Config.alreadySubscribed( this.destroyEvent, this.removeMask, this) ) {
            this.destroyEvent.subscribe(this.removeMask, this, true);
        }
        this.cfg.refireEvent("zIndex");
    } else {
        this.beforeShowEvent.unsubscribe(this.showMask, this);
        this.beforeHideEvent.unsubscribe(this.hideMask, this);
        YAHOO.widget.Overlay.windowResizeEvent.unsubscribe(this.sizeMask);
    }
};

// Overrides the showMask function to allow for fade-in animation
YAHOO.widget.PhotoBox.prototype.showMask = function() {
    if (this.cfg.getProperty("modal") && this.mask) {
        YAHOO.util.Dom.addClass(document.body, "masked");
        this.sizeMask();

        var o = this.maskOpacity;

        if (! this.maskAnimIn) {
            this.maskAnimIn = new YAHOO.util.Anim(this.mask, {opacity: {to:o}}, 0.25)
            YAHOO.util.Dom.setStyle(this.mask, "opacity", 0);
        }

        if (! this.maskAnimOut) {
            this.maskAnimOut = new YAHOO.util.Anim(this.mask, {opacity: {to:0}}, 0.25)
            this.maskAnimOut.onComplete.subscribe(function() {
                this.mask.tabIndex = -1;
                this.mask.style.display = "none";
                this.hideMaskEvent.fire();
                YAHOO.util.Dom.removeClass(document.body, "masked");
            }, this, true);

        }
        this.mask.style.display = "block";
        this.maskAnimIn.animate();
        this.mask.tabIndex = 0;
        this.showMaskEvent.fire();
    }
};

// Overrides the showMask function to allow for fade-out animation
YAHOO.widget.PhotoBox.prototype.hideMask = function() {
    if (this.cfg.getProperty("modal") && this.mask) {
        this.maskAnimOut.animate();
    }
};
// END PHOTOBOX SUBCLASS //