diff --git a/02/index.html b/02/index.html new file mode 100644 index 000000000..080281030 --- /dev/null +++ b/02/index.html @@ -0,0 +1,188 @@ + + + + + + + CS460 Assigment + + + + + + + + +

CS460 Assignment

+ + + + + + + + diff --git a/03/.vscode/launch.json b/03/.vscode/launch.json new file mode 100644 index 000000000..0c05dc951 --- /dev/null +++ b/03/.vscode/launch.json @@ -0,0 +1,14 @@ +{ + // Use IntelliSense to learn about possible attributes. + // Hover to view descriptions of existing attributes. + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "type": "msedge", + "request": "launch", + "name": "Open Untitled-1.html", + "file": "c:\\Users\\fhwarsam\\Desktop\\Untitled-1.html" + } + ] +} \ No newline at end of file diff --git a/03/CS460_Assignment_03__Copy_.pdf b/03/CS460_Assignment_03__Copy_.pdf new file mode 100644 index 000000000..8dce77b6e Binary files /dev/null and b/03/CS460_Assignment_03__Copy_.pdf differ diff --git a/03/index.html b/03/index.html new file mode 100644 index 000000000..8d4fce4a1 --- /dev/null +++ b/03/index.html @@ -0,0 +1,120 @@ + + + + + + + + Assignment_03 threejs + + + + + + + + \ No newline at end of file diff --git a/04/CS460_Assignment_04__Copy_.pdf b/04/CS460_Assignment_04__Copy_.pdf new file mode 100644 index 000000000..3c729b5c0 Binary files /dev/null and b/04/CS460_Assignment_04__Copy_.pdf differ diff --git a/04/index.html b/04/index.html new file mode 100644 index 000000000..be4801cee --- /dev/null +++ b/04/index.html @@ -0,0 +1,460 @@ + + + + + Vanilla WebGL! + + + + + + + + + + + +
0
+ + diff --git a/05/CS460_Assignment_05__Copy_ (1).pdf b/05/CS460_Assignment_05__Copy_ (1).pdf new file mode 100644 index 000000000..f3d7f5fc2 Binary files /dev/null and b/05/CS460_Assignment_05__Copy_ (1).pdf differ diff --git a/05/README.md b/05/README.md index 17ed6e178..f583f749d 100644 --- a/05/README.md +++ b/05/README.md @@ -1,2 +1,3 @@ -Assignment 5: Transforms! - +# Assignment_Four +# Assignment_Four +# AS5 diff --git a/05/index.html b/05/index.html new file mode 100644 index 000000000..f0b931fe5 --- /dev/null +++ b/05/index.html @@ -0,0 +1,378 @@ +<<<<<<< HEAD + + + + + + + XTK Assigment + + + + + + + + + + +
+
+ +======= + + + + + + + XTK Assigment + + + + + + + + + + +
+
+ +>>>>>>> a52a2a8a538bb3718e403903e48023f28e948029 + \ No newline at end of file diff --git a/05/xtk.html b/05/xtk.html new file mode 100644 index 000000000..423b0321a --- /dev/null +++ b/05/xtk.html @@ -0,0 +1,188 @@ + + + + + + + XTK Assigment + + + + + + + + + + +
+
+ + \ No newline at end of file diff --git a/06/.vscode/launch.json b/06/.vscode/launch.json new file mode 100644 index 000000000..2ba986f6f --- /dev/null +++ b/06/.vscode/launch.json @@ -0,0 +1,15 @@ +{ + // Use IntelliSense to learn about possible attributes. + // Hover to view descriptions of existing attributes. + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "type": "chrome", + "request": "launch", + "name": "Launch Chrome against localhost", + "url": "http://localhost:8080", + "webRoot": "${workspaceFolder}" + } + ] +} \ No newline at end of file diff --git a/06/CS460_Assignment_06__Copy_.pdf b/06/CS460_Assignment_06__Copy_.pdf new file mode 100644 index 000000000..de5793b37 Binary files /dev/null and b/06/CS460_Assignment_06__Copy_.pdf differ diff --git a/06/Robot.js b/06/Robot.js new file mode 100644 index 000000000..cd9042738 --- /dev/null +++ b/06/Robot.js @@ -0,0 +1,185 @@ +class Robot{ + constructor(x, y, z){ + this.x=x; + this.y=y; + this.z=z; + this.movement= ''; + // creating head and adding neck and torso + + // Head + this.head = new THREE.Bone(); + + + // Neck + this.neck = new THREE.Bone(); + + // Torso + this.torso = new THREE.Bone(); + this.head.position.x=x; + this.head.position.y=y; + this.head.position.z=z; + + + // Add neck to head + this.neck.position.y = -10; + this.head.add(this.neck); + + + // Add torso to neck + this.torso.position.y = -30; + this.neck.add(this.torso); + + // creating upper arm, lower arm and hand for left and right hands + +// Right hand + + // upper arm + this.right_upper_arm = new THREE.Bone(); + this.right_upper_arm.position.x= 5; + this.right_upper_arm.position.y= -5; + + // lower arm + this.right_lower_arm = new THREE.Bone(); + this.right_lower_arm.position.x= 5; + this.right_lower_arm.position.y= -5; + + // Hand + this.right_hand = new THREE.Bone(); + this.right_hand.position.x= 5; + this.right_hand.position.y= -5; + + // Ataching the hand to neck to form a complete arm + this.neck.add(this.right_upper_arm); + this.right_upper_arm.add(this.right_lower_arm); + this.right_lower_arm.add(this.right_hand); + +// left hand + this.left_upper_arm = new THREE.Bone(); + this.left_upper_arm.position.x= -5; + this.left_upper_arm.position.y= -5; + + + // left lower arm + this.left_lower_arm = new THREE.Bone(); + this.left_lower_arm.position.x= -5; + this.left_lower_arm.position.y= -5; + + //left hand + this.left_hand = new THREE.Bone(); + this.left_hand.position.x= -5; + this.left_hand.position.y= -5; + + // Ataching the hand to neck to form a complete arm + this.neck.add(this.left_upper_arm); + this.left_upper_arm.add(this.left_lower_arm); + this.left_lower_arm.add(this.left_hand); + + // upper right leg + this.right_upper_leg = new THREE.Bone(); + this.right_upper_leg.position.x= 5; + this.right_upper_leg.position.y= -5; + + // lower right leg + this.right_lower_leg = new THREE.Bone(); + this.right_lower_leg.position.x= 5; + this.right_lower_leg.position.y= -5; + + // right leg + this.right_foot = new THREE.Bone(); + this.right_foot.position.x= 5; + this.right_foot.position.y= -5; + + // Adding right leg to the Torso + this.torso.add(this.right_upper_leg); + this.right_upper_leg.add(this.right_lower_leg); + this.right_lower_leg.add(this.right_foot); + + // upper left leg + this.left_upper_leg = new THREE.Bone(); + this.left_upper_leg.position.x= -5; + this.left_upper_leg.position.y= -5; + + // lower left leg + this.left_lower_leg = new THREE.Bone(); + this.left_lower_leg.position.x= -5; + this.left_lower_leg.position.y= -5; + + this.left_foot = new THREE.Bone(); + this.left_foot.position.x= -5; + this.left_foot.position.y= -5; + + + // Attaching left leg to Torso + this.torso.add(this.left_upper_leg); + this.left_upper_leg.add(this.left_lower_leg); + this.left_lower_leg.add(this.left_foot); + + + + }; + + show = function(scene){ + var rGroup = new THREE.Group(); + rGroup.add(this.head); + + var helper = new THREE.SkeletonHelper(rGroup); + helper.material.linewidth = 10; // making the skeleton thick + + scene.add(rGroup); + scene.add(helper); + + }; + raise_left_arm = function(){ + this.movement = 'raise left arm'; + }; + lower_left_arm = function(){ + this.movement = 'lower left arm'; + }; + + kick = function(){ + this.movement = 'kick'; + }; + + onAnimate = function(){ + console.log('onAnimate Called'); + + var axis=[1,0,0]; + var T = Math.PI; + var x = Math.sin(T/2)*axis[0]; + var y = Math.sin(T/2)*axis[1]; + var z = Math.sin(T/2)*axis[2]; + var w = Math.cos(T/2); + var q = new THREE.Quaternion(x, y, z, w); + if (this.movement == 'raise left arm'){ + this.left_upper_arm.quaternion.slerp(q, 0.10); + } + else if(this.movement == 'lower left arm'){ + this.left_lower_arm.quaternion.slerp(q, 0.10); + + } else if(this.movement == 'kick'){ + + this.right_lower_leg.quaternion.slerp(q, 0.10); + this.right_foot.position.x= 5; + this.right_foot.position.y= -5; + + }; + }; + + dance = function(){ + console.log("Dance called"); + var axis=[1,1,0]; + var T = Math.PI; + var x = Math.sin(T/2)*axis[1]; + var y = Math.sin(T/2)*axis[1]; + var z = Math.sin(T/2)*axis[2]; + var w = Math.cos(T/2); + var q = new THREE.Quaternion(x, y, z, w); + + this.left_upper_arm.quaternion.slerp(q, 0.60); + this.right_upper_arm.quaternion.slerp(q, 0.50); + this.left_upper_leg.quaternion.slerp(q, 0.60); + + + }; + +} diff --git a/06/index.html b/06/index.html index 4f9049c1a..b99de7c89 100644 --- a/06/index.html +++ b/06/index.html @@ -18,13 +18,14 @@ - + + + + + + + + + + + + + + + + diff --git a/07/sky.jpg b/07/sky.jpg new file mode 100644 index 000000000..b6699c42b Binary files /dev/null and b/07/sky.jpg differ diff --git a/08/.vscode/launch.json b/08/.vscode/launch.json new file mode 100644 index 000000000..2ba986f6f --- /dev/null +++ b/08/.vscode/launch.json @@ -0,0 +1,15 @@ +{ + // Use IntelliSense to learn about possible attributes. + // Hover to view descriptions of existing attributes. + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "type": "chrome", + "request": "launch", + "name": "Launch Chrome against localhost", + "url": "http://localhost:8080", + "webRoot": "${workspaceFolder}" + } + ] +} \ No newline at end of file diff --git a/08/CS460_Assignment_08__Copy_.pdf b/08/CS460_Assignment_08__Copy_.pdf new file mode 100644 index 000000000..f54456857 Binary files /dev/null and b/08/CS460_Assignment_08__Copy_.pdf differ diff --git a/08/Capture1.PNG b/08/Capture1.PNG new file mode 100644 index 000000000..5380de0a0 Binary files /dev/null and b/08/Capture1.PNG differ diff --git a/08/Capture2.PNG b/08/Capture2.PNG new file mode 100644 index 000000000..d0ad5b372 Binary files /dev/null and b/08/Capture2.PNG differ diff --git a/08/Capture3.PNG b/08/Capture3.PNG new file mode 100644 index 000000000..eb2d71bc0 Binary files /dev/null and b/08/Capture3.PNG differ diff --git a/08/README.md b/08/README.md new file mode 100644 index 000000000..8e223cb61 --- /dev/null +++ b/08/README.md @@ -0,0 +1,2 @@ +Assignment 7. + diff --git a/08/Robot.js b/08/Robot.js new file mode 100644 index 000000000..cf292214e --- /dev/null +++ b/08/Robot.js @@ -0,0 +1,350 @@ +Robot = function(x, y, z) { + + + var fromHelper = HELPER.cylinderSkeletonMesh(3, 5, 'blue'); + var geometry = fromHelper[0]; + var material = fromHelper[1]; + var bones = fromHelper[2]; + var mesh = new THREE.SkinnedMesh(geometry, material); + var skeleton = new THREE.Skeleton(bones); + mesh.add(bones[0]); + mesh.bind(skeleton); + + this.root= bones[0]; + this.root.position.set( x, y, z ); + + this.head = bones[1]; + this.neck = bones[2]; + this.neck.position.y = -10; + this.torso = bones[3]; + this.torso.position.y = -30; + + this.body_mesh = mesh; + + + //Left Arm + // left upper arm, left lower arm and left hand + var fromHelper = HELPER.cylinderSkeletonMesh(3, 5, 'blue'); + var geometry = fromHelper[0]; + var material = fromHelper[1]; + var bones = fromHelper[2]; + var mesh = new THREE.SkinnedMesh(geometry, material); + var skeleton = new THREE.Skeleton(bones); + mesh.add(bones[0]); + mesh.bind(skeleton); + + // Left upper arm + this.neck.add(bones[0]); + + this.left_upperarm = bones[1]; + this.left_upperarm.position.y = -5; + this.left_upperarm.position.x = 5; + + //Left lower arm + this.left_lowerarm = bones[2]; + this.left_lowerarm.position.y = -15; + this.left_lowerarm.position.x = 5; + + //left hand + this.left_hand = bones[3]; + this.left_hand.position.x = 5; + this.left_hand.position.y = -5; + this.leftarm_mesh = mesh; + + + // right arm +// right upper arm, right lower arm and right hand + var fromHelper = HELPER.cylinderSkeletonMesh(3, 5, 'blue'); + var geometry = fromHelper[0]; + var material = fromHelper[1]; + var bones = fromHelper[2]; + var mesh = new THREE.SkinnedMesh(geometry, material); + var skeleton = new THREE.Skeleton(bones); + mesh.add(bones[0]); + mesh.bind(skeleton); + + this.neck.add(bones[0]); +// right upper arm + + this.right_upperarm = bones[1]; + this.right_upperarm.position.y = -5; + this.right_upperarm.position.x = -5; + + // right lower arm + this.right_lowerarm = bones[2]; + this.right_lowerarm.position.y = -15; + this.right_lowerarm.position.x = -5; + + // right hand + this.right_hand = bones[3]; + this.right_hand.position.y = -5; + this.right_hand.position.x = -5; + this.right_arm_mesh = mesh; + + + +// left leg +// left upper leg, left lower leg and right foot + +var fromHelper = HELPER.cylinderSkeletonMesh(3, 5, 'blue'); +var geometry = fromHelper[0]; +var material = fromHelper[1]; +var bones = fromHelper[2]; +var mesh = new THREE.SkinnedMesh(geometry, material); +var skeleton = new THREE.Skeleton(bones); +mesh.add(bones[0]); +mesh.bind(skeleton); + +this.torso.add(bones[0]); + + +// left upper leg + + this.left_upperleg = bones[1]; + this.left_upperleg.position.x = 5; + this.left_upperleg.position.y = -5; + + + // left lower leg + this.left_lowerleg = bones[2]; + this.left_lowerleg.position.y = -15; + this.left_lowerleg.position.x = 5; + + // left leg + this.left_foot = bones[3]; + this.left_foot.position.y = -5; + this.left_foot.position.x = 5; + + // this.left_foot.position.x = 5; + // this.left_foot.position.y = -5; + + + //mesh + this.leftleg_mesh = mesh; + + +// right leg +// right upper leg, right lower leg and right foot + +var fromHelper = HELPER.cylinderSkeletonMesh(3, 5, 'blue'); +var geometry = fromHelper[0]; +var material = fromHelper[1]; +var bones = fromHelper[2]; +var mesh = new THREE.SkinnedMesh(geometry, material); +var skeleton = new THREE.Skeleton(bones); +mesh.add(bones[0]); +mesh.bind(skeleton); + +this.torso.add(bones[0]); + +// right upper leg + + this.right_upperleg = bones[1]; + this.right_upperleg.position.x = -5; + this.right_upperleg.position.y = -5; + + + // right lower leg + this.right_lowerleg = bones[2]; + this.right_lowerleg.position.y = -15; + this.right_lowerleg.position.x = -5; + + // right leg + this.right_foot = bones[3]; + this.right_foot.position.y = -5; + this.right_foot.position.x = -5; + + //mesh + this.rightleg_mesh = mesh; + this.movement = null; + + }; + + + Robot.prototype.show = function(scene) { + scene.add(this.body_mesh); + scene.add(this.leftarm_mesh); + scene.add(this.right_arm_mesh); + scene.add(this.leftleg_mesh); + scene.add(this.rightleg_mesh); + + }; + + Robot.prototype.raise_left_arm = function() { + + this.movement = 'raise left arm'; + + }; + + Robot.prototype.lower_left_arm = function() { + + this.movement = 'lower left arm'; + + }; + + Robot.prototype.kick = function() { + + this.movement = 'kick'; + + }; + + Robot.prototype.dance = function() { + + this.movement = 'dance'; + + }; + Robot.prototype.walk = function(){ + + this.movement = 'walk'; + } + Robot.prototype.onStep= function(){ + allRobots = []; + for(var a in allRobots){ + a=allRobots[a]; + if(a.root.position.equals(this.root.position)){ + continue; + } + if(a.root.position.distanceTo(this.root.position) < 10){ + this.root.rotateY(Math.PI/2); + } + } + if(this.root.position.z > 490 || this.root.position.z < -490){ + this.root.rotateY(Math.PI/2); +} + else if(this.root.position.x > 490 || this.root.position.x < -490){ + this.root.rotateY(Math.PI/2); +} +if(this.root.position.x > 100 && this.root.position.x < 200 && this.root.position.z > -150 && this.root.position.z < -50){ + this.root.rotateY(Math.PI/2); +} +this.root.translateZ(10); + }; + + Robot.prototype.onAnimate = function() { + + if (this.movement == 'raise left arm') { + var T = Math.PI; + this.left_upperarm.quaternion.slerp( new THREE.Quaternion(Math.sin(-T/2), // w + 0, // x + 0, // y + Math.cos(-T/2)), // z + 0.1 ); + + } else if (this.movement == 'lower left arm') { + + this.left_upperarm.quaternion.slerp( new THREE.Quaternion(0, 0, 0, 1), + 0.1 ); + + } + + else if (this.movement == 'walk') { + + // check if slerp reached almost the end + if (this.right_upperleg.quaternion.w < 0.93) { + + this.movement = 'walk2'; // signal to take the second leg up + } + this.left_upperleg.quaternion.slerp(new THREE.Quaternion(0,0,0, 1), 0.5); + + var T = -Math.PI/4; + this.right_upperleg.quaternion.slerp(new THREE.Quaternion(Math.sin(T/2), + 0, + 0, + Math.cos(T/2)), + 0.5); + this.onStep(); + } + else if(this.movement == 'walk2') { + if(this.left_upperleg.quaternion.w < .93){ + this.movement = 'walk'; + } + + this.right_upperleg.quaternion.slerp(new THREE.Quaternion(0,0,0,1), 0.5); + + var T = -Math.PI/4; + this.left_upperleg.quaternion.slerp(new THREE.Quaternion(Math.sin(T/2), + 0, + 0, + Math.cos(T/2)), + 0.5); + this.onStep(); + } + + + else if (this.movement == 'kick') { + + if(this.right_upperleg.quaternion.w < 0.72){ + this.movement ='kick done'; + }else { + var T = -Math.PI/2; + this.right_upperleg.quaternion.slerp( new THREE.Quaternion( Math.sin( T / 2 ), // x + 0, // y + 0, // z + Math.cos( T / 2 ) ), // w + 0.1 ); + } + + } else if(this.movement == 'kick done'){ + this.right_upperleg.quaternion.slerp( new THREE.Quaternion(0,0,0,1), 0.1 ); + } + + + + + else if (this.movement == 'dance') { + + if (typeof this.dancer === 'undefined') { + + this.dancer = setInterval(function() { + + // + // some random translation + // + var shakehead = 3*Math.random(); + if (Math.random() < .5) { + shakehead *= -1; + } + + var shakeneck = 3*Math.random(); + if (Math.random() < .5) { + shakeneck *= -1; + } + + var shaketorso = 3*Math.random(); + if (Math.random() < .5) { + shaketorso *= -1; + } + + this.head.position.x += shakehead; + + this.neck.position.x += shakeneck; + + this.torso.position.x += shaketorso; + + + // + // use actions + // + if (Math.random() < .3) { + this.raise_left_arm(); + } + + if (Math.random() < .3) { + this.lower_left_arm(); + } + + if (Math.random() < .3) { + this.kick(); + } + + if (Math.random() < .3) { + this.movement = 'kick done'; + } + + }.bind(this), 500); + + } + + } + + }; \ No newline at end of file diff --git a/08/board.jpg b/08/board.jpg new file mode 100644 index 000000000..66cf45ec7 Binary files /dev/null and b/08/board.jpg differ diff --git a/08/helper.js b/08/helper.js new file mode 100644 index 000000000..1f1293f6e --- /dev/null +++ b/08/helper.js @@ -0,0 +1,83 @@ +HELPER = {}; + +/** + * This method returns [geometry, material, bones] to create a skeleton mesh + * based on a cylinder. + * + * @param howmany: Number of bones. + * @param howwide: Radius of the cylinder. + * @param color: Color of the cylinder. + */ +HELPER.cylinderSkeletonMesh = function(howmany, howwide, color) { + + var segmentheight = 10; // just a temporary value but it needs to match for geometry and bones + var height = segmentheight * howmany; + + // + // inspired by https://threejs.org/docs/scenes/bones-browser.html + // + + // step1: geometry + var geometry = new THREE.CylinderGeometry( + howwide, // radiusTop + howwide, // radiusBottom + height, // height + 8, // radiusSegments + howmany * 3, // heightSegments + true // openEnded + ); + + var position = geometry.attributes.position; + + var vertex = new THREE.Vector3(); + + var skinIndices = []; + var skinWeights = []; + + for ( var i = 0; i < position.count; i ++ ) { + + vertex.fromBufferAttribute( position, i ); + + var y = ( vertex.y + height / 2 ); + + var skinIndex = Math.floor( y / segmentheight ); + var skinWeight = ( y % segmentheight ) / segmentheight; + + skinIndices.push( skinIndex, skinIndex + 1, 0, 0 ); + skinWeights.push( 1 - skinWeight, skinWeight, 0, 0 ); + + } + + geometry.setAttribute( 'skinIndex', new THREE.Uint16BufferAttribute( skinIndices, 4 ) ); + geometry.setAttribute( 'skinWeight', new THREE.Float32BufferAttribute( skinWeights, 4 ) ); + + // step 2: setup material + var material = new THREE.MeshStandardMaterial( { + skinning: true, // IMPORTANT! + color: color, + side: THREE.DoubleSide, + flatShading: true + } ); + + // step 3: setup bones + var bones = []; + + // we always need a dummy parent bone as the anchor point + var parentbone = new THREE.Bone(); + // parentbone.position.y = -height / 2; // weeeeird + bones.push(parentbone); + + for (var i=0; i< howmany; i++) { + + var currentbone = new THREE.Bone(); + currentbone.position.y = segmentheight; + + parentbone.add(currentbone); + bones.push(currentbone); // add the bone + parentbone = currentbone; + + } + + return [geometry, material, bones]; + +}; \ No newline at end of file diff --git a/08/index.html b/08/index.html new file mode 100644 index 000000000..54d0b99d5 --- /dev/null +++ b/08/index.html @@ -0,0 +1,189 @@ + + + + + + + + + + + + + + + + + + +
+
+ + \ No newline at end of file diff --git a/08/sky.jpg b/08/sky.jpg new file mode 100644 index 000000000..b6699c42b Binary files /dev/null and b/08/sky.jpg differ diff --git a/09/CS460_Assignment_09__Copy_.pdf b/09/CS460_Assignment_09__Copy_.pdf new file mode 100644 index 000000000..ec4d1003e Binary files /dev/null and b/09/CS460_Assignment_09__Copy_.pdf differ diff --git a/09/Capture9.PNG b/09/Capture9.PNG new file mode 100644 index 000000000..4a52d6b89 Binary files /dev/null and b/09/Capture9.PNG differ diff --git a/09/index.html b/09/index.html index 5afcb3e9c..b0751c253 100644 --- a/09/index.html +++ b/09/index.html @@ -26,7 +26,18 @@ import { TrackballControls } from 'https://threejs.org/examples/jsm/controls/TrackballControls.js'; import { PLYLoader } from 'https://threejs.org/examples/jsm/loaders/PLYLoader.js'; - let scene, camera, renderer, effect, ambientLight, directionalLight, light, mesh, toonMaterial, controls, controller; + let scene, + camera, + renderer, + effect, + ambientLight, + directionalLight, + pointLight, + pointLight2, + light, + mesh, + toonMaterial, + controls, controller; window.onload = function() { @@ -49,14 +60,18 @@ // TODO Part 3 (add 2 pointlights) + pointLight = new THREE.PointLight(0xff0000, .5); + pointLight2 = new THREE.PointLight(0xff0000, .5); + pointLight.position.set(-500, 100, -100); + pointLight2.position.set(-10, 100, -100); + scene.add(pointLight); + scene.add(pointLight2); var loader = new PLYLoader(); loader.load('armadillo.ply', function (geometry) { - geometry.computeVertexNormals(); - toonMaterial = new THREE.MeshToonMaterial( { color: 0x21ce70 } ); @@ -66,12 +81,34 @@ scene.add( mesh ); } ); + + loader.load('armadillo.ply', function(geometry){ + geometry.computeVertexNormals(); + toonMaterial = new THREE.MeshPhongMaterial({color: 0x100dd1}); + mesh = new THREE.Mesh(geometry, toonMaterial); + mesh.position.y = -100; + mesh.position.x = 100; + scene.add(mesh); + }); + + + //var loader3 = new PLYLoader(); + // TODO Part 1, load another mesh // TODO Part 2, use a different material for this mesh + loader.load('armadillo.ply', function(geometry){ + geometry.computeVertexNormals(); + toonMaterial = new THREE.MeshLambertMaterial({color: 0x111111}); + mesh = new THREE.Mesh(geometry, toonMaterial); + mesh.position.y = 100; + mesh.position.x = 100; + scene.add(mesh); + }); + controller = { 'color': 0xffffff // we can use this single color @@ -97,13 +134,46 @@ // TODO Part 4 (control the color and position of point lights) + var PointLightFolder1 = gui.addFolder('Point Light 1'); + PointLightFolder1.addColor(controller, 'color').onChange( function(value) + { pointLight1.color.setHex(value); }); + + PointLightFolder1.add(pointLight.position, 'x', -100, 100); + PointLightFolder1.add(pointLight.position, 'y', -100, 100); + PointLightFolder1.add(pointLight.position, 'z', -100, 100); + PointLightFolder1.open(); + + + + var PointLightFolder2 = gui.addFolder('Point Light 2'); + PointLightFolder2.addColor(controller, 'color').onChange( function(value) { + pointLight2.color.setHex(value); + }); + + PointLightFolder2.add(pointLight2.position, 'x', -100, 100); + PointLightFolder2.add(pointLight2.position, 'y', -100, 100); + PointLightFolder2.add(pointLight2.position, 'z', -100, 100); + + PointLightFolder2.open(); + + // TODO Part 5 (control the color of both materials in the scene) gui.open(); + var MaterialFolder1 = gui.addFolder('Material 1 Toon'); + MaterialFolder1.addColor(controller, 'color').onChange( function(value) { + ToonMaterial.color.setHex(value); + }); + + var MaterialFolder2 = gui.addFolder('Material 2 Phong'); + MaterialFolder2.addColor(controller, 'color').onChange( function(value) { + PhongMaterial.color.setHex(value); + }); + gui.open(); controls = new TrackballControls( camera, renderer.domElement ); animate(); diff --git a/CS460_Assignment_01__Copy_ (2).pdf b/CS460_Assignment_01__Copy_ (2).pdf new file mode 100644 index 000000000..ba5cfd3b7 Binary files /dev/null and b/CS460_Assignment_01__Copy_ (2).pdf differ diff --git a/CS460_Assignment_02__Copy_ (1).pdf b/CS460_Assignment_02__Copy_ (1).pdf new file mode 100644 index 000000000..684df5925 Binary files /dev/null and b/CS460_Assignment_02__Copy_ (1).pdf differ diff --git a/CS460_Final_Project_Report__Copy_ (2).pdf b/CS460_Final_Project_Report__Copy_ (2).pdf new file mode 100644 index 000000000..7303cd809 Binary files /dev/null and b/CS460_Final_Project_Report__Copy_ (2).pdf differ diff --git a/Final_Project/CS460.PNG b/Final_Project/CS460.PNG new file mode 100644 index 000000000..fd69dec6b Binary files /dev/null and b/Final_Project/CS460.PNG differ diff --git a/Final_Project/CS460Intro.html b/Final_Project/CS460Intro.html new file mode 100644 index 000000000..85a520033 --- /dev/null +++ b/Final_Project/CS460Intro.html @@ -0,0 +1,476 @@ + + + + + CS460 Computer Graphics at the University of Massachusetts Boston + + + + + + + + + + + + + + + + +
+ + +
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/Final_Project/GFX.PNG b/Final_Project/GFX.PNG new file mode 100644 index 000000000..bffd89f66 Binary files /dev/null and b/Final_Project/GFX.PNG differ diff --git a/Final_Project/board.jpg b/Final_Project/board.jpg new file mode 100644 index 000000000..66cf45ec7 Binary files /dev/null and b/Final_Project/board.jpg differ diff --git a/Final_Project/camp2.jpg b/Final_Project/camp2.jpg new file mode 100644 index 000000000..fbfc7aefa Binary files /dev/null and b/Final_Project/camp2.jpg differ diff --git a/Final_Project/comp1.jpg b/Final_Project/comp1.jpg new file mode 100644 index 000000000..8745ce14d Binary files /dev/null and b/Final_Project/comp1.jpg differ diff --git a/Final_Project/computer_desk.jpg b/Final_Project/computer_desk.jpg new file mode 100644 index 000000000..a60b871e0 Binary files /dev/null and b/Final_Project/computer_desk.jpg differ diff --git a/Final_Project/dna.mp4 b/Final_Project/dna.mp4 new file mode 100644 index 000000000..13867d32e Binary files /dev/null and b/Final_Project/dna.mp4 differ diff --git a/Final_Project/firstImage.PNG b/Final_Project/firstImage.PNG new file mode 100644 index 000000000..468621b1f Binary files /dev/null and b/Final_Project/firstImage.PNG differ diff --git a/Final_Project/index.html b/Final_Project/index.html new file mode 100644 index 000000000..95e970189 --- /dev/null +++ b/Final_Project/index.html @@ -0,0 +1,479 @@ + + + + + CS460 Computer Graphics at the University of Massachusetts Boston + + + + + + + + + + + + + + + + + + + +
+ + +
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/Final_Project/intro.mp3 b/Final_Project/intro.mp3 new file mode 100644 index 000000000..320cfd98b Binary files /dev/null and b/Final_Project/intro.mp3 differ diff --git a/Final_Project/ironman.png b/Final_Project/ironman.png new file mode 100644 index 000000000..8bcfaf540 Binary files /dev/null and b/Final_Project/ironman.png differ diff --git a/Final_Project/logo_opener.mp3 b/Final_Project/logo_opener.mp3 new file mode 100644 index 000000000..f5eedd6cc Binary files /dev/null and b/Final_Project/logo_opener.mp3 differ diff --git a/Final_Project/loveBoston.PNG b/Final_Project/loveBoston.PNG new file mode 100644 index 000000000..3aa425b93 Binary files /dev/null and b/Final_Project/loveBoston.PNG differ diff --git a/Final_Project/marble.jpg b/Final_Project/marble.jpg new file mode 100644 index 000000000..8422f5b15 Binary files /dev/null and b/Final_Project/marble.jpg differ diff --git a/Final_Project/scene.mp4 b/Final_Project/scene.mp4 new file mode 100644 index 000000000..bc03dabee Binary files /dev/null and b/Final_Project/scene.mp4 differ diff --git a/Final_Project/secondImage.PNG b/Final_Project/secondImage.PNG new file mode 100644 index 000000000..94aa64952 Binary files /dev/null and b/Final_Project/secondImage.PNG differ diff --git a/Final_Project/style.css b/Final_Project/style.css new file mode 100644 index 000000000..fb5fc3a61 --- /dev/null +++ b/Final_Project/style.css @@ -0,0 +1,17 @@ +html, body{ + background-color: #000; + margin: 0; + padding: 0; + height: 100%; + overflow: hidden !important; +} +#r1{ + width: 50%; + height: 100%; + float: left; +} +#r2{ + width: 50%; + height: 100%; + float: right; +} \ No newline at end of file diff --git a/Final_Project/umb.PNG b/Final_Project/umb.PNG new file mode 100644 index 000000000..7848c0607 Binary files /dev/null and b/Final_Project/umb.PNG differ diff --git a/Project1/index.html b/Project1/index.html new file mode 100644 index 000000000..27ed7495d --- /dev/null +++ b/Project1/index.html @@ -0,0 +1,26 @@ + + + + + + + Project1 Hosting + + + +

Click here to see the project demo

+ + \ No newline at end of file diff --git a/Project1/index_xtk.html b/Project1/index_xtk.html new file mode 100644 index 000000000..712a7ed9b --- /dev/null +++ b/Project1/index_xtk.html @@ -0,0 +1,13 @@ + + + + + + + XTK Test page + + + + + + \ No newline at end of file diff --git a/Project1/x_t_k.js b/Project1/x_t_k.js new file mode 100644 index 000000000..17996a2ee --- /dev/null +++ b/Project1/x_t_k.js @@ -0,0 +1,11 @@ +function ren(){ +var r = new X.renderer3D(); +r.init(); + +var skull = new X.mesh(); +skull.file= 'skull.vtk'; +r.add(skull); + +r.render(); +} +ren(); \ No newline at end of file