|
|
|
@ -3,11 +3,12 @@ import { cachebust } from "../core/cachebust";
|
|
|
|
|
import { globalConfig, IS_DEBUG, IS_DEMO, THIRDPARTY_URLS } from "../core/config";
|
|
|
|
|
import {
|
|
|
|
|
makeDiv,
|
|
|
|
|
makeButton,
|
|
|
|
|
makeButtonElement,
|
|
|
|
|
formatSecondsToTimeAgo,
|
|
|
|
|
generateFileDownload,
|
|
|
|
|
waitNextFrame,
|
|
|
|
|
isSupportedBrowser,
|
|
|
|
|
makeButton,
|
|
|
|
|
} from "../core/utils";
|
|
|
|
|
import { ReadWriteProxy } from "../core/read_write_proxy";
|
|
|
|
|
import { HUDModalDialogs } from "../game/hud/parts/modal_dialogs";
|
|
|
|
@ -86,8 +87,6 @@ export class MainMenuState extends GameState {
|
|
|
|
|
? ""
|
|
|
|
|
: `<div class="browserWarning">${T.mainMenu.browserWarning}</div>`
|
|
|
|
|
}
|
|
|
|
|
<button class="playButton styledButton">${T.mainMenu.play}</button>
|
|
|
|
|
<button class="importButton styledButton">${T.mainMenu.importSavegame}</button>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -203,8 +202,6 @@ export class MainMenuState extends GameState {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const qs = this.htmlElement.querySelector.bind(this.htmlElement);
|
|
|
|
|
this.trackClicks(qs(".mainContainer .playButton"), this.onPlayButtonClicked);
|
|
|
|
|
this.trackClicks(qs(".mainContainer .importButton"), this.requestImportSavegame);
|
|
|
|
|
|
|
|
|
|
if (G_IS_DEV && globalConfig.debug.fastGameEnter) {
|
|
|
|
|
const games = this.app.savegameMgr.getSavegamesMetaData();
|
|
|
|
@ -240,6 +237,7 @@ export class MainMenuState extends GameState {
|
|
|
|
|
this.trackClicks(qs(".exitAppButton"), this.onExitAppButtonClicked);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.renderMainMenu();
|
|
|
|
|
this.renderSavegames();
|
|
|
|
|
|
|
|
|
|
const steamLink = this.htmlElement.querySelector(".steamLink");
|
|
|
|
@ -269,6 +267,50 @@ export class MainMenuState extends GameState {
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
renderMainMenu() {
|
|
|
|
|
const importButtonElement = makeButtonElement(
|
|
|
|
|
["importButton", "styledButton"],
|
|
|
|
|
T.mainMenu.importSavegame
|
|
|
|
|
);
|
|
|
|
|
this.trackClicks(importButtonElement, this.requestImportSavegame);
|
|
|
|
|
|
|
|
|
|
if (this.savedGames.length > 0) {
|
|
|
|
|
const continueButton = makeButton(
|
|
|
|
|
this.htmlElement.querySelector(".mainContainer"),
|
|
|
|
|
["continueButton", "styledButton"],
|
|
|
|
|
T.mainMenu.continue
|
|
|
|
|
);
|
|
|
|
|
this.trackClicks(continueButton, this.onContinueButtonClicked);
|
|
|
|
|
|
|
|
|
|
const outerDiv = makeDiv(this.htmlElement.querySelector(".mainContainer"), null, ["outer"], null);
|
|
|
|
|
outerDiv.appendChild(importButtonElement);
|
|
|
|
|
const newGameButton = makeButton(
|
|
|
|
|
this.htmlElement.querySelector(".mainContainer .outer"),
|
|
|
|
|
["newGameButton", "styledButton"],
|
|
|
|
|
T.mainMenu.newGame
|
|
|
|
|
);
|
|
|
|
|
this.trackClicks(newGameButton, this.onPlayButtonClicked);
|
|
|
|
|
|
|
|
|
|
const oldPlayButton = this.htmlElement.querySelector(".mainContainer .playButton");
|
|
|
|
|
if (oldPlayButton) oldPlayButton.remove();
|
|
|
|
|
} else {
|
|
|
|
|
const playBtn = makeButton(
|
|
|
|
|
this.htmlElement.querySelector(".mainContainer"),
|
|
|
|
|
["playButton", "styledButton"],
|
|
|
|
|
T.mainMenu.play
|
|
|
|
|
);
|
|
|
|
|
this.trackClicks(playBtn, this.onPlayButtonClicked);
|
|
|
|
|
|
|
|
|
|
this.htmlElement.querySelector(".mainContainer").appendChild(importButtonElement);
|
|
|
|
|
|
|
|
|
|
const outerDiv = this.htmlElement.querySelector(".mainContainer .outer");
|
|
|
|
|
if (outerDiv) {
|
|
|
|
|
outerDiv.remove();
|
|
|
|
|
this.htmlElement.querySelector(".mainContainer .continueButton").remove();
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
onSteamLinkClicked() {
|
|
|
|
|
this.app.analytics.trackUiClick("main_menu_steam_link_2");
|
|
|
|
|
this.app.platformWrapper.openExternalLink(THIRDPARTY_URLS.standaloneStorePage);
|
|
|
|
@ -327,21 +369,17 @@ export class MainMenuState extends GameState {
|
|
|
|
|
}, this);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
get savedGames() {
|
|
|
|
|
return this.app.savegameMgr.getSavegamesMetaData();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
renderSavegames() {
|
|
|
|
|
const oldContainer = this.htmlElement.querySelector(".mainContainer .savegames");
|
|
|
|
|
if (oldContainer) {
|
|
|
|
|
oldContainer.remove();
|
|
|
|
|
this.htmlElement.querySelector(".mainContainer .continueButton").remove();
|
|
|
|
|
}
|
|
|
|
|
const games = this.app.savegameMgr.getSavegamesMetaData();
|
|
|
|
|
const games = this.savedGames;
|
|
|
|
|
if (games.length > 0) {
|
|
|
|
|
const continueButton = makeButton(
|
|
|
|
|
this.htmlElement.querySelector(".mainContainer"),
|
|
|
|
|
["continueButton", "styledButton"],
|
|
|
|
|
T.mainMenu.continue
|
|
|
|
|
);
|
|
|
|
|
this.trackClicks(continueButton, this.onContinueButtonClicked);
|
|
|
|
|
|
|
|
|
|
const parent = makeDiv(this.htmlElement.querySelector(".mainContainer"), null, ["savegames"]);
|
|
|
|
|
|
|
|
|
|
for (let i = 0; i < games.length; ++i) {
|
|
|
|
@ -371,13 +409,13 @@ export class MainMenuState extends GameState {
|
|
|
|
|
downloadButton.classList.add("styledButton", "downloadGame");
|
|
|
|
|
elem.appendChild(downloadButton);
|
|
|
|
|
|
|
|
|
|
const resumeBtn = document.createElement("button");
|
|
|
|
|
resumeBtn.classList.add("styledButton", "resumeGame");
|
|
|
|
|
elem.appendChild(resumeBtn);
|
|
|
|
|
const resumeButton = document.createElement("button");
|
|
|
|
|
resumeButton.classList.add("styledButton", "resumeGame");
|
|
|
|
|
elem.appendChild(resumeButton);
|
|
|
|
|
|
|
|
|
|
this.trackClicks(deleteButton, () => this.deleteGame(games[i]));
|
|
|
|
|
this.trackClicks(downloadButton, () => this.downloadGame(games[i]));
|
|
|
|
|
this.trackClicks(resumeBtn, () => this.resumeGame(games[i]));
|
|
|
|
|
this.trackClicks(resumeButton, () => this.resumeGame(games[i]));
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
@ -415,6 +453,7 @@ export class MainMenuState extends GameState {
|
|
|
|
|
this.app.savegameMgr.deleteSavegame(game).then(
|
|
|
|
|
() => {
|
|
|
|
|
this.renderSavegames();
|
|
|
|
|
if (this.savedGames.length <= 0) this.renderMainMenu();
|
|
|
|
|
},
|
|
|
|
|
err => {
|
|
|
|
|
this.dialogs.showWarning(
|
|
|
|
|