diff options
Diffstat (limited to 'shader-picker.html')
| -rw-r--r-- | shader-picker.html | 39 |
1 files changed, 16 insertions, 23 deletions
diff --git a/shader-picker.html b/shader-picker.html index d0d2625..87aea23 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 → <input type="text" id="username" value=""> <br> <br> - <button id="help">help</button> + <button id="show-commands">help</button> <button id="add-shader">+</button> <button id="remove-shader">×</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">×</button></div> +<div id="commands"><iframe src="commands.html"></iframe><button class="close">×</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> @@ -127,8 +127,16 @@ a { color: #00f; } <script type="text/javascript" src="js/user.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/save.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/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") @@ -154,19 +162,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,13 +180,7 @@ 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"> -<button class="remove">x</button> -<span class="frame"></span> -</script> </html> |