Commits

Matthew Turk committed 1cd2d63

Cleaning up HTML slightly and adding resizable handles to the Canvas.

Comments (0)

Files changed (1)

 
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 
-<p><script id="vshader" type="x-shader/x-vertex">// <![CDATA[
+<script id="vshader" type="x-shader/x-vertex">
   attribute vec3 vPosition;
   varying vec3 v_Color;
   void main()
     v_Color = vPosition;
     gl_Position = vec4(vPosition, 1.0);
   }
-// ]]&gt;</script><script id="fshader" type="x-shader/x-fragment">
+</script><script id="fshader" type="x-shader/x-fragment">
 #ifdef GL_ES
   precision mediump float;
 #endif
   {
     gl_FragColor = vec4(v_Color, 1.0);
   }
-</script><script type="text/javascript" src="webgl-utils.js"></script><script type="text/javascript" src="J3DI.js"></script><script type="text/javascript" src="J3DIMath.js"></script><script type="text/javascript" src="atvtdemo.js"></script><script type="text/javascript" src="atvoltex.js"></script></p>
-<div style="-moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;">
-  <canvas id="webgl_canvas" style="border: 1px solid #202020; margin-top: 5px; margin-bottom: 5px; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" width="1024" height="1024"><br />
-    Your browser does not support the HTML 5 &lt;canvas&gt; element.<br />
-  </canvas><br />
-  <button type="button" style="-moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" onclick="loadYT();">YT</button>|<button type="button" style="-moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" onclick="decreaseBrightness();">-</button><button type="button" style="-moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" onclick="increaseBrightness();">+</button>|<button type="button" style="-moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" onclick="decreaseSize();">s</button><button type="button" style="-moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" onclick="increaseSize();">S</button>|<button type="button" style="-moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" onclick="toggleLinearFiltering();">HiQ</button> <span id="hiq" style="-moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;"></span> |<button type="button" style="-moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" onclick="decreaseNumberOfSteps();">.</button><button type="button" style="-moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" onclick="increaseNumberOfSteps();">&#8230;</button> <span id="steps" style="-moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;"></span> | <span id="framerate" style="-moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;">Select a dataset to start</span><br />
-  <span style="display: inline-block; width: 33px; vertical-align: middle; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;">Red</span> <canvas style="margin-top: 10px; border: 1px solid #202020; vertical-align: middle; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" id="canvas_red" width="522" height="42"></canvas> <button style="vertical-align: bottom; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" type="button" onclick="clear2D(0);">Reset</button><br />
-  <span style="display: inline-block; width: 33px; vertical-align: middle; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;">Green</span> <canvas style="margin-top: 10px; border: 1px solid #202020; vertical-align: middle; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" id="canvas_green" width="522" height="42"></canvas> <button style="vertical-align: bottom; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" type="button" onclick="clear2D(1);">Reset</button><br />
-  <span style="display: inline-block; width: 33px; vertical-align: middle; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;">Blue</span> <canvas style="margin-top: 10px; border: 1px solid #202020; vertical-align: middle; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" id="canvas_blue" width="522" height="42"></canvas> <button style="vertical-align: bottom; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" type="button" onclick="clear2D(2);">Reset</button><br />
-  <span style="display: inline-block; width: 33px; vertical-align: middle; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;">Alpha</span> <canvas style="margin-top: 10px; border: 1px solid #202020; vertical-align: middle; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" id="canvas_alpha" width="522" height="42"></canvas> <button style="vertical-align: bottom; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -webkit-user-select: none;" type="button" onclick="clear2D(3);">Reset</button>
+</script>
+<script type="text/javascript" src="webgl-utils.js"></script>
+<script type="text/javascript" src="J3DI.js"></script>
+<script type="text/javascript" src="J3DIMath.js"></script>
+<script type="text/javascript" src="atvtdemo.js"></script>
+<script type="text/javascript" src="atvoltex.js"></script>
+<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
+<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js"></script>
+<script type="text/javascript">
+  $(document).ready(function() {
+    $("#webgl_div").resizable({autoHide: false,
+                               handles: "se",
+                               aspectRatio: true});
+    initCanvases();
+  });
+</script>
+<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css">
+<style type="text/css">
+#webgl_div {
+  width:256px;
+  height: 256px;
+  border: 1px solid #202020;
+}
+#webgl_div canvas {
+  width: 100%;
+  height: 100%;
+}
+</style>
+<div>
+  <div id="webgl_div">
+    <canvas id="webgl_canvas"><br />
+      Your browser does not support the HTML 5 &lt;canvas&gt; element.<br />
+    </canvas>
+  </div>
+  <br />
+  <button type="button"  onclick="loadYT();">YT</button>|<button type="button"  onclick="decreaseBrightness();">-</button><button type="button"  onclick="increaseBrightness();">+</button>|<button type="button"  onclick="decreaseSize();">s</button><button type="button"  onclick="increaseSize();">S</button>|<button type="button"  onclick="toggleLinearFiltering();">HiQ</button> <span id="hiq" ></span> |<button type="button"  onclick="decreaseNumberOfSteps();">.</button><button type="button"  onclick="increaseNumberOfSteps();">&#8230;</button> <span id="steps" ></span> | <span id="framerate" >Select a dataset to start</span><br />
+  <span style="display: inline-block; width: 33px; vertical-align: middle;">Red</span> <canvas style="margin-top: 10px; border: 1px solid #202020; vertical-align: middle; " id="canvas_red" width="522" height="42"></canvas> <button style="vertical-align: bottom; " type="button" onclick="clear2D(0);">Reset</button><br />
+  <span style="display: inline-block; width: 33px; vertical-align: middle; ">Green</span> <canvas style="margin-top: 10px; border: 1px solid #202020; vertical-align: middle; " id="canvas_green" width="522" height="42"></canvas> <button style="vertical-align: bottom; " type="button" onclick="clear2D(1);">Reset</button><br />
+  <span style="display: inline-block; width: 33px; vertical-align: middle; ">Blue</span> <canvas style="margin-top: 10px; border: 1px solid #202020; vertical-align: middle; " id="canvas_blue" width="522" height="42"></canvas> <button style="vertical-align: bottom; " type="button" onclick="clear2D(2);">Reset</button><br />
+  <span style="display: inline-block; width: 33px; vertical-align: middle; ">Alpha</span> <canvas style="margin-top: 10px; border: 1px solid #202020; vertical-align: middle; " id="canvas_alpha" width="522" height="42"></canvas> <button style="vertical-align: bottom; " type="button" onclick="clear2D(3);">Reset</button>
 </div>
 <p><script type="text/javascript">// <![CDATA[
-  initCanvases();
-// ]]&gt;</script></p>
 
 
 
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.