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

animate = strand(function(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
		yield sleep(frameTime);
	}

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

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

		theButton.innerHTML = "go left";

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