var myWidth = 0, myHeight = 0;
var marginTotal = 300;
var marginTotalH = 100;
var TimeToFade = 1000.0;
var showIcons = 0;
var fadeOff = 0;

if( typeof( window.innerWidth ) == 'number' ) {
	myWidth = window.innerWidth;
	myHeight = window.innerHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
    myWidth = document.documentElement.clientWidth;
    myHeight = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
    myWidth = document.body.clientWidth;
    myHeight = document.body.clientHeight;
}

function getWH() {
	if( typeof( window.innerWidth ) == 'number' ) {
		myWidth = window.innerWidth;
		myHeight = window.innerHeight;
	} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
    	myWidth = document.documentElement.clientWidth;
    	myHeight = document.documentElement.clientHeight;
	} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
    	myWidth = document.body.clientWidth;
   		myHeight = document.body.clientHeight;
	}
}

function getWHAlert() {
	if( typeof( window.innerWidth ) == 'number' ) {
		myWidth = window.innerWidth;
		myHeight = window.innerHeight;
	} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
    	myWidth = document.documentElement.clientWidth;
    	myHeight = document.documentElement.clientHeight;
	} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
    	myWidth = document.body.clientWidth;
   		myHeight = document.body.clientHeight;
	}
	alert("resize: " + myWidth + " " + myHeight);
}

function setBg() {
	bg = 'bg';
	bgimg = 'bgimg';
	bg2 = 'bg2';
	bgimg2 = 'bgimg2';
	
	if (!myWidth || !myHeight)
		getWH();

	e = document.getElementById(bgimg);
	
	if ((myWidth*0.664) > myHeight)
		e.style.width = (myWidth) + 'px';
	else
		e.style.height = (myHeight) + 'px';

	/*e = document.getElementById(bgimg2);
	e.style.width = (myWidth+20) + 'px';

	e = document.getElementById(bg2);
	e.style.left = '-' + (myWidth+20) + 'px';*/

	if (fadeOff) {
		e = document.getElementById(bg);
		e.style.opacity = 1;		

		h = myHeight - 150;

		e = document.getElementById('dress');
		e.style.left = 100;
		e.style.bottom = h;		
		e.style.opacity = 1;
		e = document.getElementById('house');
		e.style.left = 100;
		e.style.bottom = h-150;		
		e.style.opacity = 1;
		e = document.getElementById('iphone');
		e.style.left = 115;
		e.style.bottom = h-300;		
		e.style.opacity = 1;

		e = document.getElementById('newsmini');
		if (e) {
			e.style.opacity = 1;
			//e.style.opacity = 0.7;
		}

		e = document.getElementById('dressworks');
		e.style.opacity = 1;
		e = document.getElementById('houseworks');
		e.style.opacity = 1;
		e = document.getElementById('iphoneworks');
		e.style.opacity = 1;
	}
	else {
		fadeIn(bg, 0);
		setTimeout('fadeInIcon();', 4000);
		//setTimeout('switchBg('+(myWidth+10)+',0);', 5500);
	}
	//else {
	//	e = document.getElementById(bg);
	//	e.style.opacity = 1;
	//}
}

function resizeBg() {
	getWH();
		
	e = document.getElementById(bgimg);
	
	if ((myWidth*0.664) > myHeight)
		e.style.width = (myWidth) + 'px';
	else
		e.style.height = (myHeight) + 'px';
}

function pushObj() {

	if (!myWidth || !myHeight)
		getWH();

	if (showIcons) {
		h = myHeight - 150;
		moveObj("dress",25,25,100,h);
		moveObj("house",105,75,100,(h-150));
		moveObj("iphone",35,125,115,(h-300));
		setTimeout('fadeIn("houseworks",0);', 2000);
		setTimeout('fadeIn("dressworks",0);', 2000);
		setTimeout('fadeIn("iphoneworks",0);', 2000);
		showIcons = 0;
		e = document.getElementById('dressmenu');
		e.style.opacity = 0;
		e = document.getElementById('housemenu');
		e.style.opacity = 0;
		e = document.getElementById('iphonemenu');
		e.style.opacity = 0;
	}
}

function moveObj(id, fx, fy, tx, ty) {
	e = document.getElementById(id);
	mX = 3;
	mY = 20;
	set = 0;
	
	if (!myWidth || !myHeight)
		getWH();

	//alert(fx+' '+fy+' '+tx+' '+ty);

	if ((fy+mY) < ty) {
		fy = fy+mY;
		e.style.bottom = fy + 'px';
		set = 1;
	}
	else {
		e.style.bottom = ty + 'px';
	}

	if ((fx+mX) < tx) {
		fx = fx+mX;
		e.style.left = fx + 'px';
		set = 1;
	}
	else {
		e.style.left = tx + 'px';
	}

	if (set)		
		setTimeout('moveObj('+id+','+fx+','+fy+','+tx+','+ty+');', 50);

}

function fadeInIcon() {
	house = 'house';
	dress = 'dress';
	iphone = 'iphone';
	newsmini = 'newsmini';
	
	fadeIn(house, 0);
	fadeIn(dress, 0);
	fadeIn(iphone, 0);
	e = document.getElementById(newsmini);
	if (e)
		fadeInLevel(newsmini, 0, 1);
	showIcons = 1;
}

function showE(id) {
	if (showIcons) {
		e = document.getElementById(id);
		e.style.opacity = 1;
	}
}

function hideE(id) {
	if (showIcons) {
		e = document.getElementById(id);
		e.style.opacity = 0;
	}
}

/*
function switchBg(pos1, pos2) {
	bg = 'bg';
	bg2 = 'bg2';
	
	e = document.getElementById(bg);
	e2 = document.getElementById(bg2);

	if (pos1 > 0) {
		pos2 = pos2+200;
		e.style.left = pos2 + 'px';
		pos1 = pos1-200;
		e2.style.left = '-' + pos1 + 'px';
		setTimeout('switchBg('+pos1+','+pos2+');', 50);
	}
	else {
		e2.style.left = (0+10)+'px';
	}
}


function unsetBg() {
	bg = 'bg';

	//fadeOut(bg, 1, "foo");
}
*/

function setWorks(id) {
	if (!myWidth || !myHeight)
		getWH();

	// IMAGE SIZE SHOULD BE 800x450
	e = document.getElementById(id);
	dividbase = 'mainDiv';
	pidbase = 'mainP';
	tdidbase = 'tdw';
	imgidbase = 'imgw';

	w = myWidth - marginTotal;
	iw = w / 3;
	ih = iw * (9/16);
	h = ih * 3;
	w2 = w/2;
	h2 = h/2;
	//alert(w + ' ' + iw + ' ' + h + ' ' + ih + ' ' + w2 + ' ' + h2)

	e.style.width = w + 'px';	
	e.style.height = h + 'px';	
	e.style.margin = '-' + h2 + 'px 0 0 ' + '-' + w2 + 'px';

	var aWidth=new Array(0, iw+3, iw*2+6, 0, iw+3, iw*2+6, 0, iw+3, iw*2+6);
	var aHeight=new Array(0, 0, 0, ih+3, ih+3, ih+3, ih*2+6, ih*2+6, ih*2+6);

	for (i = 0; i < 9; i++) {
		e = document.getElementById(dividbase + i);
		if (e) {
			e.style.width = iw;	
			e.style.height = ih;
			e.style.top = aHeight[i];
			e.style.left = aWidth[i];
		}
		e = document.getElementById(imgidbase + i);
		if (e) {
			e.style.width = iw-5;	
			e.style.height = ih-5;
		}
	}
}

function setSingleWork() {
	if (!myWidth || !myHeight)
		getWH();

	// IMAGE SIZE SHOULD BE 1600xWHATEVER
	ptop = 30;
	left = 217;
	center = 550;
	right = 217;
	imageMargin = 25*2;

	e = document.getElementById('workCenter');
	w = myWidth - (left+right+marginTotal);
	w2 = w/2;
	imgw = w - imageMargin;
	e.style.top = ptop;
	e.style.width = w + 'px';	
	e.style.margin = '0 0 0 ' + '-' + w2 + 'px';

	e = document.getElementById('workLeft');
	if (!e)
		e = document.getElementById('workLeft_ja');
	w = left+w2;
	e.style.top = ptop;
	e.style.width = left + 'px';	
	e.style.margin = '0 0 0 ' + '-' + w + 'px';

	e = document.getElementById('workRight');
	w = w2;
	e.style.top = ptop;
	e.style.width = left + 'px';	
	e.style.margin = '0 0 0 ' + w + 'px';

	e = document.getElementById('workImage');
	if (e) {
		h = e.style.height;
		if (h == '1px') {
			e.style.height = myHeight - 60 + 'px';
		}
		else {
			w = imgw;
			e.style.width = w + 'px';
		}
	}
}

function setAbout() {
	at1 = 'abouttxt1';
	at2 = 'abouttxt2';
	ai = 'aboutimage';
	aii = 'aboutimageid';

	if (!myWidth || !myHeight)
		getWH();

	h = myHeight - marginTotalH;
	mT = h/2;
	w = 200+15+200+15+(h*0.913);
	w2 = w/2;
	imgw = h*0.913;
	imgoffset = w2 - (w2 - imgw);
	imgoffset = (imgw - 400)/2;

	e = document.getElementById(at1);
	e.style.height = h;
	e.style.width = 200 + 'px';
	e.style.marginLeft = '-' + (200+200+imgoffset+15) + 'px';
	e.style.marginTop = '-' + h/2 + 'px'; 
	

	e = document.getElementById(at2);
	e.style.height = h;	
	e.style.width = 200 +'px';	
	e.style.marginLeft = '-' + (200+imgoffset) + 'px';
	e.style.marginTop = '-' + h/2 + 'px';

	e = document.getElementById(ai);
	e.style.width = imgw;	
	e.style.height = h;	
	e.style.marginLeft = '-' + (imgoffset-15) + 'px';
	e.style.marginTop = '-' + h/2 + 'px'; 

	e = document.getElementById(aii);
	//e.style.width = imgw;	
	e.style.height = h-4;	
}

function borderOn(id) {
	//e = document.getElementById(id);
	
	//e.style.borderColor = '#f22d94';
}

function borderOff(id) {
	e = document.getElementById(id);
	
	e.style.borderColor = 'black';
}

function fadeIn(id, val)
{
	e = document.getElementById(id);
	if (e.style.opacity < 1) {
		if (val > 0.5)
			val += 0.04;
		else
			val += 0.02;
		e.style.opacity = val;
		setTimeout('fadeIn("'+id+'",'+val+')', 50);
	}
}

function fadeInLevel(id, val, level)
{
	e = document.getElementById(id);
	if (e.style.opacity < level) {
		if (val > 0.5)
			val += 0.02;
		else
			val += 0.02;
		e.style.opacity = val;
		setTimeout('fadeInLevel("'+id+'",'+val+','+level+')', 50);
	}
}

function fadeOut(name, val, action)
{
	element = document.getElementById(name);
	if (element.style.opacity > .05) {
		val -= 0.05;
		element.style.opacity = val;
		setTimeout('fadeOut("'+name+'",'+val+')', 50);
	} else {
		var pages=new Array("/travels/","/portraits/","/weeds/","/wedding/", "/local/");
		var rand=Math.floor(Math.random()*5);
		document.location = pages[rand];
	}
}

function setFadeOff()
{
	fadeOff = 1;
}

/*
function fade(eid)
{
  var element = document.getElementById(eid);
  if(element == null)
    return;
   
  if(element.FadeState == null)
  {
    if(element.style.opacity == null
        || element.style.opacity == ''
        || element.style.opacity == '1')
    {
      element.FadeState = 2;
    }
    else
    {
      element.FadeState = -2;
    }
  }
   
  if(element.FadeState == 1 || element.FadeState == -1)
  {
    element.FadeState = element.FadeState == 1 ? -1 : 1;
    element.FadeTimeLeft = TimeToFade - element.FadeTimeLeft;
  }
  else
  {
    element.FadeState = element.FadeState == 2 ? -1 : 1;
    element.FadeTimeLeft = TimeToFade;
    setTimeout("animateFade(" + new Date().getTime() + ",'" + eid + "')", 33);
  }  
}

function  animateFade(lastTick, eid)
{  
  var curTick = new Date().getTime();
  var elapsedTicks = curTick - lastTick;
 
  var element = document.getElementById(eid);
 
  if(element.FadeTimeLeft <= elapsedTicks)
  {
    element.style.opacity = element.FadeState == 1 ? '1' : '0';
    element.style.filter = 'alpha(opacity = '
        + (element.FadeState == 1 ? '100' : '0') + ')';
    element.FadeState = element.FadeState == 1 ? 2 : -2;
    return;
  }
 
  element.FadeTimeLeft -= elapsedTicks;
  var newOpVal = element.FadeTimeLeft/TimeToFade;
  if(element.FadeState == 1)
    newOpVal = 1 - newOpVal;

  element.style.opacity = newOpVal;
  element.style.filter = 'alpha(opacity = ' + (newOpVal*100) + ')';
 
  setTimeout("animateFade(" + curTick + ",'" + eid + "')", 33);
}*/