﻿/*
 * Lightbox and paging for images on blizzard.com
 *    sV = screenViewer  
 */
var replacebr;
var openSubmissionNo;// only for images collection

var sV = {
	//initialize the screen viewer
	initialized: false,
	frame: null,
	frameContent: null,	
	currentIndex: 0,
	copyLink: null,
	descImage:null,
	imageCollection: null,	
	loader: null,
	t:null,
	searchKeyword:null,
	franchiseKeyword:null,
	imageCopyLinkURL:null,
	firstCopySetTimeId:null,
	secondCopySetTimeId:null,
	thirdCopySetTimeId:null,
	btnImage: null,
	init: function()
	{	
		//store references
		sV.frame   = $j("#screenViewer");
		sV.copyLink = $j("#viewerCopyLink");
		sV.descImage = $j("#viewerDescImage");	
		sV.content = $j("#viewerContent");		
		sV.loader  = $j("#loadingAnimation");
		
		sV.btnImage = new Image();
		sV.btnImage.src = '/_images/lang/' + lang.replace('_','-') + '/btn-copylink.gif';	
				
		//set top position
		$(sV.frame).css("top",$j(window).scrollTop() + "px")
		
		//show blackout and image
		$j(sV.frame).show();
		
		if(Browser.ie6 || Browser.ie7){ $j("#blackout").show(); $j("#blackout").height($j(document).height())}
		else  $j("#blackout").fadeIn(1000);	
		
		//only image collections have paging
		if(sV.imageCollection != null && sV.imageCollection.length > 1) {
			sV.enablePaging();	
		} else {
			sV.disablePaging();
		}
		
		sV.initialized = true;
	},
	//go to next image
	nextImage: function()
	{	if(sV.t) return;
		//get proper index
		sV.currentIndex = sV.imageIndex("next");

		//set image
		sV.setImage(sV.imageCollection[sV.currentIndex]);

		return sV.currentIndex;
		//preload next image
	//	var preloadNextImage = new Image();
	//	preloadNextImage.src = sV.imageCollection[sV.imageIndex("next")];
	},
	//go to previous image
	prevImage: function()
	{
		//get proper index
		sV.currentIndex = sV.imageIndex("prev");

		//set image
		sV.setImage(sV.imageCollection[sV.currentIndex]);
		
		return sV.currentIndex;
	},
	//determine proper index of image collection
	imageIndex: function(direction)
	{
		if(direction == "next"){
			return (sV.currentIndex-1 < 0) ? sV.imageCollection.length-1 : sV.currentIndex-1;
		}else if(direction == "prev"){
			return (sV.currentIndex+1 >= sV.imageCollection.length) ? 0 : sV.currentIndex+1;
		}
	},
	setVideo : function (title, width, height)
	{
		//set title
		$j("#viewerTitle").html(title);
		
		if(!sV.initialized){
			sV.init();
			
			//get video list and append it
			var videoList = $j("#video_list").clone();
			videoList.show();
			
			$j(sV.content).append(videoList);
		}
		
		//set dimensions (add 180 pixels for bottom thumbnails)
		sV.setContainerDimensions(width,(height*1 + 200));	
	},
	showImage: function(src)
	{
		if(!sV.initialized)
			sV.init();
		sV.setImage(src);
	},	
	setImageCollection: function(imageCollection,index,captionList,searchKeyword,descList,franchiseKeyword)
	{
		sV.searchKeyword = searchKeyword;
		
		if(franchiseKeyword){
			sV.franchiseKeyword = franchiseKeyword;
		}

		//set image collection
		sV.imageCollection = imageCollection;
		if(captionList) sV.captionList = captionList;
		if(descList) sV.descList = descList;
		
		if(!sV.initialized)
			sV.init();
		
		//set index
		sV.currentIndex = (index) ? index : 0;
		
		//set the image
		sV.setImage(sV.imageCollection[sV.currentIndex]);
	},
	setImage: function(src)
	{
		//create new image so we can tell when its done loading
		var image = new Image();
		image.src = src;
		
		//show loader only if image isnt already loaded
		if(!image.complete)
			$j(sV.loader).show();

		sV.loadImage(image);	
	},
	loadVideo: function(name, width, height, clickedLink, title)
	{
		//strip other thumbails of selected style
		if(clickedLink){
			$j(".videoThumbnail").removeClass("selected");
			$j(clickedLink).addClass("selected");
		}
		
		var gameType = gt;
		
		var videoArray = gameType + "-" + name + "-" + locale + ":" + gameType + "-" + name + ":" + "games/" + gameType + "/" + name; 

		var flashvars = {
			"vidArr":    videoArray, 
			"skincolor": skincolor||"00080d:30a6f1:142E47",
			"rating":    "",
			"autoplay":  "false"
		};

		var params = {
			menu:              "false", 
			base:              ctx + "movies/player/", 
			allowFullScreen:   "true", 
			allowScriptAccess: "always", 
			bgcolor:           "000000"
		};
		
		var attributes = {
			id:   "videoContainer", 
			name: "videoContainer"
		};		
		
		sV.setVideo(title, width, height);

		swfobject.embedSWF(ctx + "movies/player/video_loader2.swf", "videoContainer", width, Number(height) + 30, "8","expressInstall.swf", flashvars, params, attributes);
             
	},
	//load the image and set the dimensions
	loadImage: function(image)
	{
		sV.setCopyUrl();
		
		if(image.complete)
		{	
			//once loaded, set dimensions and holder html

			if(sV.descList != 'undefined' && sV.descList != null){
				sV.setImageDescription(sV.descList[sV.currentIndex]);
			}
			sV.setContainerDimensions(image.width, image.height, sV.descImage.height() + 30);			
			$j(sV.content).css("background-image","url("+image.src+")")
			$j(sV.loader).fadeOut(200);
			if(sV.captionList && sV.captionList[sV.currentIndex]) 
			{  
				var captext = sV.captionList[sV.currentIndex];
				$j("#viewerTitle").html(captext);
			} else  $j("#viewerTitle").html('');

			if(sV.imageCopyLinkURL != 'undefined' && sV.imageCopyLinkURL != null){
				sV.setCopyUrlBtn(image);
			}
			openSubmissionNo = sV.currentIndex;
			clearTimeout(sV.t); sV.t = null
		}
		else
			sV.t=window.setTimeout(function() { sV.loadImage(image) } ,50);		
	},
	setCopyUrl: function(){
		
		if(window.location.search != ''){
			sV.imageCopyLinkURL = location.href.split('?')[0];
		} else if(window.location.hash != ''){
			sV.imageCopyLinkURL = location.href.split('#')[0];
		} else {
			sV.imageCopyLinkURL = location.href;
		}		
		
		if(sV.searchKeyword != 'undefined' && sV.searchKeyword != null){
			sV.imageCopyLinkURL += "?search=" + sV.searchKeyword;
		}else if(sV.franchiseKeyword){
			sV.imageCopyLinkURL += "?ip=" + sV.franchiseKeyword;
		} 
		sV.imageCopyLinkURL += "#" + sV.currentIndex;
	},
	setCopyUrlBtn: function(image)
	{
		sV.copyLink.empty();

		var tCopyLink = $j('<div>').attr('id','link_text').append($j('<input>')
								   .attr('value',sV.imageCopyLinkURL))
								   .css('width',image.width - (sV.btnImage.width + 15) + "px");				


		var btnCopyUrlDiv = $j('<div>').addClass('btn_copylink').css('width', sV.btnImage.width)
									   .css('background','url(' + sV.btnImage.src + ') 0 0 no-repeat')
									   .append($j('<div>').attr('id','btn_copyUrl'));

		sV.copyLink.append(btnCopyUrlDiv).append(tCopyLink).show();
		
		var flashvars = {"copyUrl" : sV.imageCopyLinkURL};
		var params = { menu:"false", wmode:"transparent", base:"/_flash/", allowScriptAccess:"true" };
		swfobject.embedSWF("/_flash/_copyurl.swf", "btn_copyUrl", sV.btnImage.width, "21", "9.0.0", false, flashvars, params);
		
		$j("#btn_copyUrl").hover(
			function () {
				btnCopyUrlDiv.css('background-position','0 -21px');
			}, 
			function () {
				btnCopyUrlDiv.css('background-position','0 0');
			}
		);

		sV.copyLink.append(tCopyLink).show();
	},
	afterCopyUrl: function(){
		clearTimeout(sV.firstCopySetTimeId);
		clearTimeout(sV.secondCopySetTimeId);
		clearTimeout(sV.thirdCopySetTimeId);
		
		var copyUrlDiv =  $j('#link_text').children('input');
			if(!copyUrlDiv.data('copyUrlData')){
				copyUrlDiv.data('copyUrlData',copyUrlDiv.attr('value'));
			}
			copyUrlDiv.fadeOut(100);		
			sV.firstCopySetTimeId = window.setTimeout(function() {
				copyUrlDiv.attr('value',GALLERY_MSG_DONECOPY).fadeIn(100).css('color','#00adef');
			} ,100);
			sV.secondCopySetTimeId = window.setTimeout(function() {
				copyUrlDiv.fadeOut(200);
			} ,1300);
			sV.thirdCopySetTimeId = window.setTimeout(function() {
				copyUrlDiv.attr('value',copyUrlDiv.data('copyUrlData')).css('color','#227593').fadeIn(200);
			} ,1500);
	},
	setImageDescription: function(desc){
		sV.descImage.empty();
		var descDiv = $j('<div>').text(desc);
		sV.descImage.append(descDiv).show();
	},
	showSubmission: function(submissionNo){// TO DO: fix set pages each to view screendshots
		/*
		var pageNumber = Gallery.getPageNumber(submissionNo);
		if(pageNumber != activePageNumber) {
			Gallery.setPage(pageNumber);
		}

		openSubmissionNo = submissionNo;
		*/
	},
	//set height and width of container
	setContainerDimensions: function(width,height,addheight)
	{
		$j(sV.frame).css("height",height + addheight + "px").css("width",width + "px");
		$j(sV.content).css("height",height + "px").css("width",width + "px");
	},
	//enable paging functionality and styles
	enablePaging: function()
	{
		//image collections have paging
		$j(sV.content).unbind('click');
		$j(sV.content).bind('click', function(){
			sV.nextImage();
		});
		
		$(sV.frame).addClass("viewerPaging");
	},
	//disable paging functionality and styles
	disablePaging: function()
	{		
		//unbind click
		$j(sV.content).unbind("click");
		
		$(sV.frame).removeClass("viewerPaging");		
	},	
	//close the preview frame
	close: function()
	{
		$j(sV.frame).hide();
		$j("#blackout").hide();
		
		//clear background image and remove children
		$j(sV.content).css("background-image","none").empty();
		clearTimeout(sV.t); sV.t = null
		
		//create video container div to re-append
		var videoContainer = document.createElement("div");
		videoContainer.id = "videoContainer";
		$j(sV.content).html(videoContainer);
		
		//set initializers to false
		init = false;
		sV.initialized = false;
		sV.imageCollection = null;
	}	
};