From e7b0213ebf2621b71fcaa04e7ad80614853e9551 Mon Sep 17 00:00:00 2001 From: jules Date: Sun, 26 Jan 2014 00:11:32 -0500 Subject: toggle gallery --- shader-combo.html | 80 ++++++++++++++++++++++++++++++++++++------------------- 1 file changed, 52 insertions(+), 28 deletions(-) (limited to 'shader-combo.html') diff --git a/shader-combo.html b/shader-combo.html index 3c2eac0..92cb6e1 100644 --- a/shader-combo.html +++ b/shader-combo.html @@ -7,8 +7,8 @@ #shader { width: 400px; height: 247px; font-family: fixed; } div { float: left; padding: 10px;} form { display: inline-block; } -#shader-api,#gallery { clear: right; width:100%; padding: 0; font-size: 12px; } -#shader-gallery,#gallery-images { display: block; min-height: 152px; max-height: 210px; overflow-y: auto; width: 100%; padding: 0; } +#header { clear: right; width:100%; padding: 0; font-size: 12px; } +#shader-gallery,#gallery-images { display: block; height: 152px; overflow-y: auto; width: 100%; padding: 0; } #shader-gallery img,#shader-gallery canvas,#gallery-images img, #gallery-images canvas { max-width: 200px; height: 100px; margin: 5px; cursor: pointer; clear: right; } .shader { width: 100px; } .shader span { display: block } @@ -22,43 +22,49 @@ a { color: #00f; } #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; } - +.hidden { display: none; } +.form { display: none; } +.bold { font-weight: bold; } - -

@@ -130,10 +136,28 @@ function init(){ $("#reset").click(reset) $("#pause").click(pause) + $("#toggle-shaders").click(function(){ + $("#header .form").hide() + $("#shader-api-form").show() + $(".bold").removeClass("bold") + $(this).addClass("bold") + }).trigger("click") + $("#toggle-images").click(function(){ + $("#header .form").hide() + $("#gallery-form").show() + $(".bold").removeClass("bold") + $(this).addClass("bold") + }) + $("#toggle-off").click(function(){ + $("#header .form").hide() + $(".bold").removeClass("bold") + }) + user.init() help.init() shader_gallery.init() - + gallery.init(choose) + document.getElementById('shader').addEventListener('input', shader_build); requestAnimationFrame(animate) -- cgit v1.2.3-70-g09d2