Killing Floating Objects

FloatingSpace/FloatingLayer.js

@@ -10,7 +10,7 @@ function newFloatingLayer() {
     let thisObject = {
         floatingObjects: undefined,               // This is the array of floatingObjects being displayed
         addFloatingObject: addFloatingObject,
-        removeFloatingObject: removeFloatingObject,
+        killFloatingObject: killFloatingObject,
         getFloatingObject: getFloatingObject,
         physicsLoop: physicsLoop,
         isInside: isInside,
@@ -20,6 +20,7 @@ function newFloatingLayer() {
     };
 
     let invisibleFloatingObjects = [];
+    let dyingFloatingObjects = [];
 
     let maxTargetRepulsionForce = 0.0005;
 
@@ -49,9 +50,9 @@ function newFloatingLayer() {
 
     }
 
-    function removeFloatingObject(pFloatingObjectHandle) {
+    function killFloatingObject(pFloatingObjectHandle) {
 
-        if (INFO_LOG === true) { logger.write("[INFO] removeFloatingObject -> Entering function."); }
+        if (INFO_LOG === true) { logger.write("[INFO] killFloatingObject -> Entering function."); }
 
         for (let i = 0; i < invisibleFloatingObjects.length; i++) {
 
@@ -60,10 +61,11 @@ function newFloatingLayer() {
             if (floatingObject.handle === pFloatingObjectHandle) {
                 invisibleFloatingObjects.splice(i, 1);  // Delete item from array.
 
-                if (INFO_LOG === true) { logger.write("[INFO] removeFloatingObject -> floatingObject.handle = " + floatingObject.handle); }
-                if (INFO_LOG === true) { logger.write("[INFO] removeFloatingObject -> Removing floatingObject from invisibleFloatingObjects."); }
-                if (INFO_LOG === true) { logger.write("[INFO] removeFloatingObject -> invisibleFloatingObjects.length = " + invisibleFloatingObjects.length); }
+                if (INFO_LOG === true) { logger.write("[INFO] killFloatingObject -> floatingObject.handle = " + floatingObject.handle); }
+                if (INFO_LOG === true) { logger.write("[INFO] killFloatingObject -> Removing floatingObject from invisibleFloatingObjects."); }
+                if (INFO_LOG === true) { logger.write("[INFO] killFloatingObject -> invisibleFloatingObjects.length = " + invisibleFloatingObjects.length); }
 
+                sendToDie(floatingObject);
                 return;
             }
         }
@@ -75,13 +77,75 @@ function newFloatingLayer() {
             if (floatingObject.handle === pFloatingObjectHandle) {
                 thisObject.floatingObjects.splice(i, 1);  // Delete item from array.
 
-                if (INFO_LOG === true) { logger.write("[INFO] removeFloatingObject -> floatingObject.handle = " + floatingObject.handle); }
-                if (INFO_LOG === true) { logger.write("[INFO] removeFloatingObject -> Removing floatingObject from thisObject.floatingObjects."); }
-                if (INFO_LOG === true) { logger.write("[INFO] removeFloatingObject -> thisObject.floatingObjects.length = " + thisObject.floatingObjects.length); }
+                if (INFO_LOG === true) { logger.write("[INFO] killFloatingObject -> floatingObject.handle = " + floatingObject.handle); }
+                if (INFO_LOG === true) { logger.write("[INFO] killFloatingObject -> Removing floatingObject from thisObject.floatingObjects."); }
+                if (INFO_LOG === true) { logger.write("[INFO] killFloatingObject -> thisObject.floatingObjects.length = " + thisObject.floatingObjects.length); }
 
+                sendToDie(floatingObject);
                 return;
             }
         }
+
+        function sendToDie(pFloatingObject) {
+
+            /* Lets mofigy the targerRadius */
+
+            pFloatingObject.targetRadius = 0;
+
+            /* Lets transfer the payload to a new payload structure. */
+
+            let payload = {};
+
+            switch (pFloatingObject.type) {
+
+                case "Profile Ball": {
+
+                    if (pFloatingObject.payload.profile.visible === false) { return;}
+
+                    payload.profile = {
+                        position: {
+                            x: pFloatingObject.payload.profile.position.x,
+                            y: pFloatingObject.payload.profile.position.y
+                        },
+                        visible: pFloatingObject.payload.profile.visible
+                    }
+
+                    pFloatingObject.payload = payload;
+                    break;
+                }
+                case "Note": {
+
+                    if (pFloatingObject.payload.notes[pFloatingObject.payloadNoteIndex].visible === false) { return; }
+
+                    payload.notes = [];
+                    let note = {
+                        title: pFloatingObject.payload.notes[pFloatingObject.payloadNoteIndex].title,
+                        body: pFloatingObject.payload.notes[pFloatingObject.payloadNoteIndex].body,
+                        date: pFloatingObject.payload.notes[pFloatingObject.payloadNoteIndex].date,
+                        rate: pFloatingObject.payload.notes[pFloatingObject.payloadNoteIndex].rate,
+                        position: {
+                            x: pFloatingObject.payload.notes[pFloatingObject.payloadNoteIndex].position.x,
+                            y: pFloatingObject.payload.notes[pFloatingObject.payloadNoteIndex].position.y
+                        },
+                        visible: pFloatingObject.payload.notes[pFloatingObject.payloadNoteIndex].visible
+                    };
+                    payload.notes.push(note);
+                    pFloatingObject.payloadNoteIndex = 0;
+
+                    pFloatingObject.payload = payload;
+                    break;
+                }
+                default: {
+
+                    break;
+                }
+            }
+
+            dyingFloatingObjects.push(pFloatingObject);
+
+            if (INFO_LOG === true) { logger.write("[INFO] killFloatingObject -> Adding floatingObject to dyingFloatingObjects."); }
+            if (INFO_LOG === true) { logger.write("[INFO] killFloatingObject -> dyingFloatingObjects.length = " + dyingFloatingObjects.length); }
+        }
     }
 
     function getFloatingObject(pFloatingObjectHandle) {
@@ -356,6 +420,39 @@ function newFloatingLayer() {
 
             }
         }
+
+        /* We animate some parts of the dying objects */
+
+        for (let i = 0; i < dyingFloatingObjects.length; i++) {
+
+            let floatingObject = dyingFloatingObjects[i];
+
+            if (Math.abs(floatingObject.currentRadius - floatingObject.targetRadius) >= 5) {
+
+                let speed = Math.random();
+
+                floatingObject.currentRadius = floatingObject.currentRadius - speed * 3;
+
+            } else {
+
+                /* Here is when the floatingObjects are definetelly killed. */
+
+                dyingFloatingObjects.splice(i, 1);  // Delete item from array.
+                break;  // only one at the time. 
+            }
+        }
+
+        /* We also draw all the dyingFloatingObjects */
+
+        for (let i = 0; i < dyingFloatingObjects.length; i++) {
+            let floatingObject = dyingFloatingObjects[i];
+            floatingObject.drawBackground();
+        }
+
+        for (let i = 0; i < dyingFloatingObjects.length; i++) {
+            let floatingObject = dyingFloatingObjects[dyingFloatingObjects.length - i - 1];
+            floatingObject.drawForeground();
+        }
     }
 
     function gravityForce(floatingObject, payload) {

FloatingSpace/Note.js

@@ -153,9 +153,9 @@ function newNote() {
                 y: pFloatingObject.currentPosition.y + BUBBLE_HEIGHT / 2
             };
 
-            if (pFloatingObject.payload.profile.imageId !== undefined) {
+            if (pFloatingObject.payloadImageId !== undefined) {
 
-                let image = document.getElementById(pFloatingObject.payload.profile.imageId);
+                let image = document.getElementById(pFloatingObject.payloadImageId);
 
                 if (image !== null) {
 
@@ -180,8 +180,20 @@ function newNote() {
                 browserCanvasContext.strokeStyle = pFloatingObject.labelStrokeStyle;
 
                 const SIZE_PERCENTAGE = Math.trunc(pFloatingObject.currentRadius / pFloatingObject.targetRadius * 100) / 100;
-                const ALPHA = 0.5 - (1 - SIZE_PERCENTAGE) * 5;
+                let ALPHA;
 
+                if (pFloatingObject.targetRadius > 0) {
+
+                    ALPHA = 0.5 - (1 - SIZE_PERCENTAGE) * 5;
+
+                } else { // Object is dying...
+
+                    ALPHA = Math.trunc((0.5 - (100 - pFloatingObject.currentRadius / 100) ) * 100) / 100;
+
+                    if (ALPHA < 0) { ALPHA = 0}
+
+                }
+                
                 let labelPoint;
                 let fontSize = 10;
 

FloatingSpace/NoteSets.js

@@ -102,7 +102,7 @@ function newNoteSets() {
 
                 if (found === false) {
 
-                    floatingLayer.removeFloatingObject(floatingNote.floatingHandle);
+                    floatingLayer.killFloatingObject(floatingNote.floatingHandle);
 
                     if (INFO_LOG === true) { logger.write("[INFO] createNoteSet -> onNotesChanged -> Remove old Notes -> floatingNote.floatingHandle = " + floatingNote.floatingHandle); }
                     if (INFO_LOG === true) { logger.write("[INFO] createNoteSet -> onNotesChanged -> Remove old Notes -> Removed from Layer."); }
@@ -177,7 +177,7 @@ function newNoteSets() {
 
                         floatingObject.payload = noteSet.payload;
                         floatingObject.payloadNoteIndex = i;
-                        floatingObject.payload.profile.imageId = noteSet.imageId;
+                        floatingObject.payloadImageId = noteSet.imageId;
 
                         floatingObject.friction = .995;
 
@@ -255,7 +255,7 @@ function newNoteSets() {
 
                     let floatingNote = noteSet.floatingNotes[j];
 
-                    floatingLayer.removeFloatingObject(floatingNote.floatingHandle);
+                    floatingLayer.killFloatingObject(floatingNote.floatingHandle);
                 }
 
                 noteSets.splice(i, 1);  // Delete item from array.

FloatingSpace/ProfileBalls.js

@@ -69,7 +69,7 @@ function newProfileBalls() {
 
     function destroyProfileBall(pFloatingObjectHandle) {
 
-        floatingLayer.removeFloatingObject(pFloatingObjectHandle);
+        floatingLayer.killFloatingObject(pFloatingObjectHandle);
 
     }
 }

server.js

@@ -6,7 +6,7 @@ if (CONSOLE_LOG === true) {
 
 }
 
-const DEBUG_MODE = true;           // This forces the server to read Plotters from the local drive.
+const DEBUG_MODE = false;           // This forces the server to read Plotters from the local drive.
 
 if (CONSOLE_LOG === true && DEBUG_MODE === true) {