engine/mainmenu.js

   1 /*
   2  * mainmenu.js
   3  *
   4  * Copyright 2020 Elias Fleckenstein <eliasfleckenstein@web.de>
   5  *
   6  * This program is free software; you can redistribute it and/or modify
   7  * it under the terms of the GNU General Public License as published by
   8  * the Free Software Foundation; either version 2 of the License, or
   9  * (at your option) any later version.
  10  *
  11  * This program is distributed in the hope that it will be useful,
  12  * but WITHOUT ANY WARRANTY; without even the implied warranty of
  13  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  14  * GNU General Public License for more details.
  15  *
  16  * You should have received a copy of the GNU General Public License
  17  * along with this program; if not, write to the Free Software
  18  * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston,
  19  * MA 02110-1301, USA.
  20  *
  21  *
  22  */
  23 dragonblocks.mainmenu = {};
  24 dragonblocks.registerOnStart(_ => {
  25         document.getElementById("dragonblocks.mainmenu.content").innerHTML = "<h1 style='font-size:50px'>Loading...</h1>";
  26 });
  27 dragonblocks.registerOnStarted(_ => {
  28         document.getElementById("dragonblocks.mainmenu").style.visibility = "hidden";
  29 });
  30 dragonblocks.registerOnQuit(_ => {
  31         document.getElementById("dragonblocks.mainmenu").style.visibility = "visible";
  32         document.getElementById("dragonblocks.mainmenu.content").innerHTML = "<h1 style='font-size:50px'>Saving...</h1>";
  33 });
  34 {
  35         let mainmenu = document.body.insertBefore(document.createElement("div"), document.body.firstChild);
  36         mainmenu.id = "dragonblocks.mainmenu";
  37         mainmenu.style.visibility = "hidden";
  38         let center = mainmenu.appendChild(document.createElement("center"));
  39         let img = center.appendChild(document.createElement("img"));
  40         img.src = "textures/logo-mainmenu.png";
  41         let content = center.appendChild(document.createElement("div"));
  42         content.id = "dragonblocks.mainmenu.content";
  43         content.style.position = "relative";
  44         content.style.top = "50px";
  45         let buttons = [
  46                 {
  47                         text: "Load Saved World",
  48                         action: _ => { dragonblocks.mainmenu.loadWorldGUI.open() },
  49                         disabled: ! dragonblocks.loggedin,
  50                 },
  51                 {
  52                         text: "Create New World",
  53                         action: _ => { dragonblocks.mainmenu.createWorldGUI.open() }
  54                 },
  55                 {
  56                         text: "Credits",
  57                         action: _ => { dragonblocks.mainmenu.creditsGUI.open() }
  58                 },
  59                 {
  60                         text: "Quit",
  61                         action: _ => { history.back() }
  62                 }
  63         ];
  64         for(let {text: text, action: action, disabled: disabled} of buttons){
  65                 let button = content.appendChild(document.createElement("button"));
  66                 button.style.fontSize = "40px";
  67                 button.style.width = "100%";
  68                 button.innerHTML = text;
  69                 button.disabled = disabled;
  70                 button.addEventListener("click", action);
  71                 content.appendChild(document.createElement("br"));
  72                 content.appendChild(document.createElement("br"));
  73         }
  74         for(let {text: text, side: side} of [{side: "left", text: dragonblocks.getVersion()}, {side: "right", text: dragonblocks.settings.version.copyright}]){
  75                 let span = content.appendChild(document.createElement("span"));
  76                 span.style.position = "fixed";
  77                 span.style.bottom = "5px";
  78                 span.style[side] = "5px";
  79                 span.innerHTML = text;
  80         }
  81         document.title = dragonblocks.getVersion();
  82         img.addEventListener("load", _ => {
  83                 document.body.style.backgroundColor = "skyblue";
  84                 document.getElementById("elidragon").style.display = "none";
  85                 content.style.width = img.offsetWidth + "px";
  86                 mainmenu.style.visibility = "visible";
  87         });
  88 }
  89 if(dragonblocks.loggedin){
  90         dragonblocks.loadWorldlist();
  91         let gui = dragonblocks.mainmenu.loadWorldGUI = dragonblocks.gui.createBox();
  92         let headline = gui.create("h1");
  93         headline.innerHTML = "Select World";
  94         headline.align = "center";
  95         let worldlist = gui.create("ul");
  96         for(let world of dragonblocks.worlds){
  97                 let worldDisplay = worldlist.appendChild(document.createElement("li"));
  98                 worldDisplay.style.fontSize = "20px";
  99                 worldDisplay.textContent = world;
 100                 worldDisplay.style.postion = "relative";
 101                 let button = worldDisplay.appendChild(document.createElement("button"));
 102                 button.textContent = "Play";
 103                 button.style.position = "absolute";
 104                 button.style.right = "5px";
 105                 button.style.fontSize = "12px";
 106                 button.addEventListener("click", event => {
 107                         event.srcElement.blur();
 108                         gui.close();
 109                         dragonblocks.loadWorld(world);
 110                 });
 111         }
 112 }
 113 {
 114         let gui = dragonblocks.mainmenu.createWorldGUI = dragonblocks.gui.createBox();
 115         let properties = {};
 116         let headline = gui.create("h1");
 117         headline.innerHTML = "New World";
 118         headline.align = "center";
 119         // Worldname
 120         gui.create("h2").innerHTML = "&ensp;World Name";
 121         let worldnameInput = gui.create("input");
 122         worldnameInput.type = "text";
 123         worldnameInput.style.position = "relative";
 124         worldnameInput.style.left = "40px";
 125         let worldnameAlert = gui.create("b");
 126         worldnameAlert.style.position = "relative";
 127         worldnameAlert.style.left = "50px";
 128         // Mods
 129         properties.mods = {};
 130         gui.create("h2").innerHTML = "&ensp;Mods";
 131         let modlist = gui.create("ul");
 132         for(let mod of dragonblocks.availableMods){
 133                 let modDisplay = modlist.appendChild(document.createElement("li"));
 134                 modDisplay.style.fontSize = "20px";
 135                 modDisplay.innerHTML = mod;
 136                 modDisplay.style.postion = "relative";
 137                 $.get({
 138                         url: "mods/" + mod + "/description.txt",
 139                         success: data => {
 140                                 modDisplay.title = data;
 141                         }
 142                 });
 143                 let checkbox = modDisplay.appendChild(document.createElement("input"));
 144                 checkbox.type = "checkbox";
 145                 checkbox.style.position = "absolute";
 146                 checkbox.style.right = "5px";
 147                 checkbox.addEventListener("input", _ => { properties.mods[mod] = checkbox.checked });
 148         }
 149         // Gamemode
 150         properties.gamemode = "creative";
 151         gui.create("h2").innerHTML = "&ensp;Gamemode";
 152         for(let gamemode of ["survival", "creative"]){
 153                 let radiobox = gui.create("input");
 154                 radiobox.name = "dragonblocks.mainmenu.createWorldGUI.gamemode";
 155                 radiobox.type = "radio";
 156                 radiobox.checked = (gamemode == properties.gamemode);
 157                 radiobox.style.position = "relative";
 158                 radiobox.style.left = "40px";
 159                 radiobox.addEventListener("input", _ => {
 160                         if(radiobox.checked)
 161                                 properties.gamemode = gamemode;
 162                 });
 163                 let label = gui.create("label");
 164                 label.innerHTML = dblib.humanFormat(gamemode);
 165                 label.for = radiobox.id;
 166                 label.style.position = "relative";
 167                 label.style.left = "40px";
 168         }
 169         // Mapgen
 170         gui.create("h2").innerHTML = "&ensp;Mapgen";
 171         let selectMapgen = gui.create("select");
 172         selectMapgen.style.position = "relative";
 173         selectMapgen.style.left = "40px";
 174         selectMapgen.addEventListener("input", _ => {
 175                 properties.mapgen = selectMapgen.value;
 176         });
 177         for(let mapgen in dragonblocks.mapgen.list)
 178                 selectMapgen.appendChild(document.createElement("option")).innerHTML = mapgen;
 179         properties.mapgen = selectMapgen.value;
 180         gui.create("br");
 181         gui.create("br");
 182         // Button
 183         let button = gui.create("button");
 184         button.style.position = "relative";
 185         button.style.left = "1%";
 186         button.style.width = "98%";
 187         button.innerHTML = "Create World";
 188         if(dragonblocks.loggedin)
 189                 button.disabled = true;
 190         button.addEventListener("click", event => {
 191                 event.srcElement.blur();
 192                 gui.close();
 193                 dragonblocks.createWorld(properties);
 194         });
 195         gui.create("br");
 196         gui.create("br");
 197         // World Name Check
 198         worldnameInput.addEventListener("input", _ => {
 199                 if(! dragonblocks.loggedin){
 200                         worldnameAlert.textContent = "You are not logged in and can not save worlds.";
 201                         worldnameAlert.style.color = "#FF7D00";
 202                         button.disabled = false;
 203                 }
 204                 else if(worldnameInput.value == ""){
 205                         worldnameAlert.textContent = "";
 206                         button.disabled = true;
 207                 }
 208                 else if(! dragonblocks.checkWorldSpelling(worldnameInput.value)){
 209                         worldnameAlert.textContent = "This Worldname contains forbidden characters";
 210                         worldnameAlert.style.color = "#FF001F";
 211                         button.disabled = true;
 212                 }
 213                 else if(dragonblocks.checkWorldExistance(worldnameInput.value)){
 214                         if(dragonblocks.checkWorldOwnership(worldnameInput.value)){
 215                                 worldnameAlert.textContent = "This will overwrite an existing world";
 216                                 worldnameAlert.style.color = "#FF7D00";
 217                                 button.disabled = false;
 218                         }
 219                         else{
 220                                 worldnameAlert.textContent = "This Worldname is taken";
 221                                 worldnameAlert.style.color = "#FF001F";
 222                                 button.disabled = true;
 223                         }
 224                 }
 225                 else{
 226                         worldnameAlert.textContent = "";
 227                         button.disabled = false;
 228                 }
 229                 properties.worldname = worldnameInput.value;
 230         });
 231 }
 232 {
 233         let gui = dragonblocks.mainmenu.creditsGUI = dragonblocks.gui.createBox();
 234         let properties = {
 235                 content: $.getJSON("credits.json").responseJSON,
 236                 stage: 0,
 237         };
 238         for(let dir of ["left", "right"]){
 239                 let arrow = gui.create("div");
 240                 arrow.style.position = "absolute";
 241                 arrow.style.width = "80px";
 242                 arrow.style.height = "80px";
 243                 arrow.style.position = "absolute";
 244                 arrow.style[dir] = "3px";
 245                 arrow.style.background = dragonblocks.getTexture("arrow.png");
 246                 arrow.style.backgroundSize = "cover";
 247                 arrow.style.cursor = "pointer";
 248                 if(dir == "right")
 249                         arrow.style.transform = "rotate(180deg)";
 250                 arrow.addEventListener("click", _ => {
 251                         if(dir == "right")
 252                                 properties.stage++;
 253                         else
 254                                 properties.stage--;
 255                         gui.open();
 256                 });
 257                 dblib.centerVertical(arrow);
 258         }
 259         let content = gui.create("center");
 260         gui.onopen = _ => {
 261                 if(properties.stage < 0)
 262                         properties.stage = properties.content.length - 1;
 263                 if(!properties.content[properties.stage])
 264                         properties.stage = 0;
 265                 content.innerHTML = properties.content[properties.stage];
 266                 dragonblocks.resolveTextures(content);
 267         }
 268 }