Ajoute l'application de Brice et sa mise a jour automatique

brice/www/js/ClockFrontEnd.js

@@ -0,0 +1,87 @@
+let white = document.getElementById("white_button");
+let black = document.getElementById("black_button");
+let white_time = document.getElementById("TimeWhite")
+let black_time = document.getElementById("TimeBlack")
+let black_move_left = document.getElementById("MoveLeftBlack")
+let white_move_left = document.getElementById("MoveLeftWhite")
+let BlockType = document.getElementById("BlockType")
+let BlockTime = document.getElementById("BlockTime")
+let trais = true
+
+
+function msToMinSec(ms) {
+    const totalSeconds = Math.floor(ms / 1000);
+    const minutes = Math.floor(totalSeconds / 60);
+    const seconds = totalSeconds % 60;
+
+    return `${minutes}:${seconds.toString().padStart(2, '0')}`;
+}
+
+function toggle_trais(){
+    trais = !trais
+    if (trais){
+        showGlowRight()
+    }else{
+        showGlowLeft()
+    }
+}
+
+function change_move_left_white(number){
+    white_move_left.innerText = `Coup restant Blanc : ${number}`
+}
+
+function change_move_left_black(number){
+    black_move_left.innerText = `Coup restant Noir : ${number}`
+}
+
+function change_time_block(Time){
+    BlockTime.innerText = `Temps restant Block : ${msToMinSec(Time)}`
+}
+
+function set_block_type(type){
+    // true = +
+    // false = -
+    if (type){
+        BlockType.innerText = "Block +"
+    }else{
+        BlockType.innerText = "Block -"
+    }
+}
+
+function change_time_white(Time){
+    white_time.innerText = msToMinSec(Time)
+}
+
+function change_time_black(Time){
+    black_time.innerText = msToMinSec(Time)
+}
+white.addEventListener("pointerdown", () => {
+    if (!trais) white.classList.add("click");
+    if (!has_start) start()
+    else white_touch()
+});
+white.addEventListener("pointerup", () => {
+    white.classList.remove("click");
+});
+
+black.addEventListener("pointerdown", () => {
+    if (trais )black.classList.add("click");
+    black_touch()
+});
+black.addEventListener("pointerup", () => {
+    black.classList.remove("click");
+});
+
+function showGlowLeft() {
+    document.body.classList.remove("glow-right");
+    document.body.classList.add("glow-left");
+}
+
+function showGlowRight() {
+    document.body.classList.remove("glow-left");
+    document.body.classList.add("glow-right");
+}
+
+function hideGlow() {
+    document.body.classList.remove("glow-left", "glow-right");
+}

brice/www/js/TimerFrontEnd.js

@@ -0,0 +1,35 @@
+let white_Timer = document.getElementById("TimerWhite")
+let black_Timer = document.getElementById("TimerBlack")
+let white_Time_Timer = document.getElementById("TextWhite")
+let black_Time_Timer = document.getElementById("TextBlack")
+let TimerBlockType = document.getElementById("BlockTypeTimer")
+
+function Set_block_type_Timer(type){
+     if (type){
+        TimerBlockType.innerText = "Block +"
+    }else{
+        TimerBlockType.innerText = "Block -"
+    }
+}
+
+function Set_White_Time_Cube(Time){
+    white_Time_Timer.innerText = `Temps au cube Blanc : ${msToMinSec(Time)}`
+}
+
+function Set_Black_Time_Cube(Time){
+    black_Time_Timer.innerText = `Temps au cube Noir : ${msToMinSec(Time)}`
+}
+
+white_Timer.addEventListener("pointerdown", () => {
+    white_timer_touch();
+});
+white_Timer.addEventListener("pointerup", () => {
+    white_timer_release();
+});
+
+black_Timer.addEventListener("pointerdown", () => {
+    black_timer_touch();
+});
+black_Timer.addEventListener("pointerup", () => {
+    black_timer_release();
+});

brice/www/js/appload.js

@@ -0,0 +1,3 @@
+
+load_Clock_scene()
+update()

brice/www/js/backend.js

@@ -0,0 +1,239 @@
+
+let White = {
+    moveLeft : 0,
+    Time : 0,
+    TimeStartMove : 0
+}
+
+let Black = {
+    moveLeft : 0,
+    Time : 0,
+    TimeStartMove : 0
+}
+let has_start = false
+
+Block = {
+    Type : false,
+    Time : 0,
+    last_time : 0
+}
+
+Timer = {
+    White_Has_started : false,
+    Black_Has_started : false,
+    Black_time : 0,
+    White_time : 0,
+    White_start_time : 0,
+    Black_start_time : 0,
+    coldown_White : 0,
+    coldown_Black : 0,
+    coldown_Start_White : 0,
+    coldown_Start_Black : 0,
+    White_Has_Finish : false,
+    Black_Has_Finish : false 
+}
+
+config = {
+    StartTimeWhite : 600000,
+    StartTimeBlack:600000,
+    StartMoveLeft : 8,
+    BlockTime : 180000,
+    last_block : true,
+    trais : false,
+    MaxIncrement : 120000
+}
+
+
+function load_Clock_scene(){
+    has_start = false
+    hide_scene("Cube")
+    inizalize_clock()
+    show_scene("Clock")
+    inizalize_clock()
+}
+
+function inizalize_clock(){
+    trais = !config.trais
+    toggle_trais()
+    White.Time = config.StartTimeWhite
+    White.moveLeft = config.StartMoveLeft
+    Black.Time = config.StartTimeBlack
+    Black.moveLeft = config.StartMoveLeft
+    Block.Time = config.BlockTime
+    Block.Type = !config.last_block
+
+    change_move_left_black(Black.moveLeft)
+    change_move_left_white(White.moveLeft)
+    change_time_black(Black.Time)
+    change_time_white(White.Time)
+    change_time_block(Block.Time)
+    set_block_type(Block.Type)
+}
+
+function start(){
+    White.TimeStartMove = Date.now()
+    Black.TimeStartMove = Date.now()
+    Block.last_time = Date.now()
+    has_start = true
+}
+
+function load_cube_scene(){
+    has_start = false
+
+    config.StartTimeWhite = White.Time
+    config.StartTimeBlack = Black.Time
+    config.last_block  = Block.Type
+
+    Timer = {
+    White_Has_started : false,
+    Black_Has_started : false,
+    Black_time : 0,
+    White_time : 0,
+    White_start_time : 0,
+    Black_start_time : 0,
+    coldown_White : 0,
+    coldown_Black : 0,
+    coldown_Start_White : 0,
+    coldown_Start_Black : 0,
+    White_Has_Finish : false,
+    Black_Has_Finish : false 
+}
+    Set_block_type_Timer(config.last_block)
+    Set_White_Time_Cube(0)
+    Set_Black_Time_Cube(0)
+    hide_scene("Clock")
+    hideGlow()
+    show_scene("Cube")
+    
+}
+
+function black_timer_touch(){
+    if (!Timer.Black_Has_started){
+        Timer.coldown_Start_Black = Date.now()
+        black_Timer.classList.add("RedClick")
+    }else if(!Timer.Black_Has_Finish){
+        Timer.Black_Has_Finish = true
+        black_Timer.classList.add("GreenClick")
+    }
+}
+
+function black_timer_release(){
+    if (Timer.coldown_Black > 2000) {
+        Timer.Black_Has_started = true
+        Timer.Black_start_time = Date.now()
+        black_Timer.classList.remove("GreenClick")
+    }else{
+        black_Timer.classList.remove("RedClick")
+        Timer.coldown_Start_Black = 0;
+    }
+}
+
+
+function white_timer_touch(){
+    if (!Timer.White_Has_started){
+        Timer.coldown_Start_White = Date.now()
+        white_Timer.classList.add("RedClick")
+    }else if(!Timer.White_Has_Finish){
+        Timer.White_Has_Finish = true
+        white_Timer.classList.add("GreenClick")
+    }
+}
+
+function white_timer_release(){
+    if (Timer.coldown_White > 2000) {
+        Timer.White_Has_started = true
+        Timer.White_start_time = Date.now()
+        white_Timer.classList.remove("GreenClick")
+    }else{
+        white_Timer.classList.remove("RedClick")
+        Timer.coldown_Start_White = 0;
+    }
+}
+
+
+function white_touch(){
+    if (trais) return null
+    if (!has_start) return null
+    toggle_trais()
+    Black.TimeStartMove = Date.now()
+    White.moveLeft -= 1
+    change_move_left_white(White.moveLeft)
+}
+
+function black_touch(){
+    if (!trais) return null
+    if (!has_start) return null
+    Black.moveLeft -= 1
+    if (Black.moveLeft == 0){
+        load_cube_scene()
+    }else{
+        toggle_trais()
+        White.TimeStartMove = Date.now()
+        change_move_left_black(Black.moveLeft)
+    }
+}
+function update() {
+    if (last_scene == "Clock" && has_start){
+        if (!trais) {// trais au blanc
+            White.Time -= (Date.now() - White.TimeStartMove)
+            White.TimeStartMove = Date.now()
+        }else{
+            Black.Time -= (Date.now() - Black.TimeStartMove)
+            Black.TimeStartMove = Date.now()
+        }
+        Block.Time -= (Date.now() - Block.last_time)
+        Block.last_time = Date.now()
+        if (Block.Time <= 0){
+            load_cube_scene()
+        }
+
+        change_time_white(White.Time)
+        change_time_black(Black.Time)
+        change_time_block(Block.Time)
+    }else if(last_scene == "Cube"){
+        if (!Timer.Black_Has_started){ // noire a pas commencer le cube
+            if (Timer.coldown_Start_Black != 0){ // coldown lancer
+                Timer.coldown_Black = Date.now() - Timer.coldown_Start_Black
+                if (Timer.coldown_Black > 2000){
+                    black_Timer.classList.remove("RedClick")
+                    black_Timer.classList.add("GreenClick")
+                }
+            }
+        }else if(!Timer.Black_Has_Finish){
+
+            Timer.Black_time = Date.now() - Timer.Black_start_time
+            Set_Black_Time_Cube(Timer.Black_time)
+
+        }
+
+        if (!Timer.White_Has_started){ // blanc a pas commencer le cube
+            if (Timer.coldown_Start_White != 0){ // coldown lancer
+                Timer.coldown_White = Date.now() - Timer.coldown_Start_White
+                if (Timer.coldown_White > 2000){
+                    white_Timer.classList.remove("RedClick")
+                    white_Timer.classList.add("GreenClick")
+                }
+            }
+        }else if (!Timer.White_Has_Finish){
+
+            Timer.White_time = Date.now() - Timer.White_start_time
+            Set_White_Time_Cube(Timer.White_time)
+
+        }
+        
+
+        if (Timer.Black_Has_Finish && Timer.White_Has_Finish){
+            if (config.last_block){
+                config.StartTimeWhite += Timer.Black_time
+                config.StartTimeBlack += Timer.Black_time
+            }else{
+                config.StartTimeWhite -= Timer.White_time
+                config.StartTimeBlack -= Timer.Black_time
+            }
+
+            load_Clock_scene()
+        }
+
+    }
+    requestAnimationFrame(update);
+}

brice/www/js/scene.js

@@ -0,0 +1,13 @@
+let last_scene = ""
+
+function show_scene(name){
+    scene = document.getElementById("scene" + name);
+    console.log(scene)
+    last_scene = name
+    scene.style.display = "block";
+}
+
+function hide_scene(name){
+    scene = document.getElementById("scene" + name);
+    scene.style.display = "none";
+}