things have changed

Author: astrielov

.idea/workspace.xml

@@ -0,0 +1,25 @@
+function User(name) {
+  this.name = name;
+}
+
+function Admin(isPunishable) {
+  this.isPunishable = isPunishable;
+}
+
+Admin.prototype.punish = (name) => {
+  console.log(this);
+  if (this.isPunishable) { console.log(`${name} has been punished`); }
+};
+
+Object.setPrototypeOf(Admin.prototype, User.prototype);
+
+const human = {
+  isHuman: true,
+};
+
+User.prototype = human;
+
+console.log(new User('Bob'));
+const admin = new Admin(true);
+console.log(admin);
+admin.punish('Greg');

prototypes/temp.js

@@ -10,4 +10,8 @@
 </select>
 </body>
 <script src="selectors.js"></script>
+<script>
+  select.style.width = '400px';
+  select.style.height = '550px';
+</script>
 </html>

selectors/index.html

@@ -1,64 +1,54 @@
-const fragment = document.createDocumentFragment();
 const select = document.querySelector('select');
 let dataArray;
-let parentIndex;
-select.style.width = '400px';
-select.style.height = '600px';
-
-function hasNoParent(currentObj) {
-  return !dataArray.some(e => (currentObj.left > e.left && currentObj.right < e.right));
-}
-
-function hasParent(currentObj) {
-  return dataArray.some((elem, index) => {
-    if (elem.right === currentObj.right + 1 && elem.left < currentObj.left) {
-      parentIndex = index;
-      return true;
-    }
-    return false;
-  });
-}
-
-function hasChild(currentObj) {
-  return currentObj.left + 1 !== currentObj.right;
-}
 
 function setLeftPadding(charAmount) {
   this.style.paddingLeft = `${charAmount}ch`;
 }
 
-function recursivePaste(index = 0, paddingCharAmount = 0) {
-  const currentObj = dataArray[index];
+function fetchElement(siblings, left, right, depth = 0) {
+  dataArray.forEach((item) => {
+    if (item.left === left) {
+      siblings.push(item);
 
-  if (hasNoParent(currentObj)) {
-    paddingCharAmount = 0;
-  }
+      const currItem = siblings[siblings.length - 1];
+      currItem.depth = depth;
 
-  const op = new Option(currentObj.name, currentObj.id);
-  setLeftPadding.call(op, paddingCharAmount * 2);
-  fragment.appendChild(op);
+      if (item.left + 1 < item.right) {
+        currItem.childs = fetchElement([], item.left + 1, item.right - 1, depth + 1);
+      }
 
-  if (hasChild(currentObj)) {
-    paddingCharAmount += 1;
-  }
+      if (right && item.right < right) {
+        siblings = fetchElement(siblings, item.right + 1, right, depth);
+      }
+    }
+  });
+  return siblings;
+}
 
-  while (!hasChild(currentObj) && hasParent(currentObj)) {
-    dataArray.splice(parentIndex, 1);
-    index -= 1;
-    paddingCharAmount -= 1;
+function makeDocumentFragment(nestedSetData) {
+  const fragment = document.createDocumentFragment();
+
+  function paste(array) {
+    array.forEach((x) => {
+      const op = new Option(x.name, x.id);
+      setLeftPadding.call(op, x.depth * 2);
+      fragment.appendChild(op);
+      if (x.childs) {
+        paste(x.childs);
+      }
+    });
   }
 
-  index += 1;
-  if (index < dataArray.length) {
-    recursivePaste(index, paddingCharAmount);
-  }
+  paste(nestedSetData);
+  return fragment;
 }
 
 fetch('https://sectors-enpoint.herokuapp.com/sectors')
   .then(response => response.json())
   .then((array) => {
-    dataArray = array.sort((a, b) => (a.left - b.left));
+    dataArray = array.sort((a, b) => a.left - b.left);
 
-    recursivePaste();
+    const nestedSetData = fetchElement([], 1, dataArray.length * 2);
+    const fragment = makeDocumentFragment(nestedSetData);
     select.appendChild(fragment);
   });

selectors/selectors.js

@@ -0,0 +1,64 @@
+const fragment = document.createDocumentFragment();
+const select = document.querySelector('select');
+let dataArray;
+let parentIndex;
+select.style.width = '400px';
+select.style.height = '600px';
+
+function hasNoParent(currentObj) {
+  return !dataArray.some(e => (currentObj.left > e.left && currentObj.right < e.right));
+}
+
+function hasParent(currentObj) {
+  return dataArray.some((elem, index) => {
+    if (elem.right === currentObj.right + 1 && elem.left < currentObj.left) {
+      parentIndex = index;
+      return true;
+    }
+    return false;
+  });
+}
+
+function hasChild(currentObj) {
+  return currentObj.left + 1 !== currentObj.right;
+}
+
+function setLeftPadding(charAmount) {
+  this.style.paddingLeft = `${charAmount}ch`;
+}
+
+function recursivePaste(index = 0, paddingCharAmount = 0) {
+  const currentObj = dataArray[index];
+
+  if (hasNoParent(currentObj)) {
+    paddingCharAmount = 0;
+  }
+
+  const op = new Option(currentObj.name, currentObj.id);
+  setLeftPadding.call(op, paddingCharAmount * 2);
+  fragment.appendChild(op);
+
+  if (hasChild(currentObj)) {
+    paddingCharAmount += 1;
+  }
+
+  while (!hasChild(currentObj) && hasParent(currentObj)) {
+    dataArray.splice(parentIndex, 1);
+    index -= 1;
+    paddingCharAmount -= 1;
+  }
+
+  index += 1;
+  if (index < dataArray.length) {
+    recursivePaste(index, paddingCharAmount);
+  }
+}
+
+fetch('https://sectors-enpoint.herokuapp.com/sectors')
+  .then(response => response.json())
+  .then((array) => {
+    dataArray = array.sort((a, b) => (a.left - b.left));
+
+    recursivePaste();
+    select.appendChild(fragment);
+  });

selectors/selectorsOld.js

@@ -1,8 +1,6 @@
 let moves = [];
 let currentMove = 0;
-let pulledMoves = [];
-let pulledCurrentMove = 0;
-let pulledN;
+let pulledGameState = {};
 
 const gameField = document.querySelector('.field');
 const undoButt = document.querySelector('.undo-btn');
@@ -187,27 +185,33 @@ function clearField() {
   cells.forEach(cell => cell.classList.remove('r'));
 }
 
-function render() {
+function doRestart() {
+  removeWinTitle();
+  removeWinCells();
+  disableButton.call(undoButt);
+  disableButton.call(redoButt);
+  clearField();
   moves = [];
   currentMove = 0;
-  clearField();
-  removeWinCells();
-  removeWinTitle();
+}
+
+function render() {
+  doRestart();
 
-  if (pulledN !== N) {
+  if (!pulledGameState || pulledGameState.N !== N) {
     return;
   }
-  for (let i = 0; i < pulledMoves.length; i += 1) {
+  for (let i = 0; i < pulledGameState.moves.length; i += 1) {
     const event = new CustomEvent('click', {
       bubbles: true,
       detail: {
         custom: true,
       },
     });
-    gameField.querySelector(`#c-${pulledMoves[i].cellId}`).dispatchEvent(event);
+    gameField.querySelector(`#c-${pulledGameState.moves[i].cellId}`).dispatchEvent(event);
   }
 
-  for (let i = pulledMoves.length; i > pulledCurrentMove; i -= 1) {
+  for (let i = pulledGameState.moves.length; i > pulledGameState.currentMove; i -= 1) {
     const event = new CustomEvent('click', {
       bubbles: true,
       detail: {
@@ -220,12 +224,6 @@ function render() {
   checkWin();
 }
 
-function pullFromStorage() {
-  pulledMoves = JSON.parse(localStorage.getItem('moves'));
-  pulledCurrentMove = JSON.parse(localStorage.getItem('currentMove'));
-  pulledN = JSON.parse(localStorage.getItem('N'));
-}
-
 function removeCellPlayerClass() {
   const move = moves[currentMove];
   const cell = document.querySelector(`#c-${move.cellId}`);
@@ -239,19 +237,12 @@ function addCellPlayerClass() {
 }
 
 function pushToStorage() {
-  localStorage.setItem('moves', JSON.stringify(moves));
-  localStorage.setItem('N', JSON.stringify(N));
-  localStorage.setItem('currentMove', JSON.stringify(currentMove));
+  const gameState = { moves, N, currentMove };
+  localStorage.setItem('gameState', JSON.stringify(gameState));
 }
 
-function doRestart() {
-  removeWinTitle();
-  removeWinCells();
-  disableButton.call(undoButt);
-  disableButton.call(redoButt);
-  clearField();
-  moves = [];
-  currentMove = 0;
+function pullFromStorage() {
+  pulledGameState = JSON.parse(localStorage.getItem('gameState'));
 }
 
 gameField.addEventListener('click', (e) => {
@@ -322,15 +313,9 @@ restartButt.addEventListener('click', () => {
   localStorage.clear();
 });
 
-window.addEventListener('storage', (e) => {
-  if (e.key === null) {
-    doRestart();
-    return;
-  }
-  if (e.key === 'currentMove') {
-    pullFromStorage();
-    render();
-  }
+window.addEventListener('storage', () => {
+  pullFromStorage();
+  render();
 });
 
 try {