/*
 * YouTube Player
 */

var YouTube = {
    
    load: function(params){
        this.container = params.id + 'Container';
        this.video = params.id + 'Video';
        this.id = params.id;
        this.width = params.width;
        this.height = params.height;
        this.background = params.background
        this.videoHtml = "<div id='" + this.video + "'>You need Flash player 8+ and JavaScript enabled to view this video.</div>";
        this.html = "<div id='" + this.container + "'>" + this.videoHtml + "</div>";
       // this.embedded = false;
        //this.player = null;
    },
    
    embed: function(videoId){
        swfobject.embedSWF(
            "http://www.youtube.com/v/" + videoId + "&enablejsapi=1&playerapiid=ytplayer", 
            this.video, 
            this.width, 
            this.height, 
            "8", 
            null, 
            null, 
            {bgcolor: this.background, allowScriptAccess: "always"},  // params
            {id: this.id} // atts
        );
        this.embedded = true;
    },
    
    play: function(videoId){        
        $('#' + this.container).html(this.videoHtml);
        this.embed(videoId);
    },
    
    stop: function(){
        document.getElementById(this.id).clearVideo();
    }
    
}


/*
 * Simple Photo Viewer
 */
var SimplePhotoViewer = function(params){
    if (!document.getElementById(params.id)) {
        return false;
    }
    that = this;
    this.id = params.id;
    this.panelId = params.panelId;
    centre = params.centered || false;
    this.panel = new Panel({
        id: params.panelId,
        modal: true,
        easyHide: true,
        centered: centre
    });
    this.panel.footerHtml("<span class='button next'>Next &raquo;</span><span class='button previous'>&laquo; Previous</span>");    
    this.previous = $('#' + this.panelId + ' .previous');
    this.previous.disabled = false;
    this.next = $('#' + this.panelId + ' .next');
    this.next.disabled = false;
    this.cur = null;
    this.photos = {};
    this.photos.length = 0;
    var i = 0;
    $('#' + params.id + ' a').each(function(){
        that.photos[i] = {
            link: $(this).attr('href'),
            title: $(this).attr('title')
        };
        that.photos.length++;
        $(this).children()[0].index = i;
        i++;
        that.setLinks($(this));
        
    });
    $(this.previous).click(function(){
        if (!that.previous.disabled) {
            that.loadPhoto(that.previous.num);
        }
    });
    $(this.next).click(function(){
        if (!that.next.disabled) {
            that.loadPhoto(that.next.num);
        }
    });
}

SimplePhotoViewer.prototype = {
    
    setLinks: function(link){
        var that = this;
        link.click(function(event){
            that.panel.open();
            that.loadPhoto(event.target.index);
            return false;
        });
    },
    
    loadPhoto: function(index){
        $(this.panel.content).html("<img src='" + this.photos[index].link + "' /><div class='caption'>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse augue. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas." + this.photos[index].title + "</div>");
        this.cur = index;
        this.previous.num = index - 1;
        this.next.num = index + 1;
        if (index === 0) {
            this.disablePreviousButton();
        } else {
            this.enablePreviousButton();
        }
        if(index === this.photos.length - 1) {
            this.disableNextButton();
        } else {
            this.enableNextButton();
        }
        return false;
    },
    
    disablePreviousButton: function(){
        $(this.previous).addClass('disabled');
        this.previous.disabled = true;
    },
    
    enablePreviousButton: function(){
        $(this.previous).removeClass('disabled');
        this.previous.disabled = false;
    },
    
    disableNextButton: function(){
        $(this.next).addClass('disabled');
        this.next.disabled = true;
    },
    
    enableNextButton: function(){
        $(this.next).removeClass('disabled');
        this.next.disabled = false;
    }
    
}


/*
 * Floating Panel - optionally modal
 */
var Panel = function(params){
    var html = "<div id='" + params.id + "'><div class='header'><div class='close'>CLOSE X</div><span class='title'></span></div><div class='content'></div><div class='clear'>&nbsp;</div><div class='footer'></div></div>";
    $('body').append(html);
    var that = this;
    this.id = params.id;
    this.elm = $('#' + params.id);
    $(this.elm).css({'z-index':11000})
    this.header = $('#' + params.id + ' .header');
    this.closeButton = $('#' + params.id + ' .close');
    this.content = $('#' + params.id + ' .content');
    this.footer = $('#' + params.id + ' .footer');
    this.modal = params.modal;
    this.overlayId = 'overlay';
    this.setOverlay();
    params.draggable ? that.draggable(): null;
    params.easyHide ? that.easyHide() : null;
    params.onOpen ? this.openCallback = params.onOpen : this.openCallback = null;
    params.onClose ? this.closeCallback = params.onClose : this.closeCallback = null;
    $(this.closeButton).click(function(){
        that.close();
    });
    //params.centered ? this.centred = true : this.centered = false;
    this.centered = params.centered || false;
}

Panel.prototype = {
    
    html: function(content){
        $(this.content).append(content);
    },
    
    footerHtml: function(content){
        $(this.footer).append(content);
    }, 
    
    open: function(){
        this.insertOverlay();       
        $(this.elm).show('slow');
        if (this.centered) {
			var top = $('html').scrollTop();
			if (top < 1) {
				top = $('body').scrollTop();
			}
			top = top + 80;
            //var top = document.getElementsByTagName('html')[0].scrollTop + 80;
            this.elm.css({top: top + 'px'});
        }
        if (this.openCallback) {
            this.openCallback();
        }        
    },
    
    close: function(callback){
        $(this.elm).hide();
        this.removeOverlay();
        if (this.closeCallback) {
            this.closeCallback();
        }
    },
    
    insertOverlay: function(){
        $('#' + this.overlayId).show();
    },
    
    removeOverlay: function(){
        $('#' + this.overlayId).hide();
    },
    
    easyHide: function(){
        var that = this;
        $('#' + this.overlayId).click(function(){
            that.close();            
        });
    },
    
    draggable: function(){
        $(this.header).css({
            cursor: 'move'
        });
        this.elm.draggable({
            handle: this.header
        });
    },
    
    onclose: function(callback){
        this.closeCallback = callback;
    },
    
    setOverlay: function(){
        $('body').append("<div id='" + this.overlayId + "'></div>");
        $('#' + this.overlayId).css({
            display: 'none',
            height: '100%',
            width: '100%',
            position: 'fixed',
            left: '0',
            top: '0',
            'z-index': 10000,
            opacity: '0.85',
            background: '#FFF'
        });
        
    }
}