{"mappings":"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","sources":["src/js/html_actuator.js"],"sourcesContent":["function HTMLActuator() {\n  this.tileContainer    = document.querySelector(\".tile-container\");\n  this.scoreContainer   = document.querySelector(\".score-container\");\n  this.bestContainer    = document.querySelector(\".best-container\");\n  this.messageContainer = document.querySelector(\".game-message\");\n\n  this.score = 0;\n}\n\nHTMLActuator.prototype.actuate = function (grid, metadata) {\n  var self = this;\n\n  window.requestAnimationFrame(function () {\n    self.clearContainer(self.tileContainer);\n\n    grid.cells.forEach(function (column) {\n      column.forEach(function (cell) {\n        if (cell) {\n          self.addTile(cell);\n        }\n      });\n    });\n\n    self.updateScore(metadata.score);\n    self.updateBestScore(metadata.bestScore);\n\n    if (metadata.terminated) {\n      if (metadata.over) {\n        self.message(false); // You lose\n      } else if (metadata.won) {\n        self.message(true); // You win!\n      }\n    }\n\n  });\n};\n\n// Continues the game (both restart and keep playing)\nHTMLActuator.prototype.continueGame = function () {\n  this.clearMessage();\n};\n\nHTMLActuator.prototype.clearContainer = function (container) {\n  while (container.firstChild) {\n    container.removeChild(container.firstChild);\n  }\n};\n\nHTMLActuator.prototype.addTile = function (tile) {\n  var self = this;\n\n  var wrapper   = document.createElement(\"div\");\n  var inner     = document.createElement(\"div\");\n  var position  = tile.previousPosition || { x: tile.x, y: tile.y };\n  var positionClass = this.positionClass(position);\n\n  // We can't use classlist because it somehow glitches when replacing classes\n  var classes = [\"tile\", \"tile-\" + tile.value, positionClass];\n\n  if (tile.value > 987) classes.push(\"tile-super\");\n\n  this.applyClasses(wrapper, classes);\n\n  inner.classList.add(\"tile-inner\");\n  inner.textContent = tile.value;\n\n  if (tile.previousPosition) {\n    // Make sure that the tile gets rendered in the previous position first\n    window.requestAnimationFrame(function () {\n      classes[2] = self.positionClass({ x: tile.x, y: tile.y });\n      self.applyClasses(wrapper, classes); // Update the position\n    });\n  } else if (tile.mergedFrom) {\n    classes.push(\"tile-merged\");\n    this.applyClasses(wrapper, classes);\n\n    // Render the tiles that merged\n    tile.mergedFrom.forEach(function (merged) {\n      self.addTile(merged);\n    });\n  } else {\n    classes.push(\"tile-new\");\n    this.applyClasses(wrapper, classes);\n  }\n\n  // Add the inner part of the tile to the wrapper\n  wrapper.appendChild(inner);\n\n  // Put the tile on the board\n  this.tileContainer.appendChild(wrapper);\n};\n\nHTMLActuator.prototype.applyClasses = function (element, classes) {\n  element.setAttribute(\"class\", classes.join(\" \"));\n};\n\nHTMLActuator.prototype.normalizePosition = function (position) {\n  return { x: position.x + 1, y: position.y + 1 };\n};\n\nHTMLActuator.prototype.positionClass = function (position) {\n  position = this.normalizePosition(position);\n  return \"tile-position-\" + position.x + \"-\" + position.y;\n};\n\nHTMLActuator.prototype.updateScore = function (score) {\n  this.clearContainer(this.scoreContainer);\n\n  var difference = score - this.score;\n  this.score = score;\n\n  this.scoreContainer.textContent = this.score;\n\n  if (difference > 0) {\n    var addition = document.createElement(\"div\");\n    addition.classList.add(\"score-addition\");\n    addition.textContent = \"+\" + difference;\n\n    this.scoreContainer.appendChild(addition);\n  }\n};\n\nHTMLActuator.prototype.updateBestScore = function (bestScore) {\n  this.bestContainer.textContent = bestScore;\n};\n\nHTMLActuator.prototype.message = function (won) {\n  var type    = won ? \"game-won\" : \"game-over\";\n  var message = won ? \"이겼습니다!\" : \"게임 오버!\";\n\n  this.messageContainer.classList.add(type);\n  this.messageContainer.getElementsByTagName(\"p\")[0].textContent = message;\n};\n\nHTMLActuator.prototype.clearMessage = function () {\n  // IE only takes one value to remove at a time.\n  this.messageContainer.classList.remove(\"game-won\");\n  this.messageContainer.classList.remove(\"game-over\");\n};\n"],"names":["HTMLActuator","this","tileContainer","document","querySelector","scoreContainer","bestContainer","messageContainer","score","prototype","actuate","grid","metadata","self","window","requestAnimationFrame","clearContainer","cells","forEach","column","cell","addTile","updateScore","updateBestScore","bestScore","terminated","over","message","won","continueGame","clearMessage","container","firstChild","removeChild","tile","wrapper","createElement","inner","position","previousPosition","x","y","positionClass","classes","value","push","applyClasses","classList","add","textContent","mergedFrom","merged","appendChild","element","setAttribute","join","normalizePosition","difference","addition","type","getElementsByTagName","remove"],"version":3,"file":"index.d9036aed.js.map"}