fix a few buggs connected with dynamic handling of rank table

szymonSys · Sep 14, 2019 · 46557ee · 46557ee
1 parent fc940d4
commit 46557ee
Show file tree

Hide file tree

Showing 5 changed files with 29 additions and 15 deletions.
diff --git a/Controller.js b/Controller.js
@@ -37,14 +37,15 @@ class Controller {
          if (document.getElementById('summary-popup')) this.interface.removeGameSummary();
 
          this.addListener(this.grid.root, function (e) {
-            if ((this.game.gameState === "ongoing" || this.game.gameState === 'win') && e.target.className === "game-square") {
+            if ((this.game.gameState === "ongoing" || this.game.gameState === 'win' || this.game.gameState === 'failed') && e.target.className === "game-square") {
                this.interface.actionsCounter = this.game.stats.actionsCounter;
             }
 
             if (this.game.gameState === 'win') {
                this.game.stopGame(this.grid);
 
                const result = new Result(
+                  this.game.stats.timerValue,
                   this.game.stats._getTimerResoult(),
                   this.game.stats.actionsCounter,
                   this.game.stats.difficulty,

diff --git a/Game.js b/Game.js
@@ -288,7 +288,7 @@ class Game {
    }
 
    checkIfWin() {
+      return this.numberOfMatchedSqueres === 2 ? true : false;
       return this.numberOfMatchedSqueres === this.numberOfSquares ? true : false;
-      // return this.numberOfMatchedSqueres === 2 ? true : false;
    }
 }
diff --git a/Grid.js b/Grid.js
@@ -26,7 +26,7 @@ class Grid {
     elem.dataset.isActive = square.isActive.toString();
     elem.dataset.isMatched = square.isMatched.toString();
     elem.style.backgroundColor = square.color;
-    // elem.textContent = square.value;
+    elem.textContent = square.value;
 
     wrapper.appendChild(elem);
   }
@@ -42,4 +42,4 @@ class Grid {
 
     this.root.appendChild(wrapper);
   }
-}
+}
diff --git a/Result.js b/Result.js
@@ -1,12 +1,12 @@
 class Result {
-   constructor(time = null, actions = null, difficulty = null, playerName = '') {
+   constructor(timeValue = null, time = null, actions = null, difficulty = null, playerName = '') {
       if (!(time || actions))
          throw new Error("You have to set time and actions properties");
 
       this._time = time;
       this._actions = actions;
       this._playerName = playerName ? playerName : 'anonim';
-      this._difficulty = difficulty;
+      this._timeValue = timeValue;
    }
 
    get time() {
@@ -49,4 +49,12 @@ class Result {
 
       return this._difficulty = difficulty;
    }
+
+   get timeValue() {
+      return this._timeValue
+   }
+
+   set timeValue(value) {
+      return this._timeValue = value;
+   }
 }
diff --git a/Table.js b/Table.js
@@ -20,6 +20,7 @@ class Table {
             playerName: "result-name",
             time: "result-time",
             actions: "result-counter",
+            timeValue: "timeValue",
             difficulty: "result-difficulty"
          },
          style: {
@@ -117,7 +118,7 @@ class Table {
 
    }
 
-   sortTable(tab = this.rankTable, by = 'time', order = 'ASC') {
+   sortTable(tab = this.rankTable, by = 'timeValue', order = 'ASC') {
       tab.sort((a, b) => {
          if (!(a instanceof Result && b instanceof Result))
             throw new Error("Element of Array has not require type");
@@ -135,7 +136,7 @@ class Table {
 
    loadFromStorage() {
       if (this.hasStorage()) {
-         return JSON.parse(localStorage.getItem('rankTable')).map(result => new Result(result._time, result._actions, result._difficulty, result._playerName));
+         return JSON.parse(localStorage.getItem('rankTable')).map(result => new Result(result._timeValue, result._time, result._actions, result._difficulty, result._playerName));
       } else return [];
    }
 
@@ -167,7 +168,10 @@ class Table {
             result.style[prop] = this.resultElementProps.style[prop];
          }
 
+         // result.dataset.timeValue = result.timeValue;
+
          for (const id in this.resultElementProps.typeId) {
+            if (id === 'timeValue') continue;
             result.dataset[id] = id === 'number' ? i + 1 : this.rankTable[i][id];
             result.innerHTML += `<div id="${this.resultElementProps.typeId[id]}" style = "${this.resultElementProps.childWidth}" class="${this.resultElementProps.typeClass}">
                <span>${id === 'number' ? i+1 : this.rankTable[i][id]}</span>
@@ -179,7 +183,7 @@ class Table {
       this.htmlTable.appendChild(docFragment);
    }
 
-   addResultToView(result, by = 'time') {
+   addResultToView(result, by = 'timeValue') {
 
       function addNewNode(i) {
          const newNode = document.createElement('div');
@@ -191,7 +195,10 @@ class Table {
             newNode.style[prop] = this.resultElementProps.style[prop];
          }
 
+         newNode.dataset.timeValue = result.timeValue;
+
          for (const id in this.resultElementProps.typeId) {
+            if (id === "timeValue") continue;
             newNode.dataset[id] = id === 'number' ? +i : result[id];
             newNode.innerHTML += `<div id="${this.resultElementProps.typeId[id]}" style="${this.resultElementProps.childWidth}" class="${this.resultElementProps.typeClass}">
                   <span>${id === 'number' ? +i: result[id]}</span>
@@ -212,17 +219,17 @@ class Table {
          for (const node of [...this.htmlTable.childNodes]) {
             index++;
 
-            if (!node.previousSibling && result.time <= node.dataset.time) {
+            if (!node.previousSibling && result.timeValue <= node.dataset.timeValue) {
                this.htmlTable.insertBefore(addNewNode.call(this, node.dataset.number), node);
 
                break;
 
-            } else if (!node.nextSibling && result.time >= node.dataset.time) {
+            } else if (!node.nextSibling && result.timeValue >= node.dataset.timeValue) {
                this.htmlTable.appendChild(addNewNode.call(this, node.dataset.number));
 
                break;
 
-            } else if (result.time > node.dataset.time && result.time <= node.nextSibling.dataset.time) {
+            } else if (result.timeValue > node.dataset.timeValue && result.timeValue <= node.nextSibling.dataset.timeValue) {
                this.htmlTable.insertBefore(addNewNode.call(this, node.dataset.number), node.nextSibling);
 
                break;
@@ -232,8 +239,6 @@ class Table {
 
       const htmlNodes = [...this.htmlTable.childNodes];
 
-      console.log(index)
-
       for (let i = index; i <= htmlNodes.length - 1; i++) {
          htmlNodes[i].dataset.number++;
          htmlNodes[i].firstChild.innerHTML = `<span>${htmlNodes[i].dataset.number}</span>`;
@@ -259,7 +264,7 @@ class Table {
       return -1;
    }
 
-   _add = (result, table, isSorted, by = 'time', order = 'ASC') => {
+   _add = (result, table, isSorted, by = 'timeValue', order = 'ASC') => {
       if (result[by] === undefined)
          throw new Error("set correct type of sorting");