var Media = {
	vdoDisplay : null,
	thumbsContainer : null,
	items : null,
	thumbPerPage : 5,
    maxThumbPage : 0,
    curThumbPage : 1,
	previous: null,
    next: null,
    thumbPageWidth: 0,
	thumbWidth: 119,
	effect: null,
	ready:false,
	
    init : function() {
        window.addEvent('load',Media._init);
    },
    
    _init : function () {
		Media.vdoDisplay = $('vdoDisplay');
		Media.thumbsContainer = $('imgThumbs');
		Media.items = $$('#imgThumbs a');
		Media.previous = $$("#thumbsBox .prev")[0];
        Media.next = $$("#thumbsBox .next")[0];		
		
		if ((Browser.Engine.trident) && (Browser.Engine.version == 4))
			Media.previous.setStyle('visibility',  'hidden');
		else
			Media.previous.fade('out');
		
		if (Media.items.length <= Media.thumbPerPage) {
			if ((Browser.Engine.trident) && (Browser.Engine.version == 4))
				Media.next.setStyle('visibility',  'hidden');
			else
				Media.next.fade('out');
		}
		
		if ((Media.items.length % Media.thumbPerPage) > 0)
			Media.maxThumbPage = Math.floor(Media.items.length / Media.thumbPerPage) + 1;
		else
			Media.maxThumbPage = Media.items.length / Media.thumbPerPage;
		
		Media.thumbPageWidth = Media.thumbPerPage * Media.thumbWidth;
		Media.thumbsContainer.setStyle('width',  Media.maxThumbPage * Media.thumbPageWidth);

		Media.previous.addEvent('click', Media.prevThumb);
        Media.next.addEvent('click', Media.nextThumb);		
		Media.items.forEach(function(item, index) {
            item.addEvent('click', Media.changeVideo.bindWithEvent(item.getChildren('img')[0]));
        });
		
		Media.ready = true;
    },
	changeVideo : function(event){
		
		if (event != null) {
            if (!window.ie) {
                event = new Event(event);
                event.preventDefault();
            } else {
                event.cancelBubble = true;
                event.returnValue = false;
            }
        }
		var htmlCode = '<embed id="movie_player" height="385" width="640" name="movie_player" allowscriptaccess="always" wmode="opaque" allowfullscreen="true" quality="high" bgcolor="#000000" src="http://www.youtube.com/v/' + this.get('id') + '&hl=en&fs=1&" type="application/x-shockwave-flash"/>';
		Media.vdoDisplay.set('html', htmlCode);
    },
    nextThumb : function(event){
		if (event != null) {
            if (!window.ie) {
                event = new Event(event);
                event.preventDefault();
            } else {
                event.cancelBubble = true;
                event.returnValue = false;
            }
        }
		
        if (Media.ready && (Media.curThumbPage < Media.maxThumbPage)) {
            Media.curThumbPage++;
			var beginMargin = Media.thumbsContainer.offsetLeft - 20;
            var endMargin = beginMargin - Media.thumbPageWidth;
			
			if ((Browser.Engine.trident) && (Browser.Engine.version == 4)) {
				if(Media.curThumbPage == Media.maxThumbPage)
					Media.next.setStyle('visibility',  'hidden');          
				Media.previous.setStyle('visibility',  'visible');
			} else {
				if(Media.curThumbPage == Media.maxThumbPage)
					Media.next.fade('out');            
				Media.previous.fade('in');
			}
			Media.effect = new Fx.Morph(Media.thumbsContainer, { duration: 'long', transition: Fx.Transitions.Quad });
           	Media.effect.start({
				'margin-left': [beginMargin, endMargin]
			});
        }
    },
    prevThumb : function(event){
		if (event != null) {
            if (!window.ie) {
                event = new Event(event);
                event.preventDefault();
            } else {
                event.cancelBubble = true;
                event.returnValue = false;
            }
        }
		
        if (Media.ready && (Media.curThumbPage > 1)) {
            Media.curThumbPage--;
			var beginMargin = Media.thumbsContainer.offsetLeft - 20;
            var endMargin = beginMargin + Media.thumbPageWidth;
			
			if ((Browser.Engine.trident) && (Browser.Engine.version == 4)) {
				if (Media.curThumbPage == 1)
					Media.previous.setStyle('visibility',  'hidden');;			
				Media.next.setStyle('visibility',  'visible');
			} else {
				if (Media.curThumbPage == 1)
					Media.previous.fade('out');			
				Media.next.fade('in');
			}
			
			Media.effect = new Fx.Morph(Media.thumbsContainer, { duration: 'long', transition: Fx.Transitions.Quad });
           	Media.effect.start({
				'margin-left': [beginMargin, endMargin]
			});
        }
    }
}
Media.init();