bostongfx · talkingEagle · Sep 11, 2022 · Sep 14, 2022 · Sep 14, 2022 · Sep 17, 2022
diff --git a/.DS_Store b/.DS_Store
diff --git a/02/.DS_Store b/02/.DS_Store
diff --git a/02/My_CS460_Assignment_02.pdf b/02/My_CS460_Assignment_02.pdf
diff --git a/02/gfx/.DS_Store b/02/gfx/.DS_Store
diff --git a/02/gfx/Screen Shot 2022-09-17 at 1.32.01 PM.png b/02/gfx/Screen Shot 2022-09-17 at 1.32.01 PM.png
diff --git a/02/index.html b/02/index.html
@@ -0,0 +1,132 @@
+<html>
+  <head>
+    <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
+    <meta content="utf-8" http-equiv="encoding">
+    <title>CS460 Assignment 2</title>
+    <style>
+      body {
+        background-color: black;
+        color: white; /* font color */
+        font-family: sans-serif;
+        margin: 0;
+        padding: 0;
+        height: 100%;
+        overflow: hidden !important;
+      }
+
+      #logo {
+        position: absolute;
+        right: 10px;
+        top: 10px;
+      }
+    </style>
+
+    <script type="text/javascript" src="https://get.goXTK.com/xtk_edge.js"></script>
+
+    <script type="text/javascript">
+
+    window.onload = function() {
+
+      // create and initialize a 3d renderer
+    var r = new X.renderer3D();
+    r.init();
+    // cube objects
+    var p1 = new X.cube();
+    p1.lengthX = p1.lengthY = p1.lengthZ = 2;
+    //
+    var p2 = new X.cube();
+    p2.lengthX = p2.lengthY = p2.lengthZ = 2;
+    //
+    var p3 = new X.cube();
+    p3.lengthX = p3.lengthY = p3.lengthZ = 2;
+    //
+    var p4 = new X.cube();
+    p4.lengthX = p4.lengthY = p4.lengthZ = 2;
+
+
+    // populate the cubes
+ for (var i=0; i<9;i++) {
+     for (var j=0;j<9;j++) {
+
+        var c = new X.cube();
+
+        c.center = [j * 3, 0, i * 3];
+
+        c.lengthX = c.lengthY = c.lengthZ = 2;
+
+        if (i == 8 && j == 4) { c.color = [0,1,0]; }
+        //
+        else if (i == 7 && j<6 && j>2) { c.color = [0,1,0]; }
+        //
+        else if (i == 5 && j == 5) { c.color = [0,1,0]; }
+        //
+        else if (i == 3 && j == 6) { c.color = [0,1,0]; }
+        //
+        else if (i == 6 && j<6 && j>2) { c.color = [0,1,0]; }
+        //
+        else if (i == 5 && j<8 && j>0) { c.color = [0,1,0]; }
+        //
+        else if (i == 4 && j<8 && j>0) { c.color = [0,1,0]; }
+        //
+        else if (i == 3 && j<=8 && j>=0) { c.color = [0,1,0]; }
+        //
+        else if (i == 2 && j<=8 && j>=0) { c.color = [0,1,0]; }
+        //
+        else if (i == 1 && j<6 && j>2) { c.color = [0,1,0]; }
+        //
+        else if (i == 0 && j<6 && j>2) { c.color = [0,1,0]; }
+         //
+        else { c.color = [0,0,0];}
+
+        r.add(c);
+     }
+ }
+    r.render();
+
+    var redcube = false;
+        setInterval(function() {
+          // position the animation cube objects
+          c.center = [3, 0, 6];
+          p1.center = [6,0,12];
+          p2.center = [18,0,12];
+          p3.center = [21,0,6];
+          p4.center = [12,0,21];
+          // render the cube objects
+          r.add(c);
+          r.add(p1);
+          r.add(p2);
+          r.add(p3);
+          r.add(p4);
+
+          if (!redcube) {
+            // color the cube objects
+            c.color = [1,0,0];
+            p1.color = [.8, .8, 0];
+            p2.color = [1, 0, 0];
+            p3.color = [.8, .8, 0];
+            p4.color = [0, 0, 8];
+            redcube = true;
+
+          } else {
+            // make the cubes blinks
+            c.color = [0,1,0];
+            p1.color = [0,1,0];
+            p2.color = [0,1,0];
+            p3.color = [0,1,0];
+            p4.color = [0,1,0];
+            redcube = false;
+
+          }
+
+        }, 800);
+
+
+    };
+
+    </script>
+  </head>
+  <body>
+    <h1>CS460 Assignment 2</h1>
+    <div id="logo"><img style="height:60px" src="gfx/cs460.png"></div>
+  </body>
+</html>
diff --git a/03/.DS_Store b/03/.DS_Store
diff --git a/03/My_CS460_Assignment_03_.pdf b/03/My_CS460_Assignment_03_.pdf
diff --git a/03/index.html b/03/index.html
@@ -0,0 +1,159 @@
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <style>
+      html, body { 
+        background-color:#000;
+        margin: 0;
+        padding: 0;
+        height: 100%;
+        overflow: hidden !important;  
+      }
+    </style>
+    <script src="https://threejs.org/build/three.min.js" type="text/javascript"></script>
+    <script src="https://threejs.org/examples/js/controls/TrackballControls.js" type="text/javascript"></script>
+    <script>
+
+      var mesh = null;
+      var count = 0;
+
+      window.onload = function() {
+
+        scene = new THREE.Scene();
+
+        fov = 75;
+        ratio = window.innerWidth / window.innerHeight;
+        zNear = 1;
+        zFar = 10000;
+        // console.log(ratio);
+        camera = new THREE.PerspectiveCamera(fov, ratio, zNear, zFar);
+        camera.position.set( 0, 0, 100);
+
+        renderer = new THREE.WebGLRenderer();
+        renderer.setSize( window.innerWidth, window.innerHeight );
+        document.body.appendChild( renderer.domElement );
+
+        ambientLight = new THREE.AmbientLight();
+        scene.add( ambientLight );
+
+        light = new THREE.DirectionalLight( 0xffffff, 5.0 );
+        light.position.set( 10, 100, 10 );
+        scene.add( light );
+
+
+        //
+        // The invisible plane
+        //
+        geometry = new THREE.PlaneBufferGeometry( 10000, 10000 );
+        material = new THREE.MeshBasicMaterial( {
+          visible: false
+        });
+
+        invisible_plane = new THREE.Mesh( geometry, material );
+
+        scene.add( invisible_plane );
+        //
+        //
+        //
+
+
+
+        controls = new THREE.TrackballControls( camera, renderer.domElement );
+
+        animate();
+
+
+        //
+        // ACTION!
+        //
+
+        renderer.domElement.onmousemove = function(e) {
+
+          if (!e.shiftKey) {
+            e.preventDefault();
+            return false;
+          }
+
+          console.log('yes! you clicked!');
+
+          pixel_coords = new THREE.Vector2( e.clientX, e.clientY );
+
+          console.log('Pixel coordinates', pixel_coords);
+
+          vp_coords = new THREE.Vector2( ( pixel_coords.x / window.innerWidth ) * 2 - 1,
+                                        -( pixel_coords.y / window.innerHeight ) * 2 + 1);
+
+          console.log('Viewport coordinates', vp_coords);
+
+          vp_coords_near = new THREE.Vector3( vp_coords.x, vp_coords.y, 0);
+
+          raycaster = new THREE.Raycaster();
+          raycaster.setFromCamera(vp_coords_near, camera);
+          intersects = raycaster.intersectObject(invisible_plane);
+
+
+          // RANDOM GEOMETRY
+          random_geometry =  Math.floor((Math.random() * 6));
+
+          switch(random_geometry) {
+            case 0:
+              geometry = new THREE.BoxBufferGeometry( 20, 20, 20 );
+              break;
+
+            case 1:
+              geometry = new THREE.TorusKnotBufferGeometry( 10, 3, 100, 16 );
+              break;
+
+            case 2:
+              geometry = new THREE.SphereBufferGeometry(20,20,10);
+              break;
+
+            case 3:
+              geometry = new THREE.OctahedronBufferGeometry(20);
+              break;
+
+            case 4:
+              geometry = new THREE.ConeBufferGeometry(20,10);
+              break;
+
+            case 5:
+              geometry = new THREE.RingBufferGeometry( 1, 20, 32 );
+
+          }
+
+          // RANDOM COLOR
+          colors = ['green', 'white', 'purple', 'yellow', 'red', 'blue'];
+          random_color = colors[Math.floor((Math.random() * 6))];
+
+
+          material = new THREE.MeshStandardMaterial({ color: random_color });
+          mesh = new THREE.Mesh( geometry, material );
+
+          mesh.position.set(intersects[0].point.x, intersects[0].point.y,intersects[0].point.z)
+
+          scene.add(mesh);
+
+
+          count +=1;
+          console.log('count', count);
+
+        };
+
+
+
+
+      };
+
+      function animate() {
+
+        requestAnimationFrame( animate );
+
+        controls.update();
+        renderer.render( scene, camera );
+
+      };
+
+    </script>
+  </head>
+  <body></body>
+</html>
diff --git a/04/.DS_Store b/04/.DS_Store
diff --git a/04/My_CS460_Assignment_04_.pdf b/04/My_CS460_Assignment_04_.pdf