public/Telereview
1
0
Fork 0
mirror of https://git.roussel.pro/telecom-paris/pact.git synced 2026-02-09 10:30:17 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

optimisation retour video avec un element video

Browse Source
This commit is contained in:
Quentin Roussel
2023-01-29 21:43:07 +01:00
parent 0cc80637be
commit 4374bd0694
7 changed files with 34 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
code/interface_borne/assets/js/camera_page.js
View File

@@ -1,14 +1,14 @@
class CameraPage {
constructor(canvas) {
constructor() {
this.spinnerWeight = 10;
this.spinnerColor = "#0F0FFF"
this.canvas = canvas;
this.ctx = canvas.getContext("2d");
this.video = document.createElement("video");
this.canvas = document.getElementById("overlay-canvas");
this.ctx = this.canvas.getContext("2d");
this.video = document.getElementById("camera-video");
this.width;
this.height; //calculé automatiquement en fonction de la largeur du flux vidéo
this.height; //calcule automatiquement en fonction de la largeur du flux vidéo
this.videoWidth;
this.videoHeight;
this.streaming = false;
@@ -80,9 +80,8 @@ class CameraPage {
_frame() {
if (this.streaming && this.enabled && this.width && this.height) {
this.canvas.width = this.width;
this.canvas.height = this.height;
this.ctx.drawImage(this.video, 0, 0, this.width, this.height);
this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
// this.ctx.drawImage(this.video, 0, 0, this.width, this.height);
this._drawEffects();
}
if (this.enabled) {

4
code/interface_borne/assets/js/main.js
View File

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

8
code/interface_borne/assets/js/state_manager.js
View File

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