const name_input = document.querySelector("#name");
const name_dialog = document.querySelector("#name-dialog");
+ var informed_name;
const images = document.querySelector("#images");
const zombo_form = document.querySelector("#zombo-form");
const prompt = document.querySelector("#prompt");
socket.on('inform-name', (name) => {
console.log("Received inform-name event: " + name);
+
+ /* When we receive a name we store it in 3 places:
+ *
+ * * The informed_name variable (confirming what the server knows)
+ * * The name_input field (so the user will see that in their profile)
+ * * In localStorage (for use in a future session)
+ */
+ informed_name = name;
name_input.value = name;
+ localStorage.setItem('name', name);
});
socket.on('reset', () => {
figure.appendChild(comment_form);
comment_input.addEventListener('focus', () => {
- /* Do nothing if name is already set. */
- if (name_input.value)
+ /* If the server has informed us it has our name, we are done. */
+ if (informed_name)
+ return;
+
+ /* If server has no name, check local storage. */
+ const name = localStorage.getItem('name');
+ if (name) {
+ socket.emit('set-name', name);
return;
+ }
- /* Otherwise, bring up the modal dialog to set the name. */
+ /* Failing both, bring up the modal dialog to set the name. */
name_dialog.showModal();
});