Merge branch 'master' of https://github.com/grafkom-b-if-its-2019/final-project-jammakansiang

Author: ranggakd

css/style.css

@@ -27,6 +27,22 @@ body, #c {
     z-index: 1;
 }
 
+#perfect {
+    font-size: 2.5em;
+    font-family: 'Courier New', Courier, monospace;
+    font-weight: lighter;
+    color: white;
+    position: absolute;
+	bottom: 15%;
+	width: 100%;
+	text-align: center;
+    display:block;
+    font-weight: bold;
+    text-shadow: 5px 5px #2915A7;
+    z-index: 1;
+    opacity: 0.0;
+}
+
 #game-over {
     font-size: 1.5em !important; 
     font-family: 'Courier New', Courier, monospace;

js/app.js

@@ -43,18 +43,18 @@ function init() {
     gameoverDisplay.style.display = "none";
 
     // Membuat ground tempat pijakan balok
-    var ground_material = Physijs.createMaterial(
-        new THREE.MeshLambertMaterial({color: 0xffffff}),
-        1.,
-        0,1
-    );
-    var ground = new Physijs.BoxMesh(
-        new THREE.BoxGeometry(5, 1, 5),
-        ground_material,
-        0
-    );
-    ground.position.set(0,-13.5,0);
-    scene.add(ground);
+    // var ground_material = Physijs.createMaterial(
+    //     new THREE.MeshLambertMaterial({color: 0xffffff}),
+    //     1.,
+    //     0,1
+    // );
+    // var ground = new Physijs.BoxMesh(
+    //     new THREE.BoxGeometry(5, 1, 5),
+    //     ground_material,
+    //     0
+    // );
+    // ground.position.set(0,-13.5,0);
+    // scene.add(ground);
 
     // Membuat tumpukan awal hingga
     // bagian bawah tertutupi
@@ -190,7 +190,8 @@ function loop() {
             spawnBox();
 
             // Jika balok masih bisa memotong, maka loop lanjut
-            if(brick.cut(prevBrick)) {
+            var cutted_brick = brick.cut(prevBrick);
+            if(cutted_brick[0]) {
                 // Balok baru berupa potongan akan dapat efek Physijs
                 // var fallingbrick = new FallingBrick(prevBrick.params);
                 // fallingbricks.push(fallingbrick);
@@ -241,6 +242,9 @@ function loop() {
 
                 // Update score
                 scoreValue++;
+                if(cutted_brick[5]==true){
+                    scoreValue++;
+                }
                 scoreDisplay.innerHTML = scoreValue;
 
                 // mengembalikan state menjadi play
@@ -371,7 +375,6 @@ function nambahlagu(){
     else if (isPlay==1)
     {
         myAudio.stop();
-        console.log("aaa");
     }
 }
 

js/brick.js

@@ -8,6 +8,7 @@ class Brick {
         //===============
         //---Parameter---
         //===============
+        var perfect = document.getElementById("perfect");
         var defaultParam = {
             size: new THREE.Vector3(1, 1, 1),
             position: new THREE.Vector3(0, 0, 0),
@@ -136,23 +137,41 @@ class Brick {
      */
     cut(prevBrick)
     {
+        console.log(this.color);
+        var mantap = false;
         var prevPosition = prevBrick.position;
+        prevPosition.x = Number((prevPosition.x).toFixed(1));
+        prevPosition.y = Number((prevPosition.y).toFixed(1));
+        prevPosition.z = Number((prevPosition.z).toFixed(1));
+       
         var curScale = this.scale;
+        curScale.x = Number((curScale.x).toFixed(1));
+        curScale.y = Number((curScale.y).toFixed(1));
+        curScale.z = Number((curScale.z).toFixed(1));
+        
         var curPosition = this.position;
+        curPosition.x = Number((curPosition.x).toFixed(1));
+        curPosition.y = Number((curPosition.y).toFixed(1));
+        curPosition.z = Number((curPosition.z).toFixed(1));
 
         var diffX = curPosition.x - prevPosition.x;
         var diffZ = curPosition.z - prevPosition.z;
 
-        console.log("x : " + diffX, curScale.x);
-        console.log("Z : " + diffZ, curScale.z);
+        // console.log("x : " + diffX, curScale.x);
+        // console.log("Z : " + diffZ, curScale.z);
+
+        if(diffX==0 && diffZ==0){
+            perfect.style.opacity = 1.0;
+            mantap = true;
+        }
 
         // Jika ukuran saat ini lebih kecil
         // dari potongannya, maka error / gameover (return false)
         if(curScale.x < Math.abs(diffX) 
         || curScale.z < Math.abs(diffZ) ) {
             this.disabledMass();
             Brick.resetSpeed();
-            return false;
+            return [false, prevPosition, curScale, curPosition, this.color, mantap];
         }
 
         curScale.x -= Math.abs(diffX);
@@ -162,18 +181,21 @@ class Brick {
 
         Brick.increaseSpeed();
         this.scale.copy(curScale);
-        return true;
+        return [true, prevPosition, curScale, curPosition, this.color, mantap];
     }
 
     /** 
      * Melakukan move object sesuai arah
      * pada sumbu cartesian 'x' dan 'z'
      */
     move() {
+        if(perfect.style.opacity>0){
+            perfect.style.opacity-=0.03;
+        }
         const batas = 6.5;
 
-        console.log("x : " + this.position.x);
-        console.log("Z : " + this.position.y);
+        // console.log("x : " + this.position.x);
+        // console.log("Z : " + this.position.y);
 
         switch (this.params.direction) {
             // Jika bergerak di-sumbu 'x'

views/index.html

@@ -10,6 +10,7 @@
 </head>
 <body>
     <div id="score">0</div>
+    <div id="perfect">MANTAP MANTAP</div>
     <div id="game-over">
         <img style="width: 300px;" src="img/over.png" alt="">
         <!-- <br>Tekan 'ENTER'<br> -->