var iAnimStage=0;
var iClipOffset=0;
var iAnimSteps=7;
var idAnim=null;

function HandsAnim(){
	var _page1=document.getElementById('page0');
	var _page2=document.getElementById('page3');
	var _left=document.getElementById('LeftAnim');
	var _right=document.getElementById('RightAnim');
	
	switch(iAnimStage){
		case 0:
			document.getElementById('LeftHandBase').style.display='none';
			document.getElementById('RightHandBase').style.display='none';
			_left.style.left='0px';
			_right.style.left='0px';
			_left.getElementsByTagName('img')[0].style.visibility='visible';
			_right.getElementsByTagName('img')[0].style.visibility='visible';
			PreparePages();
			break;
		case 6:
			_left.style.display='none';
			_page2.style.position='static';
			_page1.style.display='none';
			if(!_page1.runtimeStyle)
				document.getElementById('PageContainer').style.height='auto';
			_right.style.width='107px';
			clearInterval(idAnim);
			InitMenu();
			break;
		case 1:
			var _img=_right.getElementsByTagName('img');
			_img[0].style.visibility='hidden';
			_img[1].style.visibility='visible';
		default:
			var _i=iAnimStage;
			var _img=_left.getElementsByTagName('img');
			for(var i=0; i<_img.length; i++){
				_img[i].style.visibility=(i==_i) ? 'visible' : 'hidden';
			}
			var _h=(iAnimStage+1)*iClipOffset;
			_page1.style.clip='rect('+_h+'px, auto, auto, 0px)';
			_page2.style.clip='rect(0px, auto, '+_h+'px, 0px)';
			break;
	}
	iAnimStage++;
}

function _play(){
	HandsAnim();
	idAnim=setInterval('HandsAnim()', 80);
}

function PreparePages(){
	var _page1=document.getElementById('page0');
	var _page2=document.getElementById('page3');
	var _container=document.getElementById('PageContainer');
	
	var _h=_page1.offsetHeight;
	_container.style.height=_h+'px'
	_page1.style.position='absolute';
	_page2.style.display='block';
	
	iClipOffset=Math.round(_h/iAnimSteps);
	_page1.style.clip='rect('+iClipOffset+'px, auto, auto, 0px)';
	_page2.style.clip='rect(0px, auto, '+iClipOffset+'px, 0px)';
	//~ alert(iClipOffset);
}

function InitMenu(){
	oAnS.Add(new MenuItem('RoseLine', 1, new MenuImage('/i/menu/rose-small.gif', '/i/menu/rose-med.gif', '/i/menu/rose-large.gif')));
	oAnS.Add(new MenuItem('BlueLine', 2, new MenuImage('/i/menu/blue-small.gif', '/i/menu/blue-med.gif', '/i/menu/blue-large.gif')));
	var _item=oAnS.Add(new MenuItem('GreenLine', 3, new MenuImage('/i/menu/green-small.gif', '/i/menu/green-med.gif', '/i/menu/green-large.gif')));
	
	_item.Click();
}