var EventsFlashGallery = Class.create();

//debugger;

EventsFlashGallery.prototype = {
	initialize: function() {
		this.galleryId;
		this.currentImageIndex = 0;
		this.backdrop = new ModalBackdrop($('modalBackdrop'));
		this.initGallery();
		this.bodyStyleCounter;
		this.tokenArray;
		this.galleryType = '';
	},
	
	initGallery: function() {
		try {
			// set up button event handlers
			Event.observe('flashGalleryCloseButton', 'click', this.close.bind(this));
			Event.observe('videoGalleryPrevButton', 'click', this.previous.bind(this));
			Event.observe('videoGalleryNextButton', 'click', this.next.bind(this));			
		} catch (e) {
			//alert('initGallery error: ' + e);
		}
	}, 
	
	/**
	* displays a given video, based on the VMIX token passed
	*/
	showGallery: function(params, mediaType) {
		
		if(mediaType=='video'){
			
			this.galleryType = 'video';
		
			// turn on the lightbox modal backdrop effect
			this.backdrop.enable();
		
			if(params) {
				if(params.itemId) {
					this.currentImageIndex = parseInt(params.itemId, 10);
				}
				if(params.galleryId) {
					this.galleryId = parseInt(params.galleryId, 10);
				}
			}

			// show popup
			$('flashGallery').style.display = 'block';
		
			new Ajax.Request('/vmix/apis/collection.php?action=getCollectionMedias&collection_id=' + this.galleryId + '&atoken=c3d1bee0a6f3d6bdfc7750eef78595de', {
				method: 'get',
				evalJS: true,
				onSuccess: function(transport) 
				{
				
					// parse Vmix Content
					var responseObj = {};
					this.tokenArray = [];
					this.titleArray = [];
					responseObj = transport.responseText.evalJSON();
					responseObj.media.each(function(item, index) {
						this.titleArray.push(item.title);				
						for (i=0;i<=item.formats.format.length;i++) {
							if(item.formats.format[i].format_id == "244"){ //get token for the 244 format id. (high quality video)
								this.tokenArray.push(item.formats.format[i].token);
								return false;
							}
						}												
					}.bind(this));
				
					// show/hide next prev buttons based on number of videos/tokens in collection/array
					if(this.tokenArray.length==1){
						$('videoPrevBtn').style.visibility = 'hidden';
						$('videoNextBtn').style.visibility = 'hidden';
					} else {
						$('videoPrevBtn').style.visibility = 'visible';
						$('videoNextBtn').style.visibility = 'visible';
					}
					
					$('mediaInfoCount').innerHTML = (this.currentImageIndex+1) + ' of ' + this.titleArray.length;
					$('mediaInfoTitle').innerHTML = this.titleArray[this.currentImageIndex];
				
					var orange_player_id = "24a030edb168648fed35362f931c06b6";
					var blue_player_id = "538c21ba57e53868074d64380a4b8801";
					var red_player_id = "eef38d57ee7b7e0d1109540e00e4b452";
					var yellow_player_id = "9385d29c6b055400f88ed05ae0e1d06f";
				
					var flashvars = {
  						player_id: yellow_player_id,
  						token: this.tokenArray[this.currentImageIndex],
  						event_handler: "vmix_player_callback",
						auto_play: 1
					};

					var params = {
  						menu: "false",
  						allowscriptaccess: "always",
  						allowfullscreen: "true",
  						wmode: "transparent",
  						swliveconnect: "true"
					};

					var attributes = {
  						id: "galleryObject",
  						name: "galleryObject"
					};

					swfobject.embedSWF("http://cdn-akm.vmixcore.com/core-flash/UnifiedVideoPlayer/UnifiedVideoPlayer.swf", "galleryObject", "630", "426", "9.0.0","", flashvars, params, attributes);

					
				}.bind(this)
			});
		
		} else if(mediaType=='images') {
		
			this.galleryType = 'images';
		
			// turn on the lightbox modal backdrop effect
			this.backdrop.enable();
		
			if(params) {
				if(params.itemId) {
					this.currentImageIndex = parseInt(params.itemId, 10);
				}
				if(params.galleryId) {
					this.galleryId = parseInt(params.galleryId, 10);
				}
			}

			// show popup
			$('flashGallery').style.display = 'block';
		
			new Ajax.Request('/vmix/apis/collection.php?action=getCollectionMedias&collection_id=' + this.galleryId + '&atoken=c3d1bee0a6f3d6bdfc7750eef78595de', {
				method: 'get',
				evalJS: true,
				onSuccess: function(transport) 
				{
				
					// parse Vmix Content
					var responseObj = {};
					this.tokenArray = [];
					this.titleArray = [];
					this.thumbArray = [];
					responseObj = transport.responseText.evalJSON();
					responseObj.media.each(function(item, index) {
						this.titleArray.push(item.title);
						this.tokenArray.push(item.url); //image url
					}.bind(this));
					
					$('mediaInfoCount').innerHTML = (this.currentImageIndex+1) + ' of ' + this.titleArray.length;
					$('mediaInfoTitle').innerHTML = this.titleArray[this.currentImageIndex];
					
					// show/hide next prev buttons based on number of videos/tokens in collection/array
					if(this.tokenArray.length==1){
						$('videoPrevBtn').style.visibility = 'hidden';
						$('videoNextBtn').style.visibility = 'hidden';
					} else {
						$('videoPrevBtn').style.visibility = 'visible';
						$('videoNextBtn').style.visibility = 'visible';
					}
				
					$('galleryCenter').innerHTML = '<img src=\"http://image.vmixcore.com/imgman.jpg?width=630&height=426&fill=000000000&url='+this.tokenArray[this.currentImageIndex]+'\" />';
				
				}.bind(this)
			});
			
		}
		
		fbLikeBtnUpdate();
		this.checkBodyStyle();
		window.fbAsyncInit = function() {
		    FB.init({status: true, cookie: true,xfbml: true});
		};
	},
	
	/**
	* this is a bug fix to work around an issue in the remote
	* 'addThis' library
	*/
	checkBodyStyle: function() {
		new PeriodicalExecuter(function(pe) {
			if( document.body.style.visibility == "hidden" )
			{
				document.body.style.visibility = "visible";
				pe.stop();
			}
			if (this.bodyStyleCounter >= 4)
			{
				pe.stop();
			}
		}.bind(this), 1);
		this.bodyStyleCounter ++;
	},
	
	previous: function() {
		if(this.currentImageIndex==-1){
			this.currentImageIndex = this.tokenArray.length-1;
		} else {
			this.currentImageIndex = ((this.currentImageIndex - 1) < 0)? this.tokenArray.length - 1: this.currentImageIndex - 1;
		}
		$('mediaInfoCount').innerHTML = (this.currentImageIndex+1) + ' of ' + this.titleArray.length;
		$('mediaInfoTitle').innerHTML = this.titleArray[this.currentImageIndex];
		window.location.hash = '/' + this.galleryType + '/' + this.galleryId + '/' + this.currentImageIndex;
		fbLikeBtnUpdate();
	},
	
	next: function() {
		if(this.currentImageIndex==this.tokenArray.length-1){
			this.currentImageIndex = 0;
		} else {
			this.currentImageIndex = (this.currentImageIndex + 1)%(this.tokenArray.length + 1);
		}
		$('mediaInfoCount').innerHTML = (this.currentImageIndex+1) + ' of ' + this.titleArray.length;
		$('mediaInfoTitle').innerHTML = this.titleArray[this.currentImageIndex];
		window.location.hash = '/' + this.galleryType + '/' + this.galleryId + '/' + this.currentImageIndex;
		fbLikeBtnUpdate();
	},
	
	/**
	* closes the gallery
	*/
	close: function() {
		this.backdrop.disable();
		// Kill visibility for send email and get links overlays
		$('eventsEmailOverlay').style.visibility = 'hidden';
		$('eventsOverlay').style.visibility = 'hidden';
		if(this.galleryType=='video'){
			// Kill the flash player and replace with original html
			$('galleryObject').call('unload');
		}
		$('galleryCenter').innerHTML = '<div id="galleryObject"><p>Loading...</p></div>';
		$('flashGallery').style.display = 'none';
		window.location.hash = '/' + this.galleryType + '/';
	}
	
}

// Toggle Overlays
function toggle(x) {
	if ($(x).style.visibility == 'visible') {
		$(x).style.visibility = 'hidden';
	} else {
		$(x).style.visibility = 'visible';
	}
}
// Get Link URL value
function eventsURL(){
	document.write('<input type="text" class="overlayInput" id="eventsURL" value=""/>');
}

// Get Link Embed value
function eventsEmbed(){
	document.write('<input type="text" class="overlayInput" id="eventsEmbed" value""/>');
}

// Play next video in the collection
function vmix_player_callback(e){
  	if (e.type == 'video_complete' && eventsFlashGallery.tokenArray.length > 1 && (eventsFlashGallery.currentImageIndex < (eventsFlashGallery.tokenArray.length-1))){
		eventsFlashGallery.next();
	}
}

function fbLikeBtnUpdate() {	
	document.getElementById("fbLinkBtn").innerHTML = '<fb:like href="'+window.location.href+'" send="false" width="450" show_faces="false" colorscheme="dark" font="arial"></fb:like>';
    FB.XFBML.parse(document.getElementById('fbLinkBtn'));
}