Skip to content

Commit 1bbeede

Browse files
HatrickekHatrickek
committed
add main_menu.rml
1 parent 6af4367 commit 1bbeede

2 files changed

Lines changed: 220 additions & 72 deletions

File tree

‎Pong/Assets/Scripts/scene.lua‎

Lines changed: 90 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -175,9 +175,99 @@ function add_score(player)
175175
Log.info("Added score to player! ID:" .. pc.id .. " NewScore: " .. new_score)
176176
end
177177

178+
local main_menu_doc
179+
local p1_status
180+
local p2_status
181+
local main_menu
182+
local lobby
183+
local btn_start
184+
185+
function load_rmlui(scene)
186+
local ui_document_path = vfs:resolve_physical_dir(WORKING_DIR, "UI/main_menu.rml")
187+
local rml_main_context = rmlui.contexts['main']
188+
main_menu_doc = rml_main_context:LoadDocument(ui_document_path)
189+
main_menu_doc:Show()
190+
191+
main_menu = main_menu_doc:GetElementById("main_menu")
192+
lobby = main_menu_doc:GetElementById("lobby")
193+
p1_status = main_menu_doc:GetElementById("p1_status")
194+
p2_status = main_menu_doc:GetElementById("p2_status")
195+
btn_start = main_menu_doc:GetElementById("btn_start")
196+
197+
main_menu_doc:GetElementById("btn_local_coop"):AddEventListener("click", function()
198+
main_menu.style.display = 'none'
199+
lobby.style.display = 'flex'
200+
current_state = GameState.Lobby
201+
end)
202+
203+
main_menu_doc:GetElementById("btn_back"):AddEventListener("click", function()
204+
p1_ready = false
205+
p2_ready = false
206+
207+
-- Reset UI text and colors
208+
p1_status.inner_rml = "Player 1: Press Up/Down to Ready"
209+
p1_status:SetClass("ready", false)
210+
p1_status:SetClass("not-ready", true)
211+
212+
p2_status.inner_rml = "Player 2: Press W/S to Ready"
213+
p2_status:SetClass("ready", false)
214+
p2_status:SetClass("not-ready", true)
215+
216+
btn_start.style.display = 'none'
217+
218+
lobby.style.display = 'none'
219+
main_menu.style.display = 'flex'
220+
current_state = GameState.MainMenu
221+
end)
222+
223+
main_menu_doc:GetElementById("btn_exit"):AddEventListener("click", function()
224+
App:get():should_stop()
225+
end)
226+
227+
main_menu_doc:GetElementById("btn_start"):AddEventListener("click", function()
228+
start_match(scene)
229+
end)
230+
end
231+
232+
function on_scene_update(scene)
233+
local input = App.mod.Input
234+
if input:get_key_pressed(KeyCode.R) then
235+
main_menu_doc:Close()
236+
load_rmlui(scene)
237+
end
238+
239+
240+
if current_state == GameState.Lobby then
241+
local state_changed = false
242+
243+
if not p1_ready and (input:get_key_pressed(KeyCode.Up) or input:get_key_pressed(KeyCode.Down)) then
244+
p1_ready = true
245+
p1_status.inner_rml = "Player 1: READY"
246+
p1_status:SetClass("not-ready", false)
247+
p1_status:SetClass("ready", true)
248+
state_changed = true
249+
end
250+
251+
if not p2_ready and (input:get_key_pressed(KeyCode.W) or input:get_key_pressed(KeyCode.S)) then
252+
p2_ready = true
253+
p2_status.inner_rml = "Player 2: READY"
254+
p2_status:SetClass("not-ready", false)
255+
p2_status:SetClass("ready", true)
256+
state_changed = true
257+
end
258+
259+
-- If someone just readied up, check if we should show the Start button
260+
if state_changed and p1_ready and p2_ready then
261+
btn_start.style.display = 'block'
262+
end
263+
end
264+
end
265+
178266
function on_scene_start(scene)
179267
Assets.load_assets(WORKING_DIR)
180268

269+
load_rmlui(scene)
270+
181271
scene
182272
:world()
183273
:system("ball_system", { Core.TransformComponent, Components.BallComponent }, { flecs.OnUpdate }, function(it)
@@ -238,78 +328,6 @@ function on_scene_start(scene)
238328
end)
239329
end
240330

241-
function on_scene_render(scene, extent, format)
242-
ImGui.PushFont(30)
243-
244-
if current_state == GameState.MainMenu then
245-
-- MAIN MENU UI
246-
UI.center_next_window(ImGuiCond.Always)
247-
if ImGui.Begin("Main Menu", true, ImGuiWindowFlags.AlwaysAutoResize + ImGuiWindowFlags.NoDecoration) then
248-
ImGui.TextUnformatted("Welcome to Pong!")
249-
ImGui.Separator()
250-
251-
if ImGui.Button("Local Co-Op") then
252-
current_state = GameState.Lobby
253-
end
254-
if ImGui.Button("Quit Game") then
255-
App:get():should_stop()
256-
end
257-
end
258-
ImGui.End()
259-
elseif current_state == GameState.Lobby then
260-
-- LOBBY UI
261-
UI.center_next_window(ImGuiCond.Always)
262-
if ImGui.Begin("Local Co-Op Lobby", true, ImGuiWindowFlags.AlwaysAutoResize + ImGuiWindowFlags.NoDecoration) then
263-
-- Check for inputs to ready up
264-
local input = App.mod.Input
265-
if input:get_key_pressed(KeyCode.Up) or input:get_key_pressed(KeyCode.Down) then
266-
p1_ready = true
267-
end
268-
if input:get_key_pressed(KeyCode.W) or input:get_key_pressed(KeyCode.S) then
269-
p2_ready = true
270-
end
271-
272-
-- Display status
273-
if p1_ready then
274-
ImGui.TextColored(0, 1, 0, 1, "Player 1: READY")
275-
else
276-
ImGui.TextColored(1, 0, 0, 1, "Player 1: Press Up/Down to Ready")
277-
end
278-
279-
if p2_ready then
280-
ImGui.TextColored(0, 1, 0, 1, "Player 2: READY")
281-
else
282-
ImGui.TextColored(1, 0, 0, 1, "Player 2: Press W/S to Ready")
283-
end
284-
285-
ImGui.Separator()
286-
287-
if p1_ready and p2_ready then
288-
if ImGui.Button("Start Match!") then
289-
start_match(scene)
290-
end
291-
end
292-
293-
if ImGui.Button("Back") then
294-
p1_ready = false
295-
p2_ready = false
296-
current_state = GameState.MainMenu
297-
end
298-
end
299-
ImGui.End()
300-
301-
elseif current_state == GameState.Playing then
302-
-- PLAYING UI
303-
if ImGui.Begin("Player Score Debug View", true, ImGuiWindowFlags.NoDecoration) then
304-
ImGui.TextUnformatted("Player 1: " .. player1:get_mut(Components.PlayerComponent).score)
305-
ImGui.TextUnformatted("Player 2: " .. player2:get_mut(Components.PlayerComponent).score)
306-
end
307-
ImGui.End()
308-
end
309-
310-
ImGui.PopFont()
311-
end
312-
313331
function on_contact_added(scene, body1, body2)
314332
local ball_body = nil
315333
local paddle_body = nil

‎Pong/Assets/UI/main_menu.rml‎

Lines changed: 130 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,130 @@
1+
<rml>
2+
<head>
3+
<title>Main Menu</title>
4+
<style>
5+
body {
6+
font-family: "Fira Sans";
7+
font-weight: normal;
8+
font-style: normal;
9+
10+
width: 100vw;
11+
height: 100vh;
12+
margin: 0;
13+
14+
display: flex;
15+
justify-content: center;
16+
align-items: center;
17+
}
18+
19+
.menu_panel {
20+
display: flex;
21+
flex-direction: column;
22+
23+
width: 400dp;
24+
padding: 50dp;
25+
26+
background-color: #111418cc;
27+
border-radius: 16dp;
28+
}
29+
30+
#main_menu {
31+
display: flex;
32+
}
33+
34+
#lobby {
35+
display: none;
36+
}
37+
38+
h1 {
39+
font-size: 64dp;
40+
font-weight: bold;
41+
color: #ffffff;
42+
text-align: center;
43+
margin-top: 0;
44+
margin-bottom: 40dp;
45+
46+
font-effect: shadow(0dp 4dp #00000080);
47+
}
48+
49+
.status_text {
50+
font-size: 24dp;
51+
text-align: center;
52+
margin-bottom: 20dp;
53+
}
54+
.ready {
55+
color: #00ff00;
56+
}
57+
.not-ready {
58+
color: #ff0000;
59+
}
60+
61+
button.action {
62+
display: block;
63+
box-sizing: border-box;
64+
width: 100%;
65+
padding: 16dp;
66+
margin-bottom: 16dp;
67+
68+
text-align: center;
69+
font-size: 28dp;
70+
color: #e2e8f0;
71+
72+
background-color: #fb8d45;
73+
border: 2dp #00000080;
74+
border-radius: 8dp;
75+
76+
decorator: vertical-gradient(#ae622f #fb8d45);
77+
78+
transition:
79+
transform 0.1s,
80+
border-color 0.1s,
81+
color 0.1s;
82+
83+
transform-origin: center center;
84+
}
85+
86+
button.action:last-child {
87+
margin-bottom: 0;
88+
}
89+
90+
button.action:hover {
91+
border: 2dp #2a323d;
92+
border-color: #00000080;
93+
color: #ffffff;
94+
transform: scale(1.02);
95+
96+
decorator: vertical-gradient(#fb8d45 #fb8d45);
97+
}
98+
99+
button.action:active {
100+
transform: scale(0.98);
101+
color: #ae622f;
102+
103+
decorator: vertical-gradient(#ae622f #ae622f);
104+
}
105+
</style>
106+
</head>
107+
<body>
108+
<div id="main_menu" class="menu_panel">
109+
<h1>Pong</h1>
110+
<button id="btn_local_coop" class="action">Local Coop</button>
111+
<button id="btn_options" class="action">Options</button>
112+
<button id="btn_exit" class="action">Exit</button>
113+
</div>
114+
115+
<div id="lobby" class="menu_panel">
116+
<h1>Local Co-Op</h1>
117+
<div id="p1_status" class="status-text not-ready">
118+
Player 1: Press Up/Down to Ready
119+
</div>
120+
<div id="p2_status" class="status-text not-ready">
121+
Player 2: Press W/S to Ready
122+
</div>
123+
124+
<button id="btn_start" class="action" style="display: none">
125+
Start Match!
126+
</button>
127+
<button id="btn_back" class="action">Back</button>
128+
</div>
129+
</body>
130+
</rml>

0 commit comments

Comments
 (0)