Mahayoga
/
MIF_E31231392
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

WIP: validasi fullscreen

This commit is contained in:
Mahayoga 2026-05-07 03:37:04 +07:00
parent f896e54d34
commit 731e95a864
1 changed files with 66 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
resources/views/user/pages/ujian/index.blade.php
View File

@ -9,13 +9,16 @@
<a class="navbar-brand" href="#">Smart Anxiety</a>
<div class="collapse navbar-collapse justify-content-between" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0"></ul>
<div class="d-flex col-md-2">
<div class="col-md-6 d-flex justify-content-center align-items-center">
<div class="d-flex col-md-4">
<div class="col-md-4 d-flex justify-content-center align-items-center">
Time Left: <span id="time_left"></span>
</div>
<div class="col-md-6 d-flex justify-content-center align-items-center">
<div class="col-md-4 d-flex justify-content-center align-items-center">
<span id="bg_status_tobii" class="rounded bg-warning d-block mx-2" style="width: 10px; aspect-ratio: 1/1;"></span>Status Tobii
</div>
<div class="col-md-4 d-flex justify-content-center align-items-center">
<button id="fullscreen_btn" data-status="fullscreen" class="btn btn-sm btn-outline-secondary" onclick="openFullscreen()">Fullscreen</button>
</div>
</div>
</div>
</div>
@ -263,6 +266,63 @@ function stopTobii() {
}));
}
function openFullscreen() {
const status = $('#fullscreen_btn').attr('data-status');
const elem = document.documentElement;
if (status === 'fullscreen') {
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.webkitRequestFullscreen) {
elem.webkitRequestFullscreen(); // Safari
} else if (elem.msRequestFullscreen) {
elem.msRequestFullscreen(); // IE
}
$('#fullscreen_btn').attr('data-status', 'exit-fullscreen');
$('#fullscreen_btn').text('Exit Fullscreen');
s.send(JSON.stringify({
type: "command",
action: "start",
session_id: SESSION_ID
}));
} else if (status === 'exit-fullscreen') {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen(); // Safari
} else if (document.msExitFullscreen) {
document.msExitFullscreen(); // IE
}
$('#fullscreen_btn').attr('data-status', 'fullscreen');
$('#fullscreen_btn').text('Enter Fullscreen');
}
}
function checkFullscreen() {
if (!document.fullscreenElement) {
ws.send(JSON.stringify({
type: "command",
action: "stop",
session_id: SESSION_ID
}));
Swal.fire({
title: 'Alert',
icon: 'warning',
text: 'Anda keluar dari mode fullscreen, harap masuk ke mode fullscreen untuk melanjutkan ujian.',
confirmButtonText: 'Ya',
showCancelButton: false,
showCloseButton: false,
allowOutsideClick: false,
allowEscapeKey: false,
backdrop: `rgba(0, 0, 0, 0.4)`
}).then((result) => {
if (result.isConfirmed) {
openFullscreen();
}
});
}
}
$(document).ready(function() {
ws.onopen = () => {
console.log("Connected to WebSocket");
@ -273,6 +333,9 @@ function stopTobii() {
role: "web"
}));
document.addEventListener('fullscreenchange', checkFullscreen);
checkFullscreen();
ws.send(JSON.stringify({
type: "update_status",
status_sessions: true,