diff --git a/resources/images/RandomMap.png b/resources/images/RandomMap.png
new file mode 100755
index 000000000..9cfd1f27a
Binary files /dev/null and b/resources/images/RandomMap.png differ
diff --git a/src/client/HostLobbyModal.ts b/src/client/HostLobbyModal.ts
index 2a4cd8c4f..628bce473 100644
--- a/src/client/HostLobbyModal.ts
+++ b/src/client/HostLobbyModal.ts
@@ -6,6 +6,7 @@ import { consolex } from "../core/Consolex";
import "./components/Difficulties";
import { DifficultyDescription } from "./components/Difficulties";
import "./components/Maps";
+import randomMap from "../../resources/images/RandomMap.png";
@customElement("host-lobby-modal")
export class HostLobbyModal extends LitElement {
@@ -20,6 +21,7 @@ export class HostLobbyModal extends LitElement {
@state() private lobbyId = "";
@state() private copySuccess = false;
@state() private players: string[] = [];
+ @state() private useRandomMap: boolean = false;
private playersInterval = null;
@@ -365,11 +367,27 @@ export class HostLobbyModal extends LitElement {
this.handleMapSelection(value)}>
`,
)}
+
+
+

+
+
Random
+
@@ -544,9 +562,13 @@ export class HostLobbyModal extends LitElement {
this.playersInterval = null;
}
}
-
+ private async handleRandomMapToggle() {
+ this.useRandomMap = true;
+ this.putGameConfig();
+ }
private async handleMapSelection(value: GameMapType) {
this.selectedMap = value;
+ this.useRandomMap = false;
this.putGameConfig();
}
private async handleDifficultySelection(value: Difficulty) {
@@ -599,9 +621,19 @@ export class HostLobbyModal extends LitElement {
});
}
+ private getRandomMap(): GameMapType {
+ const maps = Object.values(GameMapType);
+ const randIdx = Math.floor(Math.random() * maps.length);
+ return maps[randIdx] as GameMapType;
+ }
+
private async startGame() {
+ this.selectedMap = this.useRandomMap
+ ? this.getRandomMap()
+ : this.selectedMap;
+ await this.putGameConfig();
consolex.log(
- `Starting private game with map: ${GameMapType[this.selectedMap]}`,
+ `Starting single player game with map: ${GameMapType[this.selectedMap]} ${this.useRandomMap ? " (Randomly selected)" : ""}`,
);
this.close();
const response = await fetch(`/start_private_lobby/${this.lobbyId}`, {
diff --git a/src/client/SinglePlayerModal.ts b/src/client/SinglePlayerModal.ts
index cd3160fdd..5aa12db9f 100644
--- a/src/client/SinglePlayerModal.ts
+++ b/src/client/SinglePlayerModal.ts
@@ -6,6 +6,7 @@ import { consolex } from "../core/Consolex";
import "./components/Difficulties";
import { DifficultyDescription } from "./components/Difficulties";
import "./components/Maps";
+import randomMap from "../../resources/images/RandomMap.png";
@customElement("single-player-modal")
export class SinglePlayerModal extends LitElement {
@@ -17,6 +18,7 @@ export class SinglePlayerModal extends LitElement {
@state() private infiniteGold: boolean = false;
@state() private infiniteTroops: boolean = false;
@state() private instantBuild: boolean = false;
+ @state() private useRandomMap: boolean = false;
static styles = css`
.modal-overlay {
@@ -230,6 +232,15 @@ export class SinglePlayerModal extends LitElement {
width: 80%;
}
+ .random-map {
+ border: 2px solid rgba(255, 255, 255, 0.1);
+ background: rgba(30, 30, 30, 0.95);
+ }
+ .random-map.selected {
+ border: 2px solid '@4a9eff'
+ background: 'rgba(74, 158, 255, 0.1)'
+ }
+
@media screen and (max-width: 768px) {
.modal-content {
max-height: calc(90vh - 42px);
@@ -259,14 +270,34 @@ export class SinglePlayerModal extends LitElement {
.filter(([key]) => isNaN(Number(key)))
.map(
([key, value]) => html`
- this.handleMapSelection(value)}>
+
`,
)}
+
+
+

+
+
Random
+
@@ -329,7 +360,6 @@ export class SinglePlayerModal extends LitElement {
/>
Disable Nations
-