summaryrefslogtreecommitdiff
path: root/includes/js/dojox/gfx3d/tests
diff options
context:
space:
mode:
authormensonge <mensonge@b3834d28-1941-0410-a4f8-b48e95affb8f>2008-11-13 09:49:11 +0000
committermensonge <mensonge@b3834d28-1941-0410-a4f8-b48e95affb8f>2008-11-13 09:49:11 +0000
commite44a7e37b6c7b5961adaffc62b9042b8d442938e (patch)
tree95b67c356e93163467db2451f2b8cce84ed5d582 /includes/js/dojox/gfx3d/tests
parenta62b9742ee5e28bcec6872d88f50f25b820914f6 (diff)
downloadsemanticscuttle-e44a7e37b6c7b5961adaffc62b9042b8d442938e.tar.gz
semanticscuttle-e44a7e37b6c7b5961adaffc62b9042b8d442938e.tar.bz2
New feature: basic Ajax suggestion for tags and implementation of Dojo toolkit
git-svn-id: https://semanticscuttle.svn.sourceforge.net/svnroot/semanticscuttle/trunk@151 b3834d28-1941-0410-a4f8-b48e95affb8f
Diffstat (limited to 'includes/js/dojox/gfx3d/tests')
-rw-r--r--includes/js/dojox/gfx3d/tests/test_camerarotate.html93
-rw-r--r--includes/js/dojox/gfx3d/tests/test_camerarotate_shaded.html97
-rw-r--r--includes/js/dojox/gfx3d/tests/test_cube.html50
-rw-r--r--includes/js/dojox/gfx3d/tests/test_cylinder.html66
-rw-r--r--includes/js/dojox/gfx3d/tests/test_drawer.html92
-rw-r--r--includes/js/dojox/gfx3d/tests/test_edges.html73
-rw-r--r--includes/js/dojox/gfx3d/tests/test_matrix.html89
-rw-r--r--includes/js/dojox/gfx3d/tests/test_orbit.html50
-rw-r--r--includes/js/dojox/gfx3d/tests/test_overlap.html69
-rw-r--r--includes/js/dojox/gfx3d/tests/test_polygon.html44
-rw-r--r--includes/js/dojox/gfx3d/tests/test_quads.html78
-rw-r--r--includes/js/dojox/gfx3d/tests/test_rotate.html123
-rw-r--r--includes/js/dojox/gfx3d/tests/test_scene.html66
-rw-r--r--includes/js/dojox/gfx3d/tests/test_triangles.html82
-rw-r--r--includes/js/dojox/gfx3d/tests/test_vector.html59
15 files changed, 1131 insertions, 0 deletions
diff --git a/includes/js/dojox/gfx3d/tests/test_camerarotate.html b/includes/js/dojox/gfx3d/tests/test_camerarotate.html
new file mode 100644
index 0000000..dcfa1a2
--- /dev/null
+++ b/includes/js/dojox/gfx3d/tests/test_camerarotate.html
@@ -0,0 +1,93 @@
+<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" >
+<head>
+<title>Camera rotate of dojox.gfx3d.</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<style type="text/css">
+ @import "../../../dojo/resources/dojo.css";
+ @import "../../../dijit/tests/css/dijitTests.css";
+ @import "../../../dijit/themes/tundra/tundra.css";
+</style>
+<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: false"></script>
+<script type="text/javascript" src="../object.js"></script>
+<script type="text/javascript" src="../scheduler.js"></script>
+<script type="text/javascript">
+
+dojo.require("dojox.gfx3d");
+
+var angles = {x: 30, y: 30, z: 0};
+var cube = null;
+var view = null;
+
+rotate = function() {
+ var m = dojox.gfx3d.matrix;
+
+ if(dojo.byId('rx').checked){
+ angles.x += 1;
+ }
+ if(dojo.byId('ry').checked){
+ angles.y += 1;
+ }
+ if(dojo.byId('rz').checked){
+ angles.z += 1;
+ }
+ var t = m.normalize([
+ m.cameraTranslate(-300, -200, 0),
+ m.cameraRotateXg(angles.x),
+ m.cameraRotateYg(angles.y),
+ m.cameraRotateZg(angles.z)
+ ]);
+ console.debug(t);
+ view.setCameraTransform(t);
+ view.render();
+}
+
+makeObjects = function(){
+ var surface = dojox.gfx.createSurface("test", 500, 500);
+ view = surface.createViewport();
+
+ var c = {bottom: {x: 0, y: 0, z: 0}, top :{x: 100, y: 100, z: 100}};
+ var xaxis = [{x: 0, y: 0, z: 0}, {x: 200, y: 0, z: 0}];
+ var yaxis = [{x: 0, y: 0, z: 0}, {x: 0, y: 200, z: 0}];
+ var zaxis = [{x: 0, y: 0, z: 0}, {x: 0, y: 0, z: 200}];
+
+ var m = dojox.gfx3d.matrix;
+
+ view.createEdges(xaxis).setStroke({color: "red", width: 1});
+ view.createEdges(yaxis).setStroke({color: "green", width: 1});
+ view.createEdges(zaxis).setStroke({color: "blue", width: 1});
+
+ cube = view.createCube(c).setStroke({color: "lime", width: 1});
+
+ var camera = dojox.gfx3d.matrix.normalize([
+ m.cameraTranslate(-300, -200, 0),
+ m.cameraRotateXg(angles.x),
+ m.cameraRotateYg(angles.y),
+ m.cameraRotateZg(angles.z),
+ ]);
+
+ view.applyCameraTransform(camera);
+ view.render();
+ window.setInterval(rotate, 50);
+};
+
+dojo.addOnLoad(makeObjects);
+
+</script>
+</head>
+<body class="tundra">
+ <h1>Camera rotate</h1>
+ <p>The cube is in the center (0, 0, 0): The color of X, Y, Z axes are red, green, blue. The view renders all the objects
+ in each frame, the <em>conservative</em> drawer is used.</p>
+<form>
+ <input id="rx" type="checkbox" name="rotateX" checked="true" value="on"/>
+ <label for="rx"> Rotate around X-axis</label> <br/>
+ <input id="ry" type="checkbox" name="rotateY" checked="false" value="off"/>
+ <label for="ry"> Rotate around Y-axis</label> <br/>
+ <input id="rz" type="checkbox" name="rotateZ" checked="false" value="off"/>
+ <label for="rz"> Rotate around Z-axis</label> <br/>
+</form>
+
+<div id="test" style="width: 500px; height: 500px;"></div>
+<p>That's all Folks!</p>
+</body>
+</html>
diff --git a/includes/js/dojox/gfx3d/tests/test_camerarotate_shaded.html b/includes/js/dojox/gfx3d/tests/test_camerarotate_shaded.html
new file mode 100644
index 0000000..e9c0312
--- /dev/null
+++ b/includes/js/dojox/gfx3d/tests/test_camerarotate_shaded.html
@@ -0,0 +1,97 @@
+<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" >
+<head>
+ <title>Camera rotate of dojox.gfx3d.</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <style type="text/css">
+ @import "../../../dojo/resources/dojo.css";
+ @import "../../../dijit/tests/css/dijitTests.css";
+ @import "../../../dijit/themes/tundra/tundra.css";
+ </style>
+ <script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: false"></script>
+ <script type="text/javascript" src="../object.js"></script>
+ <script type="text/javascript" src="../scheduler.js"></script>
+ <script type="text/javascript">
+
+ dojo.require("dojox.gfx3d");
+
+ var angles = {x: 30, y: 30, z: 0};
+ var cube = null;
+ var view = null;
+
+ rotate = function() {
+ var m = dojox.gfx3d.matrix;
+
+ if(dojo.byId('rx').checked){
+ angles.x += 1;
+ }
+ if(dojo.byId('ry').checked){
+ angles.y += 1;
+ }
+ if(dojo.byId('rz').checked){
+ angles.z += 1;
+ }
+ var t = m.normalize([
+ m.cameraTranslate(-300, -200, 0),
+ m.cameraRotateXg(angles.x),
+ m.cameraRotateYg(angles.y),
+ m.cameraRotateZg(angles.z)
+ ]);
+ console.debug(t);
+ view.setCameraTransform(t);
+ view.render();
+ }
+
+ makeObjects = function(){
+ var surface = dojox.gfx.createSurface("test", 500, 500);
+ view = surface.createViewport();
+
+ view.setLights([{direction: {x: -10, y: -5, z: 5}, color: "white"}],
+ {color:"white", intensity: 2}, "white");
+
+ var c = {bottom: {x: 0, y: 0, z: 0}, top :{x: 100, y: 100, z: 100}};
+ var xaxis = [{x: 0, y: 0, z: 0}, {x: 200, y: 0, z: 0}];
+ var yaxis = [{x: 0, y: 0, z: 0}, {x: 0, y: 200, z: 0}];
+ var zaxis = [{x: 0, y: 0, z: 0}, {x: 0, y: 0, z: 200}];
+
+ var m = dojox.gfx3d.matrix;
+
+ view.createEdges(xaxis).setStroke({color: "red", width: 1});
+ view.createEdges(yaxis).setStroke({color: "green", width: 1});
+ view.createEdges(zaxis).setStroke({color: "blue", width: 1});
+
+ // setStroke({color: "lime", width: 1}).
+ cube = view.createCube(c).setFill({ type: "plastic", finish: "dull", color: "lime" });
+
+ var camera = dojox.gfx3d.matrix.normalize([
+ m.cameraTranslate(-300, -200, 0),
+ m.cameraRotateXg(angles.x),
+ m.cameraRotateYg(angles.y),
+ m.cameraRotateZg(angles.z),
+ ]);
+
+ view.applyCameraTransform(camera);
+ view.render();
+ window.setInterval(rotate, 50);
+ };
+
+ dojo.addOnLoad(makeObjects);
+
+ </script>
+</head>
+<body class="tundra">
+ <h1>Camera rotate</h1>
+ <p>The cube is in the center (0, 0, 0): The color of X, Y, Z axes are red, green, blue. The view renders all the objects
+ in each frame, the <em>conservative</em> drawer is used.</p>
+ <form>
+ <input id="rx" type="checkbox" name="rotateX" checked="true" value="on"/>
+ <label for="rx"> Rotate around X-axis</label> <br/>
+ <input id="ry" type="checkbox" name="rotateY" checked="false" value="off"/>
+ <label for="ry"> Rotate around Y-axis</label> <br/>
+ <input id="rz" type="checkbox" name="rotateZ" checked="false" value="off"/>
+ <label for="rz"> Rotate around Z-axis</label> <br/>
+ </form>
+
+ <div id="test" style="width: 500px; height: 500px;"></div>
+ <p>That's all Folks!</p>
+</body>
+</html>
diff --git a/includes/js/dojox/gfx3d/tests/test_cube.html b/includes/js/dojox/gfx3d/tests/test_cube.html
new file mode 100644
index 0000000..dcae739
--- /dev/null
+++ b/includes/js/dojox/gfx3d/tests/test_cube.html
@@ -0,0 +1,50 @@
+<html>
+<head>
+<title>Cube of dojox.gfx3d.</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<style type="text/css">
+ @import "../../../dojo/resources/dojo.css";
+ @import "../../../dijit/tests/css/dijitTests.css";
+</style>
+<!--
+The next line should include Microsoft's Silverligth.js, if you plan to use the silverlight backend
+<script type="text/javascript" src="Silverlight.js"></script>
+-->
+<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true"></script>
+<script type="text/javascript">
+dojo.require("dojox.gfx3d");
+dojo.require("dojox.gfx.utils");
+
+makeObjects = function(){
+ var surface = dojox.gfx.createSurface("test", 500, 500);
+ var view = surface.createViewport();
+ view.setLights([{direction: {x: -10, y: -5, z: 5}, color: "white"}],
+ {color:"white", intensity: 2}, "white");
+
+ var m = dojox.gfx3d.matrix;
+ var l = view.createCube({bottom: {x: 0, y: 0, z: 0}, top: {x: 100, y: 100, z: 100}})
+ .setFill({type: "plastic", finish: "dull", color: "lime"});
+
+ var camera = [m.cameraRotateXg(20), m.cameraRotateYg(20), m.cameraTranslate(-200, -200, 0)];
+ view.applyCameraTransform(camera);
+ view.render();
+
+ //dojo.byId("out1").value = dojo.byId("test").innerHTML;
+ //dojo.byId("out2").value = dojox.gfx.utils.toJson(surface, true);
+};
+
+dojo.addOnLoad(makeObjects);
+
+</script>
+</head>
+<body>
+<h1>Cube Test</h1>
+<div id="test" style="width: 500px; height: 500px;"></div>
+<!--
+<p><button onclick="makeObjects();">Go</button></p>
+<p><textarea id="out1" cols="40" rows="5"></textarea></p>
+<p><textarea id="out2" cols="40" rows="5"></textarea></p>
+-->
+<p>That's all Folks!</p>
+</body>
+</html>
diff --git a/includes/js/dojox/gfx3d/tests/test_cylinder.html b/includes/js/dojox/gfx3d/tests/test_cylinder.html
new file mode 100644
index 0000000..cd1d5c1
--- /dev/null
+++ b/includes/js/dojox/gfx3d/tests/test_cylinder.html
@@ -0,0 +1,66 @@
+<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" >
+<head>
+<title>Cylinder test of dojox.gfx3d.</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<style type="text/css">
+ @import "../../../dojo/resources/dojo.css";
+ @import "../../../dijit/tests/css/dijitTests.css";
+</style>
+<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true"></script>
+<script type="text/javascript" src="../lighting.js"></script>
+<script type="text/javascript" src="../gradient.js"></script>
+<script type="text/javascript" src="../object.js"></script>
+<script type="text/javascript">
+
+dojo.require("dojox.gfx3d");
+
+makeObjects = function(){
+ var surface = dojox.gfx.createSurface("test", 500, 400);
+ var view = surface.createViewport();
+ view.setLights([
+ {direction: {x: 0, y: 0, z: -10}, color: "white"},
+ {direction: {x: 10, y: 0, z: -10}, color: "#444"}
+ ], {color: "white", intensity: 2}, "white");
+
+ var m = dojox.gfx3d.matrix;
+
+ view.createCylinder({})
+ .setTransform([m.translate(150, 250, 0), m.rotateZg(60), m.rotateXg(-60)])
+ .setStroke("black")
+ .setFill({type: "plastic", finish: "glossy", color: "red"});
+
+ view.createCylinder({})
+ .setTransform([m.translate(150, 100, 0), m.rotateZg(45), m.rotateXg(-135)])
+ .setStroke("black")
+ .setFill({type: "plastic", finish: "shiny", color: "yellow"});
+
+ view.createCylinder({})
+ .setTransform([m.translate(250, 200, 0), m.rotateZg(-30), m.rotateXg(-30)])
+ .setStroke("black")
+ .setFill({type: "plastic", finish: "dull", color: "lime"});
+
+ //var camera = m.normalize([m.cameraRotateXg(15), m.cameraRotateYg(15), m.cameraTranslate(-200, -300, 0)]);
+ //var camera = m.normalize([m.cameraRotateXg(15), m.cameraRotateYg(15)]);
+ var camera = m.normalize({});
+
+ view.applyCameraTransform(camera);
+ view.render();
+};
+
+mdebug = function(matrix){
+ var m = dojox.gfx3d.matrix.normalize(matrix);
+ console.debug("xx: " + m.xx + ", xy: " + m.xy + " | xz:" + m.xz + " | dx:" + m.dx);
+ console.debug("yx: " + m.yx + ", yy: " + m.yy + " | yz:" + m.yz + " | dy:" + m.dy);
+ console.debug("zx: " + m.zx + ", zy: " + m.zy + " | zz:" + m.zz + " | dz:" + m.dz);
+};
+
+dojo.addOnLoad(makeObjects);
+
+</script>
+</head>
+<body>
+ <h1>Cylinder Test</h1>
+<div id="test" style="width: 500px; height: 400px;"></div>
+<p>That's all Folks!</p>
+</body>
+</html>
diff --git a/includes/js/dojox/gfx3d/tests/test_drawer.html b/includes/js/dojox/gfx3d/tests/test_drawer.html
new file mode 100644
index 0000000..3a9af1f
--- /dev/null
+++ b/includes/js/dojox/gfx3d/tests/test_drawer.html
@@ -0,0 +1,92 @@
+<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" >
+<head>
+<title>Pilot test of dojox.gfx3d.</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<style type="text/css">
+ @import "../../../dojo/resources/dojo.css";
+ @import "../../../dijit/tests/css/dijitTests.css";
+ @import "../../../dijit/themes/tundra/tundra.css";
+</style>
+<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true"></script>
+<script type="text/javascript">
+
+dojo.require("dojox.gfx3d");
+
+var angles = {x: 0, y: 0, z: 0};
+var view = null;
+var cube = null;
+
+function moveMe(){
+ var p = dojo.byId("action");
+ var m = dojox.gfx3d.matrix;
+ if(p.value == "Move to Back!"){
+ console.debug(p.value);
+ p.value = "Move to Front!";
+ cube.setTransform(m.translate(20, 0, -120))
+ }else{
+ p.value = "Move to Back!";
+ cube.setTransform(m.translate(50, 0, 150))
+ }
+ cube.invalidate();
+ view.render();
+};
+
+makeObjects = function(){
+ var surface = dojox.gfx.createSurface("test", 500, 500);
+ view = surface.createViewport();
+ var c = { bottom: {x: 0, y: 0, z: 0}, top :{x: 100, y: 100, z: 100} };
+ var xaxis = [{x: 0, y: 0, z: 0}, {x: 200, y: 0, z: 0}];
+ var yaxis = [{x: 0, y: 0, z: 0}, {x: 0, y: 200, z: 0}];
+ var zaxis = [{x: 0, y: 0, z: 0}, {x: 0, y: 0, z: 200}];
+
+ var m = dojox.gfx3d.matrix;
+
+ view.createEdges(xaxis).setStroke({color: "red", width: 1});
+ view.createEdges(yaxis).setStroke({color: "green", width: 1});
+ view.createEdges(zaxis).setStroke({color: "blue", width: 1});
+
+ view.createCube(c)
+ .setFill({type: "plastic", finish: dojox.gfx3d.lighting.finish.dull, color: "blue"})
+ .setStroke({color: "black", width: 1});
+
+ cube = view.createCube(c)
+ .setTransform(m.translate(50, 50, 150))
+ .setFill({type: "plastic", finish: dojox.gfx3d.lighting.finish.dull, color: "lime"})
+ .setStroke({color: "black", width: 1});
+
+ var camera = dojox.gfx3d.matrix.normalize([
+ m.cameraRotateXg(60),
+ m.cameraRotateYg(30),
+ m.cameraTranslate(-200, -300, 0)
+ ]);
+
+ view.applyCameraTransform(camera);
+ view.setLights([{direction: {x: 10, y: 7, z: 5}, color: "white"}],
+ {color:"white", intensity: 2}, "white");
+ view.render();
+
+ // add the click event handler
+ dojo.connect(dojo.byId("action"), "onclick", moveMe);
+};
+
+mdebug = function(matrix){
+ var m = dojox.gfx3d.matrix.normalize(matrix);
+ console.debug("xx: " + m.xx + ", xy: " + m.xy + " | xz:" + m.xz + " | dx:" + m.dx);
+ console.debug("yx: " + m.yx + ", yy: " + m.yy + " | yz:" + m.yz + " | dy:" + m.dy);
+ console.debug("zx: " + m.zx + ", zy: " + m.zy + " | zz:" + m.zz + " | dz:" + m.dz);
+};
+
+dojo.addOnLoad(makeObjects);
+
+</script>
+</head>
+<body class="tundra">
+ <h1>Pilot Test</h1>
+ <p> The color of X, Y, Z axes are red, green, blue. One cube is in the center (0, 0, 0), click the button to move the other one back
+ and forth, using this to test <em>dojox.gfx3d.drawer.conservative</em></p>
+ <input id="action" type="button" value="Move to Back!"/>
+
+<div id="test" style="width: 500px; height: 500px;"></div>
+<p>That's all Folks!</p>
+</body>
+</html>
diff --git a/includes/js/dojox/gfx3d/tests/test_edges.html b/includes/js/dojox/gfx3d/tests/test_edges.html
new file mode 100644
index 0000000..07b78f0
--- /dev/null
+++ b/includes/js/dojox/gfx3d/tests/test_edges.html
@@ -0,0 +1,73 @@
+<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" >
+<head>
+<title>Edges test of dojox.gfx3d.</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<style type="text/css">
+ @import "../../../dojo/resources/dojo.css";
+ @import "../../../dijit/tests/css/dijitTests.css";
+</style>
+<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true"></script>
+<script type="text/javascript">
+
+dojo.require("dojox.gfx3d");
+
+makeObjects = function(){
+ var surface = dojox.gfx.createSurface("test", 500, 500);
+ var view = surface.createViewport();
+ var lines = [
+ {x: 100, y: 10, z: 5},
+ {x: 80, y: 80, z: 55},
+ {x: 120, y: 80, z: 75},
+ {x: 250, y: 92, z: 15},
+ {x: 200, y: 25, z: 5},
+ {x: 156, y: 40, z: 45}
+ ];
+
+ var m = dojox.gfx3d.matrix;
+ var loop = view.createEdges(lines, "loop")
+ .setStroke({color: "blue", width: 1})
+ .applyTransform(dojox.gfx3d.matrix.translate({x: 0, y: 0, z: 0}));
+
+ var strip = view.createEdges(lines, "strip")
+ .setStroke({color: "red", width: 1})
+ .applyTransform(dojox.gfx3d.matrix.translate({x: 0, y: 100, z: 0}));
+
+ var normal = view.createEdges(lines)
+ .setStroke({color: "lime", width: 1})
+ .applyTransform(dojox.gfx3d.matrix.translate({x: 0, y: 200, z: 0}));
+
+ var camera = dojox.gfx3d.matrix.normalize([
+ m.cameraRotateZg(20),
+ //m.cameraRotateYg(30),
+ //m.cameraRotateXg(50),
+ m.cameraTranslate(0, 0, 0)
+ ]);
+
+ view.applyCameraTransform(camera);
+ view.render();
+};
+
+mdebug = function(matrix){
+ var m = dojox.gfx3d.matrix.normalize(matrix);
+ console.debug("xx: " + m.xx + ", xy: " + m.xy + " | xz:" + m.xz + " | dx:" + m.dx);
+ console.debug("yx: " + m.yx + ", yy: " + m.yy + " | yz:" + m.yz + " | dy:" + m.dy);
+ console.debug("zx: " + m.zx + ", zy: " + m.zy + " | zz:" + m.zz + " | dz:" + m.dz);
+};
+
+
+dojo.addOnLoad(makeObjects);
+
+</script>
+</head>
+<body>
+ <h1>Edges Test</h1>
+ <p> Test of the Edges, there are three modes</p>
+ <ul>
+ <li>none, any two vertice pair form one edge, lime</li>
+ <li>strip, vertices are connected by edges. red</li>
+ <li>loop, the same as strip, close the path, blue</li>
+ </ul>
+<div id="test" style="width: 500px; height: 500px;"></div>
+<p>That's all Folks!</p>
+</body>
+</html>
diff --git a/includes/js/dojox/gfx3d/tests/test_matrix.html b/includes/js/dojox/gfx3d/tests/test_matrix.html
new file mode 100644
index 0000000..9acf399
--- /dev/null
+++ b/includes/js/dojox/gfx3d/tests/test_matrix.html
@@ -0,0 +1,89 @@
+<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" >
+<head>
+<title>Dojo 3D Matrix</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<style type="text/css">
+ @import "../../../dojo/resources/dojo.css";
+ @import "../../../dijit/tests/css/dijitTests.css";
+</style>
+<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true"></script>
+<script type="text/javascript">
+
+dojo.require("dojox.gfx3d");
+
+mdebug = function(matrix){
+ var m = dojox.gfx3d.matrix.normalize(matrix);
+ console.debug("xx: " + m.xx + ", xy: " + m.xy + " | xz:" + m.xz + " | dx:" + m.dx);
+ console.debug("yx: " + m.yx + ", yy: " + m.yy + " | yz:" + m.yz + " | dy:" + m.dy);
+ console.debug("zx: " + m.zx + ", zy: " + m.zy + " | zz:" + m.zz + " | dz:" + m.dz);
+};
+
+pdebug = function(point){
+ console.debug("x: " + point.x + ", y: " + point.y + ", z: " + point.z);
+};
+
+dojo.addOnLoad(function(){
+ var m = dojox.gfx3d.matrix;
+ var a = new m.Matrix3D();
+ console.debug("identity");
+ mdebug(a);
+ a = m.rotateXg(30);
+ console.debug("rotateXg(30);");
+ mdebug(a);
+ a = m.rotateYg(45);
+ console.debug("rotateYg(45);");
+ mdebug(a);
+ a = m.rotateZg(90);
+ console.debug("rotateZg(90);");
+ mdebug(a);
+ a = [new m.Matrix3D(), new m.Matrix3D(), new m.Matrix3D()];
+ console.debug("identity");
+ mdebug(a);
+ a = [m.rotateXg(30), m.rotateXg(-30)];
+ console.debug("identity");
+ mdebug(a);
+ var b = m.multiplyPoint(a, 10, 10, 10);
+ pdebug(b);
+ b = m.multiplyPoint(a, 10, 5, 10);
+ pdebug(b);
+ b = m.multiplyPoint(a, 10, 15, 5);
+ pdebug(b);
+
+ a = [m.scale(1,1,2), m.rotateXg(45)];
+ console.debug("a = [m.scale(1,1,2), m.rotateXg(45)];");
+ mdebug(a);
+ a = [m.rotateXg(45), m.scale(1,1,2)];
+ console.debug("a = [m.rotateXg(45), m.scale(1,1,2)];");
+ mdebug(a);
+
+ a = [m.scale(2,1,2), m.rotateYg(45)];
+ console.debug("a = [m.scale(2,1,2), m.rotateYg(45)];");
+ mdebug(a);
+ a = [m.rotateYg(45), m.scale(2,1,2)];
+ console.debug("a = [m.rotateYg(45), m.scale(2,1,2)];");
+ mdebug(a);
+
+ a = [m.scale(1,2,1), m.invert(m.rotateZg(45))];
+ console.debug("[m.scale(1,2,1), m.invert(m.rotateZg(45))];");
+ mdebug(a);
+ a = [m.invert(m.rotateZg(45)), m.scale(1,2,1)];
+ console.debug("a = [m.invert(m.rotateZg(45)), m.scale(1,2,1)];");
+ mdebug(a);
+
+ a = [a, m.invert(a)];
+ console.debug("identity");
+ mdebug(a);
+
+ a = 5;
+ mdebug(a);
+ a = [2, m.scale(2,1,3)];
+ mdebug(a);
+});
+
+</script>
+</head>
+<body>
+ <h1>dojox.gfx3d.matrix test</h1>
+ <p>Please check the debug console for test results.</p>
+</body>
+</html>
diff --git a/includes/js/dojox/gfx3d/tests/test_orbit.html b/includes/js/dojox/gfx3d/tests/test_orbit.html
new file mode 100644
index 0000000..cadc043
--- /dev/null
+++ b/includes/js/dojox/gfx3d/tests/test_orbit.html
@@ -0,0 +1,50 @@
+<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" >
+<head>
+<title>Orbit test of dojox.gfx3d.</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<style type="text/css">
+ @import "../../../dojo/resources/dojo.css";
+ @import "../../../dijit/tests/css/dijitTests.css";
+</style>
+<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true"></script>
+<script type="text/javascript">
+
+dojo.require("dojox.gfx3d");
+
+makeObjects = function(){
+ var surface = dojox.gfx.createSurface("test", 500, 500);
+ var view = surface.createViewport();
+ var m = dojox.gfx3d.matrix;
+
+ view.createOrbit({center: {x: 0, y: 0, z: 0}, radius: 80})
+ .setStroke({color: "blue", width: 1});
+
+ var camera = dojox.gfx3d.matrix.normalize([
+ m.cameraRotateXg(60),
+ m.cameraRotateYg(30),
+ m.cameraRotateZg(0),
+ m.cameraTranslate(-300, -100, 0)
+ ]);
+
+ view.applyCameraTransform(camera);
+ view.render();
+};
+
+mdebug = function(matrix){
+ var m = dojox.gfx3d.matrix.normalize(matrix);
+ console.debug("xx: " + m.xx + ", xy: " + m.xy + " | xz:" + m.xz + " | dx:" + m.dx);
+ console.debug("yx: " + m.yx + ", yy: " + m.yy + " | yz:" + m.yz + " | dy:" + m.dy);
+ console.debug("zx: " + m.zx + ", zy: " + m.zy + " | zz:" + m.zz + " | dz:" + m.dz);
+};
+
+dojo.addOnLoad(makeObjects);
+
+</script>
+</head>
+<body>
+ <h1>Orbit Test</h1>
+ <p>Test how orbit looks like in 3D</p>
+<div id="test" style="width: 500px; height: 500px;"></div>
+<p>That's all Folks!</p>
+</body>
+</html>
diff --git a/includes/js/dojox/gfx3d/tests/test_overlap.html b/includes/js/dojox/gfx3d/tests/test_overlap.html
new file mode 100644
index 0000000..19f63d5
--- /dev/null
+++ b/includes/js/dojox/gfx3d/tests/test_overlap.html
@@ -0,0 +1,69 @@
+<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" >
+<head>
+<title>Test of dojox.gfx3d.scheduler</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<style type="text/css">
+ @import "../../../dojo/resources/dojo.css";
+ @import "../../../dijit/tests/css/dijitTests.css";
+</style>
+<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true"></script>
+<script type="text/javascript">
+
+dojo.require("dojox.gfx3d");
+var view = null;
+
+makeObjects = function(){
+ var surface = dojox.gfx.createSurface("test", 500, 500);
+ view = surface.createViewport();
+ var tas = [
+ [{x: 100, y: 0, z: 0}, {x: 100, y: 100, z: 0}, {x: 50, y: 50, z: 50}],
+ [{x: 100, y: 0, z: 0}, {x: 100, y: 100, z: 0}, {x: 0, y: 70, z: 50}]
+ ];
+ var fills = ["#0cc", "#c0c"];
+
+ var m = dojox.gfx3d.matrix;
+ for(var i = 0; i < tas.length; i++){
+ console.debug(fills[i]);
+ view.createPolygon(tas[i])
+ .setStroke({color: "blue", width: 1})
+ .setFill(fills[i]);
+ }
+ var camera = dojox.gfx3d.matrix.normalize([m.cameraTranslate(0, -300, 0)]);
+
+ view.applyCameraTransform(camera);
+
+ view.render();
+
+ // set up the click handlers.
+ dojo.connect(dojo.byId("bsp"), "onclick", renderWithBSP);
+ dojo.connect(dojo.byId("zorder"), "onclick", renderWithZOrder);
+};
+
+render = function(title, render){
+ dojo.byId("render").innerHTML = title;
+ view.setScheduler(render);
+ view.invalidate();
+ view.render();
+};
+
+renderWithBSP = function(){
+ render("BSP", dojox.gfx3d.scheduler.bsp);
+};
+
+renderWithZOrder = function(){
+ render("ZOrder", dojox.gfx3d.scheduler.zOrder);
+};
+
+dojo.addOnLoad(makeObjects);
+
+</script>
+</head>
+<body>
+<h1>Scheduler Test</h1>
+<p>There are two schedulers available in dojox.gfx3d, zOrder and BSP. zOrder is much simpler, and it performs quite well in most cases, it may fail in some rare cases, for example: two triangles share the same two vertice, and have the same Z value of the third vertex, in this case, they have the same z-order. They are rendered in arbitary order. In this case, BSP is the rescure.</p>
+<p>Current render: <strong id="render">default</strong></p>
+<p><button id="bsp">BSP</button>&nbsp;<button id="zorder">zOrder</button></p>
+<div id="test" style="width: 500px; height: 500px;"></div>
+<p>That's all Folks!</p>
+</body>
+</html>
diff --git a/includes/js/dojox/gfx3d/tests/test_polygon.html b/includes/js/dojox/gfx3d/tests/test_polygon.html
new file mode 100644
index 0000000..ab9f174
--- /dev/null
+++ b/includes/js/dojox/gfx3d/tests/test_polygon.html
@@ -0,0 +1,44 @@
+<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" >
+<head>
+<title>Polygon test of dojox.gfx3d.</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<style type="text/css">
+ @import "../../../dojo/resources/dojo.css";
+ @import "../../../dijit/tests/css/dijitTests.css";
+</style>
+<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true"></script>
+<script type="text/javascript">
+
+dojo.require("dojox.gfx3d");
+
+makeObjects = function(){
+ var surface = dojox.gfx.createSurface("test", 500, 500);
+ var view = surface.createViewport();
+ var poly = [{x: 0, y: 0, z: 0}, {x: 0, y: 100, z: 0}, {x: 100, y: 100, z: 0}, {x: 100, y: 0, z: 0}];
+
+ var m = dojox.gfx3d.matrix;
+ t = view.createPolygon(poly)
+ .setStroke({color: "blue", width: 1})
+ .setFill("#cc0");
+
+ var camera = dojox.gfx3d.matrix.normalize([
+ m.cameraRotateXg(30),
+ m.cameraRotateYg(30),
+ //m.cameraRotateZg(15),
+ m.cameraTranslate(-0, 0, 0)
+ ]);
+
+ view.applyCameraTransform(camera);
+ view.render();
+};
+
+dojo.addOnLoad(makeObjects);
+
+</script>
+</head>
+<body>
+<h1>Polygon Test</h1>
+<div id="test" style="width: 500px; height: 500px;"></div>
+<p>That's all Folks!</p>
+</body>
+</html>
diff --git a/includes/js/dojox/gfx3d/tests/test_quads.html b/includes/js/dojox/gfx3d/tests/test_quads.html
new file mode 100644
index 0000000..aff3b3b
--- /dev/null
+++ b/includes/js/dojox/gfx3d/tests/test_quads.html
@@ -0,0 +1,78 @@
+<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" >
+<head>
+<title>Quads test of dojox.gfx3d.</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<style type="text/css">
+ @import "../../../dojo/resources/dojo.css";
+ @import "../../../dijit/tests/css/dijitTests.css";
+</style>
+<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true"></script>
+<script type="text/javascript">
+
+dojo.require("dojox.gfx3d");
+
+makeObjects = function(){
+ var surface = dojox.gfx.createSurface("test", 500, 500);
+ var view = surface.createViewport();
+ var strip = [
+ {x: 50, y: 0, z: 0},
+ {x: 70, y: 0, z: 60},
+ {x: 0, y: 70, z: 60},
+ {x: 0, y: 50, z: 0},
+ {x: -50, y: 0, z: 0},
+ {x: -70, y: 0, z: 60},
+ {x: 0, y: -70, z: 60},
+ {x: 0, y: -50, z: 0}
+ ];
+
+ var normal = [
+ {x: 50, y: 0, z: 0},
+ {x: 70, y: 0, z: 60},
+ {x: 0, y: 70, z: 60},
+ {x: 0, y: 50, z: 0},
+ {x: 0, y: 70, z: 60},
+ {x: 0, y: 50, z: 0},
+ {x: -50, y: 0, z: 0},
+ {x: -70, y: 0, z: 60}
+ ];
+
+ var m = dojox.gfx3d.matrix;
+ view.createQuads(normal)
+ .setStroke({color: "blue", width: 1})
+ .setFill("#f00")
+ .applyTransform(dojox.gfx3d.matrix.translate({x: 0, y: 500, z: 10}));
+
+ view.createQuads(strip, "strip")
+ .setStroke({color: "red", width: 1})
+ .setFill("#0f0")
+ .applyTransform(dojox.gfx3d.matrix.translate({x: 0, y: 200, z: 10}));
+
+ var camera = dojox.gfx3d.matrix.normalize([
+ m.cameraRotateXg(30),
+ m.cameraRotateYg(30),
+ m.cameraRotateXg(50),
+ m.cameraTranslate(-100, -100, 0)
+ ]);
+
+ view.applyCameraTransform(camera);
+ view.render();
+};
+
+mdebug = function(matrix){
+ var m = dojox.gfx3d.matrix.normalize(matrix);
+ console.debug("xx: " + m.xx + ", xy: " + m.xy + " | xz:" + m.xz + " | dx:" + m.dx);
+ console.debug("yx: " + m.yx + ", yy: " + m.yy + " | yz:" + m.yz + " | dy:" + m.dy);
+ console.debug("zx: " + m.zx + ", zy: " + m.zy + " | zz:" + m.zz + " | dz:" + m.dz);
+};
+
+
+dojo.addOnLoad(makeObjects);
+
+</script>
+</head>
+<body>
+<h1>Quads Test</h1>
+<div id="test" style="width: 500px; height: 500px;"></div>
+<p>That's all Folks!</p>
+</body>
+</html>
diff --git a/includes/js/dojox/gfx3d/tests/test_rotate.html b/includes/js/dojox/gfx3d/tests/test_rotate.html
new file mode 100644
index 0000000..53c212f
--- /dev/null
+++ b/includes/js/dojox/gfx3d/tests/test_rotate.html
@@ -0,0 +1,123 @@
+<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" >
+<head>
+<title>Rotate test of dojox.gfx3d.</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<style type="text/css">
+ @import "../../../dojo/resources/dojo.css";
+ @import "../../../dijit/tests/css/dijitTests.css";
+ @import "../../../dijit/themes/tundra/tundra.css";
+</style>
+<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true"></script>
+<script type="text/javascript">
+
+dojo.require("dojox.gfx3d");
+
+var angles = {x: 0, y: 0, z: 0};
+var cube = null;
+var view = null;
+
+rotate = function(){
+ var m = dojox.gfx3d.matrix;
+
+ if(dojo.byId('rx').checked){
+ angles.x += 10;
+ }
+ if(dojo.byId('ry').checked){
+ angles.y += 10;
+ }
+ if(dojo.byId('rz').checked){
+ angles.z += 10;
+ }
+ var t = m.normalize([
+ m.cameraRotateXg(angles.x),
+ m.cameraRotateYg(angles.y),
+ m.cameraRotateZg(angles.z),
+ ]);
+ cube.setTransform(t);
+ cube.invalidate();
+ view.render();
+}
+
+makeObjects = function(){
+ var surface = dojox.gfx.createSurface("test", 500, 500);
+ view = surface.createViewport();
+ var c = {bottom: {x: 0, y: 0, z: 0}, top: {x: 100, y: 100, z: 100}};
+ var xaxis = [
+ {x: 0, y: 0, z: 0},
+ {x: 200, y: 0, z: 0}
+ ];
+
+ var yaxis = [
+ {x: 0, y: 0, z: 0},
+ {x: 0, y: 200, z: 0}
+ ];
+
+ var zaxis = [
+ {x: 0, y: 0, z: 0},
+ {x: 0, y: 0, z: 200}
+ ];
+
+ var m = dojox.gfx3d.matrix;
+
+ view.createEdges(xaxis).setStroke({color: "red", width: 1});
+ view.createEdges(yaxis).setStroke({color: "green", width: 1});
+ view.createEdges(zaxis).setStroke({color: "blue", width: 1});
+
+ cube = view.createCube(c).setStroke({color: "lime", width: 1});
+
+ var camera = dojox.gfx3d.matrix.normalize([
+ m.cameraRotateXg(20),
+ m.cameraRotateYg(30),
+ m.cameraTranslate(-100, -100, 0)
+ ]);
+
+ view.applyCameraTransform(camera);
+ view.render();
+ window.setInterval(rotate, 200);
+
+ // add the click event handler
+ dojo.connect(dojo.byId("conservative"), "onclick", drawWithConservative);
+ dojo.connect(dojo.byId("chart"), "onclick", drawWithChart);
+};
+
+draw = function(title, drawer){
+ dojo.byId("drawer").innerHTML = title;
+ view.setDrawer(drawer);
+};
+
+drawWithConservative = function(){
+ draw("Conservative", dojox.gfx3d.drawer.conservative);
+};
+
+drawWithChart = function(){
+ draw("Chart", dojox.gfx3d.drawer.chart);
+};
+
+dojo.addOnLoad(makeObjects);
+
+</script>
+</head>
+<body class="tundra">
+ <h1>Pilot Test</h1>
+ <p>There are two drawers(well, the name is quite misleading, it means draw-er) in dojox.gfx3d, conservative and chart:</p>
+ <ul>
+ <li><em>conservative</em> drawer is a pessimist, it assumes that the movement, transformation of objects would take a big fat impact to the viewport, so it not only render the modified objects, but also reorder all the underlying 2D shapes and redraw them.</li>
+ <li> <em>chart</em> drawer is an optimist, it assumes the change of the objects does not take effect on the z-order, this is most likely true in chart application. It only render and then draw the modified objects.</li>
+ </ul>
+ <p>The cube is in the center (0, 0, 0): The color of X, Y, Z axes are red, green, blue as the reference. The cube would rotate around X, Y, Z or their combination, it is up to you.</p>
+ <p>Current Drawer: <strong id="drawer">Conservative</strong></p>
+<form>
+ <input id="conservative" type="button" value="Draw with conservative"/>
+ <input id="chart" type="button" value="Draw with chart"/><br />
+ <input id="rx" type="checkbox" name="rotateX" checked="true" value="on"/>
+ <label for="rx"> Rotate around X-axis</label> <br/>
+ <input id="ry" type="checkbox" name="rotateY" checked="false" value="off"/>
+ <label for="ry"> Rotate around Y-axis</label> <br/>
+ <input id="rz" type="checkbox" name="rotateZ" checked="false" value="off"/>
+ <label for="rz"> Rotate around Z-axis</label> <br/>
+</form>
+
+<div id="test" style="width: 500px; height: 500px;"></div>
+<p>That's all Folks!</p>
+</body>
+</html>
diff --git a/includes/js/dojox/gfx3d/tests/test_scene.html b/includes/js/dojox/gfx3d/tests/test_scene.html
new file mode 100644
index 0000000..231b289
--- /dev/null
+++ b/includes/js/dojox/gfx3d/tests/test_scene.html
@@ -0,0 +1,66 @@
+<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" >
+<head>
+<title>Scene test of dojox.gfx3d.</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<style type="text/css">
+ @import "../../../dojo/resources/dojo.css";
+ @import "../../../dijit/tests/css/dijitTests.css";
+</style>
+<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true"></script>
+<script type="text/javascript">
+
+dojo.require("dojox.gfx3d");
+
+var view = null;
+
+makeObjects = function(){
+ var surface = dojox.gfx.createSurface("test", 500, 500);
+ view = surface.createViewport();
+ var c = {bottom: {x: 0, y: 0, z: 0}, top: {x: 100, y: 100, z: 100}};
+ var m = dojox.gfx3d.matrix;
+
+ var sc1 = view.createScene();
+ sc1.createCube(c).setStroke({color: "blue", width: 1});
+
+ var sc2 = view.createScene();
+ sc2.createCube(c).setStroke({color: "red", width: 1}).setFill("lime");
+
+ var poly = [{x: 0, y: 0, z: 0}, {x: 0, y: 100, z: 0}, {x: 100, y: 100, z: 0}, {x: 100, y: 0, z: 0}];
+ sc2.createPolygon(poly)
+ .setStroke({color: "blue", width: 1})
+ .setTransform(dojox.gfx3d.matrix.translate(50, 20, 30))
+ .setFill("yellow");
+
+ sc2.setTransform(dojox.gfx3d.matrix.translate(100, 200, 30))
+
+ var camera = dojox.gfx3d.matrix.normalize([
+ m.cameraRotateXg(30),
+ m.cameraRotateYg(60),
+ m.cameraTranslate(0, 0, 0)
+ ]);
+
+ view.applyCameraTransform(camera);
+ view.render();
+
+ // set up the click handlers.
+ dojo.connect(dojo.byId("rotate"), "onclick", rotate);
+};
+
+rotate = function() {
+ view.applyCameraTransform(dojox.gfx3d.matrix.rotateXg(10));
+ view.invalidate();
+ view.render();
+};
+
+dojo.addOnLoad(makeObjects);
+
+</script>
+</head>
+<body>
+<h1>Scene Test</h1>
+<p>Test the setTransform of the Scene. the lime cube and yellow polygon are grouped in one Scene, and they are moved in one shot.</p>
+<p>Test Viewport.invalidate with Scene. <input id="rotate" type="button" value="Rotate around Z-Axis"/></p>
+<div id="test" style="width: 500px; height: 500px;"></div>
+<p>That's all Folks!</p>
+</body>
+</html>
diff --git a/includes/js/dojox/gfx3d/tests/test_triangles.html b/includes/js/dojox/gfx3d/tests/test_triangles.html
new file mode 100644
index 0000000..cc4e65b
--- /dev/null
+++ b/includes/js/dojox/gfx3d/tests/test_triangles.html
@@ -0,0 +1,82 @@
+<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" >
+<head>
+<title>Triangles test of dojox.gfx3d.</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<style type="text/css">
+ @import "../../../dojo/resources/dojo.css";
+ @import "../../../dijit/tests/css/dijitTests.css";
+</style>
+<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true"></script>
+<script type="text/javascript">
+
+dojo.require("dojox.gfx3d");
+
+makeObjects = function(){
+ var surface = dojox.gfx.createSurface("test", 500, 500);
+ var view = surface.createViewport();
+ var points = [
+ {x: 0, y: 0, z: 150},
+ {x: 50, y: 0, z: 0},
+ {x: 0, y: 50, z: 0},
+ {x: 0, y: 0, z: 150},
+ {x: 50, y: 0, z: 0},
+ {x: 0, y: -50, z: 0}
+ ];
+ var fan = [
+ {x: 0, y: 0, z: 150},
+ {x: 50, y: 0, z: 0},
+ {x: 0, y: 50, z: 0},
+ {x: -50, y: 0, z: 0},
+ {x: 0, y: -50, z: 0}
+ ];
+ var strip = [
+ {x: 0, y: -50, z: 0},
+ {x: 0, y: 0, z: 150},
+ {x: 50, y: 0, z: 0},
+ {x: 0, y: 50, z: 0}
+ ];
+
+ var m = dojox.gfx3d.matrix;
+ var normal = view.createTriangles(points)
+ .setStroke({color: "blue", width: 1})
+ .setFill("#ccc")
+ .applyTransform(dojox.gfx3d.matrix.translate({x: 0, y: 0, z: 10}));
+
+ view.createTriangles(strip, "strip")
+ .setStroke({color: "red", width: 1})
+ .setFill("#ccc")
+ .applyTransform(dojox.gfx3d.matrix.translate({x: 150, y: 0, z: 10}));
+
+ view.createTriangles(fan, "fan")
+ .setStroke({color: "lime", width: 1})
+ .setFill("#ccc")
+ .applyTransform(dojox.gfx3d.matrix.translate({x: 300, y: 0, z: 10}));
+
+ var camera = dojox.gfx3d.matrix.normalize([
+ m.cameraRotateXg(-30),
+ m.cameraRotateYg(-10),
+ m.cameraTranslate(-50, -100, 0)
+ ]);
+
+ view.applyCameraTransform(camera);
+ view.render();
+};
+
+mdebug = function(matrix){
+ var m = dojox.gfx3d.matrix.normalize(matrix);
+ console.debug("xx: " + m.xx + ", xy: " + m.xy + " | xz:" + m.xz + " | dx:" + m.dx);
+ console.debug("yx: " + m.yx + ", yy: " + m.yy + " | yz:" + m.yz + " | dy:" + m.dy);
+ console.debug("zx: " + m.zx + ", zy: " + m.zy + " | zz:" + m.zz + " | dz:" + m.dz);
+};
+
+
+dojo.addOnLoad(makeObjects);
+
+</script>
+</head>
+<body>
+<h1>Path3d Test</h1>
+<div id="test" style="width: 500px; height: 500px;"></div>
+<p>That's all Folks!</p>
+</body>
+</html>
diff --git a/includes/js/dojox/gfx3d/tests/test_vector.html b/includes/js/dojox/gfx3d/tests/test_vector.html
new file mode 100644
index 0000000..371d57e
--- /dev/null
+++ b/includes/js/dojox/gfx3d/tests/test_vector.html
@@ -0,0 +1,59 @@
+<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" >
+<head>
+<title>Dojo 3D Vector</title>
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+<style type="text/css">
+ @import "../../../dojo/resources/dojo.css";
+ @import "../../../dijit/tests/css/dijitTests.css";
+</style>
+<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true"></script>
+<script type="text/javascript">
+
+dojo.require("dojox.gfx3d.vector");
+
+pdebug = function(point){
+ console.debug("x: " + point.x + ", y: " + point.y + ", z: " + point.z);
+};
+
+dojo.addOnLoad(function(){
+ var m = dojox.gfx3d.vector;
+ console.debug("test crossProduct...");
+ c = m.crossProduct(1, 2, 3, 4, 5, 6);
+ pdebug(c);
+ a = {x: 1, y: 2, z: 3};
+ b = {x: 4, y: 5, z: 6};
+ c = m.crossProduct(a, b);
+ pdebug(c);
+
+ console.debug("test dotProduct...");
+ c = m.dotProduct(1, 2, 3, 4, 5, 6);
+ console.debug(c);
+ a = {x: 1, y: 2, z: 3};
+ b = {x: 4, y: 5, z: 6};
+ c = m.dotProduct(a, b);
+ console.debug(c);
+
+ console.debug("test sum/substract...");
+ a = {x: 10, y: 5, z: 8};
+ b = {x: 1, y: 15, z: 2};
+ console.debug(m.sum(a, b));
+ console.debug(m.substract(a, b));
+
+ console.debug("test normalize...");
+ c = {x: 0, y: 17, z: -2};
+ d = m.normalize(a, b, c);
+ e = m.normalize([a, b, c]);
+ console.debug(d);
+ console.debug( "expecting 0:", m.dotProduct(d, m.substract(b, a)));
+ console.debug(e);
+ console.debug( "expecting 0:", m.dotProduct(e, m.substract(b, a)));
+
+});
+
+</script>
+</head>
+<body>
+ <h1>dojox.gfx3d.vector test</h1>
+ <p>Please check the debug console for test results.</p>
+</body>
+</html>