--- a/stlviewer.js Tue Apr 04 03:13:58 2017 +0200 +++ b/stlviewer.js Wed Apr 05 00:39:31 2017 +0200 @@ -13,13 +13,25 @@ }); $( "#sortable2" ).sortable({ placeholder: "ui-state-highlight", + forcePlaceholderSize: true, + connectWith: '#sortable1', start: clear_scene, stop: function() { for (i =0; i<10; i++) clear_scene(); - window.setTimeout(update_scene,500) + window.setTimeout(update_scene,500); } }); - $( "#sortable2" ).disableSelection(); + c = $("<li key='10'>").html("Steel, 10ℓ"); + $( "#sortable2" ) + .disableSelection() + .append(c.clone()) + .append(c.clone()); + + $("#clearselected").click(function(){ + $( "#sortable2 li" ).remove(); + for (i =0; i<10; i++) clear_scene(); + }); + update_scene(); } ); function clear_scene() { @@ -77,16 +89,11 @@ //console.log(filename, position); var loader = new THREE.STLLoader(); loader.load( filename, function ( geometry ) { - /*if (!material) - var material = new THREE.MeshPhongMaterial( { - color: 0xff5533, specular: 0x111111, shininess: 200 } ); - else {*/ - if (material == 'm_spacer') material = m_spacer; + if (material == 'm_spacer') material = m_spacer; else if (material == 'm_cylinder') material = m_cylinder; - //} - + var mesh = new THREE.Mesh( geometry, material ); - //assignUVs(mesh.geometry); + mesh["stlfile"] = true; if (!position) mesh.position.set( 0, -0.25, 0 ); else mesh.position.set( position[0], position[1], position[2] ); @@ -105,8 +112,8 @@ } function init() { - container = document.createElement( 'div' ); - document.body.appendChild( container ); + container = document.getElementById( 'rendercontainer' ); + //document.body.appendChild( container ); camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.1, 20 ); camera.position.set( 0.5, 0.35, 2 ); @@ -116,7 +123,7 @@ scene = new THREE.Scene(); scene.fog = new THREE.Fog( 0x72645b, 2, 15 ); - var controls = new THREE.OrbitControls(camera); + controls = new THREE.OrbitControls(camera); // Ground @@ -205,28 +212,3 @@ camera.lookAt( cameraTarget ); renderer.render( scene, camera ); } - -function assignUVs(geometry) { - - geometry.faceVertexUvs[0] = []; - - geometry.faces.forEach(function(face) { - - var components = ['x', 'y', 'z'].sort(function(a, b) { - return Math.abs(face.normal[a]) > Math.abs(face.normal[b]); - }); - - var v1 = geometry.vertices[face.a]; - var v2 = geometry.vertices[face.b]; - var v3 = geometry.vertices[face.c]; - - geometry.faceVertexUvs[0].push([ - new THREE.Vector2(v1[components[0]], v1[components[1]]), - new THREE.Vector2(v2[components[0]], v2[components[1]]), - new THREE.Vector2(v3[components[0]], v3[components[1]]) - ]); - - }); - - geometry.uvsNeedUpdate = true; -} \ No newline at end of file