This commit is contained in:
Nordi98 2025-07-09 15:06:30 +02:00
parent dc96cbb39b
commit c8ce065d61
939 changed files with 1976 additions and 0 deletions

View file

@ -0,0 +1,38 @@
<html>
<head>
<script src="nui://game/ui/jquery.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.9.1/gsap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/howler/2.1.1/howler.min.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="main.js" type="text/javascript"></script>
<link rel="stylesheet" href="style.css">
<script>
var audioPlayer = null;
window.addEventListener('message', function(event) {
if (event.data.Type == "playSound") {
if (audioPlayer != null) {
audioPlayer.pause();
}

audioPlayer = new Howl({src: ["./sounds/" + event.data.SoundFile + ".ogg"]});
audioPlayer.volume(event.data.Volume);
audioPlayer.play();

}
});
</script>
</head>
<body>

<div class="barcontainer" id="barcontainer" style="visibility:hidden">
<div class="progress-bar__container">
<div class="progress-bar">
<span id="task" class="task"></span>
<!-- <span class="progress-bar__text">Uploaded Successfully!</span> -->
</div>
</div>
</div>
</body>
</html>

View file

@ -0,0 +1,35 @@
window.addEventListener('message', function(event){
const progressBarContainer = document.querySelector('.progress-bar__container');
const progressBar = document.querySelector('.progress-bar');
const progressBarText = document.querySelector('.progress-bar__text');

let data = event.data;
let endState = 100;

$('#task').text(data.task);

if(event.data.Type == "showBar")
{
$(".barcontainer").css("visibility","visible");

if(event.data.time >= endState){
gsap.to(progressBar, {
x: `${event.data.time}%`,
backgroundColor: event.data.color,
});
}else{
gsap.to(progressBar, {
x: `${event.data.time}%`,
backgroundColor: event.data.color,
});
}

}
else if(event.data.Type == "hideBar")
{
$(".barcontainer").css("visibility","hidden");
gsap.to(progressBar, {
x: `0%`
});
}
});

View file

@ -0,0 +1,40 @@
.barcontainer {
display: flex;
margin: auto;
width: 30%;
margin-top: 50%;
}
.progress-bar__container {
width: 80%;
height: 2rem;
border-radius: 2rem;
position: relative;
overflow: hidden;
transition: all 0.5s;
will-change: transform;
box-shadow: 2px 2px 5px #040514;
}
.progress-bar {
position: absolute;
height: 100%;
width: 100%;
content: "";
background-color: #04020c;
top:0;
bottom: 0;
left: -100%;
border-radius: inherit;
display: flex;
justify-content: center;
align-items:center;
color: rgb(20, 20, 20);
font-family: 'Roboto', sans-serif;
font-weight: bold;
}
.progress-bar__text {
display: none;
}