Skip to content

Commit 5343111

Browse files
D4isDAVIDD4isDAVID
committed
Initial commit
0 parents  commit 5343111

27 files changed

+817
-0
lines changed

‎.editorconfig

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
root = true
2+
3+
[*]
4+
indent_style = space
5+
indent_size = 2
6+
end_of_line = lf
7+
charset = utf-8
8+
trim_trailing_whitespace = true
9+
insert_final_newline = true
10+
11+
[*.{lua,html,css,js}]
12+
indent_size = 4

‎.gitattributes

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
* text=auto eol=lf

‎.github/CODEOWNERS

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
* @D4isDAVID

‎.github/FUNDING.yml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
github: D4isDAVID

‎.gitignore

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
# IDE-related
2+
.idea/
3+
.vscode/*
4+
!.vscode/settings.json
5+
!.vscode/extensions.json
6+
7+
# OS-related
8+
.DS_Store
9+
Thumbs.db

‎.luarc.json

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
{
2+
"$schema": "https://raw.githubusercontent.com/sumneko/vscode-lua/master/setting/schema.json",
3+
"diagnostics": {
4+
"disable": [],
5+
"enable": true
6+
},
7+
"format": {
8+
"enable": true
9+
},
10+
"runtime": {
11+
"fileEncoding": "utf8",
12+
"nonstandardSymbol": [
13+
"/**/",
14+
"`",
15+
"+=",
16+
"-=",
17+
"*=",
18+
"/=",
19+
"<<=",
20+
">>=",
21+
"&=",
22+
"|=",
23+
"^="
24+
],
25+
"version": "Lua 5.4"
26+
},
27+
"type": {
28+
"castNumberToInteger": false,
29+
"weakNilCheck": false,
30+
"weakUnionCheck": false
31+
}
32+
}

‎.vscode/extensions.json

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"recommendations": [
3+
"overextended.cfxlua-vscode",
4+
"EditorConfig.EditorConfig",
5+
"ecmel.vscode-html-css",
6+
"sumneko.lua"
7+
]
8+
}

‎.vscode/settings.json

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"editor.formatOnSave": true,
3+
"editor.codeActionsOnSave": {
4+
"source.fixAll": true,
5+
"source.organizeImports": true
6+
},
7+
"files.insertFinalNewline": true,
8+
"[lua]": {
9+
"editor.defaultFormatter": "sumneko.lua"
10+
}
11+
}

‎CHANGELOG.md

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
# Changelog
2+
3+
All notable changes to this project will be documented in this file.
4+
5+
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
6+
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
7+
8+
## Unreleased
9+
10+
[unreleased commits]
11+
12+
### Added
13+
14+
- Main loading bar
15+
- Secondary loading bar
16+
- Optional background images
17+
- Optional background music
18+
- Optional background video
19+
- Dynamic server message
20+
- Finishing message
21+
- Configuration file
22+
23+
[unreleased commits]: https://github.com/D4isDAVID/loadscreen/commits

‎LICENSE

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2023 David Malchin
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

‎README.md

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
# loadscreen
2+
3+
Loading screen for FiveM.
4+
5+
- [Key Features](#key-features)
6+
- [Configuration](#configuration)
7+
8+
## Key Features
9+
10+
### Multiple Loading Bars
11+
12+
The loading screen features a main loading bar representing the % of total
13+
loading done, and a secondary loading bar representing the % of the current
14+
step done.
15+
16+
### Background Media
17+
18+
The loading screen features optional configurable background images, music,
19+
and video.
20+
21+
### No Bridge
22+
23+
The loading screen shows up until the character spawns (or until a supported
24+
multicharacter script loads).
25+
26+
## Configuration
27+
28+
See [`html/config.js`](./html/config.js) for configuration.

‎client.lua

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
-- these resources can handle the loadscreen shutdown for us
2+
local resources = {
3+
'qb-multicharacter',
4+
'qbx-multicharacter',
5+
'esx_multicharacter',
6+
'ox_core',
7+
}
8+
9+
for i = 1, #resources do
10+
if GetResourceState(resources[i]):find('start') then
11+
return
12+
end
13+
end
14+
15+
-- sumneko lua gives a warning if I don't do this weird thing
16+
local handler
17+
handler = AddEventHandler('playerSpawned', function()
18+
ShutdownLoadingScreenNui()
19+
RemoveEventHandler(handler)
20+
end)

‎fxmanifest.lua

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
fx_version 'cerulean'
2+
game 'gta5'
3+
4+
version '1.0.0'
5+
description 'Loading screen for FiveM'
6+
author 'David Malchin <malchin459@gmail.com>'
7+
repository 'https://github.com/D4isDAVID/loadscreen'
8+
9+
lua54 'yes'
10+
use_experimental_fxv2_oal 'yes'
11+
12+
client_scripts {
13+
'client.lua',
14+
}
15+
16+
server_scripts {
17+
'server.lua',
18+
}
19+
20+
files {
21+
'html/**',
22+
}
23+
24+
loadscreen 'html/index.html'
25+
loadscreen_cursor 'yes'
26+
loadscreen_manual_shutdown 'yes'

‎html/assets/icons/skip_next.svg

Lines changed: 1 addition & 0 deletions
Loading

‎html/assets/icons/skip_previous.svg

Lines changed: 1 addition & 0 deletions
Loading

‎html/assets/images/moon.png

1.84 MB
Loading

‎html/assets/images/vinewood.png

2.49 MB
Loading

‎html/assets/music/fire.mp3

1 MB
Binary file not shown.

‎html/config.js

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
/**
2+
* The message displayed at the top-left of the screen.
3+
*
4+
* Available variables:
5+
* ${playerName} - Player name
6+
* ${serverName} - sv_projectName variable (or sv_hostname if not available)
7+
*/
8+
export const serverMessage = "${playerName}, welcome to ${serverName}!";
9+
10+
/**
11+
* The message displayed when FiveM finished loading and is now starting scripts.
12+
*/
13+
export const finishingMessage = "Finishing up...";
14+
15+
/**
16+
* Image files or URLs used for the background.
17+
* Empty the array to use a CSS background instead.
18+
*
19+
* File paths must be relative to the `index.html` file.
20+
*/
21+
export const images = [
22+
"./assets/images/moon.png",
23+
"./assets/images/vinewood.png",
24+
];
25+
26+
/**
27+
* Whether the background images should be shown randomly or in order of the array.
28+
*/
29+
export const chooseImageRandomly = false;
30+
31+
/**
32+
* The switch rate of the background images, in milliseconds.
33+
*/
34+
export const imageSwitchRate = 7500;
35+
36+
/**
37+
* Music files or URLs used for the background.
38+
* Empty the array to not use background music.
39+
*
40+
* File paths must be relative to the `index.html` file.
41+
*/
42+
export const music = ["./assets/music/fire.mp3"];
43+
44+
/**
45+
* The initial volume of the background music.
46+
*/
47+
export const initialMusicVolume = 0.1;
48+
49+
/**
50+
* Video file or URL used for the background (controls will not be shown).
51+
* This will appear over the image backgrounds.
52+
* Empty the string to use image backgrounds or a CSS background instead.
53+
*
54+
* File paths must be relative to the `index.html` file.
55+
*/
56+
export const video = "";
57+
58+
/**
59+
* The volume of the background video.
60+
*/
61+
export const videoVolume = 0.1;

‎html/index.html

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
<!DOCTYPE html>
2+
<html>
3+
4+
<head>
5+
<link href="./style.css" rel="stylesheet" />
6+
<script src="./js/main.js" type="module"></script>
7+
<script src="./js/messages.js" type="module"></script>
8+
<script src="./js/music.js" type="module"></script>
9+
<script src="./js/images.js" type="module"></script>
10+
<script src="./js/video.js" type="module"></script>
11+
</head>
12+
13+
<body>
14+
<video id="background-video" style="display: none;" autoplay loop playsinline disablepictureinpicture>
15+
</video>
16+
<div id="loadscreen-wrapper">
17+
<header id="loadscreen-wrapper-header">
18+
<h1 id="server-message"></h1>
19+
<div id="audio-controls-wrapper" style="display: none;">
20+
<button id="audio-controls-prev" class="audio-controls-button" style="display: none;">
21+
<img src="./assets/icons/skip_previous.svg" />
22+
</button>
23+
<audio id="background-audio" controls controlslist="nodownload noremoteplayback"></audio>
24+
<button id="audio-controls-next" class="audio-controls-button" style="display: none">
25+
<img src="./assets/icons/skip_next.svg" />
26+
</button>
27+
</div>
28+
</header>
29+
<main id="loadscreen-wrapper-main" style="display: none; opacity: 0;">
30+
<h1 id="finishing-message"></h1>
31+
<p id="log-line"></p>
32+
</main>
33+
<footer id="loadscreen-wrapper-footer">
34+
<div id="mini-progress-wrapper" style="display: none;">
35+
<p id="mini-progress-action"></p>
36+
<progress id="mini-progress"></progress>
37+
</div>
38+
<progress id="main-progress" max="1"></progress>
39+
</footer>
40+
</div>
41+
</body>
42+
43+
</html>

‎html/js/images.js

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
import { chooseImageRandomly, imageSwitchRate, images } from "../config.js";
2+
3+
if (images.length === 1) {
4+
document.documentElement.style.background = images[0];
5+
} else if (images.length > 1) {
6+
// cache images
7+
for (const fileName of images) {
8+
const image = document.createElement("img");
9+
image.style.position = "absolute";
10+
image.style.top = "-99999px";
11+
image.style.left = "-99999px";
12+
image.src = fileName;
13+
document.body.appendChild(image);
14+
}
15+
16+
let currentImage = null;
17+
const nextBackground = () => {
18+
if (chooseImageRandomly) {
19+
let random = currentImage;
20+
while (random === currentImage)
21+
random = Math.floor(Math.random() * images.length);
22+
currentImage = random;
23+
} else if (currentImage === null) {
24+
currentImage = 0;
25+
} else {
26+
currentImage++;
27+
if (currentImage >= images.length) currentImage = 0;
28+
}
29+
30+
document.documentElement.style.backgroundImage = `url(${images[currentImage]})`;
31+
};
32+
33+
nextBackground();
34+
setInterval(nextBackground, imageSwitchRate);
35+
}

0 commit comments

Comments
 (0)