1 files changed, 7 insertions, 5 deletions
diff --git a/shader-gif.html b/shader-gif.html
index d830af1..49e4ac0 100644
--- a/shader-gif.html
+++ b/shader-gif.html
@@ -6,6 +6,8 @@
 #url { width: 100px; }
 #width,#height,#frames,#delay {width: 30px; }
 #shader { width: 400px; height: 247px; font-family: fixed; }
+#frames { width: 400px; height: 100px; overflow-x: scroll; }
+#controls { width: 450px; }
 div { float: left; padding: 10px;}
 </style>
 </head>
@@ -24,11 +26,10 @@ delay <input type="text" id="delay" value="60">
 <button id="dither-demo">dither</button>
 <br>
 <br>
-<textarea id="shader">
-</textarea>
-</div>
-<div id="workspace">
+<textarea id="shader"></textarea>
+<div id="frames"></div>
 </div>
+<div id="workspace"></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>
@@ -136,7 +137,8 @@ function shade(frame, t){
 
 frames = []
 function add_frame(){
-  frames.push(cc.clone())
+  var cel = cc.clone().appendTo("#frames")
+  frames.push(cel)
 }
 function remove_frame(){
 }