Files
Elite-Gaming-FiveM/resources/bodycam/html/index.html
T
2026-02-11 21:08:37 -08:00

82 lines
3.5 KiB
HTML

<html>
<head>
<!-- Need to include jQuery! -->
<script src="nui://game/ui/jquery.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/howler/2.1.1/howler.min.js" type="text/javascript"></script>
<script>
var audioPlayer = null;
// Listen for NUI Messages.
window.addEventListener('message', function(event) {
// Check for playSound transaction
if (event.data.transactionType == "playSound") {
if (audioPlayer != null) {
audioPlayer.pause();
}
audioPlayer = new Howl({
src: ["./sounds/" + event.data.transactionFile + ".ogg"],
autoplay: false,
loop: true,
volume: event.data.transactionVolume,
onend: function() {
}
});
audioPlayer.play();
} else if (event.data.transactionType == "showAxon") {
var div = document.getElementById("axonOverlay");
if (event.data.show == true) {
div.style.display = "block";
document.getElementById("timestamp").innerHTML = event.data.timestamp;
} else {
div.style.display = "none";
}
} else if (event.data.transactionType == "showReveal") {
var div = document.getElementById("revealOverlay");
if (event.data.show == true) {
div.style.display = "block";
document.getElementById("timestamp").innerHTML = event.data.timestamp;
} else {
div.style.display = "none";
}
}
if (event.data.transactionType == "updateTime") {
document.getElementById("timestamp").innerHTML = event.data.timestamp;
document.getElementById("timestamp2").innerHTML = event.data.timestamp;
}
});
</script>
<link href="https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap" rel="stylesheet">
</head>
<style>
</style>
<body>
<div id='axonOverlay' style='display:none; text-align:right;'>
<div style='color:#ffff; font-weight:normal; font-size:1.6rem; height:100px; position:relative; margin-top:20px; margin-left:100px;'>
<img src='images/axon.png' width='5%' height='auto' style='padding:5px; float:right; margin-top:10px; margin-left:10px;'>
<div style="font-family: 'Roboto Mono', monospace; padding-top:20px; margin-right:50px; margin-left:100px;">
<span id='timestamp'>2020-09-29 T18:29</span>
<br>
<span id='serial'>AXON BODY 3 X81020805</span>
</div>
</div>
</div>
<div id='revealOverlay' style='display:none;text-align:right;'>
<div style='color:#ffff;font-weight:bold;font-size:1.4rem;height:100px;position:relative;'>
<div style="font-family: 'Roboto Mono', monospace;padding-top:85vh;padding-right:100px;">
<span id='serial'>249105</span>
<br>
<span id='timestamp2'>2020/10/09 17:44:32</span>
</div>
</div>
</div>
</body>
</html>