Show
Ignore:
Timestamp:
13.02.2015 09:00:21 (5 years ago)
Author:
bmt11
Message:

Added interaction with objects. May be able to use this to update flag in 3d rendering aswell as 2d

Location:
other-projects/nz-flag-design/trunk/render-3d
Files:
6 added
1 modified

Legend:

Unmodified
Added
Removed
  • other-projects/nz-flag-design/trunk/render-3d/flag.html

    r29719 r29737  
    131131        <script type="text/javascript" src="./Flag_files/ColladaLoader.js"></script> 
    132132        <script type="text/javascript" src="./Flag_files/slider.js"></script> 
     133        <script type="text/javascript" src="./Flag_files/Projector.js"></script> 
    133134         
    134135        <script type="text/javascript" src="./Flag_files/KeyboardState.js"></script> 
     
    181182            var keyboard = new KeyboardState(); 
    182183            var clothTexture; 
    183  
     184             
     185            var projector, mouse = { x: 0, y: 0 }, INTERSECTED; 
     186            var objects = [];  
     187            var beehiveVisible = true; 
     188             
    184189            var initial = true; 
    185190             
     
    358363                mesh.castShadow = false; 
    359364                scene.add( mesh ); 
     365                //objects.push( mesh ); 
    360366 
    361367                // 
     
    405411                  beehive.scale.set(1,1,1); 
    406412                  beehive.rotation.set(1.5*Math.PI,0,0); 
     413                  beehive.name = "beehive"; 
    407414                  scene.add(beehive); 
     415                  objects.push( beehive ); 
    408416                }); 
     417                projector = new THREE.Projector(); 
     418                document.addEventListener( 'mousedown', onDocumentMouseDown, false ); 
    409419            } 
    410420             
     
    444454                    object.position.x = -305; 
    445455                    object.position.z = -165; 
     456                    object.name = "flag"; 
    446457                    scene.add( object ); 
     458                    objects.push( object ); 
    447459                     
    448460                    initial = false; 
     
    457469            } 
    458470             
     471            function onDocumentMouseDown( event ) { 
     472 
     473                var mouse3D = new THREE.Vector3( ( event.clientX / window.innerWidth ) * 2 - 1,   //x 
     474                                                 -( event.clientY / window.innerHeight ) * 2 + 1,  //y 
     475                                                 1 );                                            //z 
     476                mouse3D.unproject( camera ); 
     477                mouse3D.sub( camera.position ); 
     478                mouse3D.normalize(); 
     479                var raycaster = new THREE.Raycaster( camera.position, mouse3D ); 
     480                var intersects = raycaster.intersectObjects( objects , true); 
     481                if(intersects.length > 0){ 
     482                    beehiveVisible = false; 
     483                    intersects[ 0 ].object.material.color.setHex( Math.random() * 0xffffff ); 
     484                } 
     485            } 
     486             
    459487 
    460488            // 
     
    500528 
    501529                } 
     530                 
     531                /*if(beehiveVisible == false){ 
     532                    for( var i = 0; i < objects.length; i++){ 
     533                        objects[i].position.setY(-2000); 
     534                        if(objects[i].name === "flag"){ 
     535                            objects[i].position.setY(1250); 
     536                        } 
     537                    } 
     538                }*/ 
    502539                 
    503540                clothGeometry.computeFaceNormals(); 
     
    532569         
    533570        </script> 
    534  
    535571    </body> 
    536572</html>