add examples from json

3 files changed, 27 insertions, 4 deletions

diff --git a/js/api/gallery.js b/js/api/gallery.js
index c83d5f6..0e6614b 100644
--- a/js/api/gallery.js
+++ b/js/api/gallery.js
@@ -39,14 +39,15 @@ shader_gallery.bind = function(){
 	})
 }
 
-function new_shader(){
+function new_shader(opt){
+	opt = opt || {}
 	shader_id_root = null
 	run_shader({
 		id: "",
 		shader_id: "",
 		image_url: $("#url").val(),
-		script: "",
-		name: ""
+		script: opt.shader || "",
+		name: opt.name || ""
 	})
 }
 function run_shader(shader_object){
diff --git a/js/api/localstorage.js b/js/api/localstorage.js
index eeae658..309d49d 100644
--- a/js/api/localstorage.js
+++ b/js/api/localstorage.js
@@ -5,7 +5,7 @@ local_shaders.init = function(){
 }
 local_shaders.bind = function(){
   local_shaders.buttons = {}
-  if ('SHADERS' in window) {
+  if ('EXAMPLE_SHADERS' in window) {
     local_shaders.bindButtons( window.SHADERS )
   }
   local_shaders.bindButtons( local_shaders.getShaders() )
diff --git a/js/help.js b/js/help.js
index 7bc3a6b..db0ac6d 100644
--- a/js/help.js
+++ b/js/help.js
@@ -16,6 +16,28 @@ help.bind = function(){
 		stop: drag_stop
 	})
 	$("#commands,#tutorial").disableSelection();
+	
+	$("#examples").change(function(){ 
+		help.load_example($(this).val())
+		$("#toggle-images").trigger("click")
+	})
+
+  if ('EXAMPLE_SHADERS' in window) {
+  	help.examples = {}
+    window.EXAMPLE_SHADERS.forEach(function(s){
+    	help.examples[ s.name ] = s.shader
+			var $option = $("<option value='" + s.name +"'>" + s.name + "</option>")
+			$("#examples").append($option)
+    })
+  }
+}
+
+help.examples = {}
+
+help.load_example = function(name){
+	var s = help.examples[name]
+	$("#shader").html(s)
+	new_shader({ name: name, shader: s })
 }
 
 function drag_start(){ dragging = true; $(this).addClass("dragging") }