diff --git a/Assets/Scenes/MainMenu.unity b/Assets/Scenes/MainMenu.unity
index 8af5e208c4e11239a9a7ceb1dd62c8c59b4389f0..820081298f10e51c91baa9a00a05fcd9b533ae14 100644
--- a/Assets/Scenes/MainMenu.unity
+++ b/Assets/Scenes/MainMenu.unity
@@ -427,3 +427,43 @@ MonoBehaviour:
m_Script: {fileID: 11500000, guid: bd5ff973fabe4977b60c0a9681cec3df, type: 3}
m_Name:
m_EditorClassIdentifier:
+ gameRules: 'In this game, two players face each other, trying to destroy the other''s
+ castle with units while defending theirs with towers. The game is divided into
+ rounds. Every round consists of 3 phases.
+
+ #First phase: Building
+
+ In
+ this phase, first the blue and then the red player can build, upgrade, and destroy
+ their towers. The players can choose a tower from the bottom-side bar and place
+ it on any of the highlighted squares if they have enough money. On the right
+ side of the screen are shown the stats of the selected tower. If a tower from
+ the gamefield is selected, the players can also upgrade it, or destroy it for
+ a refund.
+
+ #Second phase: Unit training
+
+ In the second phase, following
+ the team order stated in the first phase, the players can buy units and plan
+ their route to the enemy''s castle. Choosing a unit is similar to choosing a
+ tower, but after clicking on one of them from the bottom bar, if the player has
+ enough money, the unit gets queued up in one of the barracks and will be spawned
+ in the last phase. When clicking on one of the barracks, the players can add
+ a checkpoint to those units'' paths that will spawn from that barrack by clicking
+ on a reachable tile with a left-click, or remove a checkpoint with a right-click.
+ The brightness of the checkpoints indicates their order: the brightest checkpoint
+ is the last before the enemy castle. Note that the players have the same budget
+ for the towers and the units, and they have to manage it accordingly to succeed.
+
+ #Third
+ phase: Attacking
+
+ In this phase, the players can only inspect their fight.
+ The units that are left alive from the previous rounds continue their journey
+ into the enemy base, while the ones purchased in this round start to deploy from
+ the barracks. When a unit reaches its destination, it damages it and gets destroyed.
+ If one castle gets destroyed until the end of the round, the enemy team wins.
+ If both get destroyed, the game is tied.
+
+ When hovering the cursor over
+ a unit or a castle, a healthbar appears, showing its current health.'
diff --git a/Assets/Scripts/Presentation/UI/MainMenu.cs b/Assets/Scripts/Presentation/UI/MainMenu.cs
index 8e5175243bc3f93c4fb1e825a90995ee75eef4d3..ce5f73d2c873b1faec9dff17350c768099104873 100644
--- a/Assets/Scripts/Presentation/UI/MainMenu.cs
+++ b/Assets/Scripts/Presentation/UI/MainMenu.cs
@@ -7,16 +7,49 @@ namespace Presentation.UI {
public class MainMenu : MonoBehaviour {
private const string NewGameButton = "NewGameButton";
private const string ExitButton = "ExitButton";
+ private const string ReturnButton = "ReturnButton";
+ private const string TextContent = "TextContent";
+ private const string RulesButton = "RulesButton";
+ private const string MainContent = "MainContent";
+ private const string GameDescription = "GameDescription";
+
+ private const string TitleStyle = "title-style";
+ private const string ParagraphStyle = "paragraph-style";
+
+ [SerializeField]
+ [TextArea]
+ private string gameRules;
+
+ private UIDocument _uiDocument;
+ private VisualElement RootElement => _uiDocument.rootVisualElement;
private void Start() {
- var document = GetComponent<UIDocument>();
- VisualElement root = document.rootVisualElement;
+ _uiDocument = GetComponent<UIDocument>();
+
+ RootElement.Q<Button>(NewGameButton).clicked += OnNewGameClicked;
+ RootElement.Q<Button>(ExitButton).clicked += OnExitClicked;
+ RootElement.Q<Button>(RulesButton).clicked += OnRulesClicked;
+ RootElement.Q<Button>(ReturnButton).clicked += ShowMainContent;
+ ShowMainContent();
+ }
+
+ private void ShowMainContent() {
+ RootElement.Q(GameDescription).style.display = DisplayStyle.None;
+ RootElement.Q(MainContent).style.display = DisplayStyle.Flex;
+ }
- var newGameButton = root.Q<Button>(NewGameButton);
- var exitButton = root.Q<Button>(ExitButton);
+ private void OnRulesClicked() {
+ RootElement.Q(GameDescription).style.display = DisplayStyle.Flex;
+ RootElement.Q(MainContent).style.display = DisplayStyle.None;
- newGameButton.clicked += OnNewGameClicked;
- exitButton.clicked += OnExitClicked;
+ var textContent = RootElement.Q(TextContent);
+ textContent.Clear();
+ foreach (string entry in gameRules.Split('\n')) {
+ bool isTitle = entry.StartsWith("#");
+ var label = new Label() { text = isTitle ? entry.Substring(1) : entry };
+ label.AddToClassList(isTitle ? TitleStyle : ParagraphStyle);
+ textContent.Add(label);
+ }
}
private void OnNewGameClicked() {
diff --git a/Assets/UI/MainMenu/MainMenuDocument.uxml b/Assets/UI/MainMenu/MainMenuDocument.uxml
index 91a672ec6bb1a3cdee7bba24cd52c948ff9a26f2..24f0958e8689c7226c08b582eb0a68531532ae2b 100644
--- a/Assets/UI/MainMenu/MainMenuDocument.uxml
+++ b/Assets/UI/MainMenu/MainMenuDocument.uxml
@@ -1,12 +1,27 @@
<ui:UXML xmlns:ui="UnityEngine.UIElements" xmlns:uie="UnityEditor.UIElements" xsi="http://www.w3.org/2001/XMLSchema-instance" engine="UnityEngine.UIElements" editor="UnityEditor.UIElements" noNamespaceSchemaLocation="../../../UIElementsSchema/UIElements.xsd" editor-extension-mode="False">
<Style src="Styles/MainMenuStyles.uss" />
<ui:VisualElement style="justify-content: space-between; align-items: stretch; height: 100%; width: 100%; flex-direction: row; padding-left: 56px; padding-right: 56px; padding-top: 56px; padding-bottom: 56px;">
- <ui:VisualElement name="MainContent" style="align-items: center; justify-content: space-between; max-width: 35%;">
+ <ui:VisualElement name="MainContent" style="align-items: center; justify-content: space-between; max-width: 35%; display: none;">
<ui:Label text="Do-o Tower Defense" display-tooltip-when-elided="true" style="font-size: 52px; white-space: normal; -unity-text-align: upper-center; color: rgb(255, 255, 255); -unity-font-style: bold;" />
<ui:VisualElement style="align-items: stretch;">
<ui:Button text="NEW GAME" display-tooltip-when-elided="true" name="NewGameButton" class="button-style" style="background-color: rgb(255, 255, 255);" />
+ <ui:Button text="RULES" display-tooltip-when-elided="true" name="RulesButton" class="button-style" style="background-color: rgb(255, 255, 255);" />
<ui:Button text="EXIT" display-tooltip-when-elided="true" name="ExitButton" class="button-style" style="font-size: 24px; background-color: rgb(255, 255, 255);" />
</ui:VisualElement>
</ui:VisualElement>
+ <ui:VisualElement name="GameDescription" style="max-width: 35%; color: rgb(255, 255, 255); display: flex; align-items: flex-start;">
+ <ui:ScrollView scroll-deceleration-rate="0,135" elasticity="0,1" show-horizontal-scroller="false" show-vertical-scroller="false" horizontal-scroller-visibility="Hidden" vertical-scroller-visibility="Hidden" style="align-items: stretch;">
+ <ui:Button text="Return" display-tooltip-when-elided="true" name="ReturnButton" class="button-style" style="padding-left: 24px; padding-right: 24px; padding-top: 8px; padding-bottom: 8px; background-color: rgb(255, 255, 255); margin-left: 0; margin-right: 0;" />
+ <ui:Label text="Rules" display-tooltip-when-elided="true" style="font-size: 52px; white-space: normal; -unity-text-align: upper-left; color: rgb(255, 255, 255); -unity-font-style: bold; margin-top: 16px; margin-bottom: 16px;" />
+ <ui:VisualElement name="TextContent">
+ <ui:Label text="This is a title" display-tooltip-when-elided="true" name="title" class="title-style" />
+ <ui:Label text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." display-tooltip-when-elided="true" name="text" class="paragraph-style" />
+ <ui:Label text="This is a title" display-tooltip-when-elided="true" name="title" style="font-size: 24px; -unity-font-style: bold;" />
+ <ui:Label text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." display-tooltip-when-elided="true" name="text" style="white-space: normal; font-size: 16px;" />
+ <ui:Label text="This is a title" display-tooltip-when-elided="true" name="title" style="font-size: 24px; -unity-font-style: bold;" />
+ <ui:Label text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." display-tooltip-when-elided="true" name="text" style="white-space: normal; font-size: 16px;" />
+ </ui:VisualElement>
+ </ui:ScrollView>
+ </ui:VisualElement>
</ui:VisualElement>
</ui:UXML>
diff --git a/Assets/UI/MainMenu/Styles/MainMenuStyles.uss b/Assets/UI/MainMenu/Styles/MainMenuStyles.uss
index 89380cc647b3e07e50b149e5bbbae0805f742b64..6624bf259200a8d8061905113d54c50d7ef10323 100644
--- a/Assets/UI/MainMenu/Styles/MainMenuStyles.uss
+++ b/Assets/UI/MainMenu/Styles/MainMenuStyles.uss
@@ -12,5 +12,15 @@
border-bottom-left-radius: 12px;
border-top-right-radius: 12px;
border-bottom-right-radius: 12px;
- color: rgba(27, 27, 27, 255);
+ color: rgb(27, 27, 27);
+}
+
+.title-style {
+ font-size: 24px;
+ -unity-font-style: bold;
+}
+
+.paragraph-style {
+ white-space: normal;
+ font-size: 16px;
}