function sleep(millis) {
	var future = new Future();
	setTimeout(future.fulfill, millis);
	future.result();
}    

function animate(element, property, endValue, duration, frameTime) {  
	// calculate animation variables 
	var frameCount = Math.ceil(duration/frameTime);
	var startValue = parseInt(element.style[property], 10);
	var distance = endValue - startValue;
	var jumpSize = Math.ceil(distance/frameCount);

	// do the animation 
	for (var i = 0; i < frameCount - 1; i++) {
		var nextValue = startValue + (jumpSize * i);
		element.style[property] = nextValue + "px";
		// note the yielding operation
		sleep(frameTime);
	}

	element.style[property] = endValue + "px";
}
  
function waitForClick(element) {
	var future = new Future();
	element.onclick = future.fulfill;
	future.result();
}    

function run() {
	var theButton = document.getElementById("theButton");
	while(true) {
		theButton.innerHTML = "go right";
		
		// move the button to the right (note the blocking operations)
		waitForClick(theButton);
		theButton.innerHTML = "-->";
		animate(theButton, "left", 200, 1000, 20);

		theButton.innerHTML = "go left";

		// move the button to the left (again note the blocking operations)
		waitForClick(theButton);
		theButton.innerHTML = "<--";
		animate(theButton, "left", 0, 1000, 20);
	}
}
new Future(run);
