diff --git a/doc/ui_sketch_main_mobile.xcf b/doc/ui_sketch_main_mobile.xcf index 101a925..40a2d60 100644 Binary files a/doc/ui_sketch_main_mobile.xcf and b/doc/ui_sketch_main_mobile.xcf differ diff --git a/game.js b/game.js index 37580cf..93335f5 100644 --- a/game.js +++ b/game.js @@ -14,20 +14,34 @@ let seconds_elapsed = 0; let sound_reveal = new Audio("./res/reveal.wav"); let sound_mark = new Audio("./res/mark.wav"); +// Game state saving. window.addEventListener("beforeunload", function() { if (mines_placed && !game_finished) { - save_game_state(); + // We need to save: the minefield, the elapsed time. These also + // get prefixed by the current level. + localStorage.setItem(current_level + "-minefield_html", $("#minefield").innerHTML); + localStorage.setItem(current_level + "-seconds_elapsed", seconds_elapsed); } else { localStorage.removeItem(current_level + "-minefield_html"); localStorage.removeItem(current_level + "-seconds_elapsed"); } }); -function save_game_state() { - // We need to save: the minefield, the elapsed time. These also - // get prefixed by the current level. - localStorage.setItem(current_level + "-minefield_html", $("#minefield").innerHTML); - localStorage.setItem(current_level + "-seconds_elapsed", seconds_elapsed); +function restart_game() { + game_finished = false; + mines_placed = false; + field_height = 8 + Math.floor(current_level / 2); + minefield_initialize(); + // The amount of mines, meanwhile, increases by one I + // think. Just a quick thought. This makes it so the amount of + // mines is around four times less than the amount of cells. + initial_mines_count = 10 + current_level; + stop_timing(); + seconds_elapsed = 0; + $("#time").innerText = get_seconds_readable(seconds_elapsed); + $("#finished-popup").style = "display:none;"; + $("#restart").style = "display:block"; + $("#newgame").style = "display:block"; } function start_or_continue_game(level) { @@ -39,12 +53,7 @@ function start_or_continue_game(level) { let minefield_html = localStorage.getItem(current_level + "-minefield_html"); $("#level").innerText = current_level; if (minefield_html == null) { - field_height = 8 + Math.floor(current_level / 2); - minefield_initialize(); - // The amount of mines, meanwhile, increases by one I - // think. Just a quick thought. This makes it so the amount of - // mines is around four times less than the amount of cells. - initial_mines_count = 10 + current_level; + restart_game(); } else { // If we have a minefield in localStorage, load it back into // the DOM. @@ -72,8 +81,6 @@ function get_seconds_readable(seconds) { return date.toISOString().slice(14, 19); } -// Used for the displayed timer. It's more or less how much time you -// took, but the final time is calculated from a date. function start_timing() { ui_timer = window.setInterval(function() { seconds_elapsed += 1; @@ -115,6 +122,7 @@ function cell_oncontextmenu() { } function minefield_initialize() { + $("#minefield").innerHTML = ""; for (let y = 0; y < field_height; y++) { for (let x = 0; x < field_width; x++) { let cell = document.createElement("div"); @@ -143,33 +151,6 @@ function place_mines(avoid_x, avoid_y) { mines_placed = true; } -function check_victory() { - for (let y = 0; y < field_height; ++y) { - for (let x = 0; x < field_width; ++x) { - let cell = $("#c" + x + "-" + y); - if (cell.classList.contains("unknown") && !(cell.classList.contains("flagged") && cell.classList.contains("mine"))) { - return false; - } - } - } - // If we get here, we've won - game_finished = true; - stop_timing(); - // Save a high score. - let cur_score = localStorage.getItem(current_level + "-high_score"); - if (cur_score == null) { - localStorage.setItem(current_level + "-high_score", seconds_elapsed) - } else if (parseInt(cur_score) > seconds_elapsed) { - localStorage.setItem(current_level + "-high_score", seconds_elapsed) - } - // Send a message proclaiming we've won. - window.webxdc.sendUpdate({ - payload: {}, - info: window.webxdc.selfName + " finished Level " + current_level + " in " + get_seconds_readable(seconds_elapsed) + "!" - }, window.webxdc.selfName + " won a game of Minesweeper"); - return true; -} - function get_neighbours(cell) { let cells = []; for (let x = cell.x - 1; x <= cell.x + 1; ++x) { @@ -213,9 +194,54 @@ function reveal_mines(cell) { sound_reveal.play(); } +// Shows the game won/over popup. +function show_popup(victory) { + $("#finished-popup").style = "display:flex;"; + $("#restart").style = "display:none"; + $("#newgame").style = "display:none"; + if (!victory) { + $("#nextlevel").style = "display:none"; + $("#message").innerText = "You've lost!" + } else { + $("#nextlevel").style = "display:block"; + $("#message").innerText = "You've won!" + } +} + +function check_victory() { + for (let y = 0; y < field_height; ++y) { + for (let x = 0; x < field_width; ++x) { + let cell = $("#c" + x + "-" + y); + if (cell.classList.contains("unknown") && !(cell.classList.contains("flagged") && cell.classList.contains("mine"))) { + return false; + } + } + } + // If we get here, we've won + game_finished = true; + stop_timing(); + // Set the maximum level to be one higher, meaning the player unlocked the next level. + localStorage.setItem("maximum_level", maximum_level + 1); + show_popup(true); + // Save a high score. + let cur_score = localStorage.getItem(current_level + "-high_score"); + if (cur_score == null) { + localStorage.setItem(current_level + "-high_score", seconds_elapsed) + } else if (parseInt(cur_score) > seconds_elapsed) { + localStorage.setItem(current_level + "-high_score", seconds_elapsed) + } + // Send a message proclaiming we've won. + window.webxdc.sendUpdate({ + payload: {}, + info: window.webxdc.selfName + " finished Level " + current_level + " in " + get_seconds_readable(seconds_elapsed) + "!" + }, window.webxdc.selfName + " won a game of Minesweeper"); + return true; +} + function lose_game() { game_finished = true; stop_timing(); + show_popup(false); $$("#minefield div").forEach(function(cell) { cell.classList.remove("unknown"); cell.classList.add("known"); @@ -224,4 +250,4 @@ function lose_game() { cell.innerText = ""; } }); -} \ No newline at end of file +} diff --git a/index.html b/index.html index 58540df..394a8aa 100644 --- a/index.html +++ b/index.html @@ -13,19 +13,21 @@