00001
00002
00003
00004
00005
00006
00007
00008
00009
00010
00011
00012
00013
00014
00015
00016
00017
00018
00019
00020
00021
00022
00023
00024
00025
00026
00027
00028
00029
00030
00031
00032
00060 WebGLUtils = function() {
00061
00068 var makeFailHTML = function(msg) {
00069 return '' +
00070 '<table style="background-color: #8CE; width: 100%; height: 100%;"><tr>' +
00071 '<td align="center">' +
00072 '<div style="display: table-cell; vertical-align: middle;">' +
00073 '<div style="">' + msg + '</div>' +
00074 '</div>' +
00075 '</td></tr></table>';
00076 };
00077
00082 var GET_A_WEBGL_BROWSER = '' +
00083 'This page requires a browser that supports WebGL.<br/>' +
00084 '<a href="http://get.webgl.org">Click here to upgrade your browser.</a>';
00085
00090 var OTHER_PROBLEM = '' +
00091 "It doesn't appear your computer can support WebGL.<br/>" +
00092 '<a href="http://get.webgl.org/troubleshooting/">Click here for more information.</a>';
00093
00106 var setupWebGL = function(canvas, opt_attribs, opt_onError) {
00107 function handleCreationError(msg) {
00108 var container = canvas.parentNode;
00109 if (container) {
00110 var str = window.WebGLRenderingContext ?
00111 OTHER_PROBLEM :
00112 GET_A_WEBGL_BROWSER;
00113 if (msg) {
00114 str += "<br/><br/>Status: " + msg;
00115 }
00116 container.innerHTML = makeFailHTML(str);
00117 }
00118 };
00119
00120 opt_onError = opt_onError || handleCreationError;
00121
00122 if (canvas.addEventListener) {
00123 canvas.addEventListener("webglcontextcreationerror", function(event) {
00124 opt_onError(event.statusMessage);
00125 }, false);
00126 }
00127 var context = create3DContext(canvas, opt_attribs);
00128 if (!context) {
00129 if (!window.WebGLRenderingContext) {
00130 opt_onError("");
00131 }
00132 }
00133 return context;
00134 };
00135
00142 var create3DContext = function(canvas, opt_attribs) {
00143 var names = ["webgl", "experimental-webgl", "webkit-3d", "moz-webgl"];
00144 var context = null;
00145 for (var ii = 0; ii < names.length; ++ii) {
00146 try {
00147 context = canvas.getContext(names[ii], opt_attribs);
00148 } catch(e) {}
00149 if (context) {
00150 break;
00151 }
00152 }
00153 return context;
00154 }
00155
00156 return {
00157 create3DContext: create3DContext,
00158 setupWebGL: setupWebGL
00159 };
00160 }();
00161
00165 window.requestAnimFrame = (function() {
00166 return window.requestAnimationFrame ||
00167 window.webkitRequestAnimationFrame ||
00168 window.mozRequestAnimationFrame ||
00169 window.oRequestAnimationFrame ||
00170 window.msRequestAnimationFrame ||
00171 function( callback, element) {
00172 window.setTimeout(callback, 1000/60);
00173 };
00174 })();
00175