Cleanup IS_DEMO flags and introduce Restriction Manager

src/js/application.js

@@ -29,6 +29,7 @@ import { MobileWarningState } from "./states/mobile_warning";
 import { PreloadState } from "./states/preload";
 import { SettingsState } from "./states/settings";
 import { ShapezGameAnalytics } from "./platform/browser/game_analytics";
+import { RestrictionManager } from "./core/restriction_manager";
 
 /**
  * @typedef {import("./platform/game_analytics").GameAnalyticsInterface} GameAnalyticsInterface
@@ -70,6 +71,9 @@ export class Application {
         this.inputMgr = new InputDistributor(this);
         this.backgroundResourceLoader = new BackgroundResourcesLoader(this);
 
+        // Restrictions (Like demo etc)
+        this.restrictionMgr = new RestrictionManager(this);
+
         // Platform dependent stuff
 
         /** @type {StorageInterface} */

src/js/core/config.js

@@ -7,11 +7,6 @@ export const IS_DEBUG =
     (window.location.host.indexOf("localhost:") >= 0 || window.location.host.indexOf("192.168.0.") >= 0) &&
     window.location.search.indexOf("nodebug") < 0;
 
-export const IS_DEMO = queryParamOptions.fullVersion
-    ? false
-    : (!G_IS_DEV && !G_IS_STANDALONE) ||
-      (typeof window !== "undefined" && window.location.search.indexOf("demo") >= 0);
-
 export const SUPPORT_TOUCH = false;
 
 const smoothCanvas = true;

src/js/core/read_write_proxy.js

@@ -81,10 +81,6 @@ export class ReadWriteProxy {
         return this.writeAsync();
     }
 
-    getCurrentData() {
-        return this.currentData;
-    }
-
     /**
      *
      * @param {object} obj

src/js/core/restriction_manager.js

@@ -0,0 +1,97 @@
+import { Application } from "../application";
+import { ExplainedResult } from "./explained_result";
+import { queryParamOptions } from "./query_parameters";
+import { ReadWriteProxy } from "./read_write_proxy";
+
+export class RestrictionManager extends ReadWriteProxy {
+    /**
+     * @param {Application} app
+     */
+    constructor(app) {
+        super(app, "restriction-flags.bin");
+    }
+
+    // -- RW Proxy Impl
+
+    /**
+     * @param {any} data
+     */
+    verify(data) {
+        return ExplainedResult.good();
+    }
+
+    /**
+     */
+    getDefaultData() {
+        return {
+            savegameV1119Imported: false,
+        };
+    }
+
+    /**
+     */
+    getCurrentVersion() {
+        return 1;
+    }
+
+    /**
+     * @param {any} data
+     */
+    migrate(data) {
+        // Todo
+        return ExplainedResult.good();
+    }
+
+    // -- End RW Proxy Impl
+
+    /**
+     * Returns if the app is currently running as the limited version
+     * @returns {boolean}
+     */
+    isLimitedVersion() {
+        return queryParamOptions.fullVersion
+            ? false
+            : (!G_IS_DEV && !G_IS_STANDALONE) ||
+                  (typeof window !== "undefined" && window.location.search.indexOf("demo") >= 0);
+    }
+
+    /**
+     * Returns if the app markets the standalone version on steam
+     * @returns {boolean}
+     */
+    getIsStandaloneMarketingActive() {
+        return this.isLimitedVersion();
+    }
+
+    /**
+     * Returns if exporting the base as a screenshot is possible
+     * @returns {boolean}
+     */
+    getIsExportingScreenshotsPossible() {
+        return !this.isLimitedVersion();
+    }
+
+    /**
+     * Returns the maximum number of supported waypoints
+     * @returns {number}
+     */
+    getMaximumWaypoints() {
+        return this.isLimitedVersion() ? 2 : 1e20;
+    }
+
+    /**
+     * Returns if the user has unlimited savegames
+     * @returns {boolean}
+     */
+    getHasUnlimitedSavegames() {
+        return !this.isLimitedVersion();
+    }
+
+    /**
+     * Returns if the app has all settings available
+     * @returns {boolean}
+     */
+    getHasExtendedSettings() {
+        return !this.isLimitedVersion();
+    }
+}

src/js/core/utils.js

@@ -681,3 +681,35 @@ export function fillInLinkIntoTranslation(translation, link) {
         .replace("<link>", "<a href='" + link + "' target='_blank'>")
         .replace("</link>", "</a>");
 }
+
+/**
+ * Generates a file download
+ * @param {string} filename
+ * @param {string} text
+ */
+export function generateFileDownload(filename, text) {
+    var element = document.createElement("a");
+    element.setAttribute("href", "data:text/plain;charset=utf-8," + encodeURIComponent(text));
+    element.setAttribute("download", filename);
+
+    element.style.display = "none";
+    document.body.appendChild(element);
+
+    element.click();
+    document.body.removeChild(element);
+}
+
+/**
+ * Starts a file chooser
+ * @param {string} acceptedType
+ */
+export function startFileChoose(acceptedType = ".bin") {
+    var input = document.createElement("input");
+    input.type = "file";
+    input.accept = acceptedType;
+
+    return new Promise(resolve => {
+        input.onchange = _ => resolve(input.files[0]);
+        input.click();
+    });
+}

src/js/game/hub_goals.js

@@ -1,4 +1,4 @@
-import { globalConfig, IS_DEMO } from "../core/config";
+import { globalConfig } from "../core/config";
 import { RandomNumberGenerator } from "../core/rng";
 import { clamp } from "../core/utils";
 import { BasicSerializableObject, types } from "../savegame/serialization";
@@ -281,11 +281,6 @@ export class HubGoals extends BasicSerializableObject {
             return false;
         }
 
-        if (IS_DEMO && currentLevel >= 4) {
-            // DEMO
-            return false;
-        }
-
         if (G_IS_DEV && globalConfig.debug.upgradesNoCost) {
             return true;
         }

src/js/game/hud/hud.js

@@ -15,7 +15,7 @@ import { HUDKeybindingOverlay } from "./parts/keybinding_overlay";
 import { HUDUnlockNotification } from "./parts/unlock_notification";
 import { HUDGameMenu } from "./parts/game_menu";
 import { HUDShop } from "./parts/shop";
-import { IS_MOBILE, globalConfig, IS_DEMO } from "../../core/config";
+import { IS_MOBILE, globalConfig } from "../../core/config";
 import { HUDMassSelector } from "./parts/mass_selector";
 import { HUDVignetteOverlay } from "./parts/vignette_overlay";
 import { HUDStatistics } from "./parts/statistics";
@@ -116,7 +116,7 @@ export class GameHUD {
             this.parts.entityDebugger = new HUDEntityDebugger(this.root);
         }
 
-        if (IS_DEMO) {
+        if (this.root.app.restrictionMgr.getIsStandaloneMarketingActive()) {
             this.parts.watermark = new HUDWatermark(this.root);
             this.parts.standaloneAdvantages = new HUDStandaloneAdvantages(this.root);
             this.parts.catMemes = new HUDCatMemes(this.root);

src/js/game/hud/parts/screenshot_exporter.js

@@ -1,13 +1,13 @@
-import { BaseHUDPart } from "../base_hud_part";
-import { KEYMAPPINGS } from "../../key_action_mapper";
-import { IS_DEMO, globalConfig } from "../../../core/config";
-import { T } from "../../../translations";
-import { createLogger } from "../../../core/logging";
-import { StaticMapEntityComponent } from "../../components/static_map_entity";
-import { Vector } from "../../../core/vector";
 import { makeOffscreenBuffer } from "../../../core/buffer_utils";
+import { globalConfig } from "../../../core/config";
 import { DrawParameters } from "../../../core/draw_parameters";
+import { createLogger } from "../../../core/logging";
 import { Rectangle } from "../../../core/rectangle";
+import { Vector } from "../../../core/vector";
+import { T } from "../../../translations";
+import { StaticMapEntityComponent } from "../../components/static_map_entity";
+import { KEYMAPPINGS } from "../../key_action_mapper";
+import { BaseHUDPart } from "../base_hud_part";
 
 const logger = createLogger("screenshot_exporter");
 
@@ -19,7 +19,7 @@ export class HUDScreenshotExporter extends BaseHUDPart {
     }
 
     startExport() {
-        if (IS_DEMO) {
+        if (!this.root.app.restrictionMgr.getIsExportingScreenshotsPossible()) {
             this.root.hud.parts.dialogs.showFeatureRestrictionInfo(T.demo.features.exportingBase);
             return;
         }

src/js/game/hud/parts/waypoints.js

@@ -1,5 +1,5 @@
 import { makeOffscreenBuffer } from "../../../core/buffer_utils";
-import { globalConfig, IS_DEMO, THIRDPARTY_URLS } from "../../../core/config";
+import { globalConfig, THIRDPARTY_URLS } from "../../../core/config";
 import { DrawParameters } from "../../../core/draw_parameters";
 import { Loader } from "../../../core/loader";
 import { DialogWithForm } from "../../../core/modal_dialog_elements";
@@ -302,7 +302,7 @@ export class HUDWaypoints extends BaseHUDPart {
                 // Show info that you can have only N markers in the demo,
                 // actually show this *after* entering the name so you want the
                 // standalone even more (I'm evil :P)
-                if (IS_DEMO && this.waypoints.length > 2) {
+                if (this.waypoints.length > this.root.app.restrictionMgr.getMaximumWaypoints()) {
                     this.root.hud.parts.dialogs.showFeatureRestrictionInfo(
                         "",
                         T.dialogs.markerDemoLimit.desc

src/js/game/modes/regular.js

@@ -11,6 +11,7 @@ const blueprintShape = "CbCbCbRb:CwCwCwCw";
 
 const fixedImprovements = [0.5, 0.5, 1, 1, 2, 1, 1];
 
+// @FIXME @TODO
 const numEndgameUpgrades = !IS_DEMO ? 20 - fixedImprovements.length - 1 : 0;
 
 function generateEndgameUpgrades() {

src/js/game/systems/hub.js

@@ -1,4 +1,4 @@
-import { globalConfig, IS_DEMO } from "../../core/config";
+import { globalConfig } from "../../core/config";
 import { smoothenDpi } from "../../core/dpi_manager";
 import { DrawParameters } from "../../core/draw_parameters";
 import { drawSpriteClipped } from "../../core/draw_utils";

src/js/platform/browser/wrapper.js

@@ -1,4 +1,4 @@
-import { globalConfig, IS_DEMO, IS_MOBILE } from "../../core/config";
+import { globalConfig, IS_MOBILE } from "../../core/config";
 import { createLogger } from "../../core/logging";
 import { queryParamOptions } from "../../core/query_parameters";
 import { clamp } from "../../core/utils";
@@ -20,8 +20,6 @@ export class PlatformWrapperImplBrowser extends PlatformWrapperInterface {
             iframed: false,
             externalLinks: true,
             iogLink: true,
-            unlimitedSavegames: IS_DEMO ? false : true,
-            showDemoBadge: IS_DEMO,
         };
 
         if (!G_IS_STANDALONE && queryParamOptions.embedProvider) {
@@ -38,8 +36,6 @@ export class PlatformWrapperImplBrowser extends PlatformWrapperInterface {
                 case "iogames.space": {
                     this.embedProvider.id = "iogames.space";
                     this.embedProvider.iogLink = true;
-                    this.embedProvider.unlimitedSavegames = true;
-                    this.embedProvider.showDemoBadge = false;
                     break;
                 }
 
@@ -113,14 +109,6 @@ export class PlatformWrapperImplBrowser extends PlatformWrapperInterface {
         });
     }
 
-    getHasUnlimitedSavegames() {
-        return this.embedProvider.unlimitedSavegames;
-    }
-
-    getShowDemoBadges() {
-        return this.embedProvider.showDemoBadge;
-    }
-
     getId() {
         return "browser@" + this.embedProvider.id;
     }

src/js/platform/electron/wrapper.js

@@ -29,14 +29,6 @@ export class PlatformWrapperImplElectron extends PlatformWrapperImplBrowser {
         return false;
     }
 
-    getHasUnlimitedSavegames() {
-        return true;
-    }
-
-    getShowDemoBadges() {
-        return false;
-    }
-
     performRestart() {
         logger.log(this, "Performing restart");
         window.location.reload(true);

src/js/platform/sound.js

@@ -6,7 +6,7 @@ import { GameRoot } from "../game/root";
 
 import { newEmptyMap, clamp } from "../core/utils";
 import { createLogger } from "../core/logging";
-import { globalConfig, IS_DEMO } from "../core/config";
+import { globalConfig } from "../core/config";
 
 const logger = createLogger("sound");
 
@@ -29,7 +29,9 @@ export const SOUNDS = {
 };
 
 export const MUSIC = {
-    theme: IS_DEMO ? "theme-short" : "theme-full",
+    // The theme always depends on the standalone only, even if running the full
+    // version in the browser
+    theme: G_IS_STANDALONE ? "theme-full" : "theme-short",
     menu: "menu",
 };
 

src/js/platform/wrapper.js

@@ -29,17 +29,6 @@ export class PlatformWrapperInterface {
         return false;
     }
 
-    /**
-     * Whether the user has unlimited savegames
-     */
-    getHasUnlimitedSavegames() {
-        return true;
-    }
-
-    getShowDemoBadges() {
-        return false;
-    }
-
     /**
      * Returns the strength of touch pans with the mouse
      */

src/js/profile/application_settings.js

@@ -6,8 +6,7 @@ import { ReadWriteProxy } from "../core/read_write_proxy";
 import { BoolSetting, EnumSetting, RangeSetting, BaseSetting } from "./setting_types";
 import { createLogger } from "../core/logging";
 import { ExplainedResult } from "../core/explained_result";
-import { THEMES, THEME, applyGameTheme } from "../game/theme";
-import { IS_DEMO } from "../core/config";
+import { THEMES, applyGameTheme } from "../game/theme";
 import { T } from "../translations";
 import { LANGUAGES } from "../languages";
 
@@ -187,7 +186,9 @@ export const allApplicationSettings = [
                 app.platformWrapper.setFullscreen(value);
             }
         },
-        !IS_DEMO
+        /**
+         * @param {Application} app
+         */ app => app.restrictionMgr.getHasExtendedSettings()
     ),
 
     new BoolSetting(
@@ -215,7 +216,9 @@ export const allApplicationSettings = [
                 applyGameTheme(id);
                 document.documentElement.setAttribute("data-theme", id);
             },
-        enabled: !IS_DEMO,
+        enabledCb: /**
+         * @param {Application} app
+         */ app => app.restrictionMgr.getHasExtendedSettings(),
     }),
 
     new EnumSetting("autosaveInterval", {
@@ -271,7 +274,9 @@ export const allApplicationSettings = [
         category: enumCategories.performance,
         restartRequired: false,
         changeCb: (app, id) => {},
-        enabled: !IS_DEMO,
+        enabledCb: /**
+         * @param {Application} app
+         */ app => app.restrictionMgr.getHasExtendedSettings(),
     }),
 
     new BoolSetting("lowQualityMapResources", enumCategories.performance, (app, value) => {}),
@@ -355,7 +360,7 @@ export class ApplicationSettings extends ReadWriteProxy {
      * @returns {SettingsStorage}
      */
     getAllSettings() {
-        return this.getCurrentData().settings;
+        return this.currentData.settings;
     }
 
     /**

src/js/profile/setting_types.js

@@ -13,13 +13,13 @@ export class BaseSetting {
      * @param {string} id
      * @param {string} categoryId
      * @param {function(Application, any):void} changeCb
-     * @param {boolean} enabled
+     * @param {function(Application) : boolean=} enabledCb
      */
-    constructor(id, categoryId, changeCb, enabled) {
+    constructor(id, categoryId, changeCb, enabledCb = null) {
         this.id = id;
         this.categoryId = categoryId;
         this.changeCb = changeCb;
-        this.enabled = enabled;
+        this.enabledCb = enabledCb;
 
         /** @type {Application} */
         this.app = null;
@@ -39,6 +39,7 @@ export class BaseSetting {
     }
 
     /**
+     * Binds all parameters
      * @param {Application} app
      * @param {HTMLElement} element
      * @param {any} dialogs
@@ -49,19 +50,37 @@ export class BaseSetting {
         this.dialogs = dialogs;
     }
 
-    getHtml() {
+    /**
+     * Returns the HTML for this setting
+     * @param {Application} app
+     */
+    getHtml(app) {
         abstract;
         return "";
     }
 
+    /**
+     * Returns whether this setting is enabled and available
+     * @param {Application} app
+     */
+    getIsAvailable(app) {
+        return this.enabledCb ? this.enabledCb(app) : true;
+    }
+
     syncValueToElement() {
         abstract;
     }
 
+    /**
+     * Attempts to modify the setting
+     */
     modify() {
         abstract;
     }
 
+    /**
+     * Shows the dialog that a restart is required
+     */
     showRestartRequiredDialog() {
         const { restart } = this.dialogs.showInfo(
             T.dialogs.restartRequired.title,
@@ -74,6 +93,7 @@ export class BaseSetting {
     }
 
     /**
+     * Validates the set value
      * @param {any} value
      * @returns {boolean}
      */
@@ -96,10 +116,10 @@ export class EnumSetting extends BaseSetting {
             iconPrefix = null,
             changeCb = null,
             magicValue = null,
-            enabled = true,
+            enabledCb = null,
         }
     ) {
-        super(id, category, changeCb, enabled);
+        super(id, category, changeCb, enabledCb);
 
         this.options = options;
         this.valueGetter = valueGetter;
@@ -110,10 +130,14 @@ export class EnumSetting extends BaseSetting {
         this.magicValue = magicValue;
     }
 
-    getHtml() {
+    /**
+     * @param {Application} app
+     */
+    getHtml(app) {
+        const available = this.getIsAvailable(app);
         return `
-            <div class="setting cardbox ${this.enabled ? "enabled" : "disabled"}">
-                ${this.enabled ? "" : `<span class="standaloneOnlyHint">${T.demo.settingNotAvailable}</span>`}
+            <div class="setting cardbox ${available ? "enabled" : "disabled"}">
+                ${available ? "" : `<span class="standaloneOnlyHint">${T.demo.settingNotAvailable}</span>`}
                 <div class="row">
                     <label>${T.settings.labels[this.id].title}</label>
                     <div class="value enum" data-setting="${this.id}"></div>
@@ -180,14 +204,18 @@ export class EnumSetting extends BaseSetting {
 }
 
 export class BoolSetting extends BaseSetting {
-    constructor(id, category, changeCb = null, enabled = true) {
-        super(id, category, changeCb, enabled);
+    constructor(id, category, changeCb = null, enabledCb = null) {
+        super(id, category, changeCb, enabledCb);
     }
 
-    getHtml() {
+    /**
+     * @param {Application} app
+     */
+    getHtml(app) {
+        const available = this.getIsAvailable(app);
         return `
-        <div class="setting cardbox ${this.enabled ? "enabled" : "disabled"}">
-            ${this.enabled ? "" : `<span class="standaloneOnlyHint">${T.demo.settingNotAvailable}</span>`}
+        <div class="setting cardbox ${available ? "enabled" : "disabled"}">
+            ${available ? "" : `<span class="standaloneOnlyHint">${T.demo.settingNotAvailable}</span>`}
 
             <div class="row">
                 <label>${T.settings.labels[this.id].title}</label>
@@ -226,13 +254,13 @@ export class RangeSetting extends BaseSetting {
         id,
         category,
         changeCb = null,
-        enabled = true,
         defaultValue = 1.0,
         minValue = 0,
         maxValue = 1.0,
-        stepSize = 0.0001
+        stepSize = 0.0001,
+        enabledCb = null
     ) {
-        super(id, category, changeCb, enabled);
+        super(id, category, changeCb, enabledCb);
 
         this.defaultValue = defaultValue;
         this.minValue = minValue;
@@ -240,10 +268,14 @@ export class RangeSetting extends BaseSetting {
         this.stepSize = stepSize;
     }
 
-    getHtml() {
+    /**
+     * @param {Application} app
+     */
+    getHtml(app) {
+        const available = this.getIsAvailable(app);
         return `
-        <div class="setting cardbox ${this.enabled ? "enabled" : "disabled"}">
-            ${this.enabled ? "" : `<span class="standaloneOnlyHint">${T.demo.settingNotAvailable}</span>`}
+        <div class="setting cardbox ${available ? "enabled" : "disabled"}">
+            ${available ? "" : `<span class="standaloneOnlyHint">${T.demo.settingNotAvailable}</span>`}
 
             <div class="row">
                 <label>${T.settings.labels[this.id].title}</label>

src/js/savegame/savegame_manager.js

@@ -40,13 +40,6 @@ export class SavegameManager extends ReadWriteProxy {
         return 1002;
     }
 
-    /**
-     * @returns {SavegamesData}
-     */
-    getCurrentData() {
-        return super.getCurrentData();
-    }
-
     verify(data) {
         // TODO / FIXME!!!!
         return ExplainedResult.good();

src/js/states/keybindings.js

@@ -1,9 +1,8 @@
+import { Dialog } from "../core/modal_dialog_elements";
 import { TextualGameState } from "../core/textual_game_state";
+import { getStringForKeyCode, KEYMAPPINGS } from "../game/key_action_mapper";
 import { SOUNDS } from "../platform/sound";
 import { T } from "../translations";
-import { KEYMAPPINGS, getStringForKeyCode } from "../game/key_action_mapper";
-import { Dialog } from "../core/modal_dialog_elements";
-import { IS_DEMO } from "../core/config";
 
 export class KeybindingsState extends TextualGameState {
     constructor() {
@@ -82,11 +81,6 @@ export class KeybindingsState extends TextualGameState {
     }
 
     editKeybinding(id) {
-        // if (IS_DEMO) {
-        //     this.dialogs.showFeatureRestrictionInfo(T.demo.features.customizeKeybindings);
-        //     return;
-        // }
-
         const dialog = new Dialog({
             app: this.app,
             title: T.dialogs.editKeybinding.title,

src/js/states/main_menu.js

@@ -1,21 +1,23 @@
-import { GameState } from "../core/game_state";
 import { cachebust } from "../core/cachebust";
-import { A_B_TESTING_LINK_TYPE, globalConfig, IS_DEMO, THIRDPARTY_URLS } from "../core/config";
+import { A_B_TESTING_LINK_TYPE, globalConfig, THIRDPARTY_URLS } from "../core/config";
+import { GameState } from "../core/game_state";
+import { DialogWithForm } from "../core/modal_dialog_elements";
+import { FormElementInput } from "../core/modal_dialog_forms";
+import { ReadWriteProxy } from "../core/read_write_proxy";
 import {
-    makeDiv,
-    makeButtonElement,
     formatSecondsToTimeAgo,
-    waitNextFrame,
+    generateFileDownload,
     isSupportedBrowser,
     makeButton,
+    makeButtonElement,
+    makeDiv,
     removeAllChildren,
+    startFileChoose,
+    waitNextFrame,
 } from "../core/utils";
-import { ReadWriteProxy } from "../core/read_write_proxy";
 import { HUDModalDialogs } from "../game/hud/parts/modal_dialogs";
-import { T } from "../translations";
 import { getApplicationSettingById } from "../profile/application_settings";
-import { FormElementInput } from "../core/modal_dialog_forms";
-import { DialogWithForm } from "../core/modal_dialog_elements";
+import { T } from "../translations";
 
 const trim = require("trim");
 
@@ -24,23 +26,6 @@ const trim = require("trim");
  * @typedef {import("../profile/setting_types").EnumSetting} EnumSetting
  */
 
-/**
- * Generates a file download
- * @param {string} filename
- * @param {string} text
- */
-function generateFileDownload(filename, text) {
-    var element = document.createElement("a");
-    element.setAttribute("href", "data:text/plain;charset=utf-8," + encodeURIComponent(text));
-    element.setAttribute("download", filename);
-
-    element.style.display = "none";
-    document.body.appendChild(element);
-
-    element.click();
-    document.body.removeChild(element);
-}
-
 export class MainMenuState extends GameState {
     constructor() {
         super("MainMenuState");
@@ -49,18 +34,16 @@ export class MainMenuState extends GameState {
     getInnerHTML() {
         const bannerHtml = `
             <h3>${T.demoBanners.title}</h3>
-
             <p>${T.demoBanners.intro}</p>
-
             <a href="#" class="steamLink ${A_B_TESTING_LINK_TYPE}" target="_blank">Get the shapez.io standalone!</a>
         `;
 
-        return `
+        const showDemoBadges = this.app.restrictionMgr.getIsStandaloneMarketingActive();
 
+        return `
             <div class="topButtons">
                 <button class="languageChoose" data-languageicon="${this.app.settings.getLanguage()}"></button>
                 <button class="settingsButton"></button>
-
             ${
                 G_IS_STANDALONE || G_IS_DEV
                     ? `
@@ -74,17 +57,14 @@ export class MainMenuState extends GameState {
                 <source src="${cachebust("res/bg_render.webm")}" type="video/webm">
             </video>
 
-
             <div class="logo">
                 <img src="${cachebust("res/logo.png")}" alt="shapez.io Logo">
                 <span class="updateLabel">Wires update!</span>
             </div>
 
-
-            <div class="mainWrapper ${IS_DEMO ? "demo" : "noDemo"}">
-
+            <div class="mainWrapper ${showDemoBadges ? "demo" : "noDemo"}">
                 <div class="sideContainer">
-                    ${IS_DEMO ? `<div class="standaloneBanner">${bannerHtml}</div>` : ""}
+                    ${showDemoBadges ? `<div class="standaloneBanner">${bannerHtml}</div>` : ""}
                 </div>
 
                 <div class="mainContainer">
@@ -95,12 +75,9 @@ export class MainMenuState extends GameState {
                     }
                     <div class="buttons"></div>
                 </div>
-
-
             </div>
 
             <div class="footer">
-
                 <a class="githubLink boxLink" target="_blank">
                     ${T.mainMenu.openSourceHint}
                     <span class="thirdpartyLogo githubLogo"></span>
@@ -123,32 +100,29 @@ export class MainMenuState extends GameState {
                     "<author-link>",
                     '<a class="producerLink" target="_blank">Tobias Springer</a>'
                 )}</div>
-
             </div>
         `;
     }
 
+    /**
+     * Asks the user to import a savegame
+     */
     requestImportSavegame() {
         if (
-            IS_DEMO &&
             this.app.savegameMgr.getSavegamesMetaData().length > 0 &&
-            !this.app.platformWrapper.getHasUnlimitedSavegames()
+            !this.app.restrictionMgr.getHasUnlimitedSavegames()
         ) {
             this.app.analytics.trackUiClick("importgame_slot_limit_show");
             this.showSavegameSlotLimit();
             return;
         }
 
-        var input = document.createElement("input");
-        input.type = "file";
-        input.accept = ".bin";
-
-        input.onchange = e => {
-            const file = input.files[0];
+        // Create a 'fake' file-input to accept savegames
+        startFileChoose(".bin").then(file => {
             if (file) {
+                const closeLoader = this.dialogs.showLoadingDialog();
                 waitNextFrame().then(() => {
                     this.app.analytics.trackUiClick("import_savegame");
-                    const closeLoader = this.dialogs.showLoadingDialog();
                     const reader = new FileReader();
                     reader.addEventListener("load", event => {
                         const contents = event.target.result;
@@ -194,8 +168,7 @@ export class MainMenuState extends GameState {
                     reader.readAsText(file, "utf-8");
                 });
             }
-        };
-        input.click();
+        });
     }
 
     onBackButton() {
@@ -557,9 +530,8 @@ export class MainMenuState extends GameState {
 
     onPlayButtonClicked() {
         if (
-            IS_DEMO &&
             this.app.savegameMgr.getSavegamesMetaData().length > 0 &&
-            !this.app.platformWrapper.getHasUnlimitedSavegames()
+            !this.app.restrictionMgr.getHasUnlimitedSavegames()
         ) {
             this.app.analytics.trackUiClick("startgame_slot_limit_show");
             this.showSavegameSlotLimit();

src/js/states/settings.js

@@ -68,7 +68,7 @@ export class SettingsState extends TextualGameState {
         for (let i = 0; i < allApplicationSettings.length; ++i) {
             const setting = allApplicationSettings[i];
 
-            categoriesHTML[setting.categoryId] += setting.getHtml();
+            categoriesHTML[setting.categoryId] += setting.getHtml(this.app);
         }
 
         return Object.keys(categoriesHTML)