source: js/viewer-f0/js/graphicsEngine.js @ 193

Last change on this file since 193 was 193, checked in by Maciej Komosinski, 10 years ago

Set svn:eol-style native for all textual files

  • Property svn:eol-style set to native
File size: 8.0 KB
Line 
1function GraphicsEngine(context) {
2    this._scene = undefined;
3    this._camera = undefined;
4    this._renderer = undefined;
5    this._canvasWidth = 400;
6    this._canvasHeight = 400;
7    this._containerContext = context;
8    this._BALL_RADIUS = 0.25;
9    this._controls = undefined;
10    this._parts = []
11    this._debug1 = 0
12    this._showAxis = false;
13}
14
15GraphicsEngine.prototype.showPartAxis = function () {
16    this._showAxis = true;
17}
18
19GraphicsEngine.prototype._createRenderer = function () {
20    this._renderer = new THREE.WebGLRenderer({antialias: true});
21    this._renderer.setClearColor(0x000000, 1);
22    this._renderer.setSize(this._canvasWidth, this._canvasHeight);
23    //this._containerContext = $("#container");
24    this._containerContext.append(this._renderer.domElement);
25}
26
27GraphicsEngine.prototype._prepareCamera = function () {
28    this._camera = new THREE.PerspectiveCamera(45, this._canvasWidth / this._canvasHeight, 1, 100);
29    this._camera.position.set(0, 0, 10);
30    this._camera.lookAt(this._scene.position);
31    this._scene.add(this._camera);
32}
33
34GraphicsEngine.prototype._addLight = function () {
35    var directionalLight = new THREE.DirectionalLight(0xffffff);
36
37    directionalLight.position = this._camera.position;
38    directionalLight.intensity = 1;
39
40    this._scene.add(directionalLight);
41}
42
43GraphicsEngine.prototype._rotateObject = function (object, part) {
44    object.rotateX(part.getXrot());
45    object.rotateY(-part.getYrot());
46    object.rotateZ(part.getZrot());
47}
48
49GraphicsEngine.prototype._addBall = function (part) {
50    var segments = 40,
51        rings = 40;
52
53    var sphereMaterial =
54        new THREE.MeshPhongMaterial(
55            {
56                color: 0xffffff
57            });
58    sphereMaterial.color.setRGB(part.getR(), part.getG(), part.getB())
59
60    var ball = new THREE.Mesh(
61        new THREE.SphereGeometry(part.getRadius()/4,
62            segments,
63            rings),
64        sphereMaterial);
65
66    ball.position.set(part.getX(), part.getY(), part.getZ());
67    this._rotateObject(ball, part);
68
69
70    this._parts.push(ball);
71    if(this._showAxis)
72        ball.add(new THREE.AxisHelper(1));
73    this._scene.add(ball);
74}
75
76GraphicsEngine.prototype._debugShow = function(object)
77{
78    var pos = object.position;
79    var scale = object.scale;
80    var rot = object.rotation
81    //console.log(pos.x, pos.y, pos.z , "|", rot.x, rot.y, rot.z,"|", scale.x, scale.y, scale.z);
82}
83
84GraphicsEngine.prototype._addEllipsoid = function (part) {
85    var geometry = new THREE.SphereGeometry(1, 20, 20);
86    var ellipsoidMaterial = new THREE.MeshPhongMaterial({color: 0xffffff});
87    ellipsoidMaterial.color.setRGB(part.getR(), part.getG(), part.getB())
88
89    var ellipsoid = new THREE.Mesh(geometry, ellipsoidMaterial);
90    ellipsoid.scale.set(part.getXshape(), part.getYshape(), part.getZshape())
91    ellipsoid.position.set(part.getX(), part.getY(), part.getZ());
92    this._rotateObject(ellipsoid, part);
93
94    this._parts.push(ellipsoid);
95    if(this._showAxis)
96        ellipsoid.add(new THREE.AxisHelper(1));
97
98    this._scene.add(ellipsoid);
99}
100
101GraphicsEngine.prototype._addCylinder = function (part) {
102    var geometry = new THREE.CylinderGeometry(1, 1, 1, 10, 10, false);
103
104    var material = new THREE.MeshLambertMaterial({color: 0xffffff});
105    material.color.setRGB(part.getR(), part.getG(), part.getB());
106
107    var cylinder = new THREE.Mesh(geometry, material);
108
109    cylinder.scale.set(part.getXshape(), part.getYshape(), part.getZshape())
110    cylinder.position.set(part.getX(), part.getY(), part.getZ());
111    this._rotateObject(cylinder, part);
112
113    this._parts.push(cylinder);
114    if(this._showAxis)
115        cylinder.add(new THREE.AxisHelper(5));
116
117    this._scene.add(cylinder);
118
119}
120
121GraphicsEngine.prototype._addCuboid = function (part) {
122    var geometry = new THREE.CubeGeometry(2, 2, 2, 10, 10, 10);
123    //TODO: poprawić getXshape na getXscale
124
125    var material = new THREE.MeshLambertMaterial({color: 0xffffff});
126    material.color.setRGB(part.getR(), part.getG(), part.getB());
127
128    var cube = new THREE.Mesh(geometry, material);
129    cube.scale.set(part.getXshape(), part.getYshape(), part.getZshape())
130    cube.position.set(part.getX(), part.getY(), part.getZ());
131    this._rotateObject(cube, part);
132
133    this._parts.push(cube);
134    if(this._showAxis)
135        cube.add(new THREE.AxisHelper(1));
136    this._scene.add(cube);
137}
138
139GraphicsEngine.prototype.addPart = function (part) {
140    console.log(part.getX(),part.getY(),part.getZ(), "|", part.getXshape(),part.getYshape(),part.getZshape(),"|",part.getXrot(),part.getYrot(),part.getZrot())
141    switch (part.getType()) {
142        case 0:
143            this._addBall(part);
144            break;
145        case 1:
146            this._addEllipsoid(part);
147            break;
148        case 2:
149            this._addCuboid(part);
150            break;
151        case 3:
152            this._addCylinder(part);
153            break;
154        default :
155            throw new Error("Unknown shape of part");
156            break;
157    }
158}
159
160GraphicsEngine.prototype._addStick = function (joint) {
161
162    var p1Pos = this._parts[joint.getP1()].position;
163    var p2Pos = this._parts[joint.getP2()].position;
164    var p1Vector = new THREE.Vector3(p1Pos.x, p1Pos.y, p1Pos.z);
165    var p2Vector = new THREE.Vector3(p2Pos.x, p2Pos.y, p2Pos.z);
166
167    var HALF_PI = Math.PI * .5;
168    var distance = p1Vector.distanceTo(p2Vector);
169    var position = p2Vector.clone().add(p1Vector).divideScalar(2);
170
171    var material = new THREE.MeshPhongMaterial({color: 0x0000ff});
172    material.color.setRGB(joint.getR(), joint.getG(), joint.getB());
173
174    var cylinder = new THREE.CylinderGeometry(0.05, 0.05, distance, 20, 20, false);
175
176    var orientation = new THREE.Matrix4();//a new orientation matrix to offset pivot
177    var offsetRotation = new THREE.Matrix4();//a matrix to fix pivot rotation
178    orientation.lookAt(p1Vector, p2Vector, new THREE.Vector3(0, 1, 0));//look at destination
179    offsetRotation.makeRotationX(HALF_PI);//rotate 90 degs on X
180    orientation.multiply(offsetRotation);//combine orientation with rotation transformations
181    cylinder.applyMatrix(orientation);
182
183    var mesh = new THREE.Mesh(cylinder, material);
184    mesh.position = position;
185
186    this._scene.add(mesh);
187}
188
189GraphicsEngine.prototype._hasTranslation = function (joint) {
190    if (joint.getXtran() != 0)
191        return true;
192    if (joint.getYtran() != 0)
193        return true;
194    if (joint.getZtran() != 0)
195        return true;
196
197    return false;
198}
199
200GraphicsEngine.prototype._translate = function (joint) {
201
202    if(this._hasTranslation(joint))
203    {
204        var p1 = joint.getP1();
205        var p2 = joint.getP2();
206
207        var copy = this._parts[p1].clone();
208
209        copy.rotateX(joint.getXrot());
210        copy.rotateY(-joint.getYrot());
211        copy.rotateZ(joint.getZrot());
212
213        copy.translateX(joint.getXtran());
214        copy.translateY(joint.getYtran());
215        copy.translateZ(joint.getZtran());
216
217        this._parts[p2].position = copy.position.clone();
218        this._parts[p2].rotation = copy.rotation.clone();
219
220        delete copy;
221    }
222}
223
224GraphicsEngine.prototype.addJoint = function (joint) {
225    switch (joint.getType()) {
226        case 0:
227            this._translate(joint);
228            this._addStick(joint);
229            break;
230        case 1:
231            this._translate(joint);
232            break;
233        default :
234            throw new Error("Unknown shape of joint");
235            break;
236    }
237}
238
239GraphicsEngine.prototype.initializeScene = function () {
240
241    this._createRenderer();
242    this._scene = new THREE.Scene();
243    this._prepareCamera();
244    this._addLight();
245    this._controls = new THREE.TrackballControls(this._camera, this._renderer.domElement)
246    this._debug();
247
248
249
250}
251
252GraphicsEngine.prototype.renderScene = function () {
253
254    var self = this;
255    requestAnimationFrame(
256        function () {
257            self.renderScene();
258        });
259    this._renderer.render(this._scene, this._camera);
260    this._controls.update();
261
262}
263
264GraphicsEngine.prototype._debug = function()
265{
266
267    this._scene.add( new THREE.AxisHelper( 20 ) );
268}
269
270GraphicsEngine.prototype.debugTest = function()
271{
272    for(var i = 0; i < this._parts.length; i++)
273        this._debugShow(this._parts[i]);
274}
275
Note: See TracBrowser for help on using the repository browser.