From f7ff2f2e99b0289712e4ab7e37d4b1f26630c9ec Mon Sep 17 00:00:00 2001
From: mimo <mimo@wildfiregames.com>
Date: Sun, 19 Jun 2016 21:01:25 +0000
Subject: [PATCH] improve load game UI, fixes #1090

This was SVN commit r18409.
---
 .../mods/public/gui/common/common_styles.xml  | 10 ++
 .../public/gui/common/functions_utility.js    | 52 +++++++++++
 .../data/mods/public/gui/page_replaymenu.xml  |  1 -
 .../mods/public/gui/replaymenu/replay_menu.js | 54 +++--------
 .../mods/public/gui/replaymenu/styles.xml     | 14 ---
 .../data/mods/public/gui/savedgames/load.js   | 58 +++++++++++-
 .../data/mods/public/gui/savedgames/load.xml  | 92 +++++++++++++------
 .../data/mods/public/gui/savedgames/save.js   | 31 ++++---
 8 files changed, 216 insertions(+), 96 deletions(-)
 delete mode 100644 binaries/data/mods/public/gui/replaymenu/styles.xml

diff --git a/binaries/data/mods/public/gui/common/common_styles.xml b/binaries/data/mods/public/gui/common/common_styles.xml
index b1dc017ac7..1128ce8198 100644
--- a/binaries/data/mods/public/gui/common/common_styles.xml
+++ b/binaries/data/mods/public/gui/common/common_styles.xml
@@ -304,6 +304,16 @@
 		tooltip_style="pgToolTip"
 	/>
 
+	<style name="MapPlayerList"
+		buffer_zone="8"
+		font="sans-14"
+		scrollbar="true"
+		scrollbar_style="ModernScrollBar"
+		scroll_bottom="false"
+		textcolor="white"
+		text_align="left"
+		text_valign="top"
+	/>
 		<!--
 	==========================================
 	CIV ICON
diff --git a/binaries/data/mods/public/gui/common/functions_utility.js b/binaries/data/mods/public/gui/common/functions_utility.js
index 95d563c891..ca227e3636 100644
--- a/binaries/data/mods/public/gui/common/functions_utility.js
+++ b/binaries/data/mods/public/gui/common/functions_utility.js
@@ -205,3 +205,55 @@ function clearChatMessages()
 	} catch (e) {
 	}
 }
+
+/**
+ * Returns a formatted string describing the player assignments.
+ * Including civs, teams, AI settings and player colors
+ * which are given in data (array of objects per player).
+ *
+ * @returns {string}
+ */
+function formatPlayerInfo(data)
+{
+	let playerDescriptions = {};
+	let playerIdx = 0;
+	for (let playerData of data)
+	{
+		++playerIdx;
+		let teamIdx = playerData.Team;
+		let showDefeated = playerData.state && playerData.state == "defeated";
+		let isAI = playerData.AI && playerData.AI != "";
+
+		let translated;
+		if (!isAI && !showDefeated)
+			translated = translateWithContext("replay", "%(playerName)s (%(civ)s)");
+		else if (!isAI && showDefeated)
+			translated = translateWithContext("replay", "%(playerName)s (%(civ)s, defeated)");
+		else if (isAI && !showDefeated)
+			translated = translateWithContext("replay", "%(playerName)s (%(civ)s, %(AIdifficulty)s %(AIname)s)");
+		else
+			translated = translateWithContext("replay", "%(playerName)s (%(civ)s, %(AIdifficulty)s %(AIname)s, defeated)");
+
+		// Sort player descriptions by team
+		if (!playerDescriptions[teamIdx])
+			playerDescriptions[teamIdx] = [];
+		playerDescriptions[teamIdx].push(sprintf(translated, {
+			"playerName": '[color="' + rgbToGuiColor(playerData.Color) + '"]' + escapeText(playerData.Name) + "[/color]",
+			"civ": playerData.Civ,
+			"AIname": isAI ? translateAIName(playerData.AI) : "",
+			"AIdifficulty": isAI ? translateAIDifficulty(playerData.AIDiff) : ""
+		}));
+	}
+
+	let teams = Object.keys(playerDescriptions);
+
+	// If there are no teams, merge all playersDescriptions
+	if (teams.length == 1)
+		return playerDescriptions[teams[0]].join("\n") + "\n";
+
+	// If there are teams, merge "Team N:" + playerDescriptions
+	return teams.map(team => {
+		let teamCaption = (team == -1) ? translate("No Team") : sprintf(translate("Team %(team)s"), { "team": +team + 1 });
+		return '[font="sans-bold-14"]' + teamCaption + "[/font]:\n" + playerDescriptions[team].join("\n");
+	}).join("\n\n");
+}
diff --git a/binaries/data/mods/public/gui/page_replaymenu.xml b/binaries/data/mods/public/gui/page_replaymenu.xml
index 6c38d3dd04..3f35d7988e 100644
--- a/binaries/data/mods/public/gui/page_replaymenu.xml
+++ b/binaries/data/mods/public/gui/page_replaymenu.xml
@@ -10,6 +10,5 @@
     <include>common/common_sprites.xml</include>
     <include>common/common_styles.xml</include>
 
-    <include>replaymenu/styles.xml</include>
     <include>replaymenu/replay_menu.xml</include>
 </page>
diff --git a/binaries/data/mods/public/gui/replaymenu/replay_menu.js b/binaries/data/mods/public/gui/replaymenu/replay_menu.js
index e460f3f45b..f52a63f982 100644
--- a/binaries/data/mods/public/gui/replaymenu/replay_menu.js
+++ b/binaries/data/mods/public/gui/replaymenu/replay_menu.js
@@ -346,50 +346,22 @@ function getReplayTeamText(replay)
 	const metadata = Engine.GetReplayMetadata(replay.directory);
 	const spoiler = Engine.GetGUIObjectByName("showSpoiler").checked;
 
-	var playerDescriptions = {};
-	var playerIdx = 0;
+	let data = [];
+	let playerIdx = 0;
 	for (let playerData of replay.attribs.settings.PlayerData)
 	{
-		// Get player info
 		++playerIdx;
-		let teamIdx = playerData.Team;
-		let playerColor = playerData.Color ? playerData.Color : g_Settings.PlayerDefaults[playerIdx].Color;
-		let playerCiv = !playerData.Civ ? translate("Unknown Civilization") : (g_CivData[playerData.Civ] && g_CivData[playerData.Civ].Name ? translate(g_CivData[playerData.Civ].Name) : playerData.Civ);
-		let showDefeated = spoiler && metadata && metadata.playerStates && metadata.playerStates[playerIdx].state == "defeated";
-		let isAI = playerData.AI;
-
-		// Create human-readable player description
-		let playerDetails = {
-			"playerName": '[color="' + rgbToGuiColor(playerColor) + '"]' + escapeText(playerData.Name) + "[/color]",
-			"civ": playerCiv,
-			"AIname": isAI ? translateAIName(playerData.AI) : "",
-			"AIdifficulty": isAI ? translateAIDifficulty(playerData.AIDiff) : ""
-		};
-
-		if (!isAI && !showDefeated)
-			playerDetails = sprintf(translateWithContext("replay", "%(playerName)s (%(civ)s)"), playerDetails);
-		else if (!isAI && showDefeated)
-			playerDetails = sprintf(translateWithContext("replay", "%(playerName)s (%(civ)s, defeated)"), playerDetails);
-		else if (isAI && !showDefeated)
-			playerDetails = sprintf(translateWithContext("replay", "%(playerName)s (%(civ)s, %(AIdifficulty)s %(AIname)s)"), playerDetails);
-		else
-			playerDetails = sprintf(translateWithContext("replay", "%(playerName)s (%(civ)s, %(AIdifficulty)s %(AIname)s, defeated)"), playerDetails);
-
-		// Sort player descriptions by team
-		if (!playerDescriptions[teamIdx])
-			playerDescriptions[teamIdx] = [];
-		playerDescriptions[teamIdx].push(playerDetails);
+		data.push({
+			"Team": playerData.Team,
+			"Name": playerData.Name,
+			"Civ": !playerData.Civ ? translate("Unknown Civilization") :
+				(g_CivData[playerData.Civ] && g_CivData[playerData.Civ].Name ? translate(g_CivData[playerData.Civ].Name) : playerData.Civ),
+			"Color": playerData.Color ? playerData.Color : g_Settings.PlayerDefaults[playerIdx].Color,
+			"AI": playerData.AI,
+			"AIDiff": playerData.AIDiff,
+			"Defeated": spoiler && metadata && metadata.playerStates && metadata.playerStates[playerIdx].state == "defeated"
+		});
 	}
 
-	var teams = Object.keys(playerDescriptions);
-
-	// If there are no teams, merge all playersDescriptions
-	if (teams.length == 1)
-		return playerDescriptions[teams[0]].join("\n") + "\n";
-
-	// If there are teams, merge "Team N:" + playerDescriptions
-	return teams.map(team => {
-		let teamCaption = (team == -1) ? translate("No Team") : sprintf(translate("Team %(team)s"), { "team": +team + 1 });
-		return '[font="sans-bold-14"]' + teamCaption + "[/font]:\n" + playerDescriptions[team].join("\n");
-	}).join("\n");
+	return formatPlayerInfo(data);
 }
diff --git a/binaries/data/mods/public/gui/replaymenu/styles.xml b/binaries/data/mods/public/gui/replaymenu/styles.xml
deleted file mode 100644
index 617b13288c..0000000000
--- a/binaries/data/mods/public/gui/replaymenu/styles.xml
+++ /dev/null
@@ -1,14 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-
-<styles>
-	<style name="MapPlayerList"
-		buffer_zone="8"
-		font="sans-14"
-		scrollbar="true"
-		scrollbar_style="ModernScrollBar"
-		scroll_bottom="true"
-		textcolor="white"
-		text_align="left"
-		text_valign="top"
-	/>
-</styles>
diff --git a/binaries/data/mods/public/gui/savedgames/load.js b/binaries/data/mods/public/gui/savedgames/load.js
index 4a6485ebb7..f4b0c4655d 100644
--- a/binaries/data/mods/public/gui/savedgames/load.js
+++ b/binaries/data/mods/public/gui/savedgames/load.js
@@ -8,7 +8,8 @@ function init()
 	if (!savedGames.length)
 	{
 		gameSelection.list = [translate("No saved games found")];
-		gameSelection.selected = 0;
+		gameSelection.selected = -1;
+		selectionChanged();
 		Engine.GetGUIObjectByName("loadGameButton").enabled = false;
 		Engine.GetGUIObjectByName("deleteGameButton").enabled = false;
 		return;
@@ -26,6 +27,38 @@ function init()
 		gameSelection.selected = 0;
 	else if (gameSelection.selected >= savedGames.length) // happens when deleting the last saved game
 		gameSelection.selected = savedGames.length - 1;
+	else
+		selectionChanged();
+}
+
+function selectionChanged()
+{
+	let gameSelection = Engine.GetGUIObjectByName("gameSelection");
+	let selectionEmpty = gameSelection.selected == -1;
+	Engine.GetGUIObjectByName("invalidGame").hidden = !selectionEmpty;
+	Engine.GetGUIObjectByName("validGame").hidden = selectionEmpty;
+
+	if (selectionEmpty)
+		return;
+
+	let metadata = g_SavedGamesMetadata[gameSelection.selected];
+
+	Engine.GetGUIObjectByName("savedMapName").caption = translate(metadata.initAttributes.settings.Name);
+	let mapData = getMapDescriptionAndPreview(metadata.initAttributes.mapType, metadata.initAttributes.map);
+	setMapPreviewImage("savedInfoPreview", mapData.preview);
+
+	Engine.GetGUIObjectByName("savedPlayers").caption = metadata.initAttributes.settings.PlayerData.length - 1;
+	Engine.GetGUIObjectByName("savedPlayedTime").caption = timeToString(metadata.gui.timeElapsed ? metadata.gui.timeElapsed : 0);
+	Engine.GetGUIObjectByName("savedMapType").caption = translateMapType(metadata.initAttributes.mapType);
+	Engine.GetGUIObjectByName("savedMapSize").caption = translateMapSize(metadata.initAttributes.settings.Size);
+	Engine.GetGUIObjectByName("savedVictory").caption = translateVictoryCondition(metadata.initAttributes.settings.GameType);
+
+	let caption = sprintf(translate("Mods: %(mods)s"), { "mods": metadata.mods.join(translate(", ")) });
+	if (!hasSameMods(metadata, Engine.GetEngineInfo()))
+		caption = "[color=\"orange\"]" + caption + "[/color]";
+	Engine.GetGUIObjectByName("savedMods").caption = caption;
+
+	Engine.GetGUIObjectByName("savedPlayersNames").caption = getPlayerInfoText(metadata);
 }
 
 function loadGame()
@@ -151,3 +184,26 @@ function reallyDeleteGame(gameID)
 	// Run init again to refresh saved game list
 	init();
 }
+
+function getPlayerInfoText(metadata)
+{
+	let data = [];
+	let playerIdx = 0;
+	for (let playerData of metadata.initAttributes.settings.PlayerData)
+	{
+		if (playerData == null || playerData.Name == "gaia")
+			continue;
+		++playerIdx;
+		data.push({
+			"Team": playerData.Team,
+			"Name": playerData.Name,
+			"Civ": playerData.Civ,
+			"Color": playerData.Color,
+			"AI": playerData.AI,
+			"AIDiff": playerData.AIDiff,
+			"Defeated": metadata.gui.states && metadata.gui.states[playerIdx] == "defeated"
+		});
+	}
+
+	return formatPlayerInfo(data);
+}
diff --git a/binaries/data/mods/public/gui/savedgames/load.xml b/binaries/data/mods/public/gui/savedgames/load.xml
index 7d1af1239f..bf7bc50525 100644
--- a/binaries/data/mods/public/gui/savedgames/load.xml
+++ b/binaries/data/mods/public/gui/savedgames/load.xml
@@ -4,46 +4,86 @@
 
 	<script file="gui/common/functions_global_object.js" />
 	<script file="gui/common/functions_utility.js" />
+	<script file="gui/common/settings.js" />
+
+	<script file="gui/common/color.js" />
+
 	<script file="gui/common/functions_utility_loadsave.js" />
 	<script file="gui/savedgames/load.js" />
 
 	<!-- Add a translucent black background to fade out the menu page -->
 	<object type="image" z="0" sprite="BackgroundTranslucent"/>
 
-	<object type="image" style="ModernDialog" size="50%-300 50%-200 50%+300 50%+200">
+	<object type="image" style="ModernDialog" size="50%-400 50%-325 50%+400 50%+325">
 
 		<object type="text" style="TitleText" size="50%-128 -18 50%+128 14">
 			<translatableAttribute id="caption">Load Game</translatableAttribute>
 		</object>
 
-		<object name="gameSelection"
-			style="ModernList"
-			type="list"
-			size="24 24 100%-24 100%-100">
+		<object type="image" size="0 20 550 100%">
+			<object name="gameSelection" style="ModernList" type="list" size="24 12 100%-24 100%-90">
+				<action on="SelectionChange">selectionChanged();</action>
+			</object>
+
+			<object type="button" size="0%+25 100%-60 33%+10 100%-32" style="StoneButton" hotkey="cancel">
+				<translatableAttribute id="caption">Cancel</translatableAttribute>
+				<action on="Press">Engine.PopGuiPage();</action>
+			</object>
+
+			<object name="deleteGameButton" type="button" size="33%+20 100%-60 66%-15 100%-32" style="StoneButton" hotkey="session.savedgames.delete">
+				<translatableAttribute id="caption">Delete</translatableAttribute>
+				<action on="Press">
+					if (!this.enabled)
+						return;
+					if (Engine.HotkeyIsPressed("session.savedgames.noconfirmation"))
+						deleteGameWithoutConfirmation();
+					else
+						deleteGame();
+				</action>
+			</object>
+
+			<object name="loadGameButton" type="button" style="StoneButton" size="66%-5 100%-60 100%-25 100%-32">
+				<translatableAttribute id="caption">Load</translatableAttribute>
+				<action on="Press">loadGame();</action>
+			</object>
+
 		</object>
 
-		<object type="button" size="0%+25 100%-60 33%+10 100%-32" style="StoneButton" hotkey="cancel">
-			<translatableAttribute id="caption">Cancel</translatableAttribute>
-			<action on="Press">Engine.PopGuiPage();</action>
-		</object>
-
-		<object name="deleteGameButton" type="button" size="33%+20 100%-60 66%-15 100%-32" style="StoneButton" hotkey="session.savedgames.delete">
-			<translatableAttribute id="caption">Delete</translatableAttribute>
-			<action on="Press">
-				if (!this.enabled)
-					return;
-				if (Engine.HotkeyIsPressed("session.savedgames.noconfirmation"))
-					deleteGameWithoutConfirmation();
-				else
-					deleteGame();
-			</action>
-		</object>
-
-		<object name="loadGameButton" type="button" style="StoneButton" size="66%-5 100%-60 100%-25 100%-32">
-			<translatableAttribute id="caption">Load</translatableAttribute>
-			<action on="Press">loadGame();</action>
+		<object name="validGame" type="image" size="550 20 100%-20 100%">
+			<object name="savedMapName" size="0 0 100% 20" type="text" style="ModernLabelText" />
+			<object name="savedInfoPreview" size="0 20 220 240"  type="image" sprite="" />
+
+			<object size="0 250 45% 270" type="text" style="ModernLabelText" text_align="left">
+				<translatableAttribute id="caption">Players:</translatableAttribute>
+			</object>
+			<object name="savedPlayers" size="45% 250 100%-15 270" type="text" style="ModernLabelText" text_align="left" />
+			<object size="0 270 45% 290" type="text" style="ModernLabelText" text_align="left">
+				<translatableAttribute id="caption">Played time:</translatableAttribute>
+			</object>
+			<object name="savedPlayedTime" size="45% 270 100%-15 290" type="text" style="ModernLabelText" text_align="left" />
+			<object size="0 290 45% 310" type="text" style="ModernLabelText" text_align="left">
+				<translatableAttribute id="caption">Map Type:</translatableAttribute>
+			</object>
+			<object name="savedMapType" size="45% 290 100%-15 310" type="text" style="ModernLabelText" text_align="left" />
+			<object size="0 310 45% 330" type="text" style="ModernLabelText" text_align="left">
+				<translatableAttribute id="caption">Map Size:</translatableAttribute>
+			</object>
+			<object name="savedMapSize" size="45% 310 100%-15 330" type="text" style="ModernLabelText" text_align="left" />
+			<object size="0 330 45% 350" type="text" style="ModernLabelText" text_align="left">
+				<translatableAttribute id="caption">Victory:</translatableAttribute>
+			</object>
+			<object name="savedVictory" size="45% 330 100%-15 350" type="text" style="ModernLabelText" text_align="left" />
+
+			<object size="0 352 100%-15 353" type="image" sprite="ModernWhiteLine" z="25" />
+
+			<object name="savedMods" size="0 355 100%-15 395" type="text" style="ModernLabelText" text_align="left" />
+
+			<object size="0 397 100%-15 398" type="image" sprite="ModernWhiteLine" z="25" />
+			<object name="savedPlayersNames" size="0 400 100%-10 100%-32" type="text" style="MapPlayerList" />
+			<object size="0 100%-32 100%-15 100%-31" type="image" sprite="ModernWhiteLine" z="25" />
 		</object>
 
+		<object name="invalidGame" size="550 55 770 155" type="image" sprite="logo" />
 	</object>
 
-	</objects>
+</objects>
diff --git a/binaries/data/mods/public/gui/savedgames/save.js b/binaries/data/mods/public/gui/savedgames/save.js
index 0bb99b02e2..b237e377d3 100644
--- a/binaries/data/mods/public/gui/savedgames/save.js
+++ b/binaries/data/mods/public/gui/savedgames/save.js
@@ -3,23 +3,28 @@ var g_SavedGameData;
 
 function selectDescription()
 {
-	var gameSelection = Engine.GetGUIObjectByName("gameSelection");
+	let gameSelection = Engine.GetGUIObjectByName("gameSelection");
 	if (gameSelection.selected == -1)
 		return;
 
-	var gameID = gameSelection.list_data[gameSelection.selected];
+	let gameID = gameSelection.list_data[gameSelection.selected];
 	Engine.GetGUIObjectByName("deleteGameButton").enabled = true;
 	Engine.GetGUIObjectByName("saveGameDesc").caption = g_Descriptions[gameID];
 }
 
 function init(data)
 {
-	g_SavedGameData = data && data.savedGameData || undefined;
+	g_SavedGameData = data && data.savedGameData || {};
+	let simulationState = Engine.GuiInterfaceCall("GetSimulationState");
+	g_SavedGameData.timeElapsed = simulationState.timeElapsed;
+	g_SavedGameData.states = [];
+	for (let player of simulationState.players)
+		g_SavedGameData.states.push(player.state);
 
-	var gameSelection = Engine.GetGUIObjectByName("gameSelection");
+	let gameSelection = Engine.GetGUIObjectByName("gameSelection");
 	Engine.GetGUIObjectByName("deleteGameButton").enabled = false;
 
-	var savedGames = Engine.GetSavedGames().sort(sortDecreasingDate);
+	let savedGames = Engine.GetSavedGames().sort(sortDecreasingDate);
 	if (!savedGames.length)
 	{
 		gameSelection.list = [translate("No saved games found")];
@@ -38,11 +43,11 @@ function init(data)
 
 function saveGame()
 {
-	var gameSelection = Engine.GetGUIObjectByName("gameSelection");
-	var gameLabel = gameSelection.list[gameSelection.selected];
-	var gameID = gameSelection.list_data[gameSelection.selected];
-	var desc = Engine.GetGUIObjectByName("saveGameDesc").caption;
-	var name = gameID || "savegame";
+	let gameSelection = Engine.GetGUIObjectByName("gameSelection");
+	let gameLabel = gameSelection.list[gameSelection.selected];
+	let gameID = gameSelection.list_data[gameSelection.selected];
+	let desc = Engine.GetGUIObjectByName("saveGameDesc").caption;
+	let name = gameID || "savegame";
 
 	if (gameSelection.selected == -1)
 	{
@@ -78,9 +83,9 @@ function closeSave()
 
 function deleteGame()
 {
-	var gameSelection = Engine.GetGUIObjectByName("gameSelection");
-	var gameLabel = gameSelection.list[gameSelection.selected];
-	var gameID = gameSelection.list_data[gameSelection.selected];
+	let gameSelection = Engine.GetGUIObjectByName("gameSelection");
+	let gameLabel = gameSelection.list[gameSelection.selected];
+	let gameID = gameSelection.list_data[gameSelection.selected];
 
 	// Ask for confirmation
 	messageBox(