/
material_instances.html
107 lines (91 loc) · 3.82 KB
/
material_instances.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
<!DOCTYPE html>
<html>
<head>
<title>
CubicVR.js: Basic Primitives /w Scene, MouseViewController and Advanced Materials
</title>
<script src="../../CubicVR.js" type="text/javascript">
</script>
<script type='text/javascript'>
function webGLStart(gl,canvas) {
// New scene with our canvas dimensions and default camera with FOV 80
var scene = new CubicVR.Scene(canvas.width, canvas.height, 80);
var light = new CubicVR.Light({
type: "point",
method: "dynamic",
diffuse:[1,1,1],
specular:[1,1,1],
position:[0,5,-2],
distance:20
});
scene.bind(light);
var boxMesh = new CubicVR.Mesh({
primitive: {
type: "box",
size: 1.0,
material: {
name: "boxMaterial",
specular:[1,1,1],
shininess: 0.9,
env_amount: 1.0,
textures: {
color: "../images/2576-diffuse.jpg",
normal: "../images/2576-normal.jpg",
bump: "../images/2576-bump.jpg",
envsphere: "../images/fract_reflections.jpg"
}
},
uvmapper: {
projectionMode: "cubic",
scale: [0.5, 0.5, 0.5]
}
},
compile:true
});
// Add SceneObjects
var sceneObjs = [
new CubicVR.SceneObject({mesh:boxMesh, position:[-1.5,0,-1]}),
new CubicVR.SceneObject({mesh:boxMesh, position:[0,0,-1]}),
new CubicVR.SceneObject({mesh:boxMesh, position:[1.5,0,-1]}),
new CubicVR.SceneObject({mesh:boxMesh, position:[-1.5,0,1]}),
new CubicVR.SceneObject({mesh:boxMesh, position:[0,0,1]}),
new CubicVR.SceneObject({mesh:boxMesh, position:[1.5,0,1]})
];
/* // Optionally retrieve array and use index
sceneObjs[0].getInstanceMaterials()[0].color = [1,0,0];
sceneObjs[1].getInstanceMaterials()[0].color = [0,1,0];
sceneObjs[2].getInstanceMaterials()[0].color = [0,0,1];
sceneObjs[3].getInstanceMaterials()[0].color = [1,1,0];
sceneObjs[4].getInstanceMaterials()[0].color = [1,0,1];
sceneObjs[5].getInstanceMaterials()[0].color = [0,1,1];
*/
sceneObjs[0].getInstanceMaterial("boxMaterial").color = [1,0,0];
sceneObjs[1].getInstanceMaterial("boxMaterial").color = [0,1,0];
sceneObjs[2].getInstanceMaterial("boxMaterial").color = [0,0,1];
sceneObjs[3].getInstanceMaterial("boxMaterial").color = [1,1,0];
sceneObjs[4].getInstanceMaterial("boxMaterial").color = [1,0,1];
sceneObjs[5].getInstanceMaterial("boxMaterial").color = [0,1,1];
for (var i = 0; i < sceneObjs.length; i++) {
scene.bind(sceneObjs[i]);
}
// set initial camera position and target
scene.camera.position = [0, 2, 2];
scene.camera.target = [0, 0, 0];
// initialize a mouse view controller
mvc = new CubicVR.MouseViewController(canvas, scene.camera);
// Add our scene to the window resize list
CubicVR.addResizeable(scene);
// Start our main drawing loop, it provides a timer and the gl context as parameters
CubicVR.MainLoop(function(timer, gl) {
var lus = timer.getLastUpdateSeconds();
for (var i = 0; i < scene.sceneObjects.length; i++) {
scene.sceneObjects[i].rotation[0] += lus*2.0+0.1*(i+1);
scene.sceneObjects[i].rotation[2] += lus*2.5+0.2*(i+1);
}
scene.render();
});
}
</script>
</head>
<body onLoad="CubicVR.start('auto',webGLStart);"></body>
</html>