// -----------------------------------------------------------------------------------
// 
// This page coded by Scott Upton
// http://www.uptonic.com | http://www.couloir.org
//
// This work is licensed under a Creative Commons License
// Attribution-ShareAlike 2.0
// http://creativecommons.org/licenses/by-sa/2.0/
//
// Associated APIs copyright their respective owners
//
// -----------------------------------------------------------------------------------
// --- version date: 11/28/05 --------------------------------------------------------
//
// Modified by Sergio Oshiro <smoshiro(at)gmail(dot)com> - 2006-09-26
//

// -----------------------------------------------------------------------------------
// Additional methods for Element added by SU, Couloir
Object.extend(Element, {
    getWidth: function(element) {
        element = $(element);
        return element.offsetWidth; 
    },
    setWidth: function(element,w) {
        element = $(element);
        element.style.width = w +"px";
    },
    setHeight: function(element,h) {
        element = $(element);
        element.style.height = h +"px";
    },
    setSrc: function(element,src) {
        element = $(element);
        element.src = src; 
    },
    setHref: function(element,href) {
        element = $(element);
        element.href = href; 
    },
    setInnerHTML: function(element,content) {
        element = $(element);
        element.innerHTML = content;
    }
});

// -----------------------------------------------------------------------------------
var Slideshow = Class.create();
Slideshow.prototype = {

    initialize: function() {
        this.options = Object.extend({
            photoElementID:      'Photo',
            containerElementID:  'Container',
            prevElementID:       'PrevLink',
            nextElementID:       'NextLink',
            captionBoxElementID: 'CaptionContainer',
            captionElementID:    'Caption',
            counterElementID:    'Counter',
            loaderElementID:     'Loading',
            resizeDuration:      0.5,
            callback:            function(){}
        }, arguments[0] || {});

        this.preLoader = new Image();
        this.imageInfo = document.createElement('div');

        Event.observe(this.preLoader, 'load', this._preloadImage.bindAsEventListener(this));
        Event.observe(this.options.prevElementID, 'click', this.prevSlide.bindAsEventListener(this), true);
        Event.observe(this.options.nextElementID, 'click', this.nextSlide.bindAsEventListener(this), true);

        this._getImageInfo(this, document.location.href);
    },

    prevSlide: function() {
        this._getImageInfo(this, $(this.options.prevElementID).href);
        return false;
    },

    nextSlide: function() {
        this._getImageInfo(this, $(this.options.nextElementID).href);
        return false;
    },

    gotoSlide: function(slideURL) {
        this._getImageInfo(this, slideURL);
        return false;
    },

    // private methods

    _preloadImage: function() {
        var parent = this;
        Element.hide(parent.options.photoElementID);
        Element.hide(parent.options.prevElementID);
        Element.hide(parent.options.nextElementID);
        Element.hide(parent.options.captionBoxElementID);
        parent._resizeImageContainer(parent.preLoader.width, parent.preLoader.height);
    },

    _getImageInfo: function(parent, url) {
        Element.show(this.options.loaderElementID);
        new Ajax.Request(url, {
            onComplete: function(originalRequest){
                parent.imageInfo.innerHTML = originalRequest.responseText;
                elements = parent.imageInfo.getElementsByTagName('span');
                for (var i = 0; i < elements.length; i++) {
                    var info = elements[i];
                    parent.imageInfo[info.id] = info.innerHTML;
                } 
                parent._setupSlide();
                Element.setSrc(parent.preLoader, parent.imageInfo.currentImageSrc);
            },
            onFailure: function(){}
        });
    },

    _setupSlide: function() {
        this.imageInfo.currentImageSrc = this.imageInfo.slide_curr_image;
        Element.setInnerHTML(this.options.captionElementID, this.imageInfo.slide_curr_description);
        Element.setInnerHTML(this.options.counterElementID,
            (1+1*this.imageInfo.slide_curr_index)+' / '+this.imageInfo.slide_list_size);
        Element.setHref(this.options.prevElementID, this.imageInfo.slide_prev_url);
        Element.setHref(this.options.nextElementID, this.imageInfo.slide_next_url);
    },
    

    //
    //    resizeImageContainer()
    //
    _resizeImageContainer: function(imgWidth, imgHeight) {

        var container = this.options.containerElementID;
        var resizeDuration = this.options.resizeDuration;

        // get current height and width
        this.wCur = Element.getWidth(container);
        this.hCur = Element.getHeight(container);

        // scalars based on change from old to new
        this.xScale = (imgWidth / this.wCur) * 100;
        this.yScale = (imgHeight / this.hCur) * 100;

        // calculate size difference between new and old image, and resize if necessary
        wDiff = this.wCur - imgWidth;
        hDiff = this.hCur - imgHeight;

        if(!( hDiff == 0)){ new Effect.Scale(container, this.yScale, {scaleX: false, duration: resizeDuration, queue: 'front'}); }
        if(!( wDiff == 0)){ new Effect.Scale(container, this.xScale, {scaleY: false, delay: resizeDuration, duration: resizeDuration}); }

        // if new and old image are same size and no scaling transition is necessary, 
        // do a quick pause to prevent image flicker.
        if((hDiff == 0) && (wDiff == 0)){
            if (navigator.appVersion.indexOf("MSIE")!=-1){ pause(250); } else { pause(100);} 
        }

        Element.setHeight(this.options.nextElementID, imgHeight);
        Element.setHeight(this.options.prevElementID, imgHeight);
        Element.setWidth( this.options.captionBoxElementID, imgWidth);

        this._showImage();
    },

    //
    //    showImage()
    //    Display image and begin preloading neighbors.
    //
    _showImage: function(){
        var parent = this;
        new Effect.Fade(this.options.loaderElementID, {delay: 0.5, duration: 0.3});
        Element.setSrc(this.options.photoElementID, this.imageInfo.currentImageSrc);
        // Workaround for problems calling object method "afterFinish"
        new Effect.Appear(this.options.photoElementID, {
            duration: 0.5,
            queue: 'end',
            afterFinish: function(){
                Element.show(parent.options.prevElementID);
                Element.show(parent.options.nextElementID);
                //Element.show(parent.options.captionBoxElementID);
                new Effect.SlideDown(parent.options.captionBoxElementID);
            }
		});
		parent.options.callback(parent);
    }

}
