{"version":3,"file":"bundle.js","sources":["../src/main.js"],"sourcesContent":["/**\n * Main container for the RPSLS App\n */\nfunction App() {\n  var _this = this;\n\n  /** \n   * Initialization function. \n   *   - sets up the websocket connection\n   *   - loads the userID\n   *   - builds the initial UI.\n   */\n  _this.init = () => {\n\n    _this.handleEvents();\n    const wsURL = 'wss://foamngcalc.execute-api.us-west-2.amazonaws.com/Prod'\n    _this.ws = new WebSocket(wsURL)\n\n    _this.played = false;\n\n    // Persist a user id to use across connections\n    // The backend gets a connection ID with every request, but that changes if\n    // the browser has to reconnect. This gives a stable player identifier without\n    // them having to log in.\n    _this.userId = localStorage.getItem(\"rockpaper-userid\");\n    if(_this.userId == null) {\n      _this.userId = Math.random().toString(36).substr(2, 17);\n      localStorage.setItem(\"rockpaper-userid\", _this.userId);\n    }\n\n    // Handler which runs every time a message comes from the websocket.\n    _this.ws.onmessage = e => {\n        d = JSON.parse(e.data)\n        // Only when needed:\n        // Add the game ID to the URL so the link can be shared with others\n        if (_this.gameId != d.gameId && d.gameId != \"\") {\n          _this.gameId = d.gameId\n          window.location = window.location + \"#\" + d.gameId\n        }\n        // Update the round that we're playing on now\n        _this.roundId = d.round\n        // Update the UI with the data from the websocket\n        _this.updateUI(d)\n    }\n\n    // Handler which does UI updates\n    _this.updateUI = d => {\n      // If the server sends a roundSummary, that means a round is over.\n      if (\"roundSummary\" in d) {\n        _this.statusElem.innerHTML = d.roundSummary\n         // Update the images for the moves\n         setPlayImg(_this.youPlayElem, `${d.yourPlay}.png`, true)\n         setPlayImg(_this.themPlayElem, `${d.theirPlay}.png`, false)\n        // Set the colors based on who won\n        if(d.winner) {\n          _this.youPlayElem.style.backgroundColor = \"lightgreen\"\n          _this.themPlayElem.style.backgroundColor = \"palevioletred\"\n        } else if(d.yourPlay != d.theirPlay) {\n          _this.themPlayElem.style.backgroundColor = \"lightgreen\"\n          _this.youPlayElem.style.backgroundColor = \"palevioletred\"\n        }\n        // Set a flag meaning we're ready to play again\n        _this.played = false;\n      }\n      // Update the scores no matter if the round is over or not\n      _this.youScoreElem.innerHTML = `You: ${d.yourScore}`\n      _this.themScoreElem.innerHTML = `Them: ${d.theirScore}`\n    }\n\n    // Handler which runs when a new websocket connection is opened\n    _this.ws.onopen = () => {\n      // Use the URL bar to see if the player is in a game already.\n      // No hash in the URL means start a new game\n      var url = new URL(window.location)\n      if (url.hash == \"\") {\n        console.log(\"hash was empty, creating a game\")\n        // no game is created yet\n          _this.ws.send(JSON.stringify({\n            'action': 'new',\n            'userId': _this.userId,\n          }))\n        _this.statusElem.innerHTML = \"Created a game. Share the link with a friend to play!\"\n      } else {\n        // cut the hash off\n        _this.gameId = url.hash.substring(1)\n        console.log(\"attempting to connect to \" + _this.gameId)\n          _this.ws.send(JSON.stringify({\n            'action': 'join',\n            'userId': _this.userId,\n            'gameId': _this.gameId,\n          }))\n          _this.statusElem.innerHTML = \"Joined Game! Make a play now.\"\n      }\n    }\n\n  }\n\n  // Handler when a play is made\n  _this.makePlay = e => {\n    // Find the button element where the click event came from\n    var elem = e.target.closest(\"button\")\n    // Don't let a player submit a play if the browser knows they already did\n    if (_this.played) {\n      console.log(\"ignoring second play attempt\")\n      return\n    }\n    console.log(\"got a play event for \" + elem + \" named \" + elem.id)\n      // Send a play event to the server\n      _this.ws.send(JSON.stringify({\n        'action': 'play',\n        'gameId': _this.gameId,\n        'userId': _this.userId,\n        'round': _this.roundId,\n        'play': elem.id,\n      }))\n    _this.statusElem.innerHTML = `You played ${elem.id}, waiting on other player ....`\n    _this.played = true\n    _this.themPlayElem.style.backgroundColor = \"\"\n    _this.youPlayElem.style.backgroundColor = \"\"\n    setPlayImg(_this.themPlayElem, \"loading.gif\", true)\n    setPlayImg(_this.youPlayElem, `${elem.id}.png`, true)\n  }\n\n  // Set up all the click handlers for the UI buttons\n  _this.handleEvents = () => {\n    console.log(\"setting up onclick events\")\n    document.querySelector('#rock').onclick = _this.makePlay\n    document.querySelector('#paper').onclick = _this.makePlay\n    document.querySelector('#scissors').onclick = _this.makePlay\n    document.querySelector('#lizard').onclick = _this.makePlay\n    document.querySelector('#spock').onclick = _this.makePlay\n    document.querySelector('#copytoclipboard').onclick = copyURLToClipboard\n    _this.statusElem = document.querySelector('#status')\n    _this.youScoreElem = document.querySelector('#youscore')\n    _this.themScoreElem = document.querySelector('#themscore')\n    _this.youPlayElem = document.querySelector(\"#youplay\")\n    _this.themPlayElem = document.querySelector(\"#themplay\")\n  }\n}\n\n/** Set image in the UI for the hand gesture of the player.\n *  If the reverse flag is set, display the image flipped\n *  This makes it so the same set of images can be used\n *  to show them coming from the left or right player\n */ \nconst setPlayImg = (element, url, reverse) => {\n  var img = document.createElement(\"img\")\n  img.src = url\n  if (reverse) {\n    img.style.transform = \"scaleX(-1)\";\n  }\n  if(element.firstElementChild == null) {\n    element.appendChild(img)\n  } else {\n    element.replaceChild(img, element.firstElementChild)\n  }\n}\n\n// Function discovered somewhere online\n// Creates a temporary element to hold the URL text\n// so it can be copied to the clipboard, then delete the element\nconst copyURLToClipboard = () => {\n  const el = document.createElement('textarea');\n  el.value = document.location;\n  el.setAttribute('readonly', '');\n  el.style.position = 'absolute';\n  el.style.left = '-9999px';\n  document.body.appendChild(el);\n  el.select();\n  document.execCommand('copy');\n  document.body.removeChild(el);\n};\n\nvar app = new App();\n\n// Run the init message once the onload event fires\nwindow.addEventListener(\"load\", function () { app.init() }, false);\n"],"names":[],"mappings":"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"}