ajout page d'attente

This commit is contained in:
2023-01-26 13:25:08 +01:00
parent e3f56a97a9
commit 2bcbf3fc20
7 changed files with 53 additions and 13 deletions

File diff suppressed because one or more lines are too long

View File

@@ -1,11 +1,9 @@
body {
font-family: 'Open Sans', sans-serif;
font-size: 16px;
line-height: 1.5;
html, body {
margin: 0;
padding: 0;
height: 100%;
}
.page {
width: 100%;
height: 100%;
text-align: center;
overflow: hidden;
}

View File

@@ -17,10 +17,12 @@ class CameraPage {
this._startup();
this._loadImages();
this._enabled = false;
this.DOMElement = document.getElementById("camera");
}
set enabled(val) {
this._enabled = val;
this.DOMElement.style.display = val ? "block" : "none";
if (val) {
this._frame();
}

View File

@@ -3,5 +3,5 @@ let stateManager;
window.addEventListener("load", () => {
let canvas = document.createElement("canvas");
document.body.appendChild(canvas);
stateManager = new StateManager(canvas);
// stateManager = new StateManager(canvas);
}, false);

View File

@@ -0,0 +1,12 @@
class SleepingPage {
constructor(onWakeUp) {
this.onWakeUp = onWakeUp;
this.isEnabled = false;
this.DOMElement = document.getElementById("sleeping-page");
}
set enabled(isEnabled) {
this.isEnabled = isEnabled;
this.DOMElement.style.display = isEnabled ? "block" : "none";
}
}

View File

@@ -10,15 +10,23 @@ class StateManager {
this.canvas = canvas;
this._state = STATE.sleeping;
this._cameraPage = new CameraPage(this.canvas);
this._sleepingPage = new SleepingPage();
this.wsClient = new WebsocketClient(
(effects) => this._cameraPage.setEffects(effects),
(state) => this.changeState(state)
);
//TODO: Remove qd implémenté dans le backend
document.getElementById("sleeping-page-continue").onclick = () => this.setState(STATE.video);
}
setState(newState) {
if(this._state == STATE.sleeping && newState == STATE.video) {
this._cameraPage.enabled = true;
this._sleepingPage.enabled = false;
}
}
}

View File

@@ -1,16 +1,29 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="assets/css/main.css">
<!-- <link rel="stylesheet" href="assets/css/bootstrap-grid.min.css"> -->
<title>Téléreview</title>
</head>
<body>
<div id="sleeping-page" class="">
<h1>Venez donner votre avis</h1>
<!-- Boutton pour test -->
<button id="sleeping-page-continue">Continuer</button>
</div>
<div id="camera">
</div>
<script src="assets/js/camera_page.js"></script>
<script src="assets/js/network.js"></script>
<script src="assets/js/sleeping_page.js"></script>
<script src="assets/js/state_manager.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>