Mercurial > hg-public > scubatools / file comparison
comparison: stlviewer.js
stlviewer.js
- changeset 13
- 39fb313ba27c
- parent 12
- b3cf0176512e
- child 17
- dee15870206a
equal
deleted
inserted
replaced
| 12:b3cf0176512e | 13:39fb313ba27c |
|---|---|
| 11 window.setTimeout(update_scene,500); | 11 window.setTimeout(update_scene,500); |
| 12 } | 12 } |
| 13 }); | 13 }); |
| 14 $( "#sortable2" ).sortable({ | 14 $( "#sortable2" ).sortable({ |
| 15 placeholder: "ui-state-highlight", | 15 placeholder: "ui-state-highlight", |
| 16 forcePlaceholderSize: true, | |
| 17 connectWith: '#sortable1', | |
| 16 start: clear_scene, | 18 start: clear_scene, |
| 17 stop: function() { | 19 stop: function() { |
| 18 for (i =0; i<10; i++) clear_scene(); | 20 for (i =0; i<10; i++) clear_scene(); |
| 19 window.setTimeout(update_scene,500) | 21 window.setTimeout(update_scene,500); |
| 20 } | 22 } |
| 21 }); | 23 }); |
| 22 $( "#sortable2" ).disableSelection(); | 24 c = $("<li key='10'>").html("Steel, 10ℓ"); |
| 25 $( "#sortable2" ) | |
| 26 .disableSelection() | |
| 27 .append(c.clone()) | |
| 28 .append(c.clone()); | |
| 29 | |
| 30 $("#clearselected").click(function(){ | |
| 31 $( "#sortable2 li" ).remove(); | |
| 32 for (i =0; i<10; i++) clear_scene(); | |
| 33 }); | |
| 34 update_scene(); | |
| 23 } ); | 35 } ); |
| 24 | 36 |
| 25 function clear_scene() { | 37 function clear_scene() { |
| 26 scene.children.forEach(function(v){ | 38 scene.children.forEach(function(v){ |
| 27 if(v.stlfile === true) { | 39 if(v.stlfile === true) { |
| 75 | 87 |
| 76 function loadSTL(filename, material, position, rotation, scale) { | 88 function loadSTL(filename, material, position, rotation, scale) { |
| 77 //console.log(filename, position); | 89 //console.log(filename, position); |
| 78 var loader = new THREE.STLLoader(); | 90 var loader = new THREE.STLLoader(); |
| 79 loader.load( filename, function ( geometry ) { | 91 loader.load( filename, function ( geometry ) { |
| 80 /*if (!material) | 92 if (material == 'm_spacer') material = m_spacer; |
| 81 var material = new THREE.MeshPhongMaterial( { | |
| 82 color: 0xff5533, specular: 0x111111, shininess: 200 } ); | |
| 83 else {*/ | |
| 84 if (material == 'm_spacer') material = m_spacer; | |
| 85 else if (material == 'm_cylinder') material = m_cylinder; | 93 else if (material == 'm_cylinder') material = m_cylinder; |
| 86 //} | 94 |
| 87 | |
| 88 var mesh = new THREE.Mesh( geometry, material ); | 95 var mesh = new THREE.Mesh( geometry, material ); |
| 89 //assignUVs(mesh.geometry); | 96 |
| 90 mesh["stlfile"] = true; | 97 mesh["stlfile"] = true; |
| 91 if (!position) mesh.position.set( 0, -0.25, 0 ); else | 98 if (!position) mesh.position.set( 0, -0.25, 0 ); else |
| 92 mesh.position.set( position[0], position[1], position[2] ); | 99 mesh.position.set( position[0], position[1], position[2] ); |
| 93 if (!rotation) mesh.rotation.set( 0, 0, 0 ); else | 100 if (!rotation) mesh.rotation.set( 0, 0, 0 ); else |
| 94 mesh.rotation.set( rotation[0], rotation[1], rotation[2] ); | 101 mesh.rotation.set( rotation[0], rotation[1], rotation[2] ); |
| 103 } ); | 110 } ); |
| 104 | 111 |
| 105 } | 112 } |
| 106 | 113 |
| 107 function init() { | 114 function init() { |
| 108 container = document.createElement( 'div' ); | 115 container = document.getElementById( 'rendercontainer' ); |
| 109 document.body.appendChild( container ); | 116 //document.body.appendChild( container ); |
| 110 | 117 |
| 111 camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.1, 20 ); | 118 camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.1, 20 ); |
| 112 camera.position.set( 0.5, 0.35, 2 ); | 119 camera.position.set( 0.5, 0.35, 2 ); |
| 113 | 120 |
| 114 cameraTarget = new THREE.Vector3( 0, -0.25, 0 ); | 121 cameraTarget = new THREE.Vector3( 0, -0.25, 0 ); |
| 115 | 122 |
| 116 scene = new THREE.Scene(); | 123 scene = new THREE.Scene(); |
| 117 scene.fog = new THREE.Fog( 0x72645b, 2, 15 ); | 124 scene.fog = new THREE.Fog( 0x72645b, 2, 15 ); |
| 118 | 125 |
| 119 var controls = new THREE.OrbitControls(camera); | 126 controls = new THREE.OrbitControls(camera); |
| 120 | 127 |
| 121 // Ground | 128 // Ground |
| 122 | 129 |
| 123 var plane = new THREE.Mesh( | 130 var plane = new THREE.Mesh( |
| 124 new THREE.PlaneBufferGeometry( 40, 40 ), | 131 new THREE.PlaneBufferGeometry( 40, 40 ), |
| 203 camera.position.x = Math.cos( timer ) * 3; | 210 camera.position.x = Math.cos( timer ) * 3; |
| 204 camera.position.z = Math.sin( timer ) * 3; | 211 camera.position.z = Math.sin( timer ) * 3; |
| 205 camera.lookAt( cameraTarget ); | 212 camera.lookAt( cameraTarget ); |
| 206 renderer.render( scene, camera ); | 213 renderer.render( scene, camera ); |
| 207 } | 214 } |
| 208 | |
| 209 function assignUVs(geometry) { | |
| 210 | |
| 211 geometry.faceVertexUvs[0] = []; | |
| 212 | |
| 213 geometry.faces.forEach(function(face) { | |
| 214 | |
| 215 var components = ['x', 'y', 'z'].sort(function(a, b) { | |
| 216 return Math.abs(face.normal[a]) > Math.abs(face.normal[b]); | |
| 217 }); | |
| 218 | |
| 219 var v1 = geometry.vertices[face.a]; | |
| 220 var v2 = geometry.vertices[face.b]; | |
| 221 var v3 = geometry.vertices[face.c]; | |
| 222 | |
| 223 geometry.faceVertexUvs[0].push([ | |
| 224 new THREE.Vector2(v1[components[0]], v1[components[1]]), | |
| 225 new THREE.Vector2(v2[components[0]], v2[components[1]]), | |
| 226 new THREE.Vector2(v3[components[0]], v3[components[1]]) | |
| 227 ]); | |
| 228 | |
| 229 }); | |
| 230 | |
| 231 geometry.uvsNeedUpdate = true; | |
| 232 } |
