I setup some debug prints. One of them is when the event is triggered (via the command), That one prints.
The other is when the client receives the trigger event. That one prints.
All of the prints are triggering, and the setTimeout works and brings me back into the game, but the video itself does not play.
In the client console, I see no javascript errors, and I also see none in the console when accessing: http://localhost:13172/
RegisterNetEvent('the_event:showdown')
AddEventHandler('the_event:showdown', function()
print("Triggering client event")
TheShowdown()
end)
RegisterNUICallback('end_event',function(data, cb)
print("stopping event")
SetNuiFocus(false)
SendNUIMessage({openVideo = false})
--DoScreenFadeOut(5000)
cb('ok')
end)
function TheShowdown()
print("Triggering function")
SetNuiFocus(true, false)
SendNUIMessage({openVideo = true})
end
Then in the javascript file;
$(document).ready(function(){
var video = document.getElementById("myVideo");
function closeMain() {
$("body").css("background","transparent");
$("#myVideo").css("display","none");
video.pause();
}
function openMain() {
$("body").css("background-color","black");
$("#myVideo").css("display","block !important");
video.play();
setTimeout(function(){
$.post('http://the_event/end_event', JSON.stringify({}));
}, 20000);
}
// If 'Esc' is pressed, close all the menus
document.onkeyup == function (data) {
if (data.which == 27) {
$.post('http://the_event/end_event',JSON.stringify({}));
}
};
window.addEventListener('message', function(event) {
var item = event.data;
if (item.openVideo == true) {
openMain();
}
if (item.openVideo == false) {
closeMain();
}
});
})
and finally, the index.html
<html>
<head>
<script src="nui://game/ui/jquery.js" type="text/javascript"></script>
<script src="script.js"></script>
<style>
/* Style the video: 100% width and height to cover the entire window */
#myVideo {
position: fixed;
right: 0;
bottom: 0;
min-width: 100%;
min-height: 100%;
opacity: 1;
}
</style>
</head>
<!-- The video -->
<video id="myVideo">
<source src="rain.mp4" type="video/mp4">
</video>
</html>
__resource.lua
description "The Event"
ui_page "html/index.html"
client_script "client.lua"
server_script "server.lua"
files {
"html/index.html",
"html/script.js",
"html/rain.mp4",
}
