// JavaScript Document
var pWidthArr = new Array();
var projectTween, projectBgTween, projectInTween;
var scrollTween;
var scrollTweenState = false;
var shipScrollTween, tagScrollTween, mainScrollTween;
var contactTween, aboutTween, aboutScrollTween, aboutPhotoTween;
var page = 0;
var tagOpTween = new Array();
var tagTween = new Array();
var safariMask = 0;
var shipIndex = 0;
var shipNum = 0;

var w;

var reloads = false; 

var t1 = new Array();
var t2 = new Array();
var t3 = new Array();


function init() {	
	
	$(document).ready(function() {
		$("body").bind('mousewheel', function(event,delta){
											   event.preventDefault();
											   });
		//$(document).pngFix(); 
		$("#tagImg").attr("src", "images/brick_tag.jpg?timestamp=" + new Date().getTime());
		if(BrowserDetect.browser == "Explorer") {
			$("body").css("height", document.body.clientHeight);
		} else {
			$("body").css("height", window.innerHeight);
		}
		$(".mask").css("display", "none");
		$("#projectScroll").css("display", "none");
		//$(".tag").css("display","none");
		$(".shipFragment").css("display","block");
		$(".shipFragment").selectable({ disable:false });
		
		$(".mask").bind('click', function() {
			//$("#projectScroll").css("display", "none");
			$(".mask").css("display", "none");
			//$(".project").css("display", "none");
			//projectBgTween.rewind();
			if (projectBgTween != null) projectBgTween.stop();
			if (projectInTween != null) projectInTween.stop();

			projectBgTween = new Tween(document.getElementById('projectId').style,'marginLeft',Tween.strongEaseOut,0,cWidth,1,'px');
			projectBgTween.start();
			projectBgTween.onMotionFinished = function(evt) {
				$(".project").css("display", "none");
			}
			
			$('.project').unbind('mousewheel');
		});

	});
	

	$(window).resize(function() {
		window.location.replace("http://icebreakerhk.com");		  
	});

	
}

function initScroll() {

	$(document).ready(function() {
		var pX = 0;
		var mL = 0;
		var maxW = document.body.clientWidth-30;
		var ratio = (w-document.body.clientWidth+100)/maxW;
		
		shipScrollTween = new Tween(document.getElementById('shipId').style,'marginLeft',Tween.strongEaseOut,0,0,1,'px');
		tagScrollTween = new Tween(document.getElementById('tagId').style,'marginLeft',Tween.strongEaseOut,0,0,1,'px');
		mainScrollTween = new Tween(document.getElementById('scrollbarId').style,'left',Tween.strongEaseOut,0,0,1,'px');
	
		$(".workScrollbar").draggable({axis:'x', containment:'window' ,snap: true ,drag: function(event, ui) { 
				//var tmp = document.getElementById("scrollbarId").style.left;
				var tmp = $(".workScrollbar").css("left").replace("px","");
				document.getElementById("shipId").style.marginLeft = -(tmp*ratio)+"px";
				document.getElementById("tagId").style.marginLeft = -(tmp*ratio)+"px";
				pX = event.pageX;
				}}
		);
		
		$('.ship').bind('mousewheel', function(event,delta){
											   event.preventDefault();
											   
			var tmp = $("#scrollbarId").css("left").replace("px","");
			var offset = 300;
			
			var x2 = document.body.clientWidth-110;
											   
			if (delta > 0) {
			   // mousewheel is going up; 
			   if(Number(tmp)-offset > 0) {
					mainScrollTween.continueTo((Number(tmp)-offset), 0.5);
					shipScrollTween.continueTo(-(Number(tmp)-offset)*ratio, 0.5);
					tagScrollTween.continueTo(-(Number(tmp)-offset)*ratio, 0.5);
		  		} else {
					mainScrollTween.continueTo(0, 0.5);
					shipScrollTween.continueTo(0, 0.5);
					tagScrollTween.continueTo(0, 0.5);
		  		}
			 } else {
			   // mousewheel is going down 
				//document.getElementById("shipId").style.marginLeft = -(tmp*ratio)+"px";
				//document.getElementById("tagId").style.marginLeft = -(tmp*ratio)+"px";
				if(Number(tmp)+offset < x2) {
					mainScrollTween.continueTo((Number(tmp)+offset), 0.5);
					shipScrollTween.continueTo(-(Number(tmp)+offset)*ratio, 0.5);
					tagScrollTween.continueTo(-(Number(tmp)+offset)*ratio, 0.5);
		  		} else {
					mainScrollTween.continueTo(x2, 0.5);
					shipScrollTween.continueTo(-x2*ratio, 0.5);
					tagScrollTween.continueTo(-x2*ratio, 0.5);
		  		}
				
			 }
		});
		
		$('.tag').bind('mousewheel', function(event,delta){
											   
			var tmp = $("#scrollbarId").css("left").replace("px","");
			var offset = 300;
			
			var x2 = document.body.clientWidth-110;
											   
			if (delta > 0) {
			   // mousewheel is going up; 
			   if(Number(tmp)-offset > 0) {
					mainScrollTween.continueTo((Number(tmp)-offset), 0.5);
					shipScrollTween.continueTo(-(Number(tmp)-offset)*ratio, 0.5);
					tagScrollTween.continueTo(-(Number(tmp)-offset)*ratio, 0.5);
		  		} else {
					mainScrollTween.continueTo(0, 0.5);
					shipScrollTween.continueTo(0, 0.5);
					tagScrollTween.continueTo(0, 0.5);
		  		}
			 } else {
				 if(BrowserDetect.browser == "Explorer") {
						if(BrowserDetect.version == 7) {
							event.preventDefault();
						}
				 }
			   // mousewheel is going down 
				//document.getElementById("shipId").style.marginLeft = -(tmp*ratio)+"px";
				//document.getElementById("tagId").style.marginLeft = -(tmp*ratio)+"px";
				if(Number(tmp)+offset < x2) {
					mainScrollTween.continueTo((Number(tmp)+offset), 0.5);
					shipScrollTween.continueTo(-(Number(tmp)+offset)*ratio, 0.5);
					tagScrollTween.continueTo(-(Number(tmp)+offset)*ratio, 0.5);
		  		} else {
					mainScrollTween.continueTo(x2, 0.5);
					shipScrollTween.continueTo(-x2*ratio, 0.5);
					tagScrollTween.continueTo(-x2*ratio, 0.5);
		  		}
				
			 }
		});
		
	});
	
}



/*------------------ project function ------------------*/

function workMouseUp() {
	$("#works").click(function(){
		if(page == 2) {
			page = 0;
			var contactW = Number($("#contactBG").css("width").replace("px",""));
			if(contactTween != null) contactTween.stop();
			contactTween = new Tween(document.getElementById('contactBG').style,'left',Tween.contactEaseOut,0,contactW,1,'px');
			contactTween.start();
		} else if(page == 1) {
			page = 0;
			var aboutW = Number($("#aboutBG").css("width").replace("px",""));
			if(aboutTween != null) aboutTween.stop();
			aboutTween = new Tween(document.getElementById('aboutBG').style,'left',Tween.contactEaseOut,0,aboutW,1,'px');
			aboutTween.start();
		}
	 });
}

function initProject(index, pWidth) {
	$("#project_des"+index).css("display", "none");

	pWidthArr[index] = pWidth;
	document.getElementById("project_des"+index).style.width = pWidthArr[index]+"px";
	
}

function initPhotoWidth(index, pWidth) {
	$("#photo"+index).css("width", (pWidth+400)+"px");
	//document.getElementById("photo"+index).style.width = pWidth+"px";
	
}

function detectProjectScroll(index) {
	$("#projectScroll").css("display", "block");
	//$(".projectScrollbar").css("left","30px");
	
	var tmpWidth = $("#project_des"+index).css("width").replace("px","");
	var diff = Number(tmpWidth)-(document.body.clientWidth-110);
	var ratio = (document.body.clientWidth-110)/diff;
	var offset;
	//if(diff > 800) offset = diff/15;
	//else offset = 400;
	offset = document.body.clientWidth*0.7;
	//alert(ratio);
	
	var x2 = document.body.clientWidth-110;
	
	var ratio2 = diff/(document.body.clientWidth-110);
	
	scrollTween = new Tween(document.getElementById('projectScrollbarId').style,'left',Tween.regularEaseOut,0,0,1,'px');
	projectTween = new Tween(document.getElementById('project_des'+index).style,'marginLeft',Tween.regularEaseOut,0,0,1,'px');

	$("#projectScrollbarId").draggable({axis:'x', containment:[0, 0, x2, 0] ,snap: false ,drag: function(event, ui) { 
		var tmp = $("#projectScrollbarId").css("left").replace("px","");
		$("#project_des"+index).css("margin-left", -(tmp*ratio2)+"px");

	}});
	
	$('.project').bind('mousewheel',function(event,delta) {
											 event.preventDefault();
		var tmp = $("#project_des"+index).css("marginLeft").replace("px","");
		
		if (delta > 0) {
		   // mousewheel is going up; 
		   if(Number(tmp)+offset < 0) {
			   scrollTween.continueTo2(Number(-tmp)*ratio, (Number(-tmp)-offset)*ratio, 0.5);
			   projectTween.continueTo2(Number(tmp), (Number(tmp)+offset), 0.5);
		   } else {
				scrollTween.continueTo2(Number(-tmp)*ratio, 0, 0.5);
				projectTween.continueTo2(Number(tmp), 0, 0.5);
		   }
		 } else {
		   // mousewheel is going down
		   if(Number(tmp)-offset > -diff) {
				scrollTween.continueTo2(Number(-tmp)*ratio, (Number(-tmp)+offset)*ratio, 0.5);
				projectTween.continueTo2(Number(tmp), (Number(tmp)-offset), 0.5);
		   } else {
			  scrollTween.continueTo2(Number(-tmp)*ratio, diff*ratio, 0.5);
			  projectTween.continueTo2(Number(tmp), -diff, 0.5);
		   }
		 }
	});
		
}

/*------------------ enf of project function ------------------*/

/*------------------ ship function ------------------*/

function initShipWidth(size) {
	shipNum = size;
	w = size*65;
	document.getElementById("shipId").style.width = w+"px";
}

function loadingShip(index) {
	//$("#shipLoad"+index).css("filter","Alpha(opacity=100)");

	//$("#shipImg"+index).css("filter","progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/works/ship/ship"+index+".png',sizingMethod='scale')Alpha(opacity=0)");
	$(".shipFragment").css("display","block");
	
	if(BrowserDetect.browser == "Explorer") {
		$('#shipImg'+index).load(function() {
			$(".ship").css("opacity","100");
			$('#shipImg'+index).css("display","block");
			var tmp = document.getElementById('shipLoad'+index);
			var tmp2 = document.getElementById('shipImg'+index);
			//t1 = new Sequence();
			//t2 = new Sequence();
			//t3 = new Sequence();
			//t1.addChild(new OpacityTween(tmp, Tween.strongEaseOut, 100, 0, 1, true));
			//t2.addChild(new OpacityTween(tmp2, Tween.strongEaseIn, 0, 100, (0.05+index*0.1), false));
			
			//t3.addChild(t1);
			//t3.addChild(t2);
			
			//t3.start();
			
		});
	} else {
		$('#shipImg'+index).load(function() {
			shipIndex++;

			$(".ship").css("opacity","100");


			var tmp = document.getElementById('shipLoad'+index);
			var tmp2 = document.getElementById('shipImg'+index);
			
			t1[index] = new Sequence();
			t2[index] = new Sequence();
			t3[index] = new Sequence();
			
			t1[index].addChild(new OpacityTween(tmp, Tween.strongEaseOut, 100, 0, 1, true));
			t2[index].addChild(new OpacityTween(tmp2, Tween.strongEaseIn, 0, 100, (0.05+index*0.1), false));
			
			t3[index].addChild(t1[index]);
			t3[index].addChild(t2[index]);
			
			t3[index].start();
			
			if(index == shipNum) {
				
				for(var count=1;count<=shipNum;count++) {
					if($("#shipImg"+count).css("display") == "inline") {
						shipIndex++;
						var tmp = document.getElementById('shipLoad'+count);
						var tmp2 = document.getElementById('shipImg'+count);
						
						t1[count] = new Sequence();
						t2[count] = new Sequence();
						t3[count] = new Sequence();
						
						t1[count].addChild(new OpacityTween(tmp, Tween.strongEaseOut, 100, 0, 1, true));
						t2[count].addChild(new OpacityTween(tmp2, Tween.strongEaseIn, 0, 100, (0.05+count*0.1), false));
						
						t3[count].addChild(t1[count]);
						t3[count].addChild(t2[count]);
						
						t3[count].start();
						
						reloads = true;
					}
				}
				if(reloads == true && shipNum == shipIndex) {
					loadTag(shipNum);
				}
			}
		});
	}
}


/*------------------ enf of ship function ------------------*/

/*------------------ tag function ------------------*/
function initTag(total) {
	document.getElementById("tagId").style.width = w+"px";

	//$("#tagId").css("display","none");
	$(".tag").css("opacity","0");
	
	if(BrowserDetect.browser == "Explorer") {
		$("#tagImg").load(function() {
			$("#tagImg").ready(function() {
				$(".tag").css("opacity","100");
				$("#tagId").css("display","block");		
				
				for(tagCount=0;tagCount<total;tagCount++) {
					$("#tagBG"+tagCount).css("display","block");
					$("#tagBG"+tagCount).css("filter","Alpha(opacity=0)");
					tagOpTween = new OpacityTween(document.getElementById('tagBG'+tagCount), Tween.strongEaseOut, 0, 100, 0.5+tagCount*0.1, false);
					tagOpTween.start();
				}
				initTagMask();
			});
		});
	} else {
		$("#tagImg").ready(function() {
			$("#tagImg").load(function() {
//				 alert("aa");
			$(".tag").css("opacity","100");
			$("#tagId").css("display","block");
					
			for(tagCount=0;tagCount<total;tagCount++) {
				$("#tagBG"+tagCount).css("display","block");
				tagOpTween = new OpacityTween(document.getElementById('tagBG'+tagCount), Tween.strongEaseOut, 0, 100, 0.5+tagCount*0.1, false);
				tagOpTween.start();
				tagTween[tagCount] = new Tween(document.getElementById('tagBG'+tagCount).style,'marginTop',Tween.strongEaseOut,(-27),0,0.8+tagCount*0.1,'px');
				tagTween[tagCount].start();
			}
		});
								   });
		
	}
	//if($(".shipFrag").css("opacity") == 0) alert("ddgf");
}

function loadTag(total) {

	for(var count=1;count<=shipNum;count++) {
			if(t1[count] == null) {
					//alert("count"+count);
				var tmp = document.getElementById('shipLoad'+count);
				var tmp2 = document.getElementById('shipImg'+count);
						
				t1[count] = new Sequence();
				t2[count] = new Sequence();
				t3[count] = new Sequence();
						
				t1[count].addChild(new OpacityTween(tmp, Tween.strongEaseOut, 100, 0, 1, true));
				t2[count].addChild(new OpacityTween(tmp2, Tween.strongEaseIn, 0, 100, (0.05+count*0.1), false));
						
				t3[count].addChild(t1[count]);
				t3[count].addChild(t2[count]);
						
				t3[count].start();
		} else {
			
		}
	}
	
	$("#tagImg").ready(function() {
			$("#tagImg").load(function() {
	
		$(".tag").css("opacity","100");
		$("#tagId").css("display","block");
		
				
		for(tagCount=0;tagCount<total;tagCount++) {
			$("#tagBG"+tagCount).css("display","block");
			tagOpTween = new OpacityTween(document.getElementById('tagBG'+tagCount), Tween.strongEaseOut, 0, 100, 0.5+tagCount*0.1, false);
			tagOpTween.start();
			tagTween[tagCount] = new Tween(document.getElementById('tagBG'+tagCount).style,'marginTop',Tween.strongEaseOut,(-27),0,0.8+tagCount*0.1,'px');
			tagTween[tagCount].start();
		}
									   });
								});
}

function tagMouseUp(total) {
	
	for(i=0;i<total;i++) {
		$("#tag"+i).bind('mouseup', {index:i}, function(e) {
			$(".project").css({"display":"block", "width":"0px"});
			$("#projectId").css({"margin-left": "0px","width":"0"});
			cWidth = document.body.clientWidth;
			
			if (projectBgTween != null) projectBgTween.stop();
			if (projectInTween != null) projectInTween.stop();
			
			$(".project_des").css("margin-left", 0);
			$(".projectScrollbar").css("left", 0);
			for(j=0;j<total;j++) {
				if(j!=e.data.index) $("#project_des"+j).css("display", "none");
				else {
					$("#project_des"+j).css("display", "block");
					var tmpW = $("#project_des"+j).css("width").replace("px","");
					var cW = document.body.clientWidth;
					document.getElementById("projectContId").style.marginLeft = "-"+tmpW+"px";
					
					if(pWidthArr[j] < cW) {
						$("#projectScroll").css("display", "none");
						projectBgTween = new Tween(document.getElementById('projectId').style,'width',Tween.sineEaseInOut2,0,cW,0.7,'px');
						projectInTween = new Tween(document.getElementById('projectContId').style,'marginLeft',Tween.sineEaseInOut,-Number(tmpW),0,0.7,'px');
						projectBgTween.start();
						projectInTween.start();
					} else {
					
						//$(".projectCont").css("width", pWidthArr[j]+"px");
						
						var thers = 6000;
						
						
						if(pWidthArr[j] < cW) {
							$("#projectScroll").css("display", "none");
							
						} else {
							projectBgTween = new Tween(document.getElementById('projectId').style,'width',Tween.sineEaseInOut2,0,tmpW,0.7+(tmpW/thers),'px');
							projectInTween = new Tween(document.getElementById('projectContId').style,'marginLeft',Tween.sineEaseInOut,-Number(tmpW),0,0.7+(tmpW/thers),'px');
						}
						projectBgTween.start();
						projectInTween.start();
						detectProjectScroll(e.data.index);
					}
					/*if(BrowserDetect.browser == "Safari") {
						alert(Number($(".tagBG").css("height").replace("px","")));
						//if(Number($(".tagBG").css("height").replace("px",""))<100) {
							if(safariMask < 100) {
								
							var maskOffset = window.innerHeight-Number($(".tagBG").css("height").replace("px",""))+95;
							document.getElementById("maskId").style.marginTop = "-"+(maskOffset)+"px";
						//}
						}
						
					}*/
					
					$(".mask").css("display", "block");
				}
			}
		});
	}
}

function tagMouseOver(total) {
	for(i=0;i<total;i++) {
		$("#tag"+i).bind('mouseover', {index:i}, function(e) {
			for(j=0;j<total;j++) {
				if(j==e.data.index) {
					$("#tagBG"+j).css("background-color","#e4e5e6");
					if(BrowserDetect.browser == "Explorer") {
						if(BrowserDetect.version == 7) {
							$("#tagBG"+j).css("height",(document.body.clientHeight-405)+"px");
						} else $("#tagBG"+j).css("height",(document.body.clientHeight)+"px");
					}
					else $("#tagBG"+j).css("height",(document.body.clientHeight)+"px");
					$("#thumb"+j).css("display", "block");
					thumbIn(j);
				}
			}
		});
	}
}

function tagMouseOut(total) {
	for(i=0;i<total;i++) {
		$("#tag"+i).bind('mouseout', {index:i}, function(e) {
			for(j=0;j<total;j++) {
				if(j==e.data.index) {
					$("#tagBG"+j).css("background-color", "#ffffff");
					$("#thumb"+j).css("display", "none");
				}
			}
		});
	}
}

/*------------------ thumb function ------------------*/

function initThumb(total) {
	for(i=0;i<total;i++) {
		$("#thumb"+i).css("display", "none");
	}
}

function thumbIn(index) {
	$('#thumb'+index).load(function() {
		var tmp = document.getElementById('thumb'+index);
		$("#thumb"+index).css("display","block");
		//var thumbTween = new Sequence();
		//thumbTween.addChild(OpacityTween(tmp, Tween.strongEaseIn, 0, 100, 5, false));
		
		//thumbTween.start();
		
	});
}

/*------------------ end of thumb function ------------------*/

function initTagMask() {
	if(BrowserDetect.browser == "Explorer") {
		$("#tagImg").load(function() {
			$("#tagImg").ready(function() {
				if(BrowserDetect.version == 7) {
					var maskOffset = document.body.clientHeight-Number($(".tagBG").css("height").replace("px",""))+86;
					document.getElementById("maskId").style.marginTop = "-"+(maskOffset)+"px";
					document.getElementById("maskId").style.height = $(".tagBG").css("height");
				} else {
					var maskOffset = document.body.clientHeight-Number($(".tagBG").css("height").replace("px",""))+95;
					document.getElementById("maskId").style.marginTop = "-"+(maskOffset)+"px";
				}
			});
		 });
	} else if(BrowserDetect.browser == "Safari") {
		
		//var maskOffset = window.innerHeight-Number($(".tagBG").css("height").replace("px",""))+95;
		var maskOffset = window.innerHeight-435+95;
		safariMask = 435;
		//safariMask = Number($(".tagBG").css("height").replace("px",""));
		//alert(Number($(".tagBG").css("height").replace("px","")));
		document.getElementById("maskId").style.marginTop = "-"+(maskOffset)+"px";
		//$("#maskId").css("position","absolute");
		//document.getElementById("maskId").style.marginTop = (350)+"px";
}
	else {
		var maskOffset = window.innerHeight-Number($(".tagBG").css("height").replace("px",""))+95;
		document.getElementById("maskId").style.marginTop = "-"+(maskOffset)+"px";
	}
}

/*------------------ end of tag function ------------------*/

/*------------------ contact function ----------------*/

function initContact() {
	if(BrowserDetect.browser == "Explorer") {
		var contactOffset = document.body.clientHeight;
		document.getElementById("contactBG").style.marginTop = "-"+(contactOffset)+"px";
	} else {
		var contactOffset = window.innerHeight;
		document.getElementById("contactBG").style.marginTop = "-"+(contactOffset)+"px";
	}
	$("#contact").click(function() {
		if(page != 2) {
			if(page == 1) {
				page = 2;
				var seq1 = new Sequence();
				var seq2 = new Sequence();
				var seq3 = new Sequence();
				var aboutW = Number($("#aboutBG").css("width").replace("px",""));
				if(aboutTween != null) aboutTween.stop();
				aboutTween = new Tween(document.getElementById('aboutBG').style,'left',Tween.contactEaseOut,0,aboutW,1,'px');
				if(contactTween != null) contactTween.stop();
				var contactW = Number($("#contactBG").css("width").replace("px",""));
				contactTween = new Tween(document.getElementById('contactBG').style,'left',Tween.strongEaseOut,-contactW,0,1,'px');
				seq1.addChild(aboutTween);
				seq2.addChild(contactTween);
				seq3.addChild(seq1);
				seq3.addChild(seq2);
				seq3.start();
				$("#contactBG").css("display","block");
				initialize();
			} else {
				page = 2;
				if(contactTween != null) contactTween.stop();
				var contactW = Number($("#contactBG").css("width").replace("px",""));
				$("#contactBG").css({"left":-contactW+"px","display":"block"});
				initialize();
				contactTween = new Tween(document.getElementById('contactBG').style,'left',Tween.strongEaseOut,-contactW,0,1,'px');
				contactTween.start();
			}
		}
	});
}

function mapInit() {
	var map;
	
      if (GBrowserIsCompatible()) {
	  	// Create our "tiny" marker icon
		var blueIcon = new GIcon(G_DEFAULT_ICON);
		
		// Set up our GMarkerOptions object
		markerOptions = { icon:blueIcon };
	  
        map = new GMap2(document.getElementById("map"));
        map.setCenter(new GLatLng(31.247957, 121.451132), 12);
		
		//
		var point = new GLatLng(31.247957, 121.451132);
  		map.addOverlay(new GMarker(point, markerOptions));
		
		
		var point = new GLatLng(22.311954, 114.219658);
		map.addOverlay(new GMarker(point, markerOptions));
		
		//map.disableDragging();
        map.setUIToDefault();
      }
    }

/*------------------ end of contact function ------------------*/

/*------------------ about function --------------*/
function initAbout() {
	if(BrowserDetect.browser == "Explorer") {
		var aboutOffset = document.body.clientHeight;
		document.getElementById("aboutBG").style.top = (300)+"px";
		document.getElementById("aboutBG").style.height = (aboutOffset+64)+"px";
	} else {
		var aboutOffset = window.innerHeight;
		document.getElementById("aboutBG").style.marginTop = "-"+(aboutOffset+64)+"px";
	}
	$("#aboutBG").ready(function(){
		$("#aboutBG").css("display","block");
		//$(this).removeAttr("width").removeAttr("height").css({ width: "", height: "" });
		
		//var realW = Number(this.width)+580;
		
		var aboutW = Number($("#aboutBG").css("width").replace("px",""));
		var aboutH = Number($("#aboutBG").css("height").replace("px",""));
		$("#aboutContent").css("margin-left", (aboutW/2-265)+"px");
		//$(".aboutCont").css({"width":aboutW+"px", "height":aboutH+"px"});
		$(".aboutCont").css({"width":aboutW+"px", "height":"100%"});
		$("#aboutBG").css("display","none");
		//$(".aboutPhotoCont").css("width",realW+"px");
		
		
		//initAboutScroll();
		
			$("#about").click(function() {
				$(".aboutCont").bind('click', function(e) {
					 $(".aboutCont").unbind('click');
	
					if(aboutTween != null) aboutTween.stop();
					aboutTween = new OpacityTween(document.getElementById('aboutBG'), Tween.strongEaseOut, 100, 0, 0.5, true);
					aboutTween.start();
					//page = 0;

				});
				$("#aboutBG").css("display","block");
			if(page != 1) {
				//aboutTween = new Tween(document.getElementById('aboutBG').style,'opacity',Tween.secondEaseOut,-aboutW*2,0,1,'px');
				//page = 1;
				aboutTween = new OpacityTween(document.getElementById('aboutBG'), Tween.strongEaseOut, 0, 100, 1, false);
				aboutTween.start();
				/*if(page == 2) {
					page = 1;
					var seq1 = new Sequence();
					var seq2 = new Sequence();
					var seq3 = new Sequence();
					var contactW = Number($("#contactBG").css("width").replace("px",""));
					if(contactTween != null) contactTween.stop();
					contactTween = new Tween(document.getElementById('contactBG').style,'left',Tween.contactEaseOut,0,contactW,1,'px');
					if(aboutTween != null) aboutTween.stop();
					var aboutW = Number($("#aboutBG").css("width").replace("px",""));
					aboutTween = new Tween(document.getElementById('aboutBG').style,'left',Tween.secondEaseOut,-aboutW*2,0,1,'px');
					seq1.addChild(contactTween);
					seq2.addChild(aboutTween);
					seq3.addChild(seq1);
					seq3.addChild(seq2);
					seq3.start();
				} else {
					page = 1;
					if(aboutTween != null) aboutTween.stop();
					var aboutW = Number($("#aboutBG").css("width").replace("px",""));
					$("#aboutBG").css({"display":"block"});
		
					aboutTween = new Tween(document.getElementById('aboutBG').style,'left',Tween.secondEaseOut,-aboutW*2,0,1,'px');
					aboutTween.start();
				}*/
			}
		});
	});
								 

	
}

function initAboutScroll() {
		var maxW = document.body.clientWidth-30;
		var realW = Number($("#aboutContent").css("width").replace("px",""));
		if(realW < maxW) {
			$("#aboutScroll").css("display", "none");
		} else {
			$("#aboutScroll").css("display", "block");
			if(BrowserDetect.browser == "Explorer") {
				$("#aboutScroll").css("width",Number(document.body.clientWidth+30)+"px");
			}
		var maxW = document.body.clientWidth-30;
		var ratio = (realW-document.body.clientWidth+150-(65*2))/maxW;
		
		aboutScrollTween = new Tween(document.getElementById('aboutContent').style,'marginLeft',Tween.strongEaseOut,0,0,1,'px');
		aboutPhotoScrollTween = new Tween(document.getElementById('aboutScrollbarId').style,'left',Tween.strongEaseOut,0,0,1,'px');
	
		$(".aboutScrollbar").draggable({axis:'x', containment:'window' ,snap: true ,drag: function(event, ui) { 
				var tmp = $(".aboutScrollbar").css("left").replace("px","");
				document.getElementById("aboutContent").style.marginLeft = -(tmp*ratio)+"px";
				}}
		);
		
		$('#aboutContent').bind('mousewheel', function(event,delta){
											   
			var tmp = $("#aboutScrollbarId").css("left").replace("px","");
			var offset = 300;
			
			var x2 = document.body.clientWidth-110;
											   
			if (delta > 0) {
			   // mousewheel is going up; 
			   if(Number(tmp)-offset > 0) {
					aboutPhotoScrollTween.continueTo((Number(tmp)-offset), 0.5);
					aboutScrollTween.continueTo(-(Number(tmp)-offset)*ratio, 0.5);
		  		} else {
					aboutPhotoScrollTween.continueTo(0, 0.5);
					aboutScrollTween.continueTo(0, 0.5);
		  		}
			 } else {
			   // mousewheel is going down 
				if(Number(tmp)+offset < x2) {
					aboutPhotoScrollTween.continueTo((Number(tmp)+offset), 0.5);
					aboutScrollTween.continueTo(-(Number(tmp)+offset)*ratio, 0.5);
		  		} else {
					aboutPhotoScrollTween.continueTo(x2, 0.5);
					aboutScrollTween.continueTo(-x2*ratio, 0.5);
		  		}
				
			 }
		});
		}
	
}
/*------------------ end of about function ---------------*/

function loadXMLDoc()
{
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.open("GET","ajax_info.txt",false);
xmlhttp.send();
document.getElementById("projectId").innerHTML=xmlhttp.responseText;
}