load shaders from json

1 files changed, 35 insertions, 23 deletions

diff --git a/js/user.js b/js/user.js
index 11b46df..39beaaa 100644
--- a/js/user.js
+++ b/js/user.js
@@ -44,36 +44,53 @@ user.shaders.init = function(){
   user.shaders.bind()
 }
 user.shaders.bind = function(){
-  var shaders = user.shaders.getShaders()
   user.shaders.buttons = {}
-  for (var i = 0; i < shaders.length; i++){
-    user.shaders.bindButton(shaders[i])
+  user.shaders.bindButtons( user.shaders.getShaders() )
+  if ('SHADERS' in window) {
+    user.shaders.bindButtons( window.SHADERS )
   }
   document.getElementById("add-shader").addEventListener("click", user.shaders.save, false)
   document.getElementById("remove-shader").addEventListener("click", user.shaders.remove, false)
 }
-user.shaders.bindButton = function(name){
-  console.log("button >> " + name)
+user.shaders.bindButtons = function(shaders){
+  for (var i = 0; i < shaders.length; i++){
+    user.shaders.bindButton(shaders[i])
+  }
+}
+user.shaders.bindButton = function(data){
+  console.log("button >> " + data.name)
   var button = document.createElement("button")
-  button.innerHTML = name
-  button.addEventListener("click", user.shaders.load.bind(this, name), false)
+  button.innerHTML = data.name
+  button.addEventListener("click", user.shaders.load.bind(this, data), false)
   document.getElementById("shaders").appendChild(button)
-  user.shaders.buttons[name] = button
+  user.shaders.buttons[data.name] = button
 }
-user.shaders.load = function(name){
-  console.log(name)
-  var shader = localStorage.getItem("im.shaders." + name)
+user.shaders.load = function(data){
+  console.log(data.name)
+  var shader = data.shader
   if (shader && shader.length > 0) {
-    user.shaders.name = name
+    user.shaders.name = data.name
     $("#shader").val(shader)
+    // pause here?
     shader_build()
     $(".active").removeClass("active")
-    $(user.shaders.buttons[name]).addClass("active")
+    $(user.shaders.buttons[data.name]).addClass("active")
   }
 }
+
+user.shaders.getShaderIndex = function(){
+  return JSON.parse( localStorage.getItem("im.shaders") ) || []
+}
 user.shaders.getShader = 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.getShader(name) } })
+}
+user.shaders.setShaderIndex = function(shaders){
+  localStorage.setItem("im.shaders", JSON.stringify(shaders))
+}
 user.shaders.setShader = function(name, shader){
   if (! name.length || ! shader.length || !name.length || !shader.length) return
   localStorage.setItem("im.shaders." + name, shader)
@@ -81,12 +98,7 @@ user.shaders.setShader = function(name, shader){
 user.shaders.removeShader = function(name){
   localStorage.removeItem("im.shaders." + name)
 }
-user.shaders.getShaders = function(){
-  return JSON.parse( localStorage.getItem("im.shaders") ) || []
-}
-user.shaders.setShaders = function(shaders){
-  localStorage.setItem("im.shaders", JSON.stringify(shaders))
-}
+
 user.shaders.save = function(){
   var name = prompt("enter shader name")
   var shader = $("#shader").val()
@@ -96,9 +108,9 @@ user.shaders.save = function(){
 
   user.shaders.setShader(name, shader)
 
-  var shaders = user.shaders.getShaders()
+  var shaders = user.shaders.getShaderIndex()
   shaders.push(name)
-  user.shaders.setShaders(shaders)
+  user.shaders.setShaderIndex(shaders)
 
   user.shaders.name = name
   user.shaders.bindButton(name)
@@ -107,9 +119,9 @@ user.shaders.remove = function(){
   var name = user.shaders.name
   if (! name || ! name.length) return
 
-  var shaders = user.shaders.getShaders()
+  var shaders = user.shaders.getShaderIndex()
   if (shaders.splice( shaders.indexOf(name), 1 )) {
-    user.shaders.setShaders(shaders)
+    user.shaders.setShaderIndex(shaders)
     user.shaders.removeShader(name)
     $(user.shaders.buttons[name]).remove()
     user.shaders.name = ""