Add more info to the info modal

BakerNet · Apr 4, 2024 · 8a491a2 · 8a491a2
1 parent 099db87
commit 8a491a2
Showing 1 changed file with 38 additions and 6 deletions.
diff --git a/web/src/components/info.rs b/web/src/components/info.rs
@@ -3,6 +3,8 @@ use leptos::*;
 use leptos_use::{use_document, use_event_listener};
 use web_sys::KeyboardEvent;
 
+use crate::components::icons::{player_icon_holder, Mine, Star, Trophy};
+
 #[component]
 pub fn ControlsInfoButton(set_show_info: WriteSignal<bool>) -> impl IntoView {
     view! {
@@ -25,11 +27,11 @@ pub fn ControlsInfoModal(set_show_info: WriteSignal<bool>) -> impl IntoView {
             on:click=move |_| set_show_info(false)
         >
             <div
-                class="flex flex-col rounded-lg border border-black shadow-lg text-gray-900 dark:text-gray-300 bg-slate-200 dark:bg-slate-800 p-8 w-10/12 max-w-md"
+                class="flex flex-col rounded-lg border border-black shadow-lg text-gray-900 dark:text-gray-300 bg-slate-200 dark:bg-slate-800 p-8 w-10/12 max-w-md max-h-10/12 overflow-auto"
                 on:click=move |ev| ev.stop_propagation()
             >
-                <h2 class="text-2xl font-bold tracking-wide mb-3">Controls</h2>
-                <div class="text-l mb-2">
+                <h2 class="text-2xl font-bold tracking-wide my-3">Controls</h2>
+                <div class="text-l my-2">
                     <span class=key_class>"Left Click"</span>
                     " or "
                     <span class=key_class>"Spacebar"</span>
@@ -59,12 +61,42 @@ pub fn ControlsInfoModal(set_show_info: WriteSignal<bool>) -> impl IntoView {
                     <span class="font-medium">"Controls"</span>
                     " menu"
                 </div>
+                <h2 class="text-2xl font-bold tracking-wide my-3">Player Badges</h2>
+                <div class="text-l my-2">
+                    <span class=player_icon_holder("bg-red-600", false)>
+                        <Mine/>
+                    </span>
+                    <span class="font-medium">"Dead"</span>
+                    " - the player died by revealing a mine"
+                </div>
+                <div class="text-l my-2">
+                    <span class=player_icon_holder("bg-green-800", false)>
+                        <Trophy/>
+                    </span>
+                    <span class="font-medium">"Top Score"</span>
+                    " - the player had the highest score in a multiplayer minesweeper game"
+                </div>
                 <div class="text-l my-2">
-                    <span class="font-bold">"Note:"</span>
-                    " Each player gets one "
-                    <span class="font-medium">"\"Super Click\""</span>
+                    <span class=player_icon_holder("bg-black", false)>
+                        <Star/>
+                    </span>
+                    <span class="font-medium">"Victory Click"</span>
+                    " - the player revealed the final non-mine cell on the map"
+                </div>
+                <h2 class="text-2xl font-bold tracking-wide my-3">Multiplayer Rules</h2>
+                <div class="text-l my-2">
+                    "Multiple players trying to reveal the same cell is hadled first-click-wins"
+                </div>
+                <div class="text-l my-2">
+                    " Each player gets one " <span class="font-medium">"\"Super Click\""</span>
                     " - that is, the first hidden cell they reveal that is not adjacent to any revealed cells is guaranteed to be an empty cell"
                 </div>
+                <div class="text-l my-2">
+                    "If a game is created by a " <span class="font-medium">"Guest"</span>
+                    ", then any player can start the game.  If the game is created by a "
+                    <span class="font-medium">"Logged In User"</span>
+                    ", only the creator can start the game"
+                </div>
             </div>
         </div>
     }