diff --git a/assets/maps/microban.js b/assets/maps/microban.js index e5bb084..7d71e94 100644 --- a/assets/maps/microban.js +++ b/assets/maps/microban.js @@ -20,8 +20,8 @@ var level_2 = ` ###### `; -var level_3_par = 100; -var level_3 = ` +var level_10_par = 100; +var level_10 = ` ###### ### #### # 0 # @@ -40,8 +40,8 @@ var level_4 = ` #### `; -var level_5_par = 100; -var level_5 = ` +var level_3_par = 100; +var level_3 = ` ####### # # # .0. # @@ -100,8 +100,8 @@ var level_9 = ` ### `; -var level_10_par = 100; -var level_10 = ` +var level_5_par = 100; +var level_5 = ` ##### #. # #.# # @@ -1988,6 +1988,8 @@ var level_155 = ` `; var microban_levels = [ + [level_1, level_1_par], + [level_2, level_2_par], [level_3, level_3_par], [level_4, level_4_par], diff --git a/assets/script.js b/assets/script.js index 97ebe27..6515e9d 100644 --- a/assets/script.js +++ b/assets/script.js @@ -1,14 +1,33 @@ var _listener; +function getCookie(cname) { + let name = cname + "="; + let decodedCookie = decodeURIComponent(document.cookie); + let ca = decodedCookie.split(";"); + for (let i = 0; i < ca.length; i++) { + let c = ca[i]; + while (c.charAt(0) == " ") { + c = c.substring(1); + } + if (c.indexOf(name) == 0) { + return c.substring(name.length, c.length); + } + } + return ""; +} + class Game { constructor() { this.mapInstance = null; + this.levelCount = levels.length; this.level = 1; this.lives = 10; this.points = 0; this.totalMoves = 0; this.levelMoves = {}; this.traditional = false; + + this.populateLevelSelector(); } toggleTraditional() { @@ -34,13 +53,38 @@ class Game { document.removeEventListener("keydown", _listener); g.levelMoves[this.level] = 0; this.lives -= 1; - // handle points this.initializeLevel(); } - continue() {} + populateLevelSelector() { + let elem = document.getElementById("level-selector"); + elem.innerHTML = ""; + let maxLevel = parseInt(getCookie("sokobanya")) + 1; + if (isNaN(maxLevel)) { + document.cookie = "sokobanya=1"; + maxLevel = 1; + } + for (let i = 0; i < this.levelCount; i++) { + if (i !== 0) { + let opt = document.createElement("option"); + opt.value = i; + opt.innerHTML = i; - handlePoints() {} + if (i !== 1 && i > maxLevel) { + opt.disabled = true; + } + + elem.appendChild(opt); + } + } + + var self = this; + elem.addEventListener("change", function () { + self.levelMoves[this.level] = 0; + self.level = parseInt(elem.value); + self.initializeLevel(); + }); + } } class Map { @@ -308,8 +352,14 @@ class Map { } continue() { + let maxLevel = parseInt(getCookie("sokobanya")); + if (maxLevel < g.level) { + document.cookie = `sokobanya=${g.level}`; + } + console.log(parseInt(getCookie("sokobanya"))); g.level += 1; g.initializeLevel(); + g.populateLevelSelector(); let continueLink = document.getElementById("continueLink"); continueLink.classList.add("disabled"); } diff --git a/index.html b/index.html index 579e7c5..e466c29 100644 --- a/index.html +++ b/index.html @@ -99,6 +99,11 @@ color: green; text-decoration: none; } + + #level-select-container { + font-size: 15px; + margin-bottom: 10px; + }
settings @@ -113,6 +118,10 @@ ▄█ █▄█ █░█ █▄█ █▄█ █▀█ █░▀█ ░█░ █▀█
LEVEL: 0 | MOVES: 0 | LIVES: 10 | POINTS: 0
+
+ SELECT LEVEL: + +
@@ -196,6 +205,10 @@

UPDATES:

+
  • + (09/10/25) v1.2: added level selector so you can pick up where you left + off (unless you delete your cookies or use a privacy browser). +
  • (09/07/25) v1.1: released mobile support via toggleable Dpad, see settings at top right of page! Also added support for traditional @@ -204,9 +217,9 @@

    TODO:

    • Mobile Support
    • -
    • Selectable levels upon completion
    • +
    • Selectable levels upon completion
    • Create a cool song and SFX
    • -
    • Points system
    • +
    • Points system (I probably will not do this, seems unnecessary)
    • Steam animation when you beat a level
    • Add more level sets (worlds)