aboutsummaryrefslogtreecommitdiff
path: root/assets/canvas-runtime.js
diff options
context:
space:
mode:
Diffstat (limited to 'assets/canvas-runtime.js')
-rw-r--r--assets/canvas-runtime.js1633
1 files changed, 1633 insertions, 0 deletions
diff --git a/assets/canvas-runtime.js b/assets/canvas-runtime.js
new file mode 100644
index 00000000..f53a4ef6
--- /dev/null
+++ b/assets/canvas-runtime.js
@@ -0,0 +1,1633 @@
1/* <copyright>
2This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5</copyright> */
6
7
8
9///////////////////////////////////////////////////////////////////////
10//Loading webGL/canvas data
11function initWebGl (rootElement, directory) {
12 var cvsDataMngr, ninjaWebGlData = JSON.parse((document.querySelectorAll(['script[data-ninja-webgl]'])[0].innerHTML.replace('(', '')).replace(')', ''));
13 if (ninjaWebGlData && ninjaWebGlData.data) {
14 for (var n=0; ninjaWebGlData.data[n]; n++) {
15 ninjaWebGlData.data[n] = unescape(ninjaWebGlData.data[n]);
16 }
17 }
18 //Creating data manager
19 cvsDataMngr = new CanvasDataManager();
20 //Loading data to canvas(es)
21 cvsDataMngr.loadGLData(rootElement, ninjaWebGlData.data, directory);
22}
23
24///////////////////////////////////////////////////////////////////////
25// Class ShapeRuntime
26// Manages runtime shape display
27///////////////////////////////////////////////////////////////////////
28function CanvasDataManager()
29{
30 this.loadGLData = function(root, valueArray, assetPath )
31 {
32 if (assetPath)
33 this._assetPath = assetPath.slice();
34
35 var value = valueArray;
36 var nWorlds = value.length;
37 for (var i=0; i<nWorlds; i++)
38 {
39 var importStr = value[i];
40
41 // there should be some version information in
42 // the form of 'v0.0;' Pull that off. (the trailing ';' should
43 // be in the first 24 characters).
44 var index = importStr.indexOf( ';' );
45 if ((importStr[0] === 'v') && (index < 24))
46 {
47 // JSON format. pull off the version info
48 importStr = importStr.substr( index+1 );
49
50 var jObj = JSON.parse( importStr );
51 var id = jObj.id;
52 if (id)
53 {
54 var canvas = this.findCanvasWithID( id, root );
55 if (canvas)
56 {
57 new GLRuntime( canvas, jObj, assetPath );
58 }
59 }
60 }
61 }
62 }
63
64 this.collectGLData = function( elt, dataArray )
65 {
66 if (elt.elementModel && elt.elementModel.shapeModel && elt.elementModel.shapeModel.GLWorld)
67 {
68 var data = elt.elementModel.shapeModel.GLWorld.export( true );
69 dataArray.push( data );
70 }
71
72 if (elt.children)
73 {
74 var nKids = elt.children.length;
75 for (var i=0; i<nKids; i++)
76 {
77 var child = elt.children[i];
78 this.collectGLData( child, dataArray );
79 }
80 }
81 }
82
83 this.findCanvasWithID = function( id, elt )
84 {
85 var cid = elt.getAttribute( "data-RDGE-id" );
86 if (cid == id) return elt;
87
88 if (elt.children)
89 {
90 var nKids = elt.children.length;
91 for (var i=0; i<nKids; i++)
92 {
93 var child = elt.children[i];
94 var foundElt = this.findCanvasWithID( id, child );
95 if (foundElt) return foundElt;
96 }
97 }
98 }
99}
100
101///////////////////////////////////////////////////////////////////////
102// Class GLRuntime
103// Manages runtime fora WebGL canvas
104///////////////////////////////////////////////////////////////////////
105function GLRuntime( canvas, jObj, assetPath )
106{
107 ///////////////////////////////////////////////////////////////////////
108 // Instance variables
109 ///////////////////////////////////////////////////////////////////////
110 this._canvas = canvas;
111 this._context = null;
112 //this._importStr = importStr;
113 this._jObj = jObj;
114
115 this.renderer = null;
116 this.myScene = null;
117 this.light = null;
118 this.light2 = null;
119 this._rootNode = null;
120
121 this._firstRender = true;
122 this._initialized = false;
123
124 this._useWebGL = false;
125
126 // view parameters
127 this._fov = 45.0;
128 this._zNear = 0.1;
129 this._zFar = 100.0;
130 this._viewDist = 5.0;
131
132 this.elapsed = 0;
133
134 this._aspect = canvas.width/canvas.height;
135
136 this._geomRoot = null;
137
138 // all "live" materials
139 this._materials = [];
140
141 // provide the mapping for the asset directory
142 if (assetPath)
143 {
144 this._assetPath = assetPath.slice();
145 if (this._assetPath[this._assetPath.length-1] != '/')
146 this._assetPath += '/';
147 }
148
149 ///////////////////////////////////////////////////////////////////////
150 // accessors
151 ///////////////////////////////////////////////////////////////////////
152 this.getZNear = function() { return this._zNear; }
153 this.getZFar = function() { return this._zFar; }
154 this.getFOV = function() { return this._fov; }
155 this.getAspect = function() { return this._aspect; }
156 this.getViewDistance = function() { return this._viewDist; }
157
158 this.get2DContext = function() { return this._context; }
159
160 this.getViewportWidth = function() { return this._canvas.width; }
161 this.getViewportHeight = function() { return this._canvas.height; }
162
163 ///////////////////////////////////////////////////////////////////////
164 // accessors
165 ///////////////////////////////////////////////////////////////////////
166 this.loadScene = function()
167 {
168 var jObj = this._jObj;
169 if (!jObj.children || (jObj.children.length != 1))
170 throw new Error( "ill-formed JSON for runtime load: " + jObj );
171 var root = jObj.children[0];
172
173 // parse the data
174 if (jObj.scenedata)
175 {
176 this._useWebGL = true;
177
178 var rdgeStr = jObj.scenedata;
179 this.myScene.importJSON( rdgeStr );
180 this.importObjects( root );
181 this.linkMaterials( this._geomRoot );
182 this.initMaterials();
183 this.linkLights();
184 }
185 else
186 {
187 this._context = this._canvas.getContext( "2d" );
188 this.importObjects( root );
189 this.render();
190 }
191 }
192
193 this.init = function()
194 {
195 var ctx1 = g_Engine.ctxMan.handleToObject(this._canvas.rdgeCtxHandle),
196 ctx2 = g_Engine.getContext();
197 if (ctx1 != ctx2) console.log( "***** different contexts *****" );
198 this.renderer = ctx1.renderer;
199
200 // create a camera, set its perspective, and then point it at the origin
201 var cam = new camera();
202 this._camera = cam;
203 cam.setPerspective(this.getFOV(), this.getAspect(), this.getZNear(), this.getZFar());
204 cam.setLookAt([0, 0, this.getViewDistance()], [0, 0, 0], vec3.up());
205
206 // make this camera the active camera
207 this.renderer.cameraManager().setActiveCamera(cam);
208
209 // change clear color
210 this.renderer.setClearColor([1.0, 1.0, 1.0, 0.0]);
211
212 // create an empty scene graph
213 this.myScene = new SceneGraph();
214
215 // load the scene graph data
216 this.loadScene();
217
218 // Add the scene to the engine - necessary if you want the engine to draw for you
219 var name = "myScene" + this._canvas.getAttribute( "data-RDGE-id" );
220 g_Engine.AddScene(name, this.myScene);
221
222 this._initialized = true;
223 }
224
225 // main code for handling user interaction and updating the scene
226 this.update = function(dt)
227 {
228 if (this._initialized)
229 {
230 if (!dt) dt = 0.2;
231
232 dt = 0.01; // use our own internal throttle
233 this.elapsed += dt;
234
235 // changed the global position uniform of light 0, another way to change behavior of a light
236 rdgeGlobalParameters.u_light0Pos.set( [5*Math.cos(this.elapsed), 5*Math.sin(this.elapsed), 20]);
237
238 // orbit the light nodes around the boxes
239 if (this.light ) this.light.setPosition([1.2*Math.cos(this.elapsed*2.0), 1.2*Math.sin(this.elapsed*2.0), 1.2*Math.cos(this.elapsed*2.0)]);
240 if (this.light2) this.light2.setPosition([-1.2*Math.cos(t