jonathanbaker7/thread-test1.html

## thread-test1.html
<!DOCTYPE html>
<html>
<body>

<h2>Testing the events queue in a browser</h2>
<p>The event queue is single threaded, so anything currently running blocks all other
events.  This includes JavaScript, page rendering, and any user input</p>
<p>To test this, click on the “Go” button.  Watch the input boxes, as they are being updated in each loop.  The rendering, however, is on hold, so the changes don’t appear.</p>
<p>While the loop is running, you can also click the browser refresh button.  Nothing will happen until the loop completes!</p>

<form>
  <span>Current loop iterations:</span>
  <br/>
  X Loop: <input id="x" type="text"></input>
  <br/>
  Y Loop: <input id="y" type="text"></input>
</form>

<br/><br/>
<button onclick="runloop()">Go</button>


<script type="text/javascript">
console.log("Testing");

var x = document.getElementById("x");
var y = document.getElementById("y");

function runloop() {
  console.log("Starting the loop");
  for(var i=0; i<10000 ; i++ ) {
    x.setAttribute("value", i);
    console.log("Current X: " + x );
    for(var j=0; j < 1000 ; j++ ){
      y.setAttribute("value",j);
    }
  }
  return false
}

</script>


</body>
</html>
	<!DOCTYPE html>
	<html>
	<body>

	<h2>Testing the events queue in a browser</h2>
	<p>The event queue is single threaded, so anything currently running blocks all other
	events. This includes JavaScript, page rendering, and any user input</p>
	<p>To test this, click on the “Go” button. Watch the input boxes, as they are being updated in each loop. The rendering, however, is on hold, so the changes don’t appear.</p>
	<p>While the loop is running, you can also click the browser refresh button. Nothing will happen until the loop completes!</p>

	<form>
	<span>Current loop iterations:</span>
	<br/>
	X Loop: <input id="x" type="text"></input>
	<br/>
	Y Loop: <input id="y" type="text"></input>
	</form>

	<br/><br/>
	<button onclick="runloop()">Go</button>


	<script type="text/javascript">
	console.log("Testing");

	var x = document.getElementById("x");
	var y = document.getElementById("y");

	function runloop() {
	console.log("Starting the loop");
	for(var i=0; i<10000 ; i++ ) {
	x.setAttribute("value", i);
	console.log("Current X: " + x );
	for(var j=0; j < 1000 ; j++ ){
	y.setAttribute("value",j);
	}
	}
	return false
	}

	</script>


	</body>
	</html>