diff options
| author | jules <jules@okfoc.us> | 2013-12-29 23:15:34 -0500 |
|---|---|---|
| committer | jules <jules@okfoc.us> | 2013-12-29 23:15:34 -0500 |
| commit | 9a64648b4a6ae74fdda850c667711f80e9e6ddb4 (patch) | |
| tree | 931e3afd054bea658db1ef505a32d7f43ec14140 /shader-picker.html | |
| parent | e1b9ea1a6e20a5d3a1c9bc78e459dfbfdb4b1f9e (diff) | |
hover-style image picker
Diffstat (limited to 'shader-picker.html')
| -rw-r--r-- | shader-picker.html | 22 |
1 files changed, 10 insertions, 12 deletions
diff --git a/shader-picker.html b/shader-picker.html index a6d1e12..db508aa 100644 --- a/shader-picker.html +++ b/shader-picker.html @@ -28,8 +28,9 @@ div { display: inline-block; padding: 10px;} .close,.remove { cursor: pointer; } #uploaded-url { display: none; width: 300px; } form { display: inline-block; } -#gallery-images img { max-width: 200px; height: 90px; margin: 5px; } #gallery { clear: right; width:100%;} +#gallery-images { display: block; max-height: 210px; overflow-y: auto; } +#gallery-images img, #gallery-images canvas { max-width: 200px; height: 100px; margin: 5px; cursor: pointer; } </style> </head> <body> @@ -40,7 +41,7 @@ form { display: inline-block; } <button id="gallery-search">DUMP SEARCH</button> </form> <button id="gallery-random">IM RANDOM</button> - <span id="status"></span> + <span class="status"></span> <div id="gallery-images"></div> </div> @@ -81,7 +82,7 @@ form { display: inline-block; } <button id="reset">reset</button> <button id="pause">pause</button> <button id="step-forward">>></button> - <span id="status"></span> + <span class="status"></span> <button id="save" disabled>save</button> <button id="upload" disabled>upload</button> <br> @@ -365,9 +366,7 @@ function render (){ $("#render").html("rendering") } -function status(s){ - $("#status").html(s) -} +function status(s){ $(".status").html(s) } var encoder = new GifEncoder() @@ -433,12 +432,11 @@ function upload(){ <span class="frame"></span> </script> <script type="text/javascript-shader" id="first"> -t /= 500 -if (a == 0) { r = g = b = x; t /= -3 } -r *= (Math.sin(t*x/y) + 1)/2 -g *= (Math.cos(t*y/x) + 0.4)/2 -b *= (Math.sin(t) + 1.5)/2 -a = y + +u = x + t/10 +v = y * sin(b/100) + +rgbpixel(d,u,v) </script> <script type="text/javascript-shader" id="second"> |