From 63de566fb925e821a389e2df59250126fccff25a Mon Sep 17 00:00:00 2001 From: Ben Burlingham Date: Sat, 18 Jul 2020 11:26:41 -0700 Subject: [PATCH] Name and socket ID persistence. --- README.md | 7 ++----- client/connection.js | 4 +++- client/controls.js | 8 ++++++-- client/cookie.js | 8 ++++---- client/grid.js | 2 +- client/stack.js | 2 +- index.html | 10 +++------- package-lock.json | 8 ++++---- package.json | 2 +- server/ricochet.js | 8 ++++++-- 10 files changed, 31 insertions(+), 28 deletions(-) diff --git a/README.md b/README.md index d257a13..1265cdd 100644 --- a/README.md +++ b/README.md @@ -13,9 +13,6 @@ A victory state can be stored by taking a snapshot of the current stack. Icons from [https://game-icons.net](https://game-icons.net) ## TODO -- tutorial -- restore name prompt -- home button - - reset robots? on server reset...avoid multiple shadows -- Fix 9 things +- "start next round" button not showing on new join in win state +- Fix 6 things diff --git a/client/connection.js b/client/connection.js index 2b62829..172ab67 100644 --- a/client/connection.js +++ b/client/connection.js @@ -31,7 +31,9 @@ const Connection = function() { Connection.prototype.connect = function() { const hostname = window.location.hostname; - this.ws = new WebSocket(`ws://${hostname}:8080/ricochet?name=${this.name}`); + const uuid = Cookie.getCookie({ name: 'player_id' }); + + this.ws = new WebSocket(`ws://${hostname}:8080/ricochet?name=${this.name}&uuid=${uuid}`); this.ws.addEventListener('open', this.socketListeners.open); this.ws.addEventListener('error', this.socketListeners.error); diff --git a/client/controls.js b/client/controls.js index 904b20a..e4de5e0 100644 --- a/client/controls.js +++ b/client/controls.js @@ -128,7 +128,11 @@ Controls.prototype.msgComplete = function(evt) { }; Controls.prototype.msgConnected = function(evt) { - this.playerId = evt.detail.body; + this.playerId = evt.detail.body.player_id; + + Cookie.setCookie({ name: 'player_name', value: evt.detail.body.player_name, days: 1 }); + Cookie.setCookie({ name: 'player_id', value: this.playerId, days: 1 }); + this.drawPlayers(); }; @@ -188,7 +192,7 @@ Controls.prototype.msgState = function(evt) { }; Controls.prototype.msgWin = function(evt) { - document.getElementById('controls-win-message').innerHTML = `Congratulations ${this.names[evt.detail.player_id]} !`; + document.getElementById('controls-win-message').innerHTML = `Congratulations ${this.names[evt.detail.body.player_id]} !`; document.getElementById('controls-win-count').innerHTML = evt.detail.body.moveCount; }; diff --git a/client/cookie.js b/client/cookie.js index 9b87af3..a072c37 100644 --- a/client/cookie.js +++ b/client/cookie.js @@ -1,16 +1,16 @@ const Cookie = { - getCookie: function(name) { + getCookie: function({ name }) { var v = document.cookie.match('(^|;) ?' + name + '=([^;]*)(;|$)'); return v ? decodeURI(v[2]) : null; }, - setCookie: function(name, value, days) { + setCookie: function({ name, value, days }) { var d = new Date; d.setTime(d.getTime() + 24*60*60*1000*days); document.cookie = name + "=" + encodeURI(value) + ";path=/;expires=" + d.toGMTString(); }, - deleteCookie: function(name) { - Util.setCookie(name, '', -1); + deleteCookie: function({ name }) { + Cookie.setCookie({ name, value: '', days: -1 }); } }; \ No newline at end of file diff --git a/client/grid.js b/client/grid.js index 90d1f7a..c4158f9 100644 --- a/client/grid.js +++ b/client/grid.js @@ -333,7 +333,7 @@ Grid.prototype.findNextObstacle = function({ direction, i, j }) { }; Grid.prototype.checkObjective = function({ id, i, j }) { - const complete = (i === this.objective.i && j === this.objective.j && id === this.objective.id); + const complete = (i === this.objective.i * 1 && j === this.objective.j * 1 && id === this.objective.id); const evtSolve = new CustomEvent('L-complete', { detail: { complete }}); document.dispatchEvent(evtSolve); diff --git a/client/stack.js b/client/stack.js index 59ebf48..f4293a4 100644 --- a/client/stack.js +++ b/client/stack.js @@ -27,7 +27,7 @@ Stack.prototype.getInitialPositions = function() { }; Stack.prototype.msgConnected = function(evt) { - this.playerId = evt.detail.body; + this.playerId = evt.detail.body.player_id; }; Stack.prototype.msgRobots = function(evt) { diff --git a/index.html b/index.html index 25cf5f8..aca4507 100644 --- a/index.html +++ b/index.html @@ -67,6 +67,7 @@ @@ -84,13 +85,8 @@ new Stack(); // Entry point. - - const names = ["Biff", "Morty", "Herb", "Chester", "Lyle", "Cap", "Dale", "Ned", "Mindy", "Frankie", "Gabriel", "Mona", "Dolores", - "Sepulveda", "Venus", "Blingbing", "Cyrpt"] - const r = Math.floor(Math.random() * names.length); - const rawInput = names[r] - - // const rawInput = prompt("What is your name?"); + const name = Cookie.getCookie({ name: "player_name" }); + const rawInput = name ? name : prompt("What is your name?"); if (!rawInput) { const evt = new CustomEvent('L-conn-error', { detail: "noname" }); diff --git a/package-lock.json b/package-lock.json index f18ce14..6d7669b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4,10 +4,10 @@ "lockfileVersion": 1, "requires": true, "dependencies": { - "node-uuid": { - "version": "1.4.8", - "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz", - "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc=" + "uuid": { + "version": "8.2.0", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.2.0.tgz", + "integrity": "sha512-CYpGiFTUrmI6OBMkAdjSDM0k5h8SkkiTP4WAjQgDgNB1S3Ou9VBEvr6q0Kv2H1mMk7IWfxYGpMH5sd5AvcIV2Q==" }, "ws": { "version": "7.3.0", diff --git a/package.json b/package.json index 0678fd2..da35df6 100644 --- a/package.json +++ b/package.json @@ -9,7 +9,7 @@ "author": "", "license": "ISC", "dependencies": { - "node-uuid": "^1.4.8", + "uuid": "^8.2.0", "ws": "^7.3.0" }, "devDependencies": {} diff --git a/server/ricochet.js b/server/ricochet.js index 9ad841d..7c625eb 100644 --- a/server/ricochet.js +++ b/server/ricochet.js @@ -1,4 +1,4 @@ -const uuid = require('node-uuid'); +const uuid = require('uuid'); const UrlParser = require('url'); const DEBUG = (process.env.NODE_ENV !== "production"); @@ -75,9 +75,11 @@ Ricochet.prototype.onConnect = function(ws, req) { this.addPlayer(ws.id, santizedName); + console.log(ws.id) + this.messenger.messageAll({ type: 'players', body: this.players }); - this.messenger.messageOne(ws, { type: 'connected', body: ws.id}); + this.messenger.messageOne(ws, { type: 'connected', body: { player_id: ws.id, player_name: santizedName } }); this.messenger.messageOne(ws, { type: 'robots', body: this.robots}); this.messenger.messageOne(ws, { type: 'objective', body: this.objective}); this.messenger.messageOne(ws, { type: 'state', body: this.state}); @@ -296,6 +298,8 @@ Ricochet.prototype.msgSkip = function() { Ricochet.prototype.msgSolve = function(message) { clearTimeout(this.countdownTimer); + + this.countdownTimer = setTimeout(this.onCountdownComplete.bind(this), this.countdownDuration * 1000); this.countdownTimestamp = new Date().getTime();