From 08333b714e73034ca9098692950051d5d9d78220 Mon Sep 17 00:00:00 2001
From: jules <jules@okfoc.us>
Date: Tue, 21 Jan 2014 13:51:57 -0500
Subject: split off shader localstorage version

---
 shader-picker.html | 1 +
 1 file changed, 1 insertion(+)

(limited to 'shader-picker.html')

diff --git a/shader-picker.html b/shader-picker.html
index d482a6b..cc4bd18 100644
--- a/shader-picker.html
+++ b/shader-picker.html
@@ -115,6 +115,7 @@ a { color: #00f; }
 <script type="text/javascript" src="js/vendor/jquery-ui-1.10.3.custom.min.js"></script>
 <script type="text/javascript" src="js/vendor/canvasquery.js"></script>
 <script type="text/javascript" src="js/canvasquery.dither.js"></script>
+<script type="text/javascript" src="js/api/localstorage.js"></script>
 <script type="text/javascript" src="js/asdf.js"></script>
 <script type="text/javascript" src="js/image.js"></script>
 <script type="text/javascript" src="js/gallery.js"></script>
-- 
cgit v1.2.3-70-g09d2


From b1aab59987e2f6aecf904d32ba092b509e72e9d3 Mon Sep 17 00:00:00 2001
From: jules <jules@okfoc.us>
Date: Tue, 21 Jan 2014 15:31:31 -0500
Subject: call it local_shaders

---
 js/api/localstorage.js   | 94 ++++++++++++++++++++++++------------------------
 shader-localstorage.html |  4 +--
 shader-picker.html       |  4 +--
 3 files changed, 51 insertions(+), 51 deletions(-)

(limited to 'shader-picker.html')

diff --git a/js/api/localstorage.js b/js/api/localstorage.js
index 0ec7cad..eeae658 100644
--- a/js/api/localstorage.js
+++ b/js/api/localstorage.js
@@ -1,106 +1,106 @@
 
-user.shaders = new function(){}
-user.shaders.init = function(){
-  user.shaders.bind()
+local_shaders = new function(){}
+local_shaders.init = function(){
+  local_shaders.bind()
 }
-user.shaders.bind = function(){
-  user.shaders.buttons = {}
+local_shaders.bind = function(){
+  local_shaders.buttons = {}
   if ('SHADERS' in window) {
-    user.shaders.bindButtons( window.SHADERS )
+    local_shaders.bindButtons( window.SHADERS )
   }
-  user.shaders.bindButtons( user.shaders.getShaders() )
-  document.getElementById("add-shader").addEventListener("click", user.shaders.save, false)
-  document.getElementById("remove-shader").addEventListener("click", user.shaders.remove, false)
+  local_shaders.bindButtons( local_shaders.getShaders() )
+  document.getElementById("add-shader").addEventListener("click", local_shaders.save, false)
+  document.getElementById("remove-shader").addEventListener("click", local_shaders.remove, false)
 }
-user.shaders.bindButtons = function(shaders){
+local_shaders.bindButtons = function(shaders){
   for (var i = 0; i < shaders.length; i++){
-    user.shaders.bindButton(shaders[i])
+    local_shaders.bindButton(shaders[i])
   }
 }
-user.shaders.bindButton = function(data){
+local_shaders.bindButton = function(data){
 //   console.log("button >> " + data.name)
   var button = document.createElement("button")
   button.innerHTML = data.name
-  button.addEventListener("click", user.shaders.load.bind(this, data), false)
+  button.addEventListener("click", local_shaders.load.bind(this, data), false)
   document.getElementById("shaders").appendChild(button)
-  user.shaders.buttons[data.name] = button
+  local_shaders.buttons[data.name] = button
 }
-user.shaders.load = function(data){
+local_shaders.load = function(data){
   var shader = data.shader
   if (shader && shader.length > 0) {
-    user.shaders.name = data.name
+    local_shaders.name = data.name
     $("#shader").val(shader)
     // pause here?
     shader_build()
     $(".active").removeClass("active")
-    $(user.shaders.buttons[data.name]).addClass("active")
-    user.shaders.setLastAccessed(data.name)
+    $(local_shaders.buttons[data.name]).addClass("active")
+    local_shaders.setLastAccessed(data.name)
   }
 }
-user.shaders.loadLastAccessed = function(){
+local_shaders.loadLastAccessed = function(){
   var name = localStorage.getItem("im.lastShader") || "colorcycle"
-  if (name in user.shaders.buttons) {
-    $(user.shaders.buttons[name]).trigger("click")
+  if (name in local_shaders.buttons) {
+    $(local_shaders.buttons[name]).trigger("click")
   }
 }
-user.shaders.setLastAccessed = function(name){
+local_shaders.setLastAccessed = function(name){
   localStorage.setItem("im.lastShader", name)
 }
 
-user.shaders.getShaderByName = function(name){
-  return { name: name, shader: user.shaders.getShaderBody(name) }
+local_shaders.getShaderByName = function(name){
+  return { name: name, shader: local_shaders.getShaderBody(name) }
 }
-user.shaders.getShaderIndex = function(){
+local_shaders.getShaderIndex = function(){
   return JSON.parse( localStorage.getItem("im.shaders") ) || []
 }
-user.shaders.getShaderBody = function(name){
+local_shaders.getShaderBody = function(name){
   return localStorage.getItem("im.shaders."+name) || null
 }
-user.shaders.getShaders = function(){
-  var shaders = user.shaders.getShaderIndex()
-  return shaders.map(function(name){ return { name: name, shader: user.shaders.getShaderBody(name) } })
+local_shaders.getShaders = function(){
+  var shaders = local_shaders.getShaderIndex()
+  return shaders.map(function(name){ return { name: name, shader: local_shaders.getShaderBody(name) } })
 }
-user.shaders.setShaderIndex = function(shaders){
+local_shaders.setShaderIndex = function(shaders){
   localStorage.setItem("im.shaders", JSON.stringify(shaders))
 }
-user.shaders.setShader = function(name, shader){
+local_shaders.setShader = function(name, shader){
   if (! name.length || ! shader.length || !name.length || !shader.length) return
   localStorage.setItem("im.shaders." + name, shader)
 }
-user.shaders.removeShader = function(name){
+local_shaders.removeShader = function(name){
   localStorage.removeItem("im.shaders." + name)
 }
 
-user.shaders.save = function(){
+local_shaders.save = function(){
   var name = prompt("enter shader name")
   var shader = $("#shader").val()
 
   if (! name) return;
   if (shade !== shade_no_error_handling) return;
 
-  user.shaders.setShader(name, shader)
+  local_shaders.setShader(name, shader)
 
-  var shaders = user.shaders.getShaderIndex()
+  var shaders = local_shaders.getShaderIndex()
   shaders.push(name)
-  user.shaders.setShaderIndex(shaders)
+  local_shaders.setShaderIndex(shaders)
 
-  user.shaders.name = name
-  user.shaders.bindButton({ name: name, shader: shader })
+  local_shaders.name = name
+  local_shaders.bindButton({ name: name, shader: shader })
 
   $(".active").removeClass("active")
-  $(user.shaders.buttons[name]).addClass("active")
-  user.shaders.setLastAccessed(name)
+  $(local_shaders.buttons[name]).addClass("active")
+  local_shaders.setLastAccessed(name)
 }
 
-user.shaders.remove = function(){
-  var name = user.shaders.name
+local_shaders.remove = function(){
+  var name = local_shaders.name
   if (! name || ! name.length) return
 
-  var shaders = user.shaders.getShaderIndex()
+  var shaders = local_shaders.getShaderIndex()
   if (shaders.splice( shaders.indexOf(name), 1 )) {
-    user.shaders.setShaderIndex(shaders)
-    user.shaders.removeShader(name)
-    $(user.shaders.buttons[name]).remove()
-    user.shaders.name = ""
+    local_shaders.setShaderIndex(shaders)
+    local_shaders.removeShader(name)
+    $(local_shaders.buttons[name]).remove()
+    local_shaders.name = ""
   }
 }
diff --git a/shader-localstorage.html b/shader-localstorage.html
index cc4bd18..923f1b6 100644
--- a/shader-localstorage.html
+++ b/shader-localstorage.html
@@ -191,8 +191,8 @@ function init(){
     console.log("signed in as", user.username)
   }
 
-  user.shaders.init()
-  user.shaders.loadLastAccessed()
+  local_shaders.init()
+  local_shaders.loadLastAccessed()
 
   document.getElementById('shader').addEventListener('input', shader_build);
   shader_build()
diff --git a/shader-picker.html b/shader-picker.html
index cc4bd18..923f1b6 100644
--- a/shader-picker.html
+++ b/shader-picker.html
@@ -191,8 +191,8 @@ function init(){
     console.log("signed in as", user.username)
   }
 
-  user.shaders.init()
-  user.shaders.loadLastAccessed()
+  local_shaders.init()
+  local_shaders.loadLastAccessed()
 
   document.getElementById('shader').addEventListener('input', shader_build);
   shader_build()
-- 
cgit v1.2.3-70-g09d2


From 3a51572e8a6628f90e73e2ab0bca52a98d9540e7 Mon Sep 17 00:00:00 2001
From: Jules Laplace <jules@okfoc.us>
Date: Thu, 23 Jan 2014 10:10:19 -0500
Subject: more shuffling

---
 js/frames.js       | 32 ++++++++++++++++++++++++++++++++
 shader-api.html    | 44 ++++++++++++++++++++++----------------------
 shader-picker.html | 26 +++-----------------------
 3 files changed, 57 insertions(+), 45 deletions(-)

(limited to 'shader-picker.html')

diff --git a/js/frames.js b/js/frames.js
index 0ae256c..c9c844d 100644
--- a/js/frames.js
+++ b/js/frames.js
@@ -1,4 +1,36 @@
 
+var frame_editor = {}
+
+frame_editor.init = function(){
+	frame_editor.bind()
+}
+
+frame_editor.bind = function(){
+  $("#add-frame").click(add_frame)
+  $("#frames").sortable({
+    start: drag_start,
+    stop: drag_stop
+  });
+  $(document).on("click","#frames .remove",remove_frame)
+  $("#framecount").change(function(){
+    var val = $(this).int()
+    if (val < 1 || isNaN(val)) $(this).val(val = 1)
+    if (val == 1) $("#add-frame").html("+add frame")
+    else $("#add-frame").html("+add frames")
+  })
+
+  $("#frames").disableSelection();
+  $("#remove-all-frames").click(remove_all_frames)
+  $("#weave-frames").click(weave_frames)
+  $("#shuffle-frames").click(shuffle_frames)
+  $("#reverse-frames").click(reverse_frames)
+  $("#sort-frames").click(sort_frames)
+
+  $("#render").click(render)
+  $("#save").click(save)
+  $("#upload").click(upload)
+}
+
 function add_frame(){
   var frame_count = $("#framecount").int()
   if (frame_count < 2) {
diff --git a/shader-api.html b/shader-api.html
index dc22d10..ba8530e 100644
--- a/shader-api.html
+++ b/shader-api.html
@@ -22,15 +22,15 @@ a { color: #00f; }
 
 <!--
 <div id="gallery">
-  <div id="gallery-form">
-    <form id="gallery-search">
-      <input type="text" id="dumpfm-search-query" value="duck bill">
-      <button id="gallery-search">DUMP SEARCH</button>
-    </form>
-    <button id="gallery-random">IM RANDOM</button>
-    <span class="status"></span>
-  </div>
-  <div id="gallery-images"></div>
+	<div id="gallery-form">
+		<form id="gallery-search">
+			<input type="text" id="dumpfm-search-query" value="duck bill">
+			<button id="gallery-search">DUMP SEARCH</button>
+		</form>
+		<button id="gallery-random">IM RANDOM</button>
+		<span class="status"></span>
+	</div>
+	<div id="gallery-images"></div>
 </div>
 -->
 
@@ -57,15 +57,15 @@ a { color: #00f; }
 	<input type="text" id="url" value="img/1376516658960-dumpfm-DoritoWitch-TimeFLyTrans0001.png">
 	<input type="text" id="username" placeholder="username">
 	<input type="text" id="shader-name" placeholder="shader name">
-  <br>
-  <br>
+	<br>
+	<br>
 
-  <textarea id="shader"></textarea>
-  <br>
-  <button id="save-shader"><b>save shader</b></button>
-  <button id="pause">pause</button>
-  <button id="reset">reset</button>
-  <br>
+	<textarea id="shader"></textarea>
+	<br>
+	<button id="save-shader"><b>save shader</b></button>
+	<button id="pause">pause</button>
+	<button id="reset">reset</button>
+	<br>
 
 </div>
 
@@ -102,16 +102,16 @@ var shader_gallery_template = $("#shader-gallery-template").html()
 $(init)
 
 function init(){
-  $("#url").change(load)
-  $("#reset").click(reset)
-  $("#pause").click(pause)
+	$("#url").change(load)
+	$("#reset").click(reset)
+	$("#pause").click(pause)
 
 	user.init()
 	shader_gallery.init()
 	
-  document.getElementById('shader').addEventListener('input', shader_build);
+	document.getElementById('shader').addEventListener('input', shader_build);
 
-  requestAnimationFrame(animate)
+	requestAnimationFrame(animate)
 }
 
 
diff --git a/shader-picker.html b/shader-picker.html
index 923f1b6..0f27d6a 100644
--- a/shader-picker.html
+++ b/shader-picker.html
@@ -147,32 +147,13 @@ function init(){
     mousey = e.pageY
   })
 
-  $("#add-frame").click(add_frame)
-  $("#frames").sortable({
-    start: drag_start,
-    stop: drag_stop
-  });
-  $(document).on("click","#frames .remove",remove_frame)
-  $("#framecount").change(function(){
-    var val = $(this).int()
-    if (val < 1 || isNaN(val)) $(this).val(val = 1)
-    if (val == 1) $("#add-frame").html("+add frame")
-    else $("#add-frame").html("+add frames")
-  })
   $("#background").change(function(){
     document.body.style.backgroundColor = $("#background").string()
   })
   
-  $("#frames").disableSelection();
-  $("#remove-all-frames").click(remove_all_frames)
-  $("#weave-frames").click(weave_frames)
-  $("#shuffle-frames").click(shuffle_frames)
-  $("#reverse-frames").click(reverse_frames)
-  $("#sort-frames").click(sort_frames)
-
-  $("#render").click(render)
-  $("#save").click(save)
-  $("#upload").click(upload)
+	frame_editor.init()
+
+  $(window).on("scroll DOMMouseScroll mousewheel", function(){ scrolling = true })
   $("#help,#instructions .close").click(function(){ $("#instructions").toggle() })
   $("#instructions").draggable({
     start: drag_start,
@@ -181,7 +162,6 @@ function init(){
   $("#instructions").disableSelection();
 
   load()
-  $(window).on("scroll DOMMouseScroll mousewheel", function(){ scrolling = true })
 
   gallery.choose = choose
   gallery.init()
-- 
cgit v1.2.3-70-g09d2


From 9bfb718de890bfaecae43b0d720038b0a9756bea Mon Sep 17 00:00:00 2001
From: Jules Laplace <jules@okfoc.us>
Date: Thu, 23 Jan 2014 10:11:23 -0500
Subject: switching from two-space indents to tabs

---
 shader-picker.html | 174 ++++++++++++++++++++++++++---------------------------
 1 file changed, 87 insertions(+), 87 deletions(-)

(limited to 'shader-picker.html')

diff --git a/shader-picker.html b/shader-picker.html
index 0f27d6a..7d014f1 100644
--- a/shader-picker.html
+++ b/shader-picker.html
@@ -37,70 +37,70 @@ a { color: #00f; }
 </head>
 <body>
 <div id="gallery">
-  <div id="gallery-form">
-    <form id="gallery-search">
-      <input type="text" id="dumpfm-search-query" value="duck bill">
-      <button id="gallery-search">DUMP SEARCH</button>
-    </form>
-    <button id="gallery-random">IM RANDOM</button>
-    <span class="status"></span>
-  </div>
-  <div id="gallery-images"></div>
+	<div id="gallery-form">
+		<form id="gallery-search">
+			<input type="text" id="dumpfm-search-query" value="duck bill">
+			<button id="gallery-search">DUMP SEARCH</button>
+		</form>
+		<button id="gallery-random">IM RANDOM</button>
+		<span class="status"></span>
+	</div>
+	<div id="gallery-images"></div>
 </div>
 
 <div id="controls">
 
-  <input type="text" id="url" value="img/1376516658960-dumpfm-DoritoWitch-TimeFLyTrans0001.png">
-  <br>
-  <br>
-
-  <textarea id="shader"></textarea>
-  <br>
-  <br>
-
-  frames <input type="text" id="framecount" value="1">
-  interval <input type="text" id="frameinterval" value="0.1s">
-  <button id="add-frame">+add frame</button>
-  <button id="remove-all-frames">clear</button>
-  <button id="render" disabled>render</button>
-  <br>
-  reorder:
-  <button id="weave-frames">weave</button>
-  <button id="shuffle-frames">shuffle</button>
-  <button id="reverse-frames">reverse</button>
-  <button id="sort-frames">sort</button>
-  
-  <div id="frames"></div>
-  <br>
-  <br>
-
-  gif delay <input type="text" id="framedelay" value="0.06s">
-  background <input type="text" id="background" value="#fff">
-  your name here &rarr; <input type="text" id="username" value="">
-  <br>
-  <br>
-  <button id="help">help</button>
-  &nbsp;
-  <button id="add-shader">+</button>
-  <button id="remove-shader">&times;</button>
-  &nbsp;
-  <span id="shaders"></span>
-  <br>
-  <br>
-  <a href="http://asdf.us/im/gallery/?tag=shader" target="_blank">Photoblaster Gallery</a>
+	<input type="text" id="url" value="img/1376516658960-dumpfm-DoritoWitch-TimeFLyTrans0001.png">
+	<br>
+	<br>
+
+	<textarea id="shader"></textarea>
+	<br>
+	<br>
+
+	frames <input type="text" id="framecount" value="1">
+	interval <input type="text" id="frameinterval" value="0.1s">
+	<button id="add-frame">+add frame</button>
+	<button id="remove-all-frames">clear</button>
+	<button id="render" disabled>render</button>
+	<br>
+	reorder:
+	<button id="weave-frames">weave</button>
+	<button id="shuffle-frames">shuffle</button>
+	<button id="reverse-frames">reverse</button>
+	<button id="sort-frames">sort</button>
+	
+	<div id="frames"></div>
+	<br>
+	<br>
+
+	gif delay <input type="text" id="framedelay" value="0.06s">
+	background <input type="text" id="background" value="#fff">
+	your name here &rarr; <input type="text" id="username" value="">
+	<br>
+	<br>
+	<button id="help">help</button>
+	&nbsp;
+	<button id="add-shader">+</button>
+	<button id="remove-shader">&times;</button>
+	&nbsp;
+	<span id="shaders"></span>
+	<br>
+	<br>
+	<a href="http://asdf.us/im/gallery/?tag=shader" target="_blank">Photoblaster Gallery</a>
 </div>
 
 <div id="workspace"></div>
 
 <div id="rendered">
-  <button id="reset">reset</button>
-  <button id="pause">pause</button>
-  <button id="step-forward">&gt;&gt;</button>
-  <span class="status"></span>
-  <button id="save" disabled>save</button>
-  <button id="upload" disabled>upload</button>
-  <br>
-  <input type="text" id="uploaded-url">
+	<button id="reset">reset</button>
+	<button id="pause">pause</button>
+	<button id="step-forward">&gt;&gt;</button>
+	<span class="status"></span>
+	<button id="save" disabled>save</button>
+	<button id="upload" disabled>upload</button>
+	<br>
+	<input type="text" id="uploaded-url">
 </div>
 
 <div id="instructions"><iframe src="instructions.html"></iframe><button class="close">&times;</button></div>
@@ -138,46 +138,46 @@ $(init)
 var mousex, mousey
 
 function init(){
-  $("#url").change(load)
-  $("#reset").click(reset)
-  $("#pause").click(pause)
-  $("#step-forward").click(step_forward)
-  $(document).on("mousemove", function(e) {
-    mousex = e.pageX
-    mousey = e.pageY
-  })
-
-  $("#background").change(function(){
-    document.body.style.backgroundColor = $("#background").string()
-  })
-  
+	$("#url").change(load)
+	$("#reset").click(reset)
+	$("#pause").click(pause)
+	$("#step-forward").click(step_forward)
+	$(document).on("mousemove", function(e) {
+		mousex = e.pageX
+		mousey = e.pageY
+	})
+
+	$("#background").change(function(){
+		document.body.style.backgroundColor = $("#background").string()
+	})
+	
 	frame_editor.init()
 
-  $(window).on("scroll DOMMouseScroll mousewheel", function(){ scrolling = true })
-  $("#help,#instructions .close").click(function(){ $("#instructions").toggle() })
-  $("#instructions").draggable({
-    start: drag_start,
-    stop: drag_stop
-  })
-  $("#instructions").disableSelection();
+	$(window).on("scroll DOMMouseScroll mousewheel", function(){ scrolling = true })
+	$("#help,#instructions .close").click(function(){ $("#instructions").toggle() })
+	$("#instructions").draggable({
+		start: drag_start,
+		stop: drag_stop
+	})
+	$("#instructions").disableSelection();
 
-  load()
+	load()
 
-  gallery.choose = choose
-  gallery.init()
+	gallery.choose = choose
+	gallery.init()
 
-  user.init()
-  if (user.username.length) {
-    console.log("signed in as", user.username)
-  }
+	user.init()
+	if (user.username.length) {
+		console.log("signed in as", user.username)
+	}
 
-  local_shaders.init()
-  local_shaders.loadLastAccessed()
+	local_shaders.init()
+	local_shaders.loadLastAccessed()
 
-  document.getElementById('shader').addEventListener('input', shader_build);
-  shader_build()
+	document.getElementById('shader').addEventListener('input', shader_build);
+	shader_build()
 
-  requestAnimationFrame(animate)
+	requestAnimationFrame(animate)
 }
 function drag_start(){ dragging = true; $(this).addClass("dragging") }
 function drag_stop(){ dragging = false; $(".dragging").removeClass("dragging") }
-- 
cgit v1.2.3-70-g09d2


From 89bf91e68f1fac2d88eb97c7fe324753a5ef76cf Mon Sep 17 00:00:00 2001
From: timb <opuscule@gmail.com>
Date: Fri, 24 Jan 2014 07:58:46 -0800
Subject: a try at error highlighting

---
 js/error.highlight.js |  160 +++++
 js/shader.js          |   28 +
 js/vendor/acorn.js    | 1768 +++++++++++++++++++++++++++++++++++++++++++++++++
 shader-api.html       |    2 +
 shader-picker.html    |    2 +
 5 files changed, 1960 insertions(+)
 create mode 100644 js/error.highlight.js
 create mode 100644 js/vendor/acorn.js

(limited to 'shader-picker.html')

diff --git a/js/error.highlight.js b/js/error.highlight.js
new file mode 100644
index 0000000..b7c583e
--- /dev/null
+++ b/js/error.highlight.js
@@ -0,0 +1,160 @@
+(function(){
+
+var html
+var textarea
+var dom = {}
+var style = {}
+var pos = {}
+// i use this because a plain <br> collapses vertically sometimes...
+var zero_width_space = '&#xfeff;'
+
+var off = function(){
+  dom.highlight.style.display = 'none'
+}
+
+var height_until_error = 0;
+var height_with_error = 0;
+
+var on = function(line_num){
+  pos = textarea.getBoundingClientRect()
+  var text = textarea.value;
+
+  var lines = text.split('\n')
+  var lines_until_error = lines.slice(0, line_num)
+  var line_with_error = lines[line_num]
+
+  if (lines_until_error.length === 1)
+    dom.textmeasure.innerHTML = lines_until_error + zero_width_space
+  else
+    dom.textmeasure.innerHTML = lines_until_error.join('<br>' + zero_width_space)
+
+  height_until_error = dom.textmeasure.offsetHeight
+
+  dom.textmeasure.innerHTML = line_with_error + zero_width_space
+
+  height_with_error = dom.textmeasure.offsetHeight
+
+  reposition_highlight()
+
+};
+
+var reposition_highlight = function(){
+  dom.highlight.style.display = 'block'
+
+  var bounds_bottom = pos.top + pos.height
+
+  if (textarea.scrollHeight > textarea.clientHeight) // scrollbar exists
+    dom.highlight.style.width = pos.width - scrollbar_width + "px"
+  else
+    dom.highlight.style.width = pos.width + "px"
+
+  dom.highlight.style.left = pos.left + "px"
+
+  var y_pos = pos.top + height_until_error - textarea.scrollTop
+
+  dom.highlight.style.top = y_pos + html.scrollTop + "px"
+
+  var height_of_highlight = height_with_error;
+
+  // nice clip on bottom
+  if (y_pos + height_of_highlight > bounds_bottom)
+    height_of_highlight = Math.max(0, bounds_bottom - y_pos)
+  // crap clip on top
+  if (y_pos < pos.top)
+    height_of_highlight = 0
+
+  dom.highlight.style.height = height_of_highlight + "px"
+}
+
+var calc_textarea_style = function(){
+  var $textarea = $("#shader")
+  textarea = $textarea[0]
+  // GG = textarea
+  
+  var props = ['lineHeight', 'fontFamily', 'fontSize', 'padding', 'margin', 'borderWidth', 'width']
+
+  for (var i=0, p; p=props[i]; i++){
+    style[p] = $textarea.css(p)
+  }
+  console.log(style)
+
+}
+
+
+var calc_scrollbar_width = function() {
+    var outer = document.createElement("div");
+    outer.style.visibility = "hidden";
+    outer.style.width = "100px";
+    document.body.appendChild(outer);
+    
+    var width_no_scroll = outer.offsetWidth;
+    // force scrollbars
+    outer.style.overflow = "scroll";
+    
+    // add innerdiv
+    var inner = document.createElement("div");
+    inner.style.width = "100%";
+    outer.appendChild(inner);        
+    
+    var width_with_scroll = inner.offsetWidth;
+    // remove divs
+    outer.parentNode.removeChild(outer);
+    
+    return width_no_scroll - width_with_scroll;
+}
+
+var create_el_textmeasure = function(){
+  var el = dom.textmeasure = document.createElement('div')
+  el.id = 'textmeasure'
+  var s = el.style
+  for (var key in style)
+    s[key] = style[key]
+
+  s.wordWrap = 'break-word'
+  s.wordBreak = 'break-all' 
+  s.border = '1px solid red'
+  s.padding = '0'
+  s.display = 'block'
+  s.position = 'absolute'
+  s.left = "-5000px"
+  document.body.appendChild(el)
+}
+
+var create_el_highlight = function(){
+  var el = dom.highlight = document.createElement('div')
+  var s = el.style
+  for (var key in style)
+    s[key] = style[key]
+  
+  s.pointerEvents = 'none'
+  s.opacity = '0.2'
+  s.backgroundColor = '#f00'
+  s.position = 'absolute'
+  s.lineHeight = '0'
+  s.fontSize = '0'
+  s.padding = '0'
+  s.borderWidth = '0'
+  s.display = 'block'
+  document.body.appendChild(el)
+}
+
+var scrollbar_width = 0;
+var init = function(){
+  calc_textarea_style()
+  create_el_highlight()
+  create_el_textmeasure()
+  scrollbar_width = calc_scrollbar_width()
+  textarea.addEventListener('scroll', reposition_highlight)
+  html = document.querySelector('html')
+}
+
+error_highlight = {
+  init: init,
+  on: on,
+  off: off
+}
+
+
+})();
+
+error_highlight.init()
diff --git a/js/shader.js b/js/shader.js
index 19c049b..003f543 100644
--- a/js/shader.js
+++ b/js/shader.js
@@ -4,8 +4,16 @@ var shader_build = function(){
   try {
     var fn = new Function('x','y','t','d', fn_str)
     shader = fn
+    error_highlight.off()
     shade = shade_error_handling
   } catch (e) {
+    try {
+      acorn.parse(fn_str)
+    } catch(e){
+        /* loc: {column: 0, line: 1} */
+        /* line is 1-based for some goddamn reason*/
+      error_highlight.on(e.loc.line-1)
+    }
     throw Error ("Shader compilation error")
   }
 }
@@ -36,6 +44,9 @@ function shade_no_error_handling(frame, t){
   cc.putImageData(imgData,0,0)
 }
 
+var chrome_stack_regexp = /<anonymous>:([0-9]+)/;
+var firefox_stack_regexp = /:([0-9]+)$/;
+
 function shade_error_handling(frame, t){
   if (! t || isNaN(t)) throw Error ("No time specified")
   if (! frame) throw Error ("No frame specified")
@@ -61,6 +72,20 @@ function shade_error_handling(frame, t){
     }
   }
   catch(e){
+    var lines = (e.stack + "").split('\n')
+    if (lines[0].substr(0,10) === "anonymous@") { //firefox
+      var matches = lines[0].match(firefox_stack_regexp)
+      if (matches.length > 1) {
+        var line = parseInt(matches[1]) - 5
+        error_highlight.on(line)
+      }
+    } else if (lines.length > 1) { // attempt chrome match
+      var matches = lines[1].match(chrome_stack_regexp)
+      if (matches.length > 1) {
+        var line = parseInt(matches[1]) - 3
+        error_highlight.on(line)
+      }
+    }
     // console.log(e.stack)
     throw Error ("Shader execution error")
   }
@@ -69,3 +94,6 @@ function shade_error_handling(frame, t){
 }
 
 shade = shade_error_handling
+
+// <anonymous>:4:11)
+// "anonymous@http://dither.local/js/shader.js:6"
\ No newline at end of file
diff --git a/js/vendor/acorn.js b/js/vendor/acorn.js
new file mode 100644
index 0000000..c335f65
--- /dev/null
+++ b/js/vendor/acorn.js
@@ -0,0 +1,1768 @@
+// Acorn is a tiny, fast JavaScript parser written in JavaScript.
+//
+// Acorn was written by Marijn Haverbeke and released under an MIT
+// license. The Unicode regexps (for identifiers and whitespace) were
+// taken from [Esprima](http://esprima.org) by Ariya Hidayat.
+//
+// Git repositories for Acorn are available at
+//
+//     http://marijnhaverbeke.nl/git/acorn
+//     https://github.com/marijnh/acorn.git
+//
+// Please use the [github bug tracker][ghbt] to report issues.
+//
+// [ghbt]: https://github.com/marijnh/acorn/issues
+//
+// This file defines the main parser interface. The library also comes
+// with a [error-tolerant parser][dammit] and an
+// [abstract syntax tree walker][walk], defined in other files.
+//
+// [dammit]: acorn_loose.js
+// [walk]: util/walk.js
+
+(function(root, mod) {
+  if (typeof exports == "object" && typeof module == "object") return mod(exports); // CommonJS
+  if (typeof define == "function" && define.amd) return define(["exports"], mod); // AMD
+  mod(root.acorn || (root.acorn = {})); // Plain browser env
+})(this, function(exports) {
+  "use strict";
+
+  exports.version = "0.4.1";
+
+  // The main exported interface (under `self.acorn` when in the
+  // browser) is a `parse` function that takes a code string and
+  // returns an abstract syntax tree as specified by [Mozilla parser
+  // API][api], with the caveat that the SpiderMonkey-specific syntax
+  // (`let`, `yield`, inline XML, etc) is not recognized.
+  //
+  // [api]: https://developer.mozilla.org/en-US/docs/SpiderMonkey/Parser_API
+
+  var options, input, inputLen, sourceFile;
+
+  exports.parse = function(inpt, opts) {
+    input = String(inpt); inputLen = input.length;
+    setOptions(opts);
+    initTokenState();
+    return parseTopLevel(options.program);
+  };
+
+  // A second optional argument can be given to further configure
+  // the parser process. These options are recognized:
+
+  var defaultOptions = exports.defaultOptions = {
+    // `ecmaVersion` indicates the ECMAScript version to parse. Must
+    // be either 3 or 5. This
+    // influences support for strict mode, the set of reserved words, and
+    // support for getters and setter.
+    ecmaVersion: 5,
+    // Turn on `strictSemicolons` to prevent the parser from doing
+    // automatic semicolon insertion.
+    strictSemicolons: false,
+    // When `allowTrailingCommas` is false, the parser will not allow
+    // trailing commas in array and object literals.
+    allowTrailingCommas: true,
+    // By default, reserved words are not enforced. Enable
+    // `forbidReserved` to enforce them.
+    forbidReserved: false,
+    // When `locations` is on, `loc` properties holding objects with
+    // `start` and `end` properties in `{line, column}` form (with
+    // line being 1-based and column 0-based) will be attached to the
+    // nodes.
+    locations: false,
+    // A function can be passed as `onComment` option, which will
+    // cause Acorn to call that function with `(block, text, start,
+    // end)` parameters whenever a comment is skipped. `block` is a
+    // boolean indicating whether this is a block (`/* */`) comment,
+    // `text` is the content of the comment, and `start` and `end` are
+    // character offsets that denote the start and end of the comment.
+    // When the `locations` option is on, two more parameters are
+    // passed, the full `{line, column}` locations of the start and
+    // end of the comments. Note that you are not allowed to call the
+    // parser from the callback—that will corrupt its internal state.
+    onComment: null,
+    // Nodes have their start and end characters offsets recorded in
+    // `start` and `end` properties (directly on the node, rather than
+    // the `loc` object, which holds line/column data. To also add a
+    // [semi-standardized][range] `range` property holding a `[start,
+    // end]` array with the same numbers, set the `ranges` option to
+    // `true`.
+    //
+    // [range]: https://bugzilla.mozilla.org/show_bug.cgi?id=745678
+    ranges: false,
+    // It is possible to parse multiple files into a single AST by
+    // passing the tree produced by parsing the first file as
+    // `program` option in subsequent parses. This will add the
+    // toplevel forms of the parsed file to the `Program` (top) node
+    // of an existing parse tree.
+    program: null,
+    // When `locations` is on, you can pass this to record the source
+    // file in every node's `loc` object.
+    sourceFile: null,
+    // This value, if given, is stored in every node, whether
+    // `locations` is on or off.
+    directSourceFile: null
+  };
+
+  function setOptions(opts) {
+    options = opts || {};
+    for (var opt in defaultOptions) if (!Object.prototype.hasOwnProperty.call(options, opt))
+      options[opt] = defaultOptions[opt];
+    sourceFile = options.sourceFile || null;
+  }
+
+  // The `getLineInfo` function is mostly useful when the
+  // `locations` option is off (for performance reasons) and you
+  // want to find the line/column position for a given character
+  // offset. `input` should be the code string that the offset refers
+  // into.
+
+  var getLineInfo = exports.getLineInfo = function(input, offset) {
+    for (var line = 1, cur = 0;;) {
+      lineBreak.lastIndex = cur;
+      var match = lineBreak.exec(input);
+      if (match && match.index < offset) {
+        ++line;
+        cur = match.index + match[0].length;
+      } else break;
+    }
+    return {line: line, column: offset - cur};
+  };
+
+  // Acorn is organized as a tokenizer and a recursive-descent parser.
+  // The `tokenize` export provides an interface to the tokenizer.
+  // Because the tokenizer is optimized for being efficiently used by
+  // the Acorn parser itself, this interface is somewhat crude and not
+  // very modular. Performing another parse or call to `tokenize` will
+  // reset the internal state, and invalidate existing tokenizers.
+
+  exports.tokenize = function(inpt, opts) {
+    input = String(inpt); inputLen = input.length;
+    setOptions(opts);
+    initTokenState();
+
+    var t = {};
+    function getToken(forceRegexp) {
+      lastEnd = tokEnd;
+      readToken(forceRegexp);
+      t.start = tokStart; t.end = tokEnd;
+      t.startLoc = tokStartLoc; t.endLoc = tokEndLoc;
+      t.type = tokType; t.value = tokVal;
+      return t;
+    }
+    getToken.jumpTo = function(pos, reAllowed) {
+      tokPos = pos;
+      if (options.locations) {
+        tokCurLine = 1;
+        tokLineStart = lineBreak.lastIndex = 0;
+        var match;
+        while ((match = lineBreak.exec(input)) && match.index < pos) {
+          ++tokCurLine;
+          tokLineStart = match.index + match[0].length;
+        }
+      }
+      tokRegexpAllowed = reAllowed;
+      skipSpace();
+    };
+    return getToken;
+  };
+
+  // State is kept in (closure-)global variables. We already saw the
+  // `options`, `input`, and `inputLen` variables above.
+
+  // The current position of the tokenizer in the input.
+
+  var tokPos;
+
+  // The start and end offsets of the current token.
+
+  var tokStart, tokEnd;
+
+  // When `options.locations` is true, these hold objects
+  // containing the tokens start and end line/column pairs.
+
+  var tokStartLoc, tokEndLoc;
+
+  // The type and value of the current token. Token types are objects,
+  // named by variables against which they can be compared, and
+  // holding properties that describe them (indicating, for example,
+  // the precedence of an infix operator, and the original name of a
+  // keyword token). The kind of value that's held in `tokVal` depends
+  // on the type of the token. For literals, it is the literal value,
+  // for operators, the operator name, and so on.
+
+  var tokType, tokVal;
+
+  // Interal state for the tokenizer. To distinguish between division
+  // operators and regular expressions, it remembers whether the last
+  // token was one that is allowed to be followed by an expression.
+  // (If it is, a slash is probably a regexp, if it isn't it's a
+  // division operator. See the `parseStatement` function for a
+  // caveat.)
+
+  var tokRegexpAllowed;
+
+  // When `options.locations` is true, these are used to keep
+  // track of the current line, and know when a new line has been
+  // entered.
+
+  var tokCurLine, tokLineStart;
+
+  // These store the position of the previous token, which is useful
+  // when finishing a node and assigning its `end` position.
+
+  var lastStart, lastEnd, lastEndLoc;
+
+  // This is the parser's state. `inFunction` is used to reject
+  // `return` statements outside of functions, `labels` to verify that
+  // `break` and `continue` have somewhere to jump to, and `strict`
+  // indicates whether strict mode is on.
+
+  var inFunction, labels, strict;
+
+  // This function is used to raise exceptions on parse errors. It
+  // takes an offset integer (into the current `input`) to indicate
+  // the location of the error, attaches the position to the end
+  // of the error message, and then raises a `SyntaxError` with that
+  // message.
+
+  function raise(pos, message) {
+    var loc = getLineInfo(input, pos);
+    message += " (" + loc.line + ":" + loc.column + ")";
+    var err = new SyntaxError(message);
+    err.pos = pos; err.loc = loc; err.raisedAt = tokPos;
+    throw err;
+  }
+
+  // Reused empty array added for node fields that are always empty.
+
+  var empty = [];
+
+  // ## Token types
+
+  // The assignment of fine-grained, information-carrying type objects
+  // allows the tokenizer to store the information it has about a
+  // token in a way that is very cheap for the parser to look up.
+
+  // All token type variables start with an underscore, to make them
+  // easy to recognize.
+
+  // These are the general types. The `type` property is only used to
+  // make them recognizeable when debugging.
+
+  var _num = {type: "num"}, _regexp = {type: "regexp"}, _string = {type: "string"};
+  var _name = {type: "name"}, _eof = {type: "eof"};
+
+  // Keyword tokens. The `keyword` property (also used in keyword-like
+  // operators) indicates that the token originated from an
+  // identifier-like word, which is used when parsing property names.
+  //
+  // The `beforeExpr` property is used to disambiguate between regular
+  // expressions and divisions. It is set on all token types that can
+  // be followed by an expression (thus, a slash after them would be a
+  // regular expression).
+  //
+  // `isLoop` marks a keyword as starting a loop, which is important
+  // to know when parsing a label, in order to allow or disallow
+  // continue jumps to that label.
+
+  var _break = {keyword: "break"}, _case = {keyword: "case", beforeExpr: true}, _catch = {keyword: "catch"};
+  var _continue = {keyword: "continue"}, _debugger = {keyword: "debugger"}, _default = {keyword: "default"};
+  var _do = {keyword: "do", isLoop: true}, _else = {keyword: "else", beforeExpr: true};
+  var _finally = {keyword: "finally"}, _for = {keyword: "for", isLoop: true}, _function = {keyword: "function"};
+  var _if = {keyword: "if"}, _return = {keyword: "return", beforeExpr: true}, _switch = {keyword: "switch"};
+  var _throw = {keyword: "throw", beforeExpr: true}, _try = {keyword: "try"}, _var = {keyword: "var"};
+  var _while = {keyword: "while", isLoop: true}, _with = {keyword: "with"}, _new = {keyword: "new", beforeExpr: true};
+  var _this = {keyword: "this"};
+
+  // The keywords that denote values.
+
+  var _null = {keyword: "null", atomValue: null}, _true = {keyword: "true", atomValue: true};
+  var _false = {keyword: "false", atomValue: false};
+
+  // Some keywords are treated as regular operators. `in` sometimes
+  // (when parsing `for`) needs to be tested against specifically, so
+  // we assign a variable name to it for quick comparing.
+
+  var _in = {keyword: "in", binop: 7, beforeExpr: true};
+
+  // Map keyword names to token types.
+
+  var keywordTypes = {"break": _break, "case": _case, "catch": _catch,
+                      "continue": _continue, "debugger": _debugger, "default": _default,
+                      "do": _do, "else": _else, "finally": _finally, "for": _for,
+                      "function": _function, "if": _if, "return": _return, "switch": _switch,
+                      "throw": _throw, "try": _try, "var": _var, "while": _while, "with": _with,
+                      "null": _null, "true": _true, "false": _false, "new": _new, "in": _in,
+                      "instanceof": {keyword: "instanceof", binop: 7, beforeExpr: true}, "this": _this,
+                      "typeof": {keyword: "typeof", prefix: true, beforeExpr: true},
+                      "void": {keyword: "void", prefix: true, beforeExpr: true},
+                      "delete": {keyword: "delete", prefix: true, beforeExpr: true}};
+
+  // Punctuation token types. Again, the `type` property is purely for debugging.
+
+  var _bracketL = {type: "[", beforeExpr: true}, _bracketR = {type: "]"}, _braceL = {type: "{", beforeExpr: true};
+  var _braceR = {type: "}"}, _parenL = {type: "(", beforeExpr: true}, _parenR = {type: ")"};
+  var _comma = {type: ",", beforeExpr: true}, _semi = {type: ";", beforeExpr: true};
+  var _colon = {type: ":", beforeExpr: true}, _dot = {type: "."}, _question = {type: "?", beforeExpr: true};
+
+  // Operators. These carry several kinds of properties to help the
+  // parser use them properly (the presence of these properties is
+  // what categorizes them as operators).
+  //
+  // `binop`, when present, specifies that this operator is a binary
+  // operator, and will refer to its precedence.
+  //
+  // `prefix` and `postfix` mark the operator as a prefix or postfix
+  // unary operator. `isUpdate` specifies that the node produced by
+  // the operator should be of type UpdateExpression rather than
+  // simply UnaryExpression (`++` and `--`).
+  //
+  // `isAssign` marks all of `=`, `+=`, `-=` etcetera, which act as
+  // binary operators with a very low precedence, that should result
+  // in AssignmentExpression nodes.
+
+  var _slash = {binop: 10, beforeExpr: true}, _eq = {isAssign: true, beforeExpr: true};
+  var _assign = {isAssign: true, beforeExpr: true};
+  var _incDec = {postfix: true, prefix: true, isUpdate: true}, _prefix = {prefix: true, beforeExpr: true};
+  var _logicalOR = {binop: 1, beforeExpr: true};
+  var _logicalAND = {binop: 2, beforeExpr: true};
+  var _bitwiseOR = {binop: 3, beforeExpr: true};
+  var _bitwiseXOR = {binop: 4, beforeExpr: true};
+  var _bitwiseAND = {binop: 5, beforeExpr: true};
+  var _equality = {binop: 6, beforeExpr: true};
+  var _relational = {binop: 7, beforeExpr: true};
+  var _bitShift = {binop: 8, beforeExpr: true};
+  var _plusMin = {binop: 9, prefix: true, beforeExpr: true};
+  var _multiplyModulo = {binop: 10, beforeExpr: true};
+
+  // Provide access to the token types for external users of the
+  // tokenizer.
+
+  exports.tokTypes = {bracketL: _bracketL, bracketR: _bracketR, braceL: _braceL, braceR: _braceR,
+                      parenL: _parenL, parenR: _parenR, comma: _comma, semi: _semi, colon: _colon,
+                      dot: _dot, question: _question, slash: _slash, eq: _eq, name: _name, eof: _eof,
+                      num: _num, regexp: _regexp, string: _string};
+  for (var kw in keywordTypes) exports.tokTypes["_" + kw] = keywordTypes[kw];
+
+  // This is a trick taken from Esprima. It turns out that, on
+  // non-Chrome browsers, to check whether a string is in a set, a
+  // predicate containing a big ugly `switch` statement is faster than
+  // a regular expression, and on Chrome the two are about on par.
+  // This function uses `eval` (non-lexical) to produce such a
+  // predicate from a space-separated string of words.
+  //
+  // It starts by sorting the words by length.
+
+  function makePredicate(words) {
+    words = words.split(" ");
+    var f = "", cats = [];
+    out: for (var i = 0; i < words.length; ++i) {
+      for (var j = 0; j < cats.length; ++j)
+        if (cats[j][0].length == words[i].length) {
+          cats[j].push(words[i]);
+          continue out;
+        }
+      cats.push([words[i]]);
+    }
+    function compareTo(arr) {
+      if (arr.length == 1) return f += "return str === " + JSON.stringify(arr[0]) + ";";
+      f += "switch(str){";
+      for (var i = 0; i < arr.length; ++i) f += "case " + JSON.stringify(arr[i]) + ":";
+      f += "return true}return false;";
+    }
+
+    // When there are more than three length categories, an outer
+    // switch first dispatches on the lengths, to save on comparisons.
+
+    if (cats.length > 3) {
+      cats.sort(function(a, b) {return b.length - a.length;});
+      f += "switch(str.length){";
+      for (var i = 0; i < cats.length; ++i) {
+        var cat = cats[i];
+        f += "case " + cat[0].length + ":";
+        compareTo(cat);
+      }
+      f += "}";
+
+    // Otherwise, simply generate a flat `switch` statement.
+
+    } else {
+      compareTo(words);
+    }
+    return new Function("str", f);
+  }
+
+  // The ECMAScript 3 reserved word list.
+
+  var isReservedWord3 = makePredicate("abstract boolean byte char class double enum export extends final float goto implements import int interface long native package private protected public short static super synchronized throws transient volatile");
+
+  // ECMAScript 5 reserved words.
+
+  var isReservedWord5 = makePredicate("class enum extends super const export import");
+
+  // The additional reserved words in strict mode.
+
+  var isStrictReservedWord = makePredicate("implements interface let package private protected public static yield");
+
+  // The forbidden variable names in strict mode.
+
+  var isStrictBadIdWord = makePredicate("eval arguments");
+
+  // And the keywords.
+
+  var isKeyword = makePredicate("break case catch continue debugger default do else finally for function if return switch throw try var while with null true false instanceof typeof void delete new in this");
+
+  // ## Character categories
+
+  // Big ugly regular expressions that match characters in the
+  // whitespace, identifier, and identifier-start categories. These
+  // are only applied when a character is found to actually have a
+  // code point above 128.
+
+  var nonASCIIwhitespace = /[\u1680\u180e\u2000-\u200a\u202f\u205f\u3000\ufeff]/;
+  var nonASCIIidentifierStartChars = "\xaa\xb5\xba\xc0-\xd6\xd8-\xf6\xf8-\u02c1\u02c6-\u02d1\u02e0-\u02e4\u02ec\u02ee\u0370-\u0374\u0376\u0377\u037a-\u037d\u0386\u0388-\u038a\u038c\u038e-\u03a1\u03a3-\u03f5\u03f7-\u0481\u048a-\u0527\u0531-\u0556\u0559\u0561-\u0587\u05d0-\u05ea\u05f0-\u05f2\u0620-\u064a\u066e\u066f\u0671-\u06d3\u06d5\u06e5\u06e6\u06ee\u06ef\u06fa-\u06fc\u06ff\u0710\u0712-\u072f\u074d-\u07a5\u07b1\u07ca-\u07ea\u07f4\u07f5\u07fa\u0800-\u0815\u081a\u0824\u0828\u0840-\u0858\u08a0\u08a2-\u08ac\u0904-\u0939\u093d\u0950\u0958-\u0961\u0971-\u0977\u0979-\u097f\u0985-\u098c\u098f\u0990\u0993-\u09a8\u09aa-\u09b0\u09b2\u09b6-\u09b9\u09bd\u09ce\u09dc\u09dd\u09df-\u09e1\u09f0\u09f1\u0a05-\u0a0a\u0a0f\u0a10\u0a13-\u0a28\u0a2a-\u0a30\u0a32\u0a33\u0a35\u0a36\u0a38\u0a39\u0a59-\u0a5c\u0a5e\u0a72-\u0a74\u0a85-\u0a8d\u0a8f-\u0a91\u0a93-\u0aa8\u0aaa-\u0ab0\u0ab2\u0ab3\u0ab5-\u0ab9\u0abd\u0ad0\u0ae0\u0ae1\u0b05-\u0b0c\u0b0f\u0b10\u0b13-\u0b28\u0b2a-\u0b30\u0b32\u0b33\u0b35-\u0b39\u0b3d\u0b5c\u0b5d\u0b5f-\u0b61\u0b71\u0b83\u0b85-\u0b8a\u0b8e-\u0b90\u0b92-\u0b95\u0b99\u0b9a\u0b9c\u0b9e\u0b9f\u0ba3\u0ba4\u0ba8-\u0baa\u0bae-\u0bb9\u0bd0\u0c05-\u0c0c\u0c0e-\u0c10\u0c12-\u0c28\u0c2a-\u0c33\u0c35-\u0c39\u0c3d\u0c58\u0c59\u0c60\u0c61\u0c85-\u0c8c\u0c8e-\u0c90\u0c92-\u0ca8\u0caa-\u0cb3\u0cb5-\u0cb9\u0cbd\u0cde\u0ce0\u0ce1\u0cf1\u0cf2\u0d05-\u0d0c\u0d0e-\u0d10\u0d12-\u0d3a\u0d3d\u0d4e\u0d60\u0d61\u0d7a-\u0d7f\u0d85-\u0d96\u0d9a-\u0db1\u0db3-\u0dbb\u0dbd\u0dc0-\u0dc6\u0e01-\u0e30\u0e32\u0e33\u0e40-\u0e46\u0e81\u0e82\u0e84\u0e87\u0e88\u0e8a\u0e8d\u0e94-\u0e97\u0e99-\u0e9f\u0ea1-\u0ea3\u0ea5\u0ea7\u0eaa\u0eab\u0ead-\u0eb0\u0eb2\u0eb3\u0ebd\u0ec0-\u0ec4\u0ec6\u0edc-\u0edf\u0f00\u0f40-\u0f47\u0f49-\u0f6c\u0f88-\u0f8c\u1000-\u102a\u103f\u1050-\u1055\u105a-\u105d\u1061\u1065\u1066\u106e-\u1070\u1075-\u1081\u108e\u10a0-\u10c5\u10c7\u10cd\u10d0-\u10fa\u10fc-\u1248\u124a-\u124d\u1250-\u1256\u1258\u125a-\u125d\u1260-\u1288\u128a-\u128d\u1290-\u12b0\u12b2-\u12b5\u12b8-\u12be\u12c0\u12c2-\u12c5\u12c8-\u12d6\u12d8-\u1310\u1312-\u1315\u1318-\u135a\u1380-\u138f\u13a0-\u13f4\u1401-\u166c\u166f-\u167f\u1681-\u169a\u16a0-\u16ea\u16ee-\u16f0\u1700-\u170c\u170e-\u1711\u1720-\u1731\u1740-\u1751\u1760-\u176c\u176e-\u1770\u1780-\u17b3\u17d7\u17dc\u1820-\u1877\u1880-\u18a8\u18aa\u18b0-\u18f5\u1900-\u191c\u1950-\u196d\u1970-\u1974\u1980-\u19ab\u19c1-\u19c7\u1a00-\u1a16\u1a20-\u1a54\u1aa7\u1b05-\u1b33\u1b45-\u1b4b\u1b83-\u1ba0\u1bae\u1baf\u1bba-\u1be5\u1c00-\u1c23\u1c4d-\u1c4f\u1c5a-\u1c7d\u1ce9-\u1cec\u1cee-\u1cf1\u1cf5\u1cf6\u1d00-\u1dbf\u1e00-\u1f15\u1f18-\u1f1d\u1f20-\u1f45\u1f48-\u1f4d\u1f50-\u1f57\u1f59\u1f5b\u1f5d\u1f5f-\u1f7d\u1f80-\u1fb4\u1fb6-\u1fbc\u1fbe\u1fc2-\u1fc4\u1fc6-\u1fcc\u1fd0-\u1fd3\u1fd6-\u1fdb\u1fe0-\u1fec\u1ff2-\u1ff4\u1ff6-\u1ffc\u2071\u207f\u2090-\u209c\u2102\u2107\u210a-\u2113\u2115\u2119-\u211d\u2124\u2126\u2128\u212a-\u212d\u212f-\u2139\u213c-\u213f\u2145-\u2149\u214e\u2160-\u2188\u2c00-\u2c2e\u2c30-\u2c5e\u2c60-\u2ce4\u2ceb-\u2cee\u2cf2\u2cf3\u2d00-\u2d25\u2d27\u2d2d\u2d30-\u2d67\u2d6f\u2d80-\u2d96\u2da0-\u2da6\u2da8-\u2dae\u2db0-\u2db6\u2db8-\u2dbe\u2dc0-\u2dc6\u2dc8-\u2dce\u2dd0-\u2dd6\u2dd8-\u2dde\u2e2f\u3005-\u3007\u3021-\u3029\u3031-\u3035\u3038-\u303c\u3041-\u3096\u309d-\u309f\u30a1-\u30fa\u30fc-\u30ff\u3105-\u312d\u3131-\u318e\u31a0-\u31ba\u31f0-\u31ff\u3400-\u4db5\u4e00-\u9fcc\ua000-\ua48c\ua4d0-\ua4fd\ua500-\ua60c\ua610-\ua61f\ua62a\ua62b\ua640-\ua66e\ua67f-\ua697\ua6a0-\ua6ef\ua717-\ua71f\ua722-\ua788\ua78b-\ua78e\ua790-\ua793\ua7a0-\ua7aa\ua7f8-\ua801\ua803-\ua805\ua807-\ua80a\ua80c-\ua822\ua840-\ua873\ua882-\ua8b3\ua8f2-\ua8f7\ua8fb\ua90a-\ua925\ua930-\ua946\ua960-\ua97c\ua984-\ua9b2\ua9cf\uaa00-\uaa28\uaa40-\uaa42\uaa44-\uaa4b\uaa60-\uaa76\uaa7a\uaa80-\uaaaf\uaab1\uaab5\uaab6\uaab9-\uaabd\uaac0\uaac2\uaadb-\uaadd\uaae0-\uaaea\uaaf2-\uaaf4\uab01-\uab06\uab09-\uab0e\uab11-\uab16\uab20-\uab26\uab28-\uab2e\uabc0-\uabe2\uac00-\ud7a3\ud7b0-\ud7c6\ud7cb-\ud7fb\uf900-\ufa6d\ufa70-\ufad9\ufb00-\ufb06\ufb13-\ufb17\ufb1d\ufb1f-\ufb28\ufb2a-\ufb36\ufb38-\ufb3c\ufb3e\ufb40\ufb41\ufb43\ufb44\ufb46-\ufbb1\ufbd3-\ufd3d\ufd50-\ufd8f\ufd92-\ufdc7\ufdf0-\ufdfb\ufe70-\ufe74\ufe76-\ufefc\uff21-\uff3a\uff41-\uff5a\uff66-\uffbe\uffc2-\uffc7\uffca-\uffcf\uffd2-\uffd7\uffda-\uffdc";
+  var nonASCIIidentifierChars = "\u0300-\u036f\u0483-\u0487\u0591-\u05bd\u05bf\u05c1\u05c2\u05c4\u05c5\u05c7\u0610-\u061a\u0620-\u0649\u0672-\u06d3\u06e7-\u06e8\u06fb-\u06fc\u0730-\u074a\u0800-\u0814\u081b-\u0823\u0825-\u0827\u0829-\u082d\u0840-\u0857\u08e4-\u08fe\u0900-\u0903\u093a-\u093c\u093e-\u094f\u0951-\u0957\u0962-\u0963\u0966-\u096f\u0981-\u0983\u09bc\u09be-\u09c4\u09c7\u09c8\u09d7\u09df-\u09e0\u0a01-\u0a03\u0a3c\u0a3e-\u0a42\u0a47\u0a48\u0a4b-\u0a4d\u0a51\u0a66-\u0a71\u0a75\u0a81-\u0a83\u0abc\u0abe-\u0ac5\u0ac7-\u0ac9\u0acb-\u0acd\u0ae2-\u0ae3\u0ae6-\u0aef\u0b01-\u0b03\u0b3c\u0b3e-\u0b44\u0b47\u0b48\u0b4b-\u0b4d\u0b56\u0b57\u0b5f-\u0b60\u0b66-\u0b6f\u0b82\u0bbe-\u0bc2\u0bc6-\u0bc8\u0bca-\u0bcd\u0bd7\u0be6-\u0bef\u0c01-\u0c03\u0c46-\u0c48\u0c4a-\u0c4d\u0c55\u0c56\u0c62-\u0c63\u0c66-\u0c6f\u0c82\u0c83\u0cbc\u0cbe-\u0cc4\u0cc6-\u0cc8\u0cca-\u0ccd\u0cd5\u0cd6\u0ce2-\u0ce3\u0ce6-\u0cef\u0d02\u0d03\u0d46-\u0d48\u0d57\u0d62-\u0d63\u0d66-\u0d6f\u0d82\u0d83\u0dca\u0dcf-\u0dd4\u0dd6\u0dd8-\u0ddf\u0df2\u0df3\u0e34-\u0e3a\u0e40-\u0e45\u0e50-\u0e59\u0eb4-\u0eb9\u0ec8-\u0ecd\u0ed0-\u0ed9\u0f18\u0f19\u0f20-\u0f29\u0f35\u0f37\u0f39\u0f41-\u0f47\u0f71-\u0f84\u0f86-\u0f87\u0f8d-\u0f97\u0f99-\u0fbc\u0fc6\u1000-\u1029\u1040-\u1049\u1067-\u106d\u1071-\u1074\u1082-\u108d\u108f-\u109d\u135d-\u135f\u170e-\u1710\u1720-\u1730\u1740-\u1750\u1772\u1773\u1780-\u17b2\u17dd\u17e0-\u17e9\u180b-\u180d\u1810-\u1819\u1920-\u192b\u1930-\u193b\u1951-\u196d\u19b0-\u19c0\u19c8-\u19c9\u19d0-\u19d9\u1a00-\u1a15\u1a20-\u1a53\u1a60-\u1a7c\u1a7f-\u1a89\u1a90-\u1a99\u1b46-\u1b4b\u1b50-\u1b59\u1b6b-\u1b73\u1bb0-\u1bb9\u1be6-\u1bf3\u1c00-\u1c22\u1c40-\u1c49\u1c5b-\u1c7d\u1cd0-\u1cd2\u1d00-\u1dbe\u1e01-\u1f15\u200c\u200d\u203f\u2040\u2054\u20d0-\u20dc\u20e1\u20e5-\u20f0\u2d81-\u2d96\u2de0-\u2dff\u3021-\u3028\u3099\u309a\ua640-\ua66d\ua674-\ua67d\ua69f\ua6f0-\ua6f1\ua7f8-\ua800\ua806\ua80b\ua823-\ua827\ua880-\ua881\ua8b4-\ua8c4\ua8d0-\ua8d9\ua8f3-\ua8f7\ua900-\ua909\ua926-\ua92d\ua930-\ua945\ua980-\ua983\ua9b3-\ua9c0\uaa00-\uaa27\uaa40-\uaa41\uaa4c-\uaa4d\uaa50-\uaa59\uaa7b\uaae0-\uaae9\uaaf2-\uaaf3\uabc0-\uabe1\uabec\uabed\uabf0-\uabf9\ufb20-\ufb28\ufe00-\ufe0f\ufe20-\ufe26\ufe33\ufe34\ufe4d-\ufe4f\uff10-\uff19\uff3f";
+  var nonASCIIidentifierStart = new RegExp("[" + nonASCIIidentifierStartChars + "]");
+  var nonASCIIidentifier = new RegExp("[" + nonASCIIidentifierStartChars + nonASCIIidentifierChars + "]");
+
+  // Whether a single character denotes a newline.
+
+  var newline = /[\n\r\u2028\u2029]/;
+
+  // Matches a whole line break (where CRLF is considered a single
+  // line break). Used to count lines.
+
+  var lineBreak = /\r\n|[\n\r\u2028\u2029]/g;
+
+  // Test whether a given character code starts an identifier.
+
+  var isIdentifierStart = exports.isIdentifierStart = function(code) {
+    if (code < 65) return code === 36;
+    if (code < 91) return true;
+    if (code < 97) return code === 95;
+    if (code < 123)return true;
+    return code >= 0xaa && nonASCIIidentifierStart.test(String.fromCharCode(code));
+  };
+
+  // Test whether a given character is part of an identifier.
+
+  var isIdentifierChar = exports.isIdentifierChar = function(code) {
+    if (code < 48) return code === 36;
+    if (code < 58) return true;
+    if (code < 65) return false;
+    if (code < 91) return true;
+    if (code < 97) return code === 95;
+    if (code < 123)return true;
+    return code >= 0xaa && nonASCIIidentifier.test(String.fromCharCode(code));
+  };
+
+  // ## Tokenizer
+
+  // These are used when `options.locations` is on, for the
+  // `tokStartLoc` and `tokEndLoc` properties.
+
+  function line_loc_t() {
+    this.line = tokCurLine;
+    this.column = tokPos - tokLineStart;
+  }
+
+  // Reset the token state. Used at the start of a parse.
+
+  function initTokenState() {
+    tokCurLine = 1;
+    tokPos = tokLineStart = 0;
+    tokRegexpAllowed = true;
+    skipSpace();
+  }
+
+  // Called at the end of every token. Sets `tokEnd`, `tokVal`, and
+  // `tokRegexpAllowed`, and skips the space after the token, so that
+  // the next one's `tokStart` will point at the right position.
+
+  function finishToken(type, val) {
+    tokEnd = tokPos;
+    if (options.locations) tokEndLoc = new line_loc_t;
+    tokType = type;
+    skipSpace();
+    tokVal = val;
+    tokRegexpAllowed = type.beforeExpr;
+  }
+
+  function skipBlockComment() {
+    var startLoc = options.onComment && options.locations && new line_loc_t;
+    var start = tokPos, end = input.indexOf("*/", tokPos += 2);
+    if (end === -1) raise(tokPos - 2, "Unterminated comment");
+    tokPos = end + 2;
+    if (options.locations) {
+      lineBreak.lastIndex = start;
+      var match;
+      while ((match = lineBreak.exec(input)) && match.index < tokPos) {
+        ++tokCurLine;
+        tokLineStart = match.index + match[0].length;
+      }
+    }
+    if (options.onComment)
+      options.onComment(true, input.slice(start + 2, end), start, tokPos,
+                        startLoc, options.locations && new line_loc_t);
+  }
+
+  function skipLineComment() {
+    var start = tokPos;
+    var startLoc = options.onComment && options.locations && new line_loc_t;
+    var ch = input.charCodeAt(tokPos+=2);
+    while (tokPos < inputLen && ch !== 10 && ch !== 13 && ch !== 8232 && ch !== 8233) {
+      ++tokPos;
+      ch = input.charCodeAt(tokPos);
+    }
+    if (options.onComment)
+      options.onComment(false, input.slice(start + 2, tokPos), start, tokPos,
+                        startLoc, options.locations && new line_loc_t);
+  }
+
+  // Called at the start of the parse and after every token. Skips
+  // whitespace and comments, and.
+
+  function skipSpace() {
+    while (tokPos < inputLen) {
+      var ch = input.charCodeAt(tokPos);
+      if (ch === 32) { // ' '
+        ++tokPos;
+      } else if (ch === 13) {
+        ++tokPos;
+        var next = input.charCodeAt(tokPos);
+        if (next === 10) {
+          ++tokPos;
+        }
+        if (options.locations) {
+          ++tokCurLine;
+          tokLineStart = tokPos;
+        }
+      } else if (ch === 10 || ch === 8232 || ch === 8233) {
+        ++tokPos;
+        if (options.locations) {
+          ++tokCurLine;
+          tokLineStart = tokPos;
+        }
+      } else if (ch > 8 && ch < 14) {
+        ++tokPos;
+      } else if (ch === 47) { // '/'
+        var next = input.charCodeAt(tokPos + 1);
+        if (next === 42) { // '*'
+          skipBlockComment();
+        } else if (next === 47) { // '/'
+          skipLineComment();
+        } else break;
+      } else if (ch === 160) { // '\xa0'
+        ++tokPos;
+      } else if (ch >= 5760 && nonASCIIwhitespace.test(String.fromCharCode(ch))) {
+        ++tokPos;
+      } else {
+        break;
+      }
+    }
+  }
+
+  // ### Token reading
+
+  // This is the function that is called to fetch the next token. It
+  // is somewhat obscure, because it works in character codes rather
+  // than characters, and because operator parsing has been inlined
+  // into it.
+  //
+  // All in the name of speed.
+  //
+  // The `forceRegexp` parameter is used in the one case where the
+  // `tokRegexpAllowed` trick does not work. See `parseStatement`.
+
+  function readToken_dot() {
+    var next = input.charCodeAt(tokPos + 1);
+    if (next >= 48 && next <= 57) return readNumber(true);
+    ++tokPos;
+    return finishToken(_dot);
+  }
+
+  function readToken_slash() { // '/'
+    var next = input.charCodeAt(tokPos + 1);
+    if (tokRegexpAllowed) {++tokPos; return readRegexp();}
+    if (next === 61) return finishOp(_assign, 2);
+    return finishOp(_slash, 1);
+  }
+
+  function readToken_mult_modulo() { // '%*'
+    var next = input.charCodeAt(tokPos + 1);
+    if (next === 61) return finishOp(_assign, 2);
+    return finishOp(_multiplyModulo, 1);
+  }
+
+  function readToken_pipe_amp(code) { // '|&'
+    var next = input.charCodeAt(tokPos + 1);
+    if (next === code) return finishOp(code === 124 ? _logicalOR : _logicalAND, 2);
+    if (next === 61) return finishOp(_assign, 2);
+    return finishOp(code === 124 ? _bitwiseOR : _bitwiseAND, 1);
+  }
+
+  function readToken_caret() { // '^'
+    var next = input.charCodeAt(tokPos + 1);
+    if (next === 61) return finishOp(_assign, 2);
+    return finishOp(_bitwiseXOR, 1);
+  }
+
+  function readToken_plus_min(code) { // '+-'
+    var next = input.charCodeAt(tokPos + 1);
+    if (next === code) {
+      if (next == 45 && input.charCodeAt(tokPos + 2) == 62 &&
+          newline.test(input.slice(lastEnd, tokPos))) {
+        // A `-->` line comment
+        tokPos += 3;
+        skipLineComment();
+        skipSpace();
+        return readToken();
+      }
+      return finishOp(_incDec, 2);
+    }
+    if (next === 61) return finishOp(_assign, 2);
+    return finishOp(_plusMin, 1);
+  }
+
+  function readToken_lt_gt(code) { // '<>'
+    var next = input.charCodeAt(tokPos + 1);
+    var size = 1;
+    if (next === code) {
+      size = code === 62 && input.charCodeAt(tokPos + 2) === 62 ? 3 : 2;
+      if (input.charCodeAt(tokPos + size) === 61) return finishOp(_assign, size + 1);
+      return finishOp(_bitShift, size);
+    }
+    if (next == 33 && code == 60 && input.charCodeAt(tokPos + 2) == 45 &&
+        input.charCodeAt(tokPos + 3) == 45) {
+      // `<!--`, an XML-style comment that should be interpreted as a line comment
+      tokPos += 4;
+      skipLineComment();
+      skipSpace();
+      return readToken();
+    }
+    if (next === 61)
+      size = input.charCodeAt(tokPos + 2) === 61 ? 3 : 2;
+    return finishOp(_relational, size);
+  }
+
+  function readToken_eq_excl(code) { // '=!'
+    var next = input.charCodeAt(tokPos + 1);
+    if (next === 61) return finishOp(_equality, input.charCodeAt(tokPos + 2) === 61 ? 3 : 2);
+    return finishOp(code === 61 ? _eq : _prefix, 1);
+  }
+
+  function getTokenFromCode(code) {
+    switch(code) {
+      // The interpretation of a dot depends on whether it is followed
+      // by a digit.
+    case 46: // '.'
+      return readToken_dot();
+
+      // Punctuation tokens.
+    case 40: ++tokPos; return finishToken(_parenL);
+    case 41: ++tokPos; return finishToken(_parenR);
+    case 59: ++tokPos; return finishToken(_semi);
+    case 44: ++tokPos; return finishToken(_comma);
+    case 91: ++tokPos; return finishToken(_bracketL);
+    case 93: ++tokPos; return finishToken(_bracketR);
+    case 123: ++tokPos; return finishToken(_braceL);
+    case 125: ++tokPos; return finishToken(_braceR);
+    case 58: ++tokPos; return finishToken(_colon);
+    case 63: ++tokPos; return finishToken(_question);
+
+      // '0x' is a hexadecimal number.
+    case 48: // '0'
+      var next = input.charCodeAt(tokPos + 1);
+      if (next === 120 || next === 88) return readHexNumber();
+      // Anything else beginning with a digit is an integer, octal
+      // number, or float.
+    case 49: case 50: case 51: case 52: case 53: case 54: case 55: case 56: case 57: // 1-9
+      return readNumber(false);
+
+      // Quotes produce strings.
+    case 34: case 39: // '"', "'"
+      return readString(code);
+
+    // Operators are parsed inline in tiny state machines. '=' (61) is
+    // often referred to. `finishOp` simply skips the amount of
+    // characters it is given as second argument, and returns a token
+    // of the type given by its first argument.
+
+    case 47: // '/'
+      return readToken_slash(code);
+
+    case 37: case 42: // '%*'
+      return readToken_mult_modulo();
+
+    case 124: case 38: // '|&'
+      return readToken_pipe_amp(code);
+
+    case 94: // '^'
+      return readToken_caret();
+
+    case 43: case 45: // '+-'
+      return readToken_plus_min(code);
+
+    case 60: case 62: // '<>'
+      return readToken_lt_gt(code);
+
+    case 61: case 33: // '=!'
+      return readToken_eq_excl(code);
+
+    case 126: // '~'
+      return finishOp(_prefix, 1);
+    }
+
+    return false;
+  }
+
+  function readToken(forceRegexp) {
+    if (!forceRegexp) tokStart = tokPos;
+    else tokPos = tokStart + 1;
+    if (options.locations) tokStartLoc = new line_loc_t;
+    if (forceRegexp) return readRegexp();
+    if (tokPos >= inputLen) return finishToken(_eof);
+
+    var code = input.charCodeAt(tokPos);
+    // Identifier or keyword. '\uXXXX' sequences are allowed in
+    // identifiers, so '\' also dispatches to that.
+    if (isIdentifierStart(code) || code === 92 /* '\' */) return readWord();
+
+    var tok = getTokenFromCode(code);
+
+    if (tok === false) {
+      // If we are here, we either found a non-ASCII identifier
+      // character, or something that's entirely disallowed.
+      var ch = String.fromCharCode(code);
+      if (ch === "\\" || nonASCIIidentifierStart.test(ch)) return readWord();
+      raise(tokPos, "Unexpected character '" + ch + "'");
+    }
+    return tok;
+  }
+
+  function finishOp(type, size) {
+    var str = input.slice(tokPos, tokPos + size);
+    tokPos += size;
+    finishToken(type, str);
+  }
+
+  // Parse a regular expression. Some context-awareness is necessary,
+  // since a '/' inside a '[]' set does not end the expression.
+
+  function readRegexp() {
+    var content = "", escaped, inClass, start = tokPos;
+    for (;;) {
+      if (tokPos >= inputLen) raise(start, "Unterminated regular expression");
+      var ch = input.charAt(tokPos);
+      if (newline.test(ch)) raise(start, "Unterminated regular expression");
+      if (!escaped) {
+        if (ch === "[") inClass = true;
+        else if (ch === "]" && inClass) inClass = false;
+        else if (ch === "/" && !inClass) break;
+        escaped = ch === "\\";
+      } else escaped = false;
+      ++tokPos;
+    }
+    var content = input.slice(start, tokPos);
+    ++tokPos;
+    // Need to use `readWord1` because '\uXXXX' sequences are allowed
+    // here (don't ask).
+    var mods = readWord1();
+    if (mods && !/^[gmsiy]*$/.test(mods)) raise(start, "Invalid regexp flag");
+    try {
+      var value = new RegExp(content, mods);
+    } catch (e) {
+      if (e instanceof SyntaxError) raise(start, e.message);
+      raise(e);
+    }
+    return finishToken(_regexp, value);
+  }
+
+  // Read an integer in the given radix. Return null if zero digits
+  // were read, the integer value otherwise. When `len` is given, this
+  // will return `null` unless the integer has exactly `len` digits.
+
+  function readInt(radix, len) {
+    var start = tokPos, total = 0;
+    for (var i = 0, e = len == null ? Infinity : len; i < e; ++i) {
+      var code = input.charCodeAt(tokPos), val;
+      if (code >= 97) val = code - 97 + 10; // a
+      else if (code >= 65) val = code - 65 + 10; // A
+      else if (code >= 48 && code <= 57) val = code - 48; // 0-9
+      else val = Infinity;
+      if (val >= radix) break;
+      ++tokPos;
+      total = total * radix + val;
+    }
+    if (tokPos === start || len != null && tokPos - start !== len) return null;
+
+    return total;
+  }
+
+  function readHexNumber() {
+    tokPos += 2; // 0x
+    var val = readInt(16);
+    if (val == null) raise(tokStart + 2, "Expected hexadecimal number");
+    if (isIdentifierStart(input.charCodeAt(tokPos))) raise(tokPos, "Identifier directly after number");
+    return finishToken(_num, val);
+  }
+
+  // Read an integer, octal integer, or floating-point number.
+
+  function readNumber(startsWithDot) {
+    var start = tokPos, isFloat = false, octal = input.charCodeAt(tokPos) === 48;
+    if (!startsWithDot && readInt(10) === null) raise(start, "Invalid number");
+    if (input.charCodeAt(tokPos) === 46) {
+      ++tokPos;
+      readInt(10);
+      isFloat = true;
+    }
+    var next = input.charCodeAt(tokPos);
+    if (next === 69 || next === 101) { // 'eE'
+      next = input.charCodeAt(++tokPos);
+      if (next === 43 || next === 45) ++tokPos; // '+-'
+      if (readInt(10) === null) raise(start, "Invalid number");
+      isFloat = true;
+    }
+    if (isIdentifierStart(input.charCodeAt(tokPos))) raise(tokPos, "Identifier directly after number");
+
+    var str = input.slice(start, tokPos), val;
+    if (isFloat) val = parseFloat(str);
+    else if (!octal || str.length === 1) val = parseInt(str, 10);
+    else if (/[89]/.test(str) || strict) raise(start, "Invalid number");
+    else val = parseInt(str, 8);
+    return finishToken(_num, val);
+  }
+
+  // Read a string value, interpreting backslash-escapes.
+
+  function readString(quote) {
+    tokPos++;
+    var out = "";
+    for (;;) {
+      if (tokPos >= inputLen) raise(tokStart, "Unterminated string constant");
+      var ch = input.charCodeAt(tokPos);
+      if (ch === quote) {
+        ++tokPos;
+        return finishToken(_string, out);
+      }
+      if (ch === 92) { // '\'
+        ch = input.charCodeAt(++tokPos);
+        var octal = /^[0-7]+/.exec(input.slice(tokPos, tokPos + 3));
+        if (octal) octal = octal[0];
+        while (octal && parseInt(octal, 8) > 255) octal = octal.slice(0, -1);
+        if (octal === "0") octal = null;
+        ++tokPos;
+        if (octal) {
+          if (strict) raise(tokPos - 2, "Octal literal in strict mode");
+          out += String.fromCharCode(parseInt(octal, 8));
+          tokPos += octal.length - 1;
+        } else {
+          switch (ch) {
+          case 110: out += "\n"; break; // 'n' -> '\n'
+          case 114: out += "\r"; break; // 'r' -> '\r'
+          case 120: out += String.fromCharCode(readHexChar(2)); break; // 'x'
+          case 117: out += String.fromCharCode(readHexChar(4)); break; // 'u'
+          case 85: out += String.fromCharCode(readHexChar(8)); break; // 'U'
+          case 116: out += "\t"; break; // 't' -> '\t'
+          case 98: out += "\b"; break; // 'b' -> '\b'
+          case 118: out += "\u000b"; break; // 'v' -> '\u000b'
+          case 102: out += "\f"; break; // 'f' -> '\f'
+          case 48: out += "\0"; break; // 0 -> '\0'
+          case 13: if (input.charCodeAt(tokPos) === 10) ++tokPos; // '\r\n'
+          case 10: // ' \n'
+            if (options.locations) { tokLineStart = tokPos; ++tokCurLine; }
+            break;
+          default: out += String.fromCharCode(ch); break;
+          }
+        }
+      } else {
+        if (ch === 13 || ch === 10 || ch === 8232 || ch === 8233) raise(tokStart, "Unterminated string constant");
+        out += String.fromCharCode(ch); // '\'
+        ++tokPos;
+      }
+    }
+  }
+
+  // Used to read character escape sequences ('\x', '\u', '\U').
+
+  function readHexChar(len) {
+    var n = readInt(16, len);
+    if (n === null) raise(tokStart, "Bad character escape sequence");
+    return n;
+  }
+
+  // Used to signal to callers of `readWord1` whether the word
+  // contained any escape sequences. This is needed because words with
+  // escape sequences must not be interpreted as keywords.
+
+  var containsEsc;
+
+  // Read an identifier, and return it as a string. Sets `containsEsc`
+  // to whether the word contained a '\u' escape.
+  //
+  // Only builds up the word character-by-character when it actually
+  // containeds an escape, as a micro-optimization.
+
+  function readWord1() {
+    containsEsc = false;
+    var word, first = true, start = tokPos;
+    for (;;) {
+      var ch = input.charCodeAt(tokPos);
+      if (isIdentifierChar(ch)) {
+        if (containsEsc) word += input.charAt(tokPos);
+        ++tokPos;
+      } else if (ch === 92) { // "\"
+        if (!containsEsc) word = input.slice(start, tokPos);
+        containsEsc = true;
+        if (input.charCodeAt(++tokPos) != 117) // "u"
+          raise(tokPos, "Expecting Unicode escape sequence \\uXXXX");
+        ++tokPos;
+        var esc = readHexChar(4);
+        var escStr = String.fromCharCode(esc);
+        if (!escStr) raise(tokPos - 1, "Invalid Unicode escape");
+        if (!(first ? isIdentifierStart(esc) : isIdentifierChar(esc)))
+          raise(tokPos - 4, "Invalid Unicode escape");
+        word += escStr;
+      } else {
+        break;
+      }
+      first = false;
+    }
+    return containsEsc ? word : input.slice(start, tokPos);
+  }
+
+  // Read an identifier or keyword token. Will check for reserved
+  // words when necessary.
+
+  function readWord() {
+    var word = readWord1();
+    var type = _name;
+    if (!containsEsc) {
+      if (isKeyword(word)) type = keywordTypes[word];
+      else if (options.forbidReserved &&
+               (options.ecmaVersion === 3 ? isReservedWord3 : isReservedWord5)(word) ||
+               strict && isStrictReservedWord(word))
+        raise(tokStart, "The keyword '" + word + "' is reserved");
+    }
+    return finishToken(type, word);
+  }
+
+  // ## Parser
+
+  // A recursive descent parser operates by defining functions for all
+  // syntactic elements, and recursively calling those, each function
+  // advancing the input stream and returning an AST node. Precedence
+  // of constructs (for example, the fact that `!x[1]` means `!(x[1])`
+  // instead of `(!x)[1]` is handled by the fact that the parser
+  // function that parses unary prefix operators is called first, and
+  // in turn calls the function that parses `[]` subscripts — that
+  // way, it'll receive the node for `x[1]` already parsed, and wraps
+  // *that* in the unary operator node.
+  //
+  // Acorn uses an [operator precedence parser][opp] to handle binary
+  // operator precedence, because it is much more compact than using
+  // the technique outlined above, which uses different, nesting
+  // functions to specify precedence, for all of the ten binary
+  // precedence levels that JavaScript defines.
+  //
+  // [opp]: http://en.wikipedia.org/wiki/Operator-precedence_parser
+
+  // ### Parser utilities
+
+  // Continue to the next token.
+
+  function next() {
+    lastStart = tokStart;
+    lastEnd = tokEnd;
+    lastEndLoc = tokEndLoc;
+    readToken();
+  }
+
+  // Enter strict mode. Re-reads the next token to please pedantic
+  // tests ("use strict"; 010; -- should fail).
+
+  function setStrict(strct) {
+    strict = strct;
+    tokPos = tokStart;
+    if (options.locations) {
+      while (tokPos < tokLineStart) {
+        tokLineStart = input.lastIndexOf("\n", tokLineStart - 2) + 1;
+        --tokCurLine;
+      }
+    }
+    skipSpace();
+    readToken();
+  }
+
+  // Start an AST node, attaching a start offset.
+
+  function node_t() {
+    this.type = null;
+    this.start = tokStart;
+    this.end = null;
+  }
+
+  function node_loc_t() {
+    this.start = tokStartLoc;
+    this.end = null;
+    if (sourceFile !== null) this.source = sourceFile;
+  }
+
+  function startNode() {
+    var node = new node_t();
+    if (options.locations)
+      node.loc = new node_loc_t();
+    if (options.directSourceFile)
+      node.sourceFile = options.directSourceFile;
+    if (options.ranges)
+      node.range = [tokStart, 0];
+    return node;
+  }
+
+  // Start a node whose start offset information should be based on
+  // the start of another node. For example, a binary operator node is
+  // only started after its left-hand side has already been parsed.
+
+  function startNodeFrom(other) {
+    var node = new node_t();
+    node.start = other.start;
+    if (options.locations) {
+      node.loc = new node_loc_t();
+      node.loc.start = other.loc.start;
+    }
+    if (options.ranges)
+      node.range = [other.range[0], 0];
+
+    return node;
+  }
+
+  // Finish an AST node, adding `type` and `end` properties.
+
+  function finishNode(node, type) {
+    node.type = type;
+    node.end = lastEnd;
+    if (options.locations)
+      node.loc.end = lastEndLoc;
+    if (options.ranges)
+      node.range[1] = lastEnd;
+    return node;
+  }
+
+  // Test whether a statement node is the string literal `"use strict"`.
+
+  function isUseStrict(stmt) {
+    return options.ecmaVersion >= 5 && stmt.type === "ExpressionStatement" &&
+      stmt.expression.type === "Literal" && stmt.expression.value === "use strict";
+  }
+
+  // Predicate that tests whether the next token is of the given
+  // type, and if yes, consumes it as a side effect.
+
+  function eat(type) {
+    if (tokType === type) {
+      next();
+      return true;
+    }
+  }
+
+  // Test whether a semicolon can be inserted at the current position.
+
+  function canInsertSemicolon() {
+    return !options.strictSemicolons &&
+      (tokType === _eof || tokType === _braceR || newline.test(input.slice(lastEnd, tokStart)));
+  }
+
+  // Consume a semicolon, or, failing that, see if we are allowed to
+  // pretend that there is a semicolon at this position.
+
+  function semicolon() {
+    if (!eat(_semi) && !canInsertSemicolon()) unexpected();
+  }
+
+  // Expect a token of a given type. If found, consume it, otherwise,
+  // raise an unexpected token error.
+
+  function expect(type) {
+    if (tokType === type) next();
+    else unexpected();
+  }
+
+  // Raise an unexpected token error.
+
+  function unexpected() {
+    raise(tokStart, "Unexpected token");
+  }
+
+  // Verify that a node is an lval — something that can be assigned
+  // to.
+
+  function checkLVal(expr) {
+    if (expr.type !== "Identifier" && expr.type !== "MemberExpression")
+      raise(expr.start, "Assigning to rvalue");
+    if (strict && expr.type === "Identifier" && isStrictBadIdWord(expr.name))
+      raise(expr.start, "Assigning to " + expr.name + " in strict mode");
+  }
+
+  // ### Statement parsing
+
+  // Parse a program. Initializes the parser, reads any number of
+  // statements, and wraps them in a Program node.  Optionally takes a
+  // `program` argument.  If present, the statements will be appended
+  // to its body instead of creating a new node.
+
+  function parseTopLevel(program) {
+    lastStart = lastEnd = tokPos;
+    if (options.locations) lastEndLoc = new line_loc_t;
+    inFunction = strict = null;
+    labels = [];
+    readToken();
+
+    var node = program || startNode(), first = true;
+    if (!program) node.body = [];
+    while (tokType !== _eof) {
+      var stmt = parseStatement();
+      node.body.push(stmt);
+      if (first && isUseStrict(stmt)) setStrict(true);
+      first = false;
+    }
+    return finishNode(node, "Program");
+  }
+
+  var loopLabel = {kind: "loop"}, switchLabel = {kind: "switch"};
+
+  // Parse a single statement.
+  //
+  // If expecting a statement and finding a slash operator, parse a
+  // regular expression literal. This is to handle cases like
+  // `if (foo) /blah/.exec(foo);`, where looking at the previous token
+  // does not help.
+
+  function parseStatement() {
+    if (tokType === _slash || tokType === _assign && tokVal == "/=")
+      readToken(true);
+
+    var starttype = tokType, node = startNode();
+
+    // Most types of statements are recognized by the keyword they
+    // start with. Many are trivial to parse, some require a bit of
+    // complexity.
+
+    switch (starttype) {
+    case _break: case _continue:
+      next();
+      var isBreak = starttype === _break;
+      if (eat(_semi) || canInsertSemicolon()) node.label = null;
+      else if (tokType !== _name) unexpected();
+      else {
+        node.label = parseIdent();
+        semicolon();
+      }
+
+      // Verify that there is an actual destination to break or
+      // continue to.
+      for (var i = 0; i < labels.length; ++i) {
+        var lab = labels[i];
+        if (node.label == null || lab.name === node.label.name) {
+          if (lab.kind != null && (isBreak || lab.kind === "loop")) break;
+          if (node.label && isBreak) break;
+        }
+      }
+      if (i === labels.length) raise(node.start, "Unsyntactic " + starttype.keyword);
+      return finishNode(node, isBreak ? "BreakStatement" : "ContinueStatement");
+
+    case _debugger:
+      next();
+      semicolon();
+      return finishNode(node, "DebuggerStatement");
+
+    case _do:
+      next();
+      labels.push(loopLabel);
+      node.body = parseStatement();
+      labels.pop();
+      expect(_while);
+      node.test = parseParenExpression();
+      semicolon();
+      return finishNode(node, "DoWhileStatement");
+
+      // Disambiguating between a `for` and a `for`/`in` loop is
+      // non-trivial. Basically, we have to parse the init `var`
+      // statement or expression, disallowing the `in` operator (see
+      // the second parameter to `parseExpression`), and then check
+      // whether the next token is `in`. When there is no init part
+      // (semicolon immediately after the opening parenthesis), it is
+      // a regular `for` loop.
+
+    case _for:
+      next();
+      labels.push(loopLabel);
+      expect(_parenL);
+      if (tokType === _semi) return parseFor(node, null);
+      if (tokType === _var) {
+        var init = startNode();
+        next();
+        parseVar(init, true);
+        finishNode(init, "VariableDeclaration");
+        if (init.declarations.length === 1 && eat(_in))
+          return parseForIn(node, init);
+        return parseFor(node, init);
+      }
+      var init = parseExpression(false, true);
+      if (eat(_in)) {checkLVal(init); return parseForIn(node, init);}
+      return parseFor(node, init);
+
+    case _function:
+      next();
+      return parseFunction(node, true);
+
+    case _if:
+      next();
+      node.test = parseParenExpression();
+      node.consequent = parseStatement();
+      node.alternate = eat(_else) ? parseStatement() : null;
+      return finishNode(node, "IfStatement");
+
+    case _return:
+      if (!inFunction) raise(tokStart, "'return' outside of function");
+      next();
+
+      // In `return` (and `break`/`continue`), the keywords with
+      // optional arguments, we eagerly look for a semicolon or the
+      // possibility to insert one.
+
+      if (eat(_semi) || canInsertSemicolon()) node.argument = null;
+      else { node.argument = parseExpression(); semicolon(); }
+      return finishNode(node, "ReturnStatement");
+
+    case _switch:
+      next();
+      node.discriminant = parseParenExpression();
+      node.cases = [];
+      expect(_braceL);
+      labels.push(switchLabel);
+
+      // Statements under must be grouped (by label) in SwitchCase
+      // nodes. `cur` is used to keep the node that we are currently
+      // adding statements to.
+
+      for (var cur, sawDefault; tokType != _braceR;) {
+        if (tokType === _case || tokType === _default) {
+          var isCase = tokType === _case;
+          if (cur) finishNode(cur, "SwitchCase");
+          node.cases.push(cur = startNode());
+          cur.consequent = [];
+          next();
+          if (isCase) cur.test = parseExpression();
+          else {
+            if (sawDefault) raise(lastStart, "Multiple default clauses"); sawDefault = true;
+            cur.test = null;
+          }
+          expect(_colon);
+        } else {
+          if (!cur) unexpected();
+          cur.consequent.push(parseStatement());
+        }
+      }
+      if (cur) finishNode(cur, "SwitchCase");
+      next(); // Closing brace
+      labels.pop();
+      return finishNode(node, "SwitchStatement");
+
+    case _throw:
+      next();
+      if (newline.test(input.slice(lastEnd, tokStart)))
+        raise(lastEnd, "Illegal newline after throw");
+      node.argument = parseExpression();
+      semicolon();
+      return finishNode(node, "ThrowStatement");
+
+    case _try:
+      next();
+      node.block = parseBlock();
+      node.handler = null;
+      if (tokType === _catch) {
+        var clause = startNode();
+        next();
+        expect(_parenL);
+        clause.param = parseIdent();
+        if (strict && isStrictBadIdWord(clause.param.name))
+          raise(clause.param.start, "Binding " + clause.param.name + " in strict mode");
+        expect(_parenR);
+        clause.guard = null;
+        clause.body = parseBlock();
+        node.handler = finishNode(clause, "CatchClause");
+      }
+      node.guardedHandlers = empty;
+      node.finalizer = eat(_finally) ? parseBlock() : null;
+      if (!node.handler && !node.finalizer)
+        raise(node.start, "Missing catch or finally clause");
+      return finishNode(node, "TryStatement");
+
+    case _var:
+      next();
+      parseVar(node);
+      semicolon();
+      return finishNode(node, "VariableDeclaration");
+
+    case _while:
+      next();
+      node.test = parseParenExpression();
+      labels.push(loopLabel);
+      node.body = parseStatement();
+      labels.pop();
+      return finishNode(node, "WhileStatement");
+
+    case _with:
+      if (strict) raise(tokStart, "'with' in strict mode");
+      next();
+      node.object = parseParenExpression();
+      node.body = parseStatement();
+      return finishNode(node, "WithStatement");
+
+    case _braceL:
+      return parseBlock();
+
+    case _semi:
+      next();
+      return finishNode(node, "EmptyStatement");
+
+      // If the statement does not start with a statement keyword or a
+      // brace, it's an ExpressionStatement or LabeledStatement. We
+      // simply start parsing an expression, and afterwards, if the
+      // next token is a colon and the expression was a simple
+      // Identifier node, we switch to interpreting it as a label.
+
+    default:
+      var maybeName = tokVal, expr = parseExpression();
+      if (starttype === _name && expr.type === "Identifier" && eat(_colon)) {
+        for (var i = 0; i < labels.length; ++i)
+          if (labels[i].name === maybeName) raise(expr.start, "Label '" + maybeName + "' is already declared");
+        var kind = tokType.isLoop ? "loop" : tokType === _switch ? "switch" : null;
+        labels.push({name: maybeName, kind: kind});
+        node.body = parseStatement();
+        labels.pop();
+        node.label = expr;
+        return finishNode(node, "LabeledStatement");
+      } else {
+        node.expression = expr;
+        semicolon();
+        return finishNode(node, "ExpressionStatement");
+      }
+    }
+  }
+
+  // Used for constructs like `switch` and `if` that insist on
+  // parentheses around their expression.
+
+  function parseParenExpression() {
+    expect(_parenL);
+    var val = parseExpression();
+    expect(_parenR);
+    return val;
+  }
+
+  // Parse a semicolon-enclosed block of statements, handling `"use
+  // strict"` declarations when `allowStrict` is true (used for
+  // function bodies).
+
+  function parseBlock(allowStrict) {
+    var node = startNode(), first = true, strict = false, oldStrict;
+    node.body = [];
+    expect(_braceL);
+    while (!eat(_braceR)) {
+      var stmt = parseStatement();
+      node.body.push(stmt);
+      if (first && allowStrict && isUseStrict(stmt)) {
+        oldStrict = strict;
+        setStrict(strict = true);
+      }
+      first = false;
+    }
+    if (strict && !oldStrict) setStrict(false);
+    return finishNode(node, "BlockStatement");
+  }
+
+  // Parse a regular `for` loop. The disambiguation code in
+  // `parseStatement` will already have parsed the init statement or
+  // expression.
+
+  function parseFor(node, init) {
+    node.init = init;
+    expect(_semi);
+    node.test = tokType === _semi ? null : parseExpression();
+    expect(_semi);
+    node.update = tokType === _parenR ? null : parseExpression();
+    expect(_parenR);
+    node.body = parseStatement();
+    labels.pop();
+    return finishNode(node, "ForStatement");
+  }
+
+  // Parse a `for`/`in` loop.
+
+  function parseForIn(node, init) {
+    node.left = init;
+    node.right = parseExpression();
+    expect(_parenR);
+    node.body = parseStatement();
+    labels.pop();
+    return finishNode(node, "ForInStatement");
+  }
+
+  // Parse a list of variable declarations.
+
+  function parseVar(node, noIn) {
+    node.declarations = [];
+    node.kind = "var";
+    for (;;) {
+      var decl = startNode();
+      decl.id = parseIdent();
+      if (strict && isStrictBadIdWord(decl.id.name))
+        raise(decl.id.start, "Binding " + decl.id.name + " in strict mode");
+      decl.init = eat(_eq) ? parseExpression(true, noIn) : null;
+      node.declarations.push(finishNode(decl, "VariableDeclarator"));
+      if (!eat(_comma)) break;
+    }
+    return node;
+  }
+
+  // ### Expression parsing
+
+  // These nest, from the most general expression type at the top to
+  // 'atomic', nondivisible expression types at the bottom. Most of
+  // the functions will simply let the function(s) below them parse,
+  // and, *if* the syntactic construct they handle is present, wrap
+  // the AST node that the inner parser gave them in another node.
+
+  // Parse a full expression. The arguments are used to forbid comma
+  // sequences (in argument lists, array literals, or object literals)
+  // or the `in` operator (in for loops initalization expressions).
+
+  function parseExpression(noComma, noIn) {
+    var expr = parseMaybeAssign(noIn);
+    if (!noComma && tokType === _comma) {
+      var node = startNodeFrom(expr);
+      node.expressions = [expr];
+      while (eat(_comma)) node.expressions.push(parseMaybeAssign(noIn));
+      return finishNode(node, "SequenceExpression");
+    }
+    return expr;
+  }
+
+  // Parse an assignment expression. This includes applications of
+  // operators like `+=`.
+
+  function parseMaybeAssign(noIn) {
+    var left = parseMaybeConditional(noIn);
+    if (tokType.isAssign) {
+      var node = startNodeFrom(left);
+      node.operator = tokVal;
+      node.left = left;
+      next();
+      node.right = parseMaybeAssign(noIn);
+      checkLVal(left);
+      return finishNode(node, "AssignmentExpression");
+    }
+    return left;
+  }
+
+  // Parse a ternary conditional (`?:`) operator.
+
+  function parseMaybeConditional(noIn) {
+    var expr = parseExprOps(noIn);
+    if (eat(_question)) {
+      var node = startNodeFrom(expr);
+      node.test = expr;
+      node.consequent = parseExpression(true);
+      expect(_colon);
+      node.alternate = parseExpression(true, noIn);
+      return finishNode(node, "ConditionalExpression");
+    }
+    return expr;
+  }
+
+  // Start the precedence parser.
+
+  function parseExprOps(noIn) {
+    return parseExprOp(parseMaybeUnary(), -1, noIn);
+  }
+
+  // Parse binary operators with the operator precedence parsing
+  // algorithm. `left` is the left-hand side of the operator.
+  // `minPrec` provides context that allows the function to stop and
+  // defer further parser to one of its callers when it encounters an
+  // operator that has a lower precedence than the set it is parsing.
+
+  function parseExprOp(left, minPrec, noIn) {
+    var prec = tokType.binop;
+    if (prec != null && (!noIn || tokType !== _in)) {
+      if (prec > minPrec) {
+        var node = startNodeFrom(left);
+        node.left = left;
+        node.operator = tokVal;
+        var op = tokType;
+        next();
+        node.right = parseExprOp(parseMaybeUnary(), prec, noIn);
+        var exprNode = finishNode(node, (op === _logicalOR || op === _logicalAND) ? "LogicalExpression" : "BinaryExpression");
+        return parseExprOp(exprNode, minPrec, noIn);
+      }
+    }
+    return left;
+  }
+
+  // Parse unary operators, both prefix and postfix.
+
+  function parseMaybeUnary() {
+    if (tokType.prefix) {
+      var node = startNode(), update = tokType.isUpdate;
+      node.operator = tokVal;
+      node.prefix = true;
+      tokRegexpAllowed = true;
+      next();
+      node.argument = parseMaybeUnary();
+      if (update) checkLVal(node.argument);
+      else if (strict && node.operator === "delete" &&
+               node.argument.type === "Identifier")
+        raise(node.start, "Deleting local variable in strict mode");
+      return finishNode(node, update ? "UpdateExpression" : "UnaryExpression");
+    }
+    var expr = parseExprSubscripts();
+    while (tokType.postfix && !canInsertSemicolon()) {
+      var node = startNodeFrom(expr);
+      node.operator = tokVal;
+      node.prefix = false;
+      node.argument = expr;
+      checkLVal(expr);
+      next();
+      expr = finishNode(node, "UpdateExpression");
+    }
+    return expr;
+  }
+
+  // Parse call, dot, and `[]`-subscript expressions.
+
+  function parseExprSubscripts() {
+    return parseSubscripts(parseExprAtom());
+  }
+
+  function parseSubscripts(base, noCalls) {
+    if (eat(_dot)) {
+      var node = startNodeFrom(base);
+      node.object = base;
+      node.property = parseIdent(true);
+      node.computed = false;
+      return parseSubscripts(finishNode(node, "MemberExpression"), noCalls);
+    } else if (eat(_bracketL)) {
+      var node = startNodeFrom(base);
+      node.object = base;
+      node.property = parseExpression();
+      node.computed = true;
+      expect(_bracketR);
+      return parseSubscripts(finishNode(node, "MemberExpression"), noCalls);
+    } else if (!noCalls && eat(_parenL)) {
+      var node = startNodeFrom(base);
+      node.callee = base;
+      node.arguments = parseExprList(_parenR, false);
+      return parseSubscripts(finishNode(node, "CallExpression"), noCalls);
+    } else return base;
+  }
+
+  // Parse an atomic expression — either a single token that is an
+  // expression, an expression started by a keyword like `function` or
+  // `new`, or an expression wrapped in punctuation like `()`, `[]`,
+  // or `{}`.
+
+  function parseExprAtom() {
+    switch (tokType) {
+    case _this:
+      var node = startNode();
+      next();
+      return finishNode(node, "ThisExpression");
+    case _name:
+      return parseIdent();
+    case _num: case _string: case _regexp:
+      var node = startNode();
+      node.value = tokVal;
+      node.raw = input.slice(tokStart, tokEnd);
+      next();
+      return finishNode(node, "Literal");
+
+    case _null: case _true: case _false:
+      var node = startNode();
+      node.value = tokType.atomValue;
+      node.raw = tokType.keyword;
+      next();
+      return finishNode(node, "Literal");
+
+    case _parenL:
+      var tokStartLoc1 = tokStartLoc, tokStart1 = tokStart;
+      next();
+      var val = parseExpression();
+      val.start = tokStart1;
+      val.end = tokEnd;
+      if (options.locations) {
+        val.loc.start = tokStartLoc1;
+        val.loc.end = tokEndLoc;
+      }
+      if (options.ranges)
+        val.range = [tokStart1, tokEnd];
+      expect(_parenR);
+      return val;
+
+    case _bracketL:
+      var node = startNode();
+      next();
+      node.elements = parseExprList(_bracketR, true, true);
+      return finishNode(node, "ArrayExpression");
+
+    case _braceL:
+      return parseObj();
+
+    case _function:
+      var node = startNode();
+      next();
+      return parseFunction(node, false);
+
+    case _new:
+      return parseNew();
+
+    default:
+      unexpected();
+    }
+  }
+
+  // New's precedence is slightly tricky. It must allow its argument
+  // to be a `[]` or dot subscript expression, but not a call — at
+  // least, not without wrapping it in parentheses. Thus, it uses the
+
+  function parseNew() {
+    var node = startNode();
+    next();
+    node.callee = parseSubscripts(parseExprAtom(), true);
+    if (eat(_parenL)) node.arguments = parseExprList(_parenR, false);
+    else node.arguments = empty;
+    return finishNode(node, "NewExpression");
+  }
+
+  // Parse an object literal.
+
+  function parseObj() {
+    var node = startNode(), first = true, sawGetSet = false;
+    node.properties = [];
+    next();
+    while (!eat(_braceR)) {
+      if (!first) {
+        expect(_comma);
+        if (options.allowTrailingCommas && eat(_braceR)) break;
+      } else first = false;
+
+      var prop = {key: parsePropertyName()}, isGetSet = false, kind;
+      if (eat(_colon)) {
+        prop.value = parseExpression(true);
+        kind = prop.kind = "init";
+      } else if (options.ecmaVersion >= 5 && prop.key.type === "Identifier" &&
+                 (prop.key.name === "get" || prop.key.name === "set")) {
+        isGetSet = sawGetSet = true;
+        kind = prop.kind = prop.key.name;
+        prop.key = parsePropertyName();
+        if (tokType !== _parenL) unexpected();
+        prop.value = parseFunction(startNode(), false);
+      } else unexpected();
+
+      // getters and setters are not allowed to clash — either with
+      // each other or with an init property — and in strict mode,
+      // init properties are also not allowed to be repeated.
+
+      if (prop.key.type === "Identifier" && (strict || sawGetSet)) {
+        for (var i = 0; i < node.properties.length; ++i) {
+          var other = node.properties[i];
+          if (other.key.name === prop.key.name) {
+            var conflict = kind == other.kind || isGetSet && other.kind === "init" ||
+              kind === "init" && (other.kind === "get" || other.kind === "set");
+            if (conflict && !strict && kind === "init" && other.kind === "init") conflict = false;
+            if (conflict) raise(prop.key.start, "Redefinition of property");
+          }
+        }
+      }
+      node.properties.push(prop);
+    }
+    return finishNode(node, "ObjectExpression");
+  }
+
+  function parsePropertyName() {
+    if (tokType === _num || tokType === _string) return parseExprAtom();
+    return parseIdent(true);
+  }
+
+  // Parse a function declaration or literal (depending on the
+  // `isStatement` parameter).
+
+  function parseFunction(node, isStatement) {
+    if (tokType === _name) node.id = parseIdent();
+    else if (isStatement) unexpected();
+    else node.id = null;
+    node.params = [];
+    var first = true;
+    expect(_parenL);
+    while (!eat(_parenR)) {
+      if (!first) expect(_comma); else first = false;
+      node.params.push(parseIdent());
+    }
+
+    // Start a new scope with regard to labels and the `inFunction`
+    // flag (restore them to their old value afterwards).
+    var oldInFunc = inFunction, oldLabels = labels;
+    inFunction = true; labels = [];
+    node.body = parseBlock(true);
+    inFunction = oldInFunc; labels = oldLabels;
+
+    // If this is a strict mode function, verify that argument names
+    // are not repeated, and it does not try to bind the words `eval`
+    // or `arguments`.
+    if (strict || node.body.body.length && isUseStrict(node.body.body[0])) {
+      for (var i = node.id ? -1 : 0; i < node.params.length; ++i) {
+        var id = i < 0 ? node.id : node.params[i];
+        if (isStrictReservedWord(id.name) || isStrictBadIdWord(id.name))
+          raise(id.start, "Defining '" + id.name + "' in strict mode");
+        if (i >= 0) for (var j = 0; j < i; ++j) if (id.name === node.params[j].name)
+          raise(id.start, "Argument name clash in strict mode");
+      }
+    }
+
+    return finishNode(node, isStatement ? "FunctionDeclaration" : "FunctionExpression");
+  }
+
+  // Parses a comma-separated list of expressions, and returns them as
+  // an array. `close` is the token type that ends the list, and
+  // `allowEmpty` can be turned on to allow subsequent commas with
+  // nothing in between them to be parsed as `null` (which is needed
+  // for array literals).
+
+  function parseExprList(close, allowTrailingComma, allowEmpty) {
+    var elts = [], first = true;
+    while (!eat(close)) {
+      if (!first) {
+        expect(_comma);
+        if (allowTrailingComma && options.allowTrailingCommas && eat(close)) break;
+      } else first = false;
+
+      if (allowEmpty && tokType === _comma) elts.push(null);
+      else elts.push(parseExpression(true));
+    }
+    return elts;
+  }
+
+  // Parse the next token as an identifier. If `liberal` is true (used
+  // when parsing properties), it will also convert keywords into
+  // identifiers.
+
+  function parseIdent(liberal) {
+    var node = startNode();
+    node.name = tokType === _name ? tokVal : (liberal && !options.forbidReserved && tokType.keyword) || unexpected();
+    tokRegexpAllowed = false;
+    next();
+    return finishNode(node, "Identifier");
+  }
+
+});
diff --git a/shader-api.html b/shader-api.html
index b17c45b..aa9d1a6 100644
--- a/shader-api.html
+++ b/shader-api.html
@@ -72,6 +72,7 @@ a { color: #00f; }
 <div id="workspace"></div>
 
 </body>
+<script type="text/javascript" src="js/vendor/acorn.js"></script>
 <script type="text/javascript" src="js/vendor/jquery/jquery.min.js"></script>
 <script type="text/javascript" src="js/vendor/canvasquery.js"></script>
 <script type="text/javascript" src="js/vendor/FileSaver/FileSaver.js"></script>
@@ -84,6 +85,7 @@ a { color: #00f; }
 <script type="text/javascript" src="js/gallery.js"></script>
 <script type="text/javascript" src="js/render.js"></script>
 <script type="text/javascript" src="js/shader.js"></script>
+<script type="text/javascript" src="js/error.highlight.js"></script>
 <script type="text/javascript" src="js/api/gallery.js"></script>
 <script type="text/javascript" src="js/api/get.js"></script>
 <script type="text/javascript" src="js/api/set.js"></script>
diff --git a/shader-picker.html b/shader-picker.html
index 7d014f1..d0d2625 100644
--- a/shader-picker.html
+++ b/shader-picker.html
@@ -111,11 +111,13 @@ a { color: #00f; }
 <script type="text/javascript" src="js/vendor/gif.js"></script>
 <script type="text/javascript" src="js/vendor/FileSaver/FileSaver.js"></script>
 <script type="text/javascript" src="js/vendor/dataUriToBlob.js"></script>
+<script type="text/javascript" src="js/vendor/acorn.js"></script>
 <script type="text/javascript" src="js/vendor/jquery/jquery.min.js"></script>
 <script type="text/javascript" src="js/vendor/jquery-ui-1.10.3.custom.min.js"></script>
 <script type="text/javascript" src="js/vendor/canvasquery.js"></script>
 <script type="text/javascript" src="js/canvasquery.dither.js"></script>
 <script type="text/javascript" src="js/api/localstorage.js"></script>
+<script type="text/javascript" src="js/error.highlight.js"></script>
 <script type="text/javascript" src="js/asdf.js"></script>
 <script type="text/javascript" src="js/image.js"></script>
 <script type="text/javascript" src="js/gallery.js"></script>
-- 
cgit v1.2.3-70-g09d2


From 9433b20670a1eada77e1a4372a8f8ccad6f499c3 Mon Sep 17 00:00:00 2001
From: jules <jules@okfoc.us>
Date: Sat, 25 Jan 2014 23:24:36 -0500
Subject: split out help and whatever else

---
 js/gallery.js      | 12 +++++++++++-
 js/help.js         | 19 +++++++++++++++++++
 shader-api.html    |  3 +++
 shader-picker.html | 16 +++-------------
 4 files changed, 36 insertions(+), 14 deletions(-)
 create mode 100644 js/help.js

(limited to 'shader-picker.html')

diff --git a/js/gallery.js b/js/gallery.js
index 16ecdd8..d114ec6 100644
--- a/js/gallery.js
+++ b/js/gallery.js
@@ -3,7 +3,10 @@
 
 var gallery = {}
 
-gallery.init = function(){
+gallery.init = function(choose){
+	if (choose) {
+		galler.choose = choose;
+	}
   gallery.bind()
 }
 
@@ -52,3 +55,10 @@ gallery.image = function(im){
 gallery.click = function(){
   gallery.choose()
 }
+
+// template for choose function.. bound to an image object
+gallery.choose = function(){
+	var img = this
+  var imageURL = this.src
+}
+
diff --git a/js/help.js b/js/help.js
new file mode 100644
index 0000000..5610794
--- /dev/null
+++ b/js/help.js
@@ -0,0 +1,19 @@
+
+var help = {}
+
+help.init = function(){
+	help.bind()
+}
+
+help.bind = function(){
+	$(window).on("scroll DOMMouseScroll mousewheel", function(){ scrolling = true })
+	$("#help,#instructions .close").click(function(){ $("#instructions").toggle() })
+	$("#instructions").draggable({
+		start: drag_start,
+		stop: drag_stop
+	})
+	$("#instructions").disableSelection();
+}
+
+function drag_start(){ dragging = true; $(this).addClass("dragging") }
+function drag_stop(){ dragging = false; $(".dragging").removeClass("dragging") }
diff --git a/shader-api.html b/shader-api.html
index aa9d1a6..416f21a 100644
--- a/shader-api.html
+++ b/shader-api.html
@@ -86,6 +86,7 @@ a { color: #00f; }
 <script type="text/javascript" src="js/render.js"></script>
 <script type="text/javascript" src="js/shader.js"></script>
 <script type="text/javascript" src="js/error.highlight.js"></script>
+<script type="text/javascript" src="js/help.js"></script>
 <script type="text/javascript" src="js/api/gallery.js"></script>
 <script type="text/javascript" src="js/api/get.js"></script>
 <script type="text/javascript" src="js/api/set.js"></script>
@@ -109,6 +110,7 @@ function init(){
 	$("#pause").click(pause)
 
 	user.init()
+	help.init()
 	shader_gallery.init()
 	
 	document.getElementById('shader').addEventListener('input', shader_build);
@@ -120,3 +122,4 @@ function init(){
 
 </script>
 </html>
+-
\ No newline at end of file
diff --git a/shader-picker.html b/shader-picker.html
index d0d2625..0896609 100644
--- a/shader-picker.html
+++ b/shader-picker.html
@@ -128,6 +128,7 @@ a { color: #00f; }
 <script type="text/javascript" src="js/render.js"></script>
 <script type="text/javascript" src="js/shader.js"></script>
 <script type="text/javascript" src="js/util.js"></script>
+<script type="text/javascript" src="js/help.js"></script>
 <script type="text/javascript" src="shaders.json"></script>
 <script type="text/javascript">
 
@@ -154,19 +155,10 @@ function init(){
 	})
 	
 	frame_editor.init()
-
-	$(window).on("scroll DOMMouseScroll mousewheel", function(){ scrolling = true })
-	$("#help,#instructions .close").click(function(){ $("#instructions").toggle() })
-	$("#instructions").draggable({
-		start: drag_start,
-		stop: drag_stop
-	})
-	$("#instructions").disableSelection();
-
+	help.init()
 	load()
 
-	gallery.choose = choose
-	gallery.init()
+	gallery.init(choose)
 
 	user.init()
 	if (user.username.length) {
@@ -181,8 +173,6 @@ function init(){
 
 	requestAnimationFrame(animate)
 }
-function drag_start(){ dragging = true; $(this).addClass("dragging") }
-function drag_stop(){ dragging = false; $(".dragging").removeClass("dragging") }
 
 </script>
 <script type="text/html" id="frame-template">
-- 
cgit v1.2.3-70-g09d2


From e873e6c1b0d2f4e06b94138a22d0d4292c52a037 Mon Sep 17 00:00:00 2001
From: jules <jules@okfoc.us>
Date: Sat, 25 Jan 2014 23:42:19 -0500
Subject: logging, error fix, css

---
 js/api/set.js         |  4 ++++
 js/error.highlight.js |  2 +-
 shader-api.html       | 10 +++++++++-
 shader-picker.html    | 10 ++++++----
 4 files changed, 20 insertions(+), 6 deletions(-)

(limited to 'shader-picker.html')

diff --git a/js/api/set.js b/js/api/set.js
index 92cc071..8732c87 100644
--- a/js/api/set.js
+++ b/js/api/set.js
@@ -10,14 +10,17 @@ function save_shader(){
 	}
 	var blob = dataUriToBlob(cc.clone().resize(200,200).canvas.toDataURL("image/png"))
 
+	status('saving..')
 	console.log(params)
 	$.post("http://asdf.us/cgi-bin/im/shader/save", params, function(resp){
 		console.log(resp);
 		data = JSON.parse(resp)
 		if (data.ERROR){
+			status('error saving shader')
 			alert(data.ERROR)
 			return false
 		}
+		status('uploading thumbnail')
 		if (! shader_id_root) {
 			shader_id_root = data.id;
 		}
@@ -40,6 +43,7 @@ function save_shader(){
 			contentType: false,
 		}).done(function(resp){
 			console.log(resp);
+			status('')
 			var data = JSON.parse(resp)
 			if (data.success) {
 				$shader.find("img").attr("src", data.url)
diff --git a/js/error.highlight.js b/js/error.highlight.js
index 0b478e2..f46d0ec 100644
--- a/js/error.highlight.js
+++ b/js/error.highlight.js
@@ -136,7 +136,7 @@ var init = function(){
   create_el_highlight()
   create_el_textmeasure()
   scrollbar_width = calc_scrollbar_width()
-  textarea.addEventListener('scroll', reposition_highlight)
+  dom.textarea.addEventListener('scroll', reposition_highlight)
 }
 
 // exports
diff --git a/shader-api.html b/shader-api.html
index 416f21a..b860093 100644
--- a/shader-api.html
+++ b/shader-api.html
@@ -16,6 +16,13 @@ form { display: inline-block; }
 #shader-name { width: 75px; }
 #shader-id { width: 40px; }
 a { color: #00f; }
+#help { float: right; }
+.dragging { cursor: -webkit-grabbing !important; }
+#instructions { position: absolute;top:20px;right:20px; width:190px;height:465px; box-shadow:5px 5px 10px rgba(0,0,0,0.3); background:rgba(255,255,255,0.8); display: none; cursor: -webkit-grab; }
+#instructions iframe {width: 100%;height:100%;margin:0;padding:0;border:0;}
+#instructions.dragging iframe { pointer-events: none; }
+#instructions .close { position: absolute; top: 5px; right: 5px; color: #f00; padding: 3px; border: 0;background: white; font-size: 10px; line-height: 10px; }
+
 </style>
 </head>
 <body>
@@ -35,6 +42,7 @@ a { color: #00f; }
 -->
 
 <div id="shader-api">
+	<button id="help">help</button>
 	<button id="new-shader"><b>new shader</b></button>
 	<input type="text" id="shader-id" disabled><button id="fetch-info" disabled>info</button>
 	<button id="fetch-history" disabled>history</button>
@@ -74,6 +82,7 @@ a { color: #00f; }
 </body>
 <script type="text/javascript" src="js/vendor/acorn.js"></script>
 <script type="text/javascript" src="js/vendor/jquery/jquery.min.js"></script>
+<script type="text/javascript" src="js/vendor/jquery-ui-1.10.3.custom.min.js"></script>
 <script type="text/javascript" src="js/vendor/canvasquery.js"></script>
 <script type="text/javascript" src="js/vendor/FileSaver/FileSaver.js"></script>
 <script type="text/javascript" src="js/vendor/dataUriToBlob.js"></script>
@@ -122,4 +131,3 @@ function init(){
 
 </script>
 </html>
--
\ No newline at end of file
diff --git a/shader-picker.html b/shader-picker.html
index 0896609..7efe39f 100644
--- a/shader-picker.html
+++ b/shader-picker.html
@@ -130,6 +130,12 @@ a { color: #00f; }
 <script type="text/javascript" src="js/util.js"></script>
 <script type="text/javascript" src="js/help.js"></script>
 <script type="text/javascript" src="shaders.json"></script>
+
+<script type="text/html" id="frame-template">
+<button class="remove">x</button>
+<span class="frame"></span>
+</script>
+
 <script type="text/javascript">
 
 var cc = cq(0,0).appendTo("#workspace")
@@ -174,10 +180,6 @@ function init(){
 	requestAnimationFrame(animate)
 }
 
-</script>
-<script type="text/html" id="frame-template">
-<button class="remove">x</button>
-<span class="frame"></span>
 </script>
 </html>
 
-- 
cgit v1.2.3-70-g09d2


From dd7d18e344da5aa5b326621857d17993d01d7151 Mon Sep 17 00:00:00 2001
From: jules <jules@okfoc.us>
Date: Sun, 2 Feb 2014 01:08:41 -0500
Subject: toggle iframes, write short copy

---
 commands.html      | 69 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
 instructions.html  | 69 ------------------------------------------------------
 js/help.js         | 10 ++++----
 shader-combo.html  |  6 ++---
 shader-picker.html | 12 +++++-----
 tutorial.html      |  2 +-
 6 files changed, 85 insertions(+), 83 deletions(-)
 create mode 100644 commands.html
 delete mode 100644 instructions.html

(limited to 'shader-picker.html')

diff --git a/commands.html b/commands.html
new file mode 100644
index 0000000..df9b072
--- /dev/null
+++ b/commands.html
@@ -0,0 +1,69 @@
+<!doctype html>
+<html>
+<head>
+<title>instructions</title>
+<style type="text/css">
+html,body{margin:0;padding:5px; }
+pre { font-family: serif; font-size: 14px; margin:0;padding:0;}
+u{ color: #866; }
+i{ color: #666; }
+</style>
+</head>
+<body>
+<pre id="pre"><u>function parameters</u>
+w, h, x, y
+t = current time (ms)
+d[] = imageData array
+r, g, b, a = color values
+mousex, mousey
+
+<u>Math aliases</u>
+floor, ceil, round
+abs, sign, mod(n,m)
+pow, exp, sqrt
+cos, sin, tan
+acos, asin, atan, atan2
+random()
+E, PI, PHI
+
+<u>convenience functions</u>
+clamp(n,min,max)
+mix(n,a,b) (lerp)
+step(a,b)
+smoothstep(min,max,n)
+avg(m,n,a)
+cosp, sinp (mapped to [0,1])
+pixel(x,y) == 4*(y*w+h)
+dist(x,y,a,b)
+angle(x,y,a,b)
+rand(n), randint(n)
+randrange(a,b)
+choice(array)
+deg(radians), rad(degrees)
+
+<u>set pixel color</u>
+rgb(r,g,b)
+rgbref([rgb])
+black() white() red()
+gray(n)
+
+<u>color spaces</u>
+rgb2xyz(rgb)
+xyz2rgb(xyz)
+xyz2hunterlab(xyz)
+hunterlab2xyz(Lab)
+xyz2cielab(xyz)
+cielab2xyz(Lab)
+rgb2hsl(rgb)
+hsl2rgb(hsl)
+rgb2cmy(r,g,b)
+cmy2rgb(cmy)
+cmy2cmyk(cmy)
+cmyk2cmy(cmyk)
+(not all have been tested)
+</pre>
+</body>
+<script>
+pre.innerHTML = pre.innerHTML.replace(/\(/g,"(<i>").replace(/\)/g,"</i>)")
+</script>
+</html>
diff --git a/instructions.html b/instructions.html
deleted file mode 100644
index df9b072..0000000
--- a/instructions.html
+++ /dev/null
@@ -1,69 +0,0 @@
-<!doctype html>
-<html>
-<head>
-<title>instructions</title>
-<style type="text/css">
-html,body{margin:0;padding:5px; }
-pre { font-family: serif; font-size: 14px; margin:0;padding:0;}
-u{ color: #866; }
-i{ color: #666; }
-</style>
-</head>
-<body>
-<pre id="pre"><u>function parameters</u>
-w, h, x, y
-t = current time (ms)
-d[] = imageData array
-r, g, b, a = color values
-mousex, mousey
-
-<u>Math aliases</u>
-floor, ceil, round
-abs, sign, mod(n,m)
-pow, exp, sqrt
-cos, sin, tan
-acos, asin, atan, atan2
-random()
-E, PI, PHI
-
-<u>convenience functions</u>
-clamp(n,min,max)
-mix(n,a,b) (lerp)
-step(a,b)
-smoothstep(min,max,n)
-avg(m,n,a)
-cosp, sinp (mapped to [0,1])
-pixel(x,y) == 4*(y*w+h)
-dist(x,y,a,b)
-angle(x,y,a,b)
-rand(n), randint(n)
-randrange(a,b)
-choice(array)
-deg(radians), rad(degrees)
-
-<u>set pixel color</u>
-rgb(r,g,b)
-rgbref([rgb])
-black() white() red()
-gray(n)
-
-<u>color spaces</u>
-rgb2xyz(rgb)
-xyz2rgb(xyz)
-xyz2hunterlab(xyz)
-hunterlab2xyz(Lab)
-xyz2cielab(xyz)
-cielab2xyz(Lab)
-rgb2hsl(rgb)
-hsl2rgb(hsl)
-rgb2cmy(r,g,b)
-cmy2rgb(cmy)
-cmy2cmyk(cmy)
-cmyk2cmy(cmyk)
-(not all have been tested)
-</pre>
-</body>
-<script>
-pre.innerHTML = pre.innerHTML.replace(/\(/g,"(<i>").replace(/\)/g,"</i>)")
-</script>
-</html>
diff --git a/js/help.js b/js/help.js
index 6f39aa7..7bc3a6b 100644
--- a/js/help.js
+++ b/js/help.js
@@ -7,13 +7,15 @@ help.init = function(){
 
 help.bind = function(){
 	$(window).on("scroll DOMMouseScroll mousewheel", function(){ scrolling = true })
-	$("#help").click(function(){ $("#instructions").toggle() ;console.log("zZ") })
-	$("#instructions .close").click(function(){ $("#instructions").toggle() ;console.log("zZ") })
-	$("#instructions").draggable({
+	$("#show-commands").click(function(){ $("#tutorial").hide(); $("#commands").toggle() })
+	$("#show-tutorial").click(function(){ $("#commands").hide(); $("#tutorial").toggle() })
+	$("#commands .close").click(function(){ $("#commands").toggle() })
+	$("#tutorial .close").click(function(){ $("#tutorial").toggle() })
+	$("#commands,#tutorial").draggable({
 		start: drag_start,
 		stop: drag_stop
 	})
-	$("#instructions").disableSelection();
+	$("#commands,#tutorial").disableSelection();
 }
 
 function drag_start(){ dragging = true; $(this).addClass("dragging") }
diff --git a/shader-combo.html b/shader-combo.html
index 99c5a6c..5d9c869 100644
--- a/shader-combo.html
+++ b/shader-combo.html
@@ -29,7 +29,7 @@ a { color: #00f; }
 .dragging { cursor: -webkit-grabbing !important; }
 .ui-sortable-helper { cursor: -webkit-grabbing !important; }
 
-#instructions { top:20px;right:20px; width:190px;height:465px; }
+#commands { top:40px;right:20px; width:190px;height:calc(95% - 230px); }
 #tutorial { top:40px;right:30px; width:290px;height:325px; display: block;}
 .iframe { position: absolute; box-shadow:5px 5px 10px rgba(0,0,0,0.3); background:rgba(255,255,255,0.8); display: none; cursor: -webkit-grab; }
 .iframe iframe {width: 100%;height:100%;margin:0;padding:0;border:0;}
@@ -64,7 +64,7 @@ a { color: #00f; }
 
 <div id="corner">
 	<h1 id="logo">shaderblaster</h1>
-	<button id="show-help">help</button>
+	<button id="show-tutorial">help</button>
 	<button id="show-commands">commands</button>
 	<select id="examples">
 		<option>examples</option>
@@ -156,7 +156,7 @@ a { color: #00f; }
 <div id="workspace"></div>
 
 <div class="iframe" id="tutorial"><iframe src="tutorial.html"></iframe><button class="close">&times;</button></div>
-<div class="iframe" id="instructions"><iframe src="instructions.html"></iframe><button class="close">&times;</button></div>
+<div class="iframe" id="commands"><iframe src="commands.html"></iframe><button class="close">&times;</button></div>
 <script type="text/javascript" src="js/vendor/acorn.js"></script>
 <script type="text/javascript" src="js/vendor/gif.js"></script>
 <script type="text/javascript" src="js/vendor/gif-encode.min.js"></script>
diff --git a/shader-picker.html b/shader-picker.html
index 7efe39f..8bafc60 100644
--- a/shader-picker.html
+++ b/shader-picker.html
@@ -21,10 +21,10 @@ div { display: inline-block; padding: 10px;}
 #rendered img { display: block; }
 #render,#save { font-weight: bold; }
 #render { float: right; }
-#instructions { position: absolute;top:20px;right:20px; width:190px;height:465px; box-shadow:5px 5px 10px rgba(0,0,0,0.3); background:rgba(255,255,255,0.8); display: none; cursor: -webkit-grab; }
-#instructions iframe {width: 100%;height:100%;margin:0;padding:0;border:0;}
-#instructions.dragging iframe { pointer-events: none; }
-#instructions .close { position: absolute; top: 5px; right: 5px; color: #f00; padding: 3px; border: 0;background: white; font-size: 10px; line-height: 10px; }
+#commands { position: absolute;top:20px;right:20px; width:190px;height:465px; box-shadow:5px 5px 10px rgba(0,0,0,0.3); background:rgba(255,255,255,0.8); display: none; cursor: -webkit-grab; }
+#commands iframe {width: 100%;height:100%;margin:0;padding:0;border:0;}
+#commands.dragging iframe { pointer-events: none; }
+#commands .close { position: absolute; top: 5px; right: 5px; color: #f00; padding: 3px; border: 0;background: white; font-size: 10px; line-height: 10px; }
 .close,.remove { cursor: pointer; }
 #uploaded-url { display: none; width: 300px; }
 form { display: inline-block; }
@@ -79,7 +79,7 @@ a { color: #00f; }
 	your name here &rarr; <input type="text" id="username" value="">
 	<br>
 	<br>
-	<button id="help">help</button>
+	<button id="show-commands">help</button>
 	&nbsp;
 	<button id="add-shader">+</button>
 	<button id="remove-shader">&times;</button>
@@ -103,7 +103,7 @@ a { color: #00f; }
 	<input type="text" id="uploaded-url">
 </div>
 
-<div id="instructions"><iframe src="instructions.html"></iframe><button class="close">&times;</button></div>
+<div id="commands"><iframe src="commands.html"></iframe><button class="close">&times;</button></div>
 </body>
 <script type="text/javascript" src="js/vendor/gif-encode/util.js"></script>
 <script type="text/javascript" src="js/vendor/gif-encode/tube.js"></script>
diff --git a/tutorial.html b/tutorial.html
index 84d4ca0..be42f74 100644
--- a/tutorial.html
+++ b/tutorial.html
@@ -18,7 +18,7 @@ Your basic variables are position (x, y), time (t), and color (r, g, b, a).
 
 Many math functions such as <i>cos</i> and <i>sqrt</i> are available, along with functions from GLSL like <i>step</i> and <i>mix</i>.  Click <b>commands</b> to see a complete list.
 
-Use the bar below to search <a href="http://dump.fm/">Dumpfm</a> and <a href="http://asdf.us/im/">Photoblaster</a> for images.
+Use the bar below to search <a href="http://dump.fm/">Dumpfm</a> and <a href="http://asdf.us/im/">Photoblaster</a> for images, or use your own.
 
 If you make a cool effect, you can render it out to a gif, or save the shader for others to use.
 </article>
-- 
cgit v1.2.3-70-g09d2