/* THE DAILY GREEN FLIPBOOK*/

var thumb_boxsize = 94;
var fb_totalheight = 460; // matches the same exact value as #flipbook_box
var fb_vsheight = 358; // WHAT IS THE HEIGHT?
var fb_vswidth = 458;
var testimg;
var thumbsarray = new Array();
var fp_maxpos;
var clickedstate = "smallimg_1";
var clickedindex = 1; //this is the index value of the item selected
var fb_scrollbarx;
var boolean_scrollmouseactive = false;
var mousey;
var timeouts = new Array();
var miniscrollratio;
var fb_playstatus = true;
var myimg=new Array();
var hasplayed = 0;

function resizeimage(obj){
	var objwidth = testimg.width;
	var objheight = testimg.height;
/*	var objwidth = document.getElementById(obj).width;
	var objheight = document.getElementById(obj).height;*/
	var scalevalue = 1;
/*	
//	alert("obj width:"+objwidth+" | screen width: "+fb_vswidth+" | obj height:"+objheight+" | screen height:"+fb_vsheight);
	if ((objwidth < fb_vswidth) && (objheight < fb_vsheight)){
//		alert("object is smaller!");
		// object is smaller than the screen, find which side is bigger, and then scale that side according to the larger side
		if (objwidth < objheight){
			// height is smaller, scale to the width..
//			alert("object height is smaller, need to scale up width ratio");
		scalevalue = fb_vswidth/objwidth;
		} else {
			// width is smaller, scale to the height..
//			alert("object width is smaller, need to scale up height ratio");
		scalevalue = fb_vsheight/objheight;
		}
	} else if ((objwidth < fb_vswidth) && (objheight > fb_vsheight)){
		// height is bigger, so we need to reduce it from the height side..
//		alert("object height is bigger, reducing height..!");
		scalevalue = fb_vsheight/objheight;
	
	} else if ((objwidth > fb_vswidth) && (objheight < fb_vsheight)){
		// width is larger, so we need to reduce it from the width side..
//		alert("object width is bigger, reducing width!");
		scalevalue = fb_vswidth/objwidth;
	} else {
//		alert("object is larger!");
		// this option indicates that the image is larger both height and width, we need to reduce it
		if (objwidth < objheight){
			// height is smaller, scale down to the height..
//		alert("object height is larger, need to reduce by height!");
		scalevalue = fb_vsheight/objheight;
		} else {
			// width is smaller, scale down to the width..
//		alert("object width is smaller, need to reduce by width!");
		scalevalue = fb_vswidth/objwidth;
		}
	}
//	alert(scalevalue);
	document.getElementById(obj).width = parseInt(objwidth*scalevalue);
	document.getElementById(obj).height = parseInt(objheight*scalevalue);
	document.getElementById(obj).style.left = parseInt((fb_vswidth-objwidth*scalevalue)/2)+"0px";
	document.getElementById(obj).style.top = parseInt((fb_vsheight-objheight*scalevalue)/2)+"0px";*/
	var element = document.getElementById("flipbook_article_win");
	if (document.defaultView && document.defaultView.getComputedStyle) {
   		var thestyle = document.defaultView.getComputedStyle(element, "");
		theheight = parseFloat(thestyle.height.substring(0, thestyle.height.length-2)); 
	} else if (element.currentStyle) {
   		var theheight = element.offsetHeight;
	}
	if(objwidth < objheight){
		document.getElementById("flipbook_viewarea").className = "area_tall";
		document.getElementById("flipbook_viewscreen").className = "screen_tall";
		document.getElementById("CNTR_flipbook").style.height = 700 + theheight + "px";
		element.style.top = 530 + "px";
		document.getElementById("flipbook_scrollbarcomponent").style.top = 532 + theheight + "px";
		document.getElementById("btop").style.paddingTop = theheight + "px";
		document.getElementById("flipbook_photocred").style.top = 510 + "px";
		document.getElementById("flipbook_photocred").style.width = 410 + "px";
		
	}
	else{
		document.getElementById("flipbook_viewarea").className = "area_wide";
		document.getElementById("flipbook_viewscreen").className = "screen_wide";
		document.getElementById("CNTR_flipbook").style.height = 600 + theheight + "px";
		element.style.top = 430 + "px";
		document.getElementById("flipbook_scrollbarcomponent").style.top = 432 + theheight + "px";
		document.getElementById("btop").style.paddingTop = theheight + "px";
		document.getElementById("flipbook_photocred").style.top = 410 + "px";
		document.getElementById("flipbook_photocred").style.width = 460 + "px";
	}
	
	
	document.getElementById(obj).width = parseInt(objwidth*scalevalue);
	document.getElementById(obj).height = parseInt(objheight*scalevalue);
	document.getElementById(obj).style.left = 0;
	document.getElementById(obj).style.top = 0;
	
	/*
	document.getElementById(obj).style.left = parseInt((fb_vswidth-objwidth*scalevalue)/2)+"px";
	document.getElementById(obj).style.top = parseInt((fb_vsheight-objheight*scalevalue)/2)+"px";
	*/
}
function resizetodimensions(id,newheight,newwidth){
/*	var theimage = new Image();
	theimage = myimg[id];
	id= "smallimg_"+(id+1);
//	var tobj = document.getElementById(id);
//	var thumburl = tobj.src; //this is the url of the main image the thumb
//	theimage.src = thumburl;
	thumbsarray.push(theimage);
	var objwidth = theimage.width;
	var objheight = theimage.height;
	var scalevalue;
	if ((objwidth < newwidth) && (objheight < newheight)){
		if (objwidth < objheight){
		scalevalue = newwidth/objwidth;
		} else {
		scalevalue = newheight/objheight;
		}
	} else if ((objwidth < newwidth) && (objheight > newheight)){
		scalevalue = newheight/objheight;
	
	} else if ((objwidth > newwidth) && (objheight < newheight)){
		scalevalue = newwidth/objwidth;
	} else {
		if (objwidth < objheight){
		scalevalue = newheight/objheight;
		} else {
		scalevalue = newwidth/objwidth;
		}
	}
	document.getElementById(id).width = parseInt(objwidth*scalevalue);
	document.getElementById(id).height = parseInt(objheight*scalevalue);*/
	id= "smallimg_"+(id+1);
	document.getElementById(id).width = 90;
	document.getElementById(id).height = 90;
}
function loaddisplayimg(url){
	var theimage = new Image();
	theimage.src = url;
	testimg = theimage;
}
function moveimagetoflipbook_viewarea(id){
	var fb_viewobj = document.getElementById("flipbook_viewarea");
	var fb_htmlobj = document.getElementById("fp_textdmp");
	var fb_photocap = document.getElementById("flipbook_photocred");

	var idval = id.split("largeimg_");
	var fb_image = document.getElementById(id);
	var fb_text = document.getElementById("associatedtextimg_"+idval[1]);
	var fb_photo = document.getElementById("flipbook_photocred_"+idval[1]);
	fb_viewobj.innerHTML = "";// first thing to do is cleanup, take whatever was in here and dump it in the container
	fb_htmlobj.innerHTML = "";// first thing to do is cleanup, take whatever was in here and dump it in the container
	fb_photocap.innerHTML = "";
	$(fb_htmlobj).fadeIn(750).append($(fb_text).clone());
	if(fb_photo != null)
		$(fb_photocap).fadeIn(750).append($(fb_photo).clone());
	$(fb_viewobj).fadeIn(750).append($(fb_image).clone());
}
function fb_selprev(fb_y){
	var newindex = clickedindex-fb_y;
	if (newindex > 0) {
		fb_selbyindex(newindex);
		if(newindex == 1) {
			fb_scrollupto(0);
		}
		else if (Math.abs(currentscrolloffsetvalue) > scrollheightarray[newindex-fb_y]){
			fb_scrollupto(scrollheightarray[newindex-fb_y]);
		}
	}
	else {
		fb_selbyindex(fp_maxpos);
		if(fp_maxpos > 4) {
			fb_scrolldownto(scrollheightarray[fp_maxpos-1]+thumb_boxsize+85-fb_y);
		}
	}
}
function fb_selnext(fb_y){
	var newindex = clickedindex+fb_y;
	if (newindex < fp_maxpos+fb_y) {
		fb_selbyindex(newindex);
		if (((currentscrolloffsetvalue) < (scrollheightarray[newindex-fb_y]-fb_totalheight+thumb_boxsize)) && (newindex >= 4)){
//		alert("c_offsetval:"+(currentscrolloffsetvalue)+" | is lower than:"+(scrollheightarray[newindex-1]-fb_totalheight+thumb_boxsize));
		fb_scrolldownto((scrollheightarray[newindex-fb_y])+thumb_boxsize+85-fb_y);
		}
	}
	else {
		fb_selbyindex(1);
		if(newindex > 4) {
		 fb_scrollupto(0);
		}
	}
}
function fb_fliplargeimg(id){
	loaddisplayimg(document.getElementById(id).src);
	resizeimage(id);
	moveimagetoflipbook_viewarea(id);
}
function fb_selbyindex(numposition){
	refreshAds();
	var imgid = "largeimg_"+numposition;
	var fb_obj = document.getElementById("smallimg_"+numposition);
	document.getElementById(clickedstate).className = "fb_image_thumb";
	clickedstate = "smallimg_"+numposition;
	clickedindex = numposition;
	fb_obj.className="fb_image_thumb_hover";
	loaddisplayimg(document.getElementById(imgid).src);
	moveimagetoflipbook_viewarea(imgid);
	resizeimage(imgid);
	if((numposition == 1) && (hasplayed == 1)) {
		fb_stop();
		hasplayed = 0;
	}
	if(numposition != 1) {
		hasplayed = 1;
	}
}

var scrollheightarray = new Array();

function cacheImages(){
	var thumbcollection = document.getElementById("fb_thumbspool").getElementsByTagName('img');
	fp_maxpos = parseInt(thumbcollection.length);
	for (i=1; i <= fp_maxpos; i++) {
			id="smallimg_"+i;
			theimage=new Image();
			theimage.src=document.getElementById(id).src;
			myimg.push(theimage);
		}
}
function flipbookinitialize(){
	//cacheImages();
	setTimeout(function(){}, 7500);
	var thumbcollection = document.getElementById("fb_thumbspool").getElementsByTagName('img');
	fp_maxpos = parseInt(thumbcollection.length);
	document.getElementById("fb_thumbspool").style.width = parseInt(fp_maxpos * thumb_boxsize)+"px";
	collectiveheight = 0;
	for (i=0; i < fp_maxpos; i++) {
		if (i == 1) {
			scrollheightarray.push(collectiveheight);
		} else {
			scrollheightarray.push(collectiveheight = collectiveheight+thumb_boxsize);
		}
		
		k=i+1
		if(document.getElementById("smallimg_"+k) != null)
		{
			document.getElementById("smallimg_"+k).alt = document.getElementById("associatedtextimg_"+k).innerHTML.replace(/(<([^>]+)>)/ig,"");
			//alert(document.getElementById("smallimg_"+i).alt);
		}
		
		//resizetodimensions("smallimg_"+i,100,130);
//		resizetodimensions(i,100,130);
	}
	var scrollheight = document.getElementById("fb_thumbspool").offsetWidth;	
	miniscrollheight = (fb_totalheight*fb_totalheight/scrollheight);
	scrollbarlowerlimit = parseInt(fb_totalheight-miniscrollheight);
	miniscrollratio = miniscrollheight/fb_totalheight;
	//document.getElementById("fp_adjustablescrollbar").style.height = parseInt(miniscrollheight)+"px";
	for(i=0; i < fp_maxpos; i++) {
		if(document.getElementById("smallimg_"+i) != null)
		{
			clickedstate="smallimg_"+i;
			var numtosel = i;
			break;
		}
	}
	fb_selbyindex(numtosel);
	//fb_play();
}
var miniscrollheight;
var scrollbarlowerlimit;
function thumbover(obj){
	obj.className="fb_image_thumb_hover";
}
function thumbout(obj){
if (clickedstate == obj.id) {return false;}
	obj.className="fb_image_thumb";
}

// mouse utility movement stuff
/*var isIE = document.all?true:false;
if (!isIE) document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = getMousePosition;
//document.body.onmouseup = deactivatescrollbar;
function getMousePosition(e) {
  var _x;
  var _y;
  if (!isIE) {
    _x = e.pageX;
    _y = e.pageY;
  }
  if (isIE) {
    _x = event.clientX + document.body.scrollLeft;
    _y = event.clientY + document.body.scrollTop;
  }
  mousey = _y
  if (boolean_scrollmouseactive){
	processscrollbar();  
  }
  return true;
}*/
var yorigin_clicked;
var scrollbaroffsetvalue = 0;
var currentscrollbaroffsetvalue = 0;
var currentscrolloffsetvalue = 0;
function processscrollbar(){
	var deltay = yorigin_clicked-mousey;
	currentscrollbaroffsetvalue = scrollbaroffsetvalue-deltay;
	if (currentscrollbaroffsetvalue < 0) {currentscrollbaroffsetvalue = 0;}
	if (currentscrollbaroffsetvalue > scrollbarlowerlimit) {currentscrollbaroffsetvalue = scrollbarlowerlimit;}
	currentscrolloffsetvalue = -currentscrollbaroffsetvalue/miniscrollheight*fb_totalheight;
	document.getElementById("fb_thumbspool").style.left = parseInt(currentscrolloffsetvalue)+"px";
}
function activatescrollbar(){
	boolean_scrollmouseactive = true;
	yorigin_clicked = mousey;
	scrollbaroffsetvalue = currentscrollbaroffsetvalue;
	document.body.onmouseup = deactivatescrollbar;
}
function fb_csbov_by_csov(){
	currentscrollbaroffsetvalue = -currentscrolloffsetvalue/fb_totalheight*miniscrollheight;
}
function fb_csov_by_csbov(){
	currentscrolloffsetvalue = -currentscrollbaroffsetvalue/miniscrollheight*fb_totalheight;
}
function deactivatescrollbar(){
	if(boolean_scrollmouseactive){
		boolean_scrollmouseactive = false;
		scrollbaroffsetvalue = currentscrollbaroffsetvalue+scrollbaroffsetvalue;
	}
}
// scrolling animation utility function
function fb_scrollupto(valuex){fb_scrollthumbs(currentscrolloffsetvalue,-valuex);}
function fb_scrolldownto(valuex){fb_scrollthumbs(currentscrolloffsetvalue,-valuex+fb_totalheight);}

function fb_scrollthumbs(startingx,endingx){
	var idname = "fb_thumbspool";
	var scrollidname = "fp_adjustablescrollbar";
	var startx = startingx;
	while (timeouts.length > 0) {
		window.clearTimeout(timeouts.pop());
	}
    var endx = endingx; // where we end at
	var deltax = startx-endx; // how much we want to shift over by
    var numframes = 25;
	var framerate = 15;
    var incrementdifferences = new Array();
	var incrementdifferences_rev;
    for (var i=0; i < numframes; i++) {
        incrementdifferences.push(deltax*Math.sin(i*Math.PI/2/numframes));// --ease out function
    }
	incrementdifferences_rev = incrementdifferences.reverse();
	for (var i=0; i < numframes; i++) {
		startx = startingx-incrementdifferences_rev.pop();
		if (i== numframes-1){startx = endingx;}
		var vartimeout = window.setTimeout("document.getElementById('"+idname+"').style.left = '"+parseInt(startx)+"px';",framerate*i);
		timeouts.push(vartimeout);
		//vartimeout = window.setTimeout("document.getElementById('"+scrollidname+"').style.top = '"+parseInt(-startx*miniscrollratio)+"px';",framerate*i);
		timeouts.push(vartimeout);
		if (i == (numframes-1)){currentscrolloffsetvalue = parseInt(startx);fb_csbov_by_csov();}
	}
	
//	alert("scrollvalue set:"+currentscrolloffsetvalue);
}
var autoscrolltimervar = new Array();
var scrolldeltay = 0;
function fb_scrollonup(){ while (autoscrolltimervar.length > 0){clearTimeout(autoscrolltimervar.pop());} scrolldeltay = 0; autoscrolltimervar.push(setInterval(function(){shiftdown(false);},25));}
function fb_scrollondown(){while (autoscrolltimervar.length > 0){clearTimeout(autoscrolltimervar.pop());} scrolldeltay = 0; autoscrolltimervar.push(setInterval(function(){shiftdown(true);},25));}
function fb_scrolloff(){
	while (autoscrolltimervar.length > 0){
		clearTimeout(autoscrolltimervar.pop());
		}
}

function shiftdown(var_bool){
	if (var_bool) {
		currentscrollbaroffsetvalue += 2;
	} else {currentscrollbaroffsetvalue -= 2;}
	if (currentscrollbaroffsetvalue < 0) {currentscrollbaroffsetvalue = 0;}
	if (currentscrollbaroffsetvalue > (scrollbarlowerlimit + 85)) {currentscrollbaroffsetvalue = (scrollbarlowerlimit+85);}
	currentscrolloffsetvalue = -currentscrollbaroffsetvalue/miniscrollheight*fb_totalheight;
	document.getElementById("fb_thumbspool").style.left = parseInt(currentscrolloffsetvalue)+"px";
}
function fb_play(){
	autoscrolltimervar.push(setInterval(function(){fb_selnext(1);},7500));
	document.getElementById("fb_stopimg").style.display = "block";
	document.getElementById("fb_playimg").style.display = "none";
}
function fb_stop(){
	while (autoscrolltimervar.length > 0){
		clearTimeout(autoscrolltimervar.pop());
	}
	document.getElementById("fb_stopimg").style.display = "none";
	document.getElementById("fb_playimg").style.display = "block";
}
function fb_mostop(mybool){
	var moobj = document.getElementById("fb_stopimg");
	if (mybool) {
		moobj.src="/cm/thedailygreen/images/design/flipbook/pause.gif";
	} else { moobj.src="/cm/thedailygreen/images/design/flipbook/pause2.gif";}
}
function fb_moplay(mybool){
	var moobj = document.getElementById("fb_playimg");
	if (mybool) {
		moobj.src="/cm/thedailygreen/images/design/flipbook/play.gif";
	} else { moobj.src="/cm/thedailygreen/images/design/flipbook/play2.gif";}
}
function fb_monext(mybool){
	var moobj = document.getElementById("fb_nextimg");
	if (mybool) {
		moobj.src="/cm/thedailygreen/images/design/flipbook/big-right.gif";
	} else { moobj.src="/cm/thedailygreen/images/design/flipbook/big-right.gif";}
/*	var imgtrue = "next_over.gif";
	var imgfalse = "next.gif";
	if (mybool) {
		document.getElementById("button_right").style.backgroundImage = "url('/cm/cosmogirl/images/v01/flipbook_app/'"+imgfalse+"')";
	} else {
		document.getElementById("button_right").style.backgroundImage = "url('/cm/cosmogirl/images/v01/flipbook_app/'"+imgtrue+"')";
	}
*/}
function fb_moprev(mybool){
	var moobj = document.getElementById("fb_previmg");
	if (mybool) {
		moobj.src="/cm/thedailygreen/images/design/flipbook/big-left.gif";
	} else { moobj.src="/cm/thedailygreen/images/design/flipbook/big-left.gif";}
}
// call that initializes the fb
// I don't know of a good solution for this one, as calling window.onload will override the existing one, so intead, we are going to set an interval and call it a day.
//window.setTimeout(fb_init(),1000);
//Window.onload = fb_init;
//$(document).ready(fb_init());