brendanberg · August 24, 2011 20:28 · brendanberg · Aug 24, 2011
diff --git a/coffee.html b/coffee.html
 <!DOCTYPE html>

 <html lang="en">
 <head>
 	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 	<title>Caffeinate Me!</title>
 	<meta name="generator" content="TextMate http://macromates.com/">
 	<meta name="author" content="Brendan Berg">
 	<!-- Date: 2011-08-24 -->
 	<style>
 body { 
 	font: 18px courier;
 	background-color: #333;
 }

 textarea {
 	font: 18px "Courier New";
 	color: lightblue;
 	background-color: inherit;
 	outline-width: 0;
 	width: 99%;
 	border-color: #444;
 	-webkit-tab-size: 4;
 	-moz-tab-size: 4;
 	tab-size: 4;
 }

 textarea#output {
 	color: orange;
 }
 	</style>
 	<script type="text/javascript" src="jquery.min.js"></script>
 	<script type="text/javascript" src="coffee-script.js"></script>
 	<script language="javascript">

 var println;
 jQuery.fn.extend({
 	insertAtCaret: function(myValue){
 		return this.each(function(i) {
 			if (document.selection) {
 				this.focus();
 				sel = document.selection.createRange();
 				sel.text = myValue;
 				this.focus();
 			}
 			else if (this.selectionStart || this.selectionStart == '0') {
 				var startPos = this.selectionStart;
 				var endPos = this.selectionEnd;
 				var scrollTop = this.scrollTop;
 				this.value = this.value.substring(0, startPos)+myValue+this.value.substring(endPos,this.value.length);
 				this.focus();
 				this.selectionStart = startPos + myValue.length;
 				this.selectionEnd = startPos + myValue.length;
 				this.scrollTop = scrollTop;
 			} else {
 				this.value += myValue;
 				this.focus();
 			}
 		})
 	}
 });
 $(document).ready(function() {
 	println = function(str) {
 		$('#output').val($('#output').val() + str + '\n');
 	}
 	$('#output').focus(function() {
 		this.blur();
 	});
 	$('#term').keydown(function(evt) {
 		if (evt.which == 9) {
 			// Tab. Insert tab character at caret position.
 			$('#term').insertAtCaret('\t');
 			return false;
 		} else if (evt.which == 13) {
 			// Enter. Eval code.
 			if (evt.metaKey && !evt.ctrlKey) {
 				$('#output').val('');
 				eval(CoffeeScript.compile($('#term').val()));
 				return false;
 			}
 		} else if (evt.which == 74) {
 			// Cmd-J shows JavaScript source
 			if (evt.metaKey && !evt.ctrlKey) {
 				$('#output').val(CoffeeScript.compile($('#term').val()));
 				return false;
 			}
 		}
 	});
 	(function() {
 		var term = $('#term');
 		term.focus();
 		var len = term.val().length;
 		if (term.get(0).setSelectionRange) {
 			term.get(0).setSelectionRange(len, len);
 		} else if (term.get(0).createTextRange) {
 			var range = term.get(0).createTextRange();
 			range.moveEnd('character', len);
 			range.moveStart('character', pos);
 			range.select();
 		}
 	})();
 });
 </script>
 	
 </head>
 <body>
 	<div>
 		<textarea id="term" rows="20" cols="80"># CoffeeScript shell. Code up here, console down there. There's a 'println' convenience
 # function to write to the output console. Type Command-Enter to compile and execute
 # the script, Command-J outputs the compiled JavaScript. Enjoy!

 </textarea>
 	</div>
 	<div>
 		<textarea id="output" rows="20" cols="80"></textarea>
 	</div>
 </body>
 </html>
	<!DOCTYPE html>

	<html lang="en">
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>Caffeinate Me!</title>
	<meta name="generator" content="TextMate http://macromates.com/">
	<meta name="author" content="Brendan Berg">
	<!-- Date: 2011-08-24 -->
	<style>
	body {
	font: 18px courier;
	background-color: #333;
	}

	textarea {
	font: 18px "Courier New";
	color: lightblue;
	background-color: inherit;
	outline-width: 0;
	width: 99%;
	border-color: #444;
	-webkit-tab-size: 4;
	-moz-tab-size: 4;
	tab-size: 4;
	}

	textarea#output {
	color: orange;
	}
	</style>
	<script type="text/javascript" src="jquery.min.js"></script>
	<script type="text/javascript" src="coffee-script.js"></script>
	<script language="javascript">

	var println;
	jQuery.fn.extend({
	insertAtCaret: function(myValue){
	return this.each(function(i) {
	if (document.selection) {
	this.focus();
	sel = document.selection.createRange();
	sel.text = myValue;
	this.focus();
	}
	else if (this.selectionStart \|\| this.selectionStart == '0') {
	var startPos = this.selectionStart;
	var endPos = this.selectionEnd;
	var scrollTop = this.scrollTop;
	this.value = this.value.substring(0, startPos)+myValue+this.value.substring(endPos,this.value.length);
	this.focus();
	this.selectionStart = startPos + myValue.length;
	this.selectionEnd = startPos + myValue.length;
	this.scrollTop = scrollTop;
	} else {
	this.value += myValue;
	this.focus();
	}
	})
	}
	});
	$(document).ready(function() {
	println = function(str) {
	$('#output').val($('#output').val() + str + '\n');
	}
	$('#output').focus(function() {
	this.blur();
	});
	$('#term').keydown(function(evt) {
	if (evt.which == 9) {
	// Tab. Insert tab character at caret position.
	$('#term').insertAtCaret('\t');
	return false;
	} else if (evt.which == 13) {
	// Enter. Eval code.
	if (evt.metaKey && !evt.ctrlKey) {
	$('#output').val('');
	eval(CoffeeScript.compile($('#term').val()));
	return false;
	}
	} else if (evt.which == 74) {
	// Cmd-J shows JavaScript source
	if (evt.metaKey && !evt.ctrlKey) {
	$('#output').val(CoffeeScript.compile($('#term').val()));
	return false;
	}
	}
	});
	(function() {
	var term = $('#term');
	term.focus();
	var len = term.val().length;
	if (term.get(0).setSelectionRange) {
	term.get(0).setSelectionRange(len, len);
	} else if (term.get(0).createTextRange) {
	var range = term.get(0).createTextRange();
	range.moveEnd('character', len);
	range.moveStart('character', pos);
	range.select();
	}
	})();
	});
	</script>

	</head>
	<body>
	<div>
	<textarea id="term" rows="20" cols="80"># CoffeeScript shell. Code up here, console down there. There's a 'println' convenience
	# function to write to the output console. Type Command-Enter to compile and execute
	# the script, Command-J outputs the compiled JavaScript. Enjoy!

	</textarea>
	</div>
	<div>
	<textarea id="output" rows="20" cols="80"></textarea>
	</div>
	</body>
	</html>