// JavaScript Document
// some demo tings



function animationDemo() {



	// sequence collection

	

	var animations = [];

	var animationCount = 0;



	function nextAnimation() {

	  if (animations[animationCount]) {

	    writeDebug('starting animation '+animationCount);

	    animations[animationCount].start();

	    animationCount++;

	  }

	}



	// generic tween functions



	function animateBoxX(value) {

	  document.getElementById('box').style.left = value+'px';

	}



	function animateBoxH(value) {

	  document.getElementById('box').style.height = value+'px';

	}



	// create a sequence of animations



	animations.push(new Animation({

	  from: 0,

	  to: 200,

	  ontween: animateBoxX,

	  oncomplete: nextAnimation

	}));



	animations.push(new Animation({

	  from: parseInt(document.getElementById('education').offsetHeight),

	  to: 300,

	  ontween: animateBoxH,

	  oncomplete: nextAnimation

	}));



	animations.push(new Animation({

	  from: 200,

	  to: 400,

	  ontween: animateBoxX,

	  oncomplete: function() {

	    // run last two animations simultaneously

	    nextAnimation();

	    nextAnimation();

	  }

	}));



	// simultaneous #1

	animations.push(new Animation({

	  from: 400,

	  to: 800,

	  ontween: animateBoxX

	}));



	// simultaneous #2

	animations.push(new Animation({

	  from: 300,

	  to: 600,

	  ontween: animateBoxH

	}));



	nextAnimation(); // start the sequence



}



function redoAnimationDemo() {

	var o = document.getElementById('education');

	o.style.left = '0px';

	o.style.height = 'auto';

	animationDemo();

}



window.onload = function() {

	animationDemo();

}