8 |
13 | {/if}
14 |
--------------------------------------------------------------------------------
/web/src/stores/ImageStore.ts:
--------------------------------------------------------------------------------
1 | import type { IImage } from './../interfaces/IImage';
2 | import { writable, type Writable } from 'svelte/store';
3 | import { showComponent, showUi } from './GeneralStores';
4 | import { UIComponentsEnum } from './../enums/UIComponentsEnum';
5 |
6 | export const imageStore: Writable
9 |
10 | 
11 |
12 |
7 |
--------------------------------------------------------------------------------
/client/showImage.lua:
--------------------------------------------------------------------------------
1 | --- Sets the display state for the NUI with an optional image.
2 | --- @param bool boolean: Determines whether to show or hide the NUI. `true` to show, `false` to hide.
3 | --- @param img string|nil: URL of the image to display. Ignored if `bool` is `false`.
4 | local function setDisplay(bool, img)
5 | DebugPrint("ShowImage called with " .. tostring(bool) .. " bool and " .. img .. " img")
6 | SendNUI("ShowImage", nil, {
7 | url = bool and img or nil,
8 | show = bool,
9 | }, true)
10 | end
11 |
12 | --- Shows an image by setting the display state to `true`.
13 | --- @param img string: URL of the image to display.
14 | local function showImage(img)
15 | setDisplay(true, img)
16 | end
17 |
18 | --- NUI callback for handling the image display state change.
19 | --- @param data table: Data received from the NUI callback.
20 | --- @field data.show boolean: Indicates whether the image was shown or hidden.
21 | --- @param cb function: Callback function to signal completion of the NUI callback.
22 | RegisterNUICallback("showItemImage-callback", function(data, cb)
23 | setDisplay(false)
24 | SetNuiFocus(false, false)
25 | cb('ok')
26 | end)
27 |
28 | exports("ShowImage", showImage)
--------------------------------------------------------------------------------
/web/src/stores/NotificationStore.ts:
--------------------------------------------------------------------------------
1 | import type { INotification } from 'src/interfaces/INotification';
2 | import { writable, type Writable } from 'svelte/store';
3 | import { showComponent } from './GeneralStores';
4 | import { UIComponentsEnum } from './../enums/UIComponentsEnum';
5 |
6 | export const notifications: Writable
8 | {#each $notifications as notification}
9 |
27 |
12 |
25 | {/each}
26 |
13 | {#if notification.type === NotificationTypes.Success}
14 |
15 | {:else if notification.type === NotificationTypes.Warning}
16 |
17 | {:else if notification.type === NotificationTypes.Error}
18 |
19 | {:else if notification.type === NotificationTypes.Info}
20 |
21 | {/if}
22 |
23 | {notification.text}
24 |
17 |
33 |
34 |
--------------------------------------------------------------------------------
/client/scrambler.lua:
--------------------------------------------------------------------------------
1 | --- Starts the scrambler game.
2 | --- @param callback function: Callback function to handle the result of the game (true for success, false for failure).
3 | --- @param type string|nil: Type of the game (e.g., 'alphabet', 'numeric'). Defaults to "alphabet" if nil.
4 | --- @param time number|nil: Time duration of the game in seconds. Defaults to 10 seconds if nil.
5 | --- @param mirrored number|nil: Option to include mirrored text (0: Normal, 1: Normal + Mirrored, 2: Mirrored only). Defaults to 0 if nil.
6 | local function scrambler(callback, type, time, mirrored)
7 | if type == nil then type = "alphabet" end -- Default to "alphabet" if type is nil
8 | if time == nil then time = 10 end -- Default to 10 seconds if time is nil
9 | if mirrored == nil then mirrored = 0 end -- Default to 0 if mirrored is nil
10 | DebugPrint("Scrambler called with " .. type .. " type and " .. time .. " time")
11 | SendNUI("GameLauncher", callback, { -- Use SendNUI with nil callback
12 | game = "Scramber", -- Internal name of the game
13 | gameName = "Scrambler", -- Display name of the game
14 | gameDescription = "Challenge your brain with the Scrambler game! Depending on your choice, you'll either unscramble letters or numbers, with an option for mirrored text. Can you solve the puzzles before time runs out?", -- Description of the game
15 | amountOfAnswers = 4, -- Number of answers to provide in the game
16 | gameTime = time, -- Time duration of the game
17 | sets = type, -- Type of the game
18 | changeBoardAfter = 1, -- Specifies if the board should change after a certain condition
19 | }, true)
20 | end
21 | exports("Scrambler", scrambler)
--------------------------------------------------------------------------------
/web/src/index.css:
--------------------------------------------------------------------------------
1 | @tailwind base;
2 | @tailwind components;
3 | @tailwind utilities;
4 |
5 |
6 |
7 | @font-face {
8 | font-family: roboto;
9 | src: url('./assets/fonts/Roboto/Roboto-Regular.ttf');
10 | }
11 |
12 | @font-face {
13 | font-family: hacker;
14 | src: url('./assets/fonts/Hacker-Technology-Font/Hacker.ttf');
15 | }
16 |
17 | @font-face {
18 | font-family: arcade;
19 | src: url('./assets/fonts/karmatic_arcade/ka1.ttf');
20 | }
21 |
22 | @layer utilities {
23 | .ps-text-roboto {
24 | font-family: 'roboto';
25 | }
26 | .ps-font-arcade {
27 | font-family: 'arcade';
28 | }
29 | .ps-font-hacker {
30 | font-family: 'hacker';
31 | }
32 |
33 | .ps-text-green {
34 | color: var(--color-green) !important;
35 | }
36 | .ps-text-lightgrey {
37 | color: var(--color-lightgrey);
38 | }
39 | .ps-text-darkblue {
40 | color: var(--color-darkblue);
41 | }
42 | .ps-text-red {
43 | color: var(--color-red) !important;
44 | }
45 |
46 | .ps-border-green {
47 | border: 1px solid var(--color-green);
48 | }
49 | .ps-outline-green {
50 | outline: 1px solid var(--color-green);
51 | }
52 |
53 | .ps-bg-lightgrey {
54 | background-color: var(--color-lightgrey);
55 | }
56 | .ps-bg-darkblue {
57 | background-color: var(--color-darkblue);
58 | }
59 | .ps-bg-green {
60 | background-color: var(--color-green);
61 | }
62 |
63 | .ps-bg-green-w-opacity {
64 | background-color: rgba(2, 241, 181, 0.2);
65 | }
66 | .ps-notification-success {
67 | background-color: #2ebd2e;
68 | color: black;
69 | border: 1px solid #158515;
70 | }
71 | .ps-notification-warning {
72 | background-color: #fbb433;
73 | border: 1px solid #cf8d15;
74 | color: black;
75 | }
76 | .ps-notification-error {
77 | background-color: #cd2222;
78 | border: 1px solid #8d0e0e;
79 | color: white;
80 | }
81 | .ps-notification-info {
82 | background-color: #33addf;
83 | border: 1px solid #1886b3;
84 | color: black;
85 | }
86 | }
87 |
--------------------------------------------------------------------------------
/client/display.lua:
--------------------------------------------------------------------------------
1 | local storedText = ""
2 | local storedColor = "primary"
3 |
4 | --- Displays text with a specified color and icon.
5 | --- @param text string|nil: The text to display (defaults to an empty string if nil)
6 | --- @param color string|nil: The color for the text (defaults to "primary" if nil)
7 | --- @param icon string|nil: The icon to display (defaults to 'fa-solid fa-circle-info' if nil)
8 | exports("DisplayText", function(text, color, icon)
9 | if text == nil then storedText = "" else storedText = text end
10 | if color == nil then storedColor = "primary" else storedColor = color end
11 | DebugPrint("DisplayText called with " .. text .. " text and " .. color .. " color")
12 | SendNUIMessage({
13 | action = "ShowDrawTextMenu",
14 | data = {
15 | title = "No Title", -- Static title for the text display
16 | keys = storedText, -- The text to display
17 | icon = icon or 'fa-solid fa-circle-info', -- Icon to display (default is 'fa-solid fa-circle-info')
18 | color = storedColor, -- Color of the text
19 | }
20 | })
21 | end)
22 |
23 | --- Hides the currently displayed text.
24 | exports("HideText", function()
25 | storedText = ""
26 | storedColor = "primary"
27 | SendNUIMessage({
28 | action = "HideDrawTextMenu",
29 | })
30 | end)
31 |
32 | --- Updates the displayed text.
33 | --- @param text string|nil: The new text to display (defaults to an empty string if nil)
34 | exports("UpdateText", function(text, color, icon)
35 | if text == nil then storedText = "" else storedText = text end
36 | if color == nil then storedColor = "primary" else storedColor = color end
37 | SendNUIMessage({
38 | action = "ShowDrawTextMenu",
39 | data = {
40 | keys = storedText, -- The updated text to display
41 | icon = icon or 'fa-solid fa-circle-info', -- Icon to display (default is 'fa-solid fa-circle-info')
42 | color = storedColor, -- Color of the text
43 | }
44 | })
45 | end)
--------------------------------------------------------------------------------
/client/thermite.lua:
--------------------------------------------------------------------------------
1 | local correctBlocksBasedOnGrid = {
2 | [5] = 10,
3 | [6] = 14,
4 | [7] = 18,
5 | [8] = 20,
6 | [9] = 24,
7 | [10] = 28,
8 | }
9 |
10 | --- Starts the Thermite game with the specified parameters.
11 | --- @param cb function: Callback function that will receive the result of the game (true for success, false for failure).
12 | --- @param time number|nil: Time duration for the game in seconds. Default is 10 if nil.
13 | --- @param gridsize number|nil: Size of the game grid (number of blocks per side). Default is 6 if nil.
14 | --- @param wrong number|nil: Maximum number of incorrect answers allowed. Default is 3 if nil.
15 | --- @param correctBlocks number|nil: Number of correct blocks to display. If not provided, it is determined based on the grid size.
16 | local function thermite(cb, time, gridsize, wrong, correctBlocks)
17 | -- Default values if parameters are not provided
18 | if time == nil then time = 10 end
19 | if gridsize <= 5 or gridsize == nil then gridsize = 6 end
20 | if wrong == nil then wrong = 3 end
21 |
22 | local correctBlockCount = correctBlocks or correctBlocksBasedOnGrid[gridsize]
23 | DebugPrint("Thermite called with " .. correctBlockCount .. " correct blocks and " .. time .. " time")
24 | SendNUI("GameLauncher", cb, { -- Use SendNUI with nil callback
25 | game = "MemoryGame", -- Name of the game
26 | gameName = "Memory Game", -- Display name of the game
27 | gameDescription = "Test your memory with Thermite! Match blocks on a grid before time runs out. Adjust grid size and incorrect answers for added challenge!", -- Description of the game
28 | amountOfAnswers = correctBlockCount, -- Number of correct blocks to display
29 | gameTime = time, -- Time duration for the game
30 | maxAnswersIncorrect = wrong, -- Maximum number of incorrect answers allowed
31 | displayInitialAnswersFor = 3, -- Time to display initial answers (seconds)
32 | gridSize = gridsize, -- Size of the game grid
33 | }, true)
34 | end
35 | exports("Thermite", thermite)
--------------------------------------------------------------------------------
/client/menu.lua:
--------------------------------------------------------------------------------
1 | local storedData = {}
2 |
3 | ---Creates a menu and registers its events.
4 | ---@param menuData table: Data for the menu, including items and submenus.
5 | local function createMenu(menuData)
6 | for _, item in ipairs(menuData) do
7 | storedData[item.id] = item
8 | if item.subMenu then
9 | for _, subItem in ipairs(item.subMenu) do
10 | storedData[subItem.id] = subItem
11 | end
12 | end
13 | end
14 |
15 | SendNUI("ShowMenu", nil, {
16 | menuData = menuData
17 | }, true)
18 | end
19 |
20 | --- Event handler for creating a menu from a network event.
21 | --- @param menuData table: Data for the menu, including items and submenus.
22 | RegisterNetEvent("ps-ui:CreateMenu", function(menuData)
23 | if not menuData then
24 | return
25 | end
26 |
27 | createMenu(menuData)
28 | end)
29 |
30 | --- Closes the current menu.
31 | local function hideMenu()
32 | SendNUI("HideMenu", nil, {}, false)
33 | storedData = {}
34 | end
35 |
36 | --- NUI callback for closing the menu.
37 | --- @param data any: Data from the NUI (not used in this function).
38 | --- @param cb function: Callback function to signal completion of the NUI callback.
39 | RegisterNUICallback('menuClose', function(data, cb)
40 | SetNuiFocus(false, false)
41 | storedData = {}
42 | cb('ok')
43 | end)
44 |
45 | --- NUI callback for menu item selection.
46 | --- @param data table: Data from the NUI, including event details.
47 | --- @param cb function: Callback function to signal completion of the NUI callback. The callback should be called with a string status, e.g., 'ok' or an error message.
48 | RegisterNUICallback('MenuSelect', function(data, cb)
49 | local menuData = storedData[data.data.id]
50 | if menuData then
51 | if menuData.server then
52 | TriggerServerEvent(menuData.event, table.unpack(menuData.args))
53 | else
54 | TriggerEvent(menuData.event, table.unpack(menuData.args))
55 | end
56 |
57 | SetNuiFocus(false, false)
58 | storedData = {}
59 | end
60 | cb('ok')
61 | end)
62 |
63 | exports("CreateMenu", createMenu)
64 | exports("HideMenu", hideMenu)
--------------------------------------------------------------------------------
/web/src/games/GameLauncher.svelte:
--------------------------------------------------------------------------------
1 |
55 |
56 | {#if $showLoading}
57 |
18 |
31 |
32 |
19 |
21 | {#if isSuccess}
22 | 23 | Access granted 24 |
25 | {:else} 26 |27 | Access denied 28 |
29 | {/if} 30 |
58 |
75 | {/if}
76 |
77 | {#if !$showLoading && gameLoaded}
78 |
61 |
74 | {$connectionText}
63 | 64 | 65 |
66 |
67 |
73 |
71 |
72 |
18 |
46 | {:else}
47 |
19 |
45 |
20 |
22 |
23 |
24 |
28 |
29 | 25 | {$currentActiveGameDetails?.gameName} 26 |
27 |
30 |
32 |
33 | {$currentActiveGameDetails?.gameDescription}
31 |
34 | {#if $currentGameActive === GamesEnum.Memory}
35 | {showResultScreen = true; hackSuccess = event.detail.hackSuccess; }} />
36 | {:else if $currentGameActive === GamesEnum.Scrambler}
37 | {showResultScreen = true; hackSuccess = event.detail.hackSuccess; }} />
38 | {:else if $currentGameActive === GamesEnum.NumberMaze}
39 | {showResultScreen = true; hackSuccess = event.detail.hackSuccess; }} />
40 | {:else if $currentGameActive === GamesEnum.NumberPuzzle}
41 | {showResultScreen = true; hackSuccess = event.detail.hackSuccess; }} />
42 | {/if}
43 |
44 |
138 |
139 |
--------------------------------------------------------------------------------
/web/src/components/StatusBarComponent.svelte:
--------------------------------------------------------------------------------
1 |
77 |
78 |
107 |
108 |
--------------------------------------------------------------------------------
/web/src/components/InputComponent.svelte:
--------------------------------------------------------------------------------
1 |
55 |
56 |
57 |
88 |
89 |
--------------------------------------------------------------------------------
/web/src/components/DrawTextComponent.svelte:
--------------------------------------------------------------------------------
1 |
136 |
137 |
58 | 
59 |
60 |
61 |
59 |
62 | {#each inputData as inputValue}
63 |
82 |
83 |
87 |
64 |
80 | {/each}
81 |
65 |
68 |
75 |
76 |
79 |
69 |
74 | 70 | {inputValue.label} 71 |
72 | 73 |
138 |
152 |
153 |
--------------------------------------------------------------------------------
/web/src/App.svelte:
--------------------------------------------------------------------------------
1 |
183 |
184 | {#if $showUi }
185 |
186 |
139 |
151 |
140 |
142 |
143 |
144 |
150 | 145 | {#each interactionText as text} 146 |
{text.value}
147 | {/each} 148 | 149 |
169 |
189 |
190 |
--------------------------------------------------------------------------------
/web/src/components/InteractionMenuComponent.svelte:
--------------------------------------------------------------------------------
1 |
59 |
60 |
170 |
171 |
173 |
174 | {gameTimeRemaining}
time remaining 172 |
175 | {#each allCubes as cube}
176 |
188 | handleClick(cube)}
181 | >
182 | {#if displayNumbersOnCubesFor > 0}
183 |
186 | {/each}
187 | {cube.cubeValue + 1}
184 | {/if} 185 |
61 |
118 |
119 |
--------------------------------------------------------------------------------
/web/src/games/MemoryGame.svelte:
--------------------------------------------------------------------------------
1 |
196 |
197 |
62 | {#if !selectedMenuItem}
63 |
116 |
117 |
64 |
65 |
66 |
67 |
65 |
68 | {#each menuData as menu, index}
69 |
88 | {/each}
89 |
90 | {:else if selectedMenuItem.hasOwnProperty('subMenu') && selectedMenuItem.subMenu}
91 |
95 |
96 |
97 | {#each subMenu as menu, index}
98 |
112 | {/each}
113 |
114 | {/if}
115 |
199 |
215 |
216 |
--------------------------------------------------------------------------------
/web/src/games/Scrambler.svelte:
--------------------------------------------------------------------------------
1 |
219 |
220 |
200 |
201 |
203 |
204 | {gameTimeRemaining}
time remaining 202 |
205 | {#each allCubes as cube}
206 |
214 | guessAnswer(cube)}
209 | style="width: 0px; height: 0px; border: 0px;"
210 | class="each-cube {gameStarted ? 'cursor-pointer' : 'cursor-default'} {!gameStarted ? (cube.isCorrectAnswer ? 'ps-bg-green-cube' : '') : (cube.isClicked && cube.isCorrectAnswer ? 'ps-bg-green-cube' : (cube.isClicked && !cube.isCorrectAnswer ? 'ps-bg-wrong-cube' : ''))}">
211 |
212 | {/each}
213 |
222 |
245 |
246 |
--------------------------------------------------------------------------------
/web/src/games/NumberMaze.svelte:
--------------------------------------------------------------------------------
1 |
211 |
212 |
223 |
236 |
237 |
224 |
231 | Match the numbers underneath.
225 |
226 | {#each correctAnswers as value}
227 |
230 | {value.cubeValue}
228 | {/each} 229 |
232 |
233 |
235 | {gameTimeRemaining}
time remaining 234 |
238 | {#each allCubes as cube}
239 |
244 |
240 |
242 | {/each}
243 | {cube.cubeValue}
241 |
214 |
240 |
241 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | GNU GENERAL PUBLIC LICENSE
2 | Version 3, 29 June 2007
3 |
4 | Copyright (C) 2007 Free Software Foundation, Inc.
215 |
216 |
218 | {gameTimeRemaining}
time remaining 217 |
219 | {#each allCubes as cube}
220 |
239 | handleCubeClick(cube)}
222 | class="each-cube {cube.classList}
223 | {[0, numberOfCubes - 1].includes(cube.cubeIndex) ? 'start-dest-cube' : ''}
224 | {!stopBlinking && [blinkingIndex, blinkingIndex * 7].includes(cube.cubeIndex) ? 'blinking-cube' : ''}
225 | "
226 | >
227 | {#if cube.cubeIndex === 0}
228 |
229 | {:else if cube.cubeIndex === numberOfCubes - 1}
230 |
231 | {:else}
232 | {#if !stopBlinking || displayCubeNumbers}
233 |
237 | {/each}
238 | { cube.cubeValue }
234 | {/if} 235 | {/if} 236 |