Added webgl-utils and update function.
1.1 --- a/machine.html Fri Apr 01 23:28:15 2011 +0200
1.2 +++ b/machine.html Fri Apr 01 23:38:58 2011 +0200
1.3 @@ -2,9 +2,10 @@
1.4 <head>
1.5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
1.6 <title>Machine Alpha</title>
1.7 -<script src="scripts/CanvasMatrix.js" type="text/javascript"> </script>
1.8 +<script src="scripts/CanvasMatrix.js" type="text/javascript"></script>
1.9 <script src="scripts/utils3d.js" type="text/javascript"> </script>
1.10 <script src="scripts/glMatrix.js" type="text/javascript"></script>
1.11 +<script src="scripts/webgl-utils.js" type="text/javascript"></script>
1.12
1.13 <script id="fragment-shader" type="x-shader/x-fragment">
1.14 #ifdef GL_ES
2.1 --- a/scripts/machine.js Fri Apr 01 23:28:15 2011 +0200
2.2 +++ b/scripts/machine.js Fri Apr 01 23:38:58 2011 +0200
2.3 @@ -13,13 +13,20 @@
2.4 gl.enable(gl.DEPTH_TEST);
2.5 machine = new Machine(object);
2.6 render = new Render(context);
2.7 + //render.draw(machine.scene);
2.8 + requestAnimFrame(update);
2.9 + update();
2.10 +}
2.11 +
2.12 +function update()
2.13 +{
2.14 render.draw(machine.scene);
2.15 }
2.16
2.17 function resize()
2.18 {
2.19 - make_fullscreen(machine.context);
2.20 - machine.draw();
2.21 + make_fullscreen(render.context);
2.22 + update();
2.23 }
2.24
2.25 function make_fullscreen(context)
3.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
3.2 +++ b/scripts/webgl-utils.js Fri Apr 01 23:38:58 2011 +0200
3.3 @@ -0,0 +1,164 @@
3.4 +/*
3.5 + * Copyright 2010, Google Inc.
3.6 + * All rights reserved.
3.7 + *
3.8 + * Redistribution and use in source and binary forms, with or without
3.9 + * modification, are permitted provided that the following conditions are
3.10 + * met:
3.11 + *
3.12 + * * Redistributions of source code must retain the above copyright
3.13 + * notice, this list of conditions and the following disclaimer.
3.14 + * * Redistributions in binary form must reproduce the above
3.15 + * copyright notice, this list of conditions and the following disclaimer
3.16 + * in the documentation and/or other materials provided with the
3.17 + * distribution.
3.18 + * * Neither the name of Google Inc. nor the names of its
3.19 + * contributors may be used to endorse or promote products derived from
3.20 + * this software without specific prior written permission.
3.21 + *
3.22 + * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
3.23 + * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
3.24 + * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
3.25 + * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
3.26 + * OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
3.27 + * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
3.28 + * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
3.29 + * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
3.30 + * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
3.31 + * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
3.32 + * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
3.33 + */
3.34 +
3.35 +
3.36 +/**
3.37 + * @fileoverview This file contains functions every webgl program will need
3.38 + * a version of one way or another.
3.39 + *
3.40 + * Instead of setting up a context manually it is recommended to
3.41 + * use. This will check for success or failure. On failure it
3.42 + * will attempt to present an approriate message to the user.
3.43 + *
3.44 + * gl = WebGLUtils.setupWebGL(canvas);
3.45 + *
3.46 + * For animated WebGL apps use of setTimeout or setInterval are
3.47 + * discouraged. It is recommended you structure your rendering
3.48 + * loop like this.
3.49 + *
3.50 + * function render() {
3.51 + * window.requestAnimFrame(render, canvas);
3.52 + *
3.53 + * // do rendering
3.54 + * ...
3.55 + * }
3.56 + * render();
3.57 + *
3.58 + * This will call your rendering function up to the refresh rate
3.59 + * of your display but will stop rendering if your app is not
3.60 + * visible.
3.61 + */
3.62 +
3.63 +WebGLUtils = function() {
3.64 +
3.65 +/**
3.66 + * Creates the HTLM for a failure message
3.67 + * @param {string} canvasContainerId id of container of th
3.68 + * canvas.
3.69 + * @return {string} The html.
3.70 + */
3.71 +var makeFailHTML = function(msg) {
3.72 + return '' +
3.73 + '<table style="background-color: #8CE; width: 100%; height: 100%;"><tr>' +
3.74 + '<td align="center">' +
3.75 + '<div style="display: table-cell; vertical-align: middle;">' +
3.76 + '<div style="">' + msg + '</div>' +
3.77 + '</div>' +
3.78 + '</td></tr></table>';
3.79 +};
3.80 +
3.81 +/**
3.82 + * Mesasge for getting a webgl browser
3.83 + * @type {string}
3.84 + */
3.85 +var GET_A_WEBGL_BROWSER = '' +
3.86 + 'This page requires a browser that supports WebGL.<br/>' +
3.87 + '<a href="http://get.webgl.org">Click here to upgrade your browser.</a>';
3.88 +
3.89 +/**
3.90 + * Mesasge for need better hardware
3.91 + * @type {string}
3.92 + */
3.93 +var OTHER_PROBLEM = '' +
3.94 + "It doesn't appear your computer can support WebGL.<br/>" +
3.95 + '<a href="http://get.webgl.org/troubleshooting/">Click here for more information.</a>';
3.96 +
3.97 +/**
3.98 + * Creates a webgl context. If creation fails it will
3.99 + * change the contents of the container of the <canvas>
3.100 + * tag to an error message with the correct links for WebGL.
3.101 + * @param {Element} canvas. The canvas element to create a
3.102 + * context from.
3.103 + * @param {WebGLContextCreationAttirbutes} opt_attribs Any
3.104 + * creation attributes you want to pass in.
3.105 + * @return {WebGLRenderingContext} The created context.
3.106 + */
3.107 +var setupWebGL = function(canvas, opt_attribs) {
3.108 + function showLink(str) {
3.109 + var container = canvas.parentNode;
3.110 + if (container) {
3.111 + container.innerHTML = makeFailHTML(str);
3.112 + }
3.113 + };
3.114 +
3.115 + if (!window.WebGLRenderingContext) {
3.116 + showLink(GET_A_WEBGL_BROWSER);
3.117 + return null;
3.118 + }
3.119 +
3.120 + var context = create3DContext(canvas, opt_attribs);
3.121 + if (!context) {
3.122 + showLink(OTHER_PROBLEM);
3.123 + }
3.124 + return context;
3.125 +};
3.126 +
3.127 +/**
3.128 + * Creates a webgl context.
3.129 + * @param {!Canvas} canvas The canvas tag to get context
3.130 + * from. If one is not passed in one will be created.
3.131 + * @return {!WebGLContext} The created context.
3.132 + */
3.133 +var create3DContext = function(canvas, opt_attribs) {
3.134 + var names = ["webgl", "experimental-webgl", "webkit-3d", "moz-webgl"];
3.135 + var context = null;
3.136 + for (var ii = 0; ii < names.length; ++ii) {
3.137 + try {
3.138 + context = canvas.getContext(names[ii], opt_attribs);
3.139 + } catch(e) {}
3.140 + if (context) {
3.141 + break;
3.142 + }
3.143 + }
3.144 + return context;
3.145 +}
3.146 +
3.147 +return {
3.148 + create3DContext: create3DContext,
3.149 + setupWebGL: setupWebGL
3.150 +};
3.151 +}();
3.152 +
3.153 +/**
3.154 + * Provides requestAnimationFrame in a cross browser way.
3.155 + */
3.156 +window.requestAnimFrame = (function() {
3.157 + return window.requestAnimationFrame ||
3.158 + window.webkitRequestAnimationFrame ||
3.159 + window.mozRequestAnimationFrame ||
3.160 + window.oRequestAnimationFrame ||
3.161 + window.msRequestAnimationFrame ||
3.162 + function(/* function FrameRequestCallback */ callback, /* DOMElement Element */ element) {
3.163 + window.setTimeout(callback, 1000/60);
3.164 + };
3.165 +})();
3.166 +
3.167 +