From 34c4e82330c70848d4eeb12598569fb0d84d39b3 Mon Sep 17 00:00:00 2001 From: Jonas Weinz Date: Thu, 21 Mar 2019 15:41:38 +0100 Subject: [PATCH] session cookies --- main.js | 81 ++++++++++++++++++++++++++++++++++++----- settings.js | 8 +++- sw.js | 24 ++++++++++++ websocket_connection.js | 74 ++++++++++++++++++++++++++++++++----- 4 files changed, 166 insertions(+), 21 deletions(-) diff --git a/main.js b/main.js index 6eae975..a303110 100644 --- a/main.js +++ b/main.js @@ -68,6 +68,39 @@ logged_in = false; // connection stuff: var connection = null; +var session_id = null; + + +// cookies: +function get_cookie(cname) { + var name = cname + "="; + var ca = document.cookie.split(';'); + for(var i = 0; i < ca.length; i++) { + var c = ca[i]; + while (c.charAt(0) == ' ') { + c = c.substring(1); + } + if (c.indexOf(name) == 0) { + return c.substring(name.length, c.length); + } + } + return ""; +} + +function set_cookie(cname, cvalue, exdays) { + var d = new Date(); + d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000)); + var expires = "expires="+d.toUTCString(); + document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/"; +} + +function check_cookie(cname) { + var tmp = get_cookie(cname); + if (tmp != "") { + return true; + } + return false; +} @@ -150,16 +183,8 @@ login_callback = function() end_local_game(); l_username.innerHTML = "logged in as: " + connection.player.get_name(); -} + set_cookie("sessionid", connection.session_id, 30); -login = function(){ - - if (connection != null) - { - connection.close(); - } - connection = new WebsocketConnection(server_url, server_port, grid, l_status, match_slot_container, match_control, login_callback); - connection.connect(i_register_username.value, i_register_pw.value); } logout = function() @@ -169,6 +194,12 @@ logout = function() { connection.close(); + if (check_cookie("sessionid")) + { + // delete session: + session_id = get_cookie("sessionid"); + set_cookie("sessionid", session_id, -100); + } } @@ -179,6 +210,36 @@ logout = function() end_local_game(); } +reconnect = function() +{ + if (check_cookie("sessionid")) + { + session_id = get_cookie("sessionid"); + if (connection != null) + { + connection.close(); + } + connection = new WebsocketConnection(server_url, server_port, grid, l_status, match_slot_container, match_control, login_callback, on_connection_error); + connection.reconnect(session_id); + } +} + +on_connection_error = function() +{ + connection = null; + logout(); +} + +login = function(){ + + if (connection != null) + { + connection.close(); + } + connection = new WebsocketConnection(server_url, server_port, grid, l_status, match_slot_container, match_control, login_callback, on_connection_error); + connection.connect(i_register_username.value, i_register_pw.value); +} + search_match = function() { if (connection != null) @@ -215,6 +276,8 @@ b_logout.addEventListener("click", logout); b_match_search.addEventListener("click", search_match); b_match_invite.addEventListener("click", invite_player); +reconnect(); + /* var websocket_connection = new WebsocketConnection('127.0.0.1', 5556); diff --git a/settings.js b/settings.js index ee39b5d..692cf89 100644 --- a/settings.js +++ b/settings.js @@ -1,2 +1,6 @@ -var server_url = "the-cake-is-a-lie.net"; -var server_port = "5556"; \ No newline at end of file +var server_protocol = "ws://" +var server_url = "127.0.0.1"; +var server_port = "5556"; + +var home = "https://the-cake-is-a-lie.net/website/ultimate_tictactoe/"; +var rel_home = "/website/ultimate_tictactoe"; \ No newline at end of file diff --git a/sw.js b/sw.js index 5791dd9..c19b768 100644 --- a/sw.js +++ b/sw.js @@ -32,4 +32,28 @@ self.addEventListener('install', function(e) { return response || fetch(event.request); }) ); +}); + +self.addEventListener('notificationclick', function(event) { + event.waitUntil(async function() { + const allClients = await clients.matchAll({ + includeUncontrolled: true + }); + + var instance = None; + + + // Let's see if we already have a window open: + for (const client of allClients) { + client.focus(); + instance = client; + break; + } + + // If we didn't find an existing window, + // open a new one: + if (!instance) { + instance = await clients.openWindow(rel_home); + } + }()); }); \ No newline at end of file diff --git a/websocket_connection.js b/websocket_connection.js index b5edc30..002a0e4 100644 --- a/websocket_connection.js +++ b/websocket_connection.js @@ -1,6 +1,6 @@ class WebsocketConnection { - constructor(ip, port, grid, status_label, matches_container, control_container, login_callback_func) + constructor(ip, port, grid, status_label, matches_container, control_container, login_callback_func, error_callback_func) { this.ip = ip; this.port = port; @@ -23,8 +23,9 @@ class WebsocketConnection this.login_callback_func = login_callback_func; this.openmatches = {}; + this.error_callback_func = error_callback_func; - this. + this.closed_by_user = false; matches_container.hide(); @@ -57,10 +58,22 @@ class WebsocketConnection this.login(username, pw) } + on_reopen(session_id) + { + this.connected = true; + this.relogin(session_id); + } + on_close() { this.registered = false; this.connected = false; + if (!this.closed_by_user) + { + this.status_label.innerHTML = "connection to server closed"; + this.error_callback_func(); + } + } on_error() @@ -68,6 +81,11 @@ class WebsocketConnection console.log("error in websocket connection"); this.registered = false; this.connected = false; + if (!this.closed_by_user) + { + this.status_label.innerHTML = "connection to server lost"; + this.error_callback_func(); + } } @@ -90,9 +108,8 @@ class WebsocketConnection this.on_register_response(msg.data); break; - case "temp_session_response": - console.log(json_msg) - this.on_temp_session_response(msg.data); + case "reconnect_response": + this.on_reconnect_response(msg.data); break; case "match_update": @@ -118,7 +135,13 @@ class WebsocketConnection this.openmatches[this.active_match].on_user_close(); - } + } + + if (this.current_end_button != null) + { + this.control_container.container.deleteChild(this.current_end_button); + this.current_end_button = null; + } } @@ -149,7 +172,6 @@ class WebsocketConnection if (id in this.openmatches) { this.openmatches[id].update_match_state(match_state) - console.log("update!!!"); if (this.active_match == id) { this.openmatches[id].open_match(); @@ -179,9 +201,17 @@ class WebsocketConnection } - on_temp_session_response(data) + on_reconnect_response(data) { - console.log("not supported yet"); + if (data.success) + { + this.registered = true; + this.session_id = data.id; + this.player.set_name(data.user); + this.login_callback_func(); + } + + this.status_label.innerHTML = data.msg; } on_match_request_response(data) @@ -199,13 +229,22 @@ class WebsocketConnection connect(username, pw) { - this.socket = new WebSocket("wss://" + this.ip + ":" + this.port); + this.socket = new WebSocket(server_protocol + this.ip + ":" + this.port); this.socket.onmessage = (e => this.on_message(e)); this.socket.onopen = (() => this.on_open(username, pw)); this.socket.onerror = (() => this.on_error()); this.socket.onclose = (() => this.on_close()); } + reconnect(session_id) + { + this.socket = new WebSocket(server_protocol + this.ip + ":" + this.port); + this.socket.onmessage = (e => this.on_message(e)); + this.socket.onopen = (() => this.on_reopen(session_id)); + this.socket.onerror = (() => this.on_error()); + this.socket.onclose = (() => this.on_close()); + } + send_move(sub_x, sub_y, x, y, match_id) { var msg_object = { @@ -261,6 +300,19 @@ class WebsocketConnection this.socket.send(JSON.stringify(msg_object)); } + relogin(session_id) + { + // register for game queue + var msg_object = { + type: "reconnect", + data: { + id: session_id + } + }; + + this.socket.send(JSON.stringify(msg_object)); + } + send_disconnect() { if (!this.is_connected) @@ -283,6 +335,8 @@ class WebsocketConnection { this.openmatches[key].remove_match(); } + this.status_label.innerHTML = "logged out"; + this.closed_by_user = true; this.socket.close(); }