From 85b1c46364e21c348ddcec6fe2ac61bc05dd3f25 Mon Sep 17 00:00:00 2001
From: Plague <null>
Date: Fri, 28 Aug 2020 18:13:47 -0700
Subject: [PATCH 1/2] Add buffer and increment functions to timer

---
 app.js     | 26 +++++++++++++++++++++++++-
 index.html | 11 +++++++++--
 index.js   | 21 ++++++++++++++++++---
 3 files changed, 52 insertions(+), 6 deletions(-)
diff --git a/app.js b/app.js
index 769bb92..0a5db0b 100644
--- a/app.js
+++ b/app.js
@@ -35,7 +35,16 @@ app.post('/create',async function(req,res) {
         while(rooms[code]) {
             code = Math.floor(100000 + Math.random() * 900000).toString();
         }
-        rooms[code] = {t1: data.time, t2: data.time, m1: true, p: true, t: 0};
+        let buffer = parseInt(data.buffer) || 0
+        rooms[code] = {t1: data.time, 
+            t2: data.time, 
+            buffer: buffer, 
+            activeBuffer: buffer,
+            increment: parseInt(data.increment) || 0,
+            m1: true, 
+            p: true, 
+            t: 0
+        };
 
         res.send(code);
     } catch(e) {
@@ -66,8 +75,16 @@ app.post('/switch',async function(req, res) {
     }
     var room = rooms[data.code];
     if(data.s == 0) {
+        //apply increment
+        if (room.m1) {
+            room.t1 += room.increment;
+        } else {
+            room.t2 += room.increment;
+        }
         //switch
         room.m1 = !room.m1;
+        //reset buffer TODO: (Should this also happen on unpause?)
+        room.activeBuffer = room.buffer;
     } else if(data.s == 1) {
         //pause
         room.p = false;
@@ -81,6 +98,13 @@ app.post('/switch',async function(req, res) {
 //reduce room timer value
 function roomTick(delta, room) {
     if(room.p) return;
+    if (room.activeBuffer > 0) {
+        room.activeBuffer -= delta;
+        delta = -1* room.activeBuffer; 
+        if (delta < 0) {
+            return;
+        }
+    }
     if(room.m1 && room.t1 > 0) {
         room.t1 -= delta;
     } else if(room.t2 > 0) {
diff --git a/index.html b/index.html
index 8ab5e63..20f6b4a 100644
--- a/index.html
+++ b/index.html
@@ -18,12 +18,19 @@
     <body>
         <div id="joinDiv">
             <h1>Chess Timer Online</h1>
-            <input id="code" placeholder="Code"/>
+            <input id="code" placeholder="Code" size=15/>
             <button id="join" onclick="join()">Join</button>
             <br/>
             <br/>
-            <input id="time" placeholder="Time (Minutes)"/>
+            <input id="time" placeholder="Time (Minutes)" size=15/>
             <button id="create" onclick="create()">Create</button>
+            <div id="timeSettings" style="padding-top: 50px">
+            <strong>Advanced Time Settings</strong>
+                <div id="row">
+                    <input id="timeBuffer" placeholder="Buffer (Seconds)" size=15/>
+                    <input id="timeIncrement" placeholder="Increment (Seconds)" size=15/>
+                </div>
+            </div>
         </div>
         <div id="roomDiv" style="display:none">
             <h3 id="codeH"></h3>
diff --git a/index.js b/index.js
index ebd082c..fd63d59 100644
--- a/index.js
+++ b/index.js
@@ -3,6 +3,8 @@ var joinDiv = document.getElementById('joinDiv');
 var roomDiv = document.getElementById('roomDiv');
 var codeInput = document.getElementById('code');
 var timeInput = document.getElementById('time');
+var timeBufferInput = document.getElementById('timeBuffer');
+var timeIncrementInput = document.getElementById('timeIncrement');
 var t1h = document.getElementById('t1');
 var t2h = document.getElementById('t2');
 var pauseB = document.getElementById('pauseButton');
@@ -16,7 +18,11 @@ var room = {};
 //POST the creation request to server and open room div if successful
 function create() {
     console.log('time: ' + timeInput.value);
-    var data = {time: parseInt(timeInput.value)};
+    var data = {
+        time: parseInt(timeInput.value),
+        buffer: parseInt(timeBufferInput.value),
+        increment: parseInt(timeIncrementInput.value),
+    };
     $.post('./create',data,function(data,status) {
         if(data == 'invalid') {
             alert("Time must be between 1 and 740 minutes.");
@@ -60,6 +66,7 @@ function join() {
 //switch which timer is counting down
 function swap() {
     var data = {code, s: 0};
+    room.activeBuffer = room.buffer; //just to keep the local update smooth
     $.post('./switch',data,function(data,status) {
         if(data == 'invalid') {
             alert("Invalid Room Code.");
@@ -173,8 +180,16 @@ function setUpdateInterval() {
 //update room clock locally between server updates
 var prevTime = performance.now();
 setInterval(function() {
-    var time = performance.now();
-    var delta = (time-prevTime)/1000;
+    let time = performance.now();
+    let delta = (time-prevTime)/1000;
+    // Check buffer before for local updates to avoid backwards ticks
+    if (room && room.activeBuffer && room.activeBuffer > 0) {
+        room.activeBuffer -= delta;
+        delta = -1* room.activeBuffer; 
+        if (delta < 0) {
+            return;
+        }
+    }
     prevTime = time;
     if(room && !room.p) {
         if(room.m1 && room.t1 > 0) {

From 01de8dab911cf2f5e9f503aa8bc68b4f0a889aa0 Mon Sep 17 00:00:00 2001
From: Plague <null>
Date: Fri, 28 Aug 2020 18:25:03 -0700
Subject: [PATCH 2/2] fix directory structure

---
 index.html => client/index.html |  92 ++++----
 index.js => client/js/index.js  | 404 ++++++++++++++++----------------
 2 files changed, 248 insertions(+), 248 deletions(-)
 rename index.html => client/index.html (97%)
 rename index.js => client/js/index.js (96%)

diff --git a/index.html b/client/index.html
similarity index 97%
rename from index.html
rename to client/index.html
index 20f6b4a..bba8b25 100644
--- a/index.html
+++ b/client/index.html
@@ -1,47 +1,47 @@
-<!DOCTYPE html>
-<html>
-    <head>
-        <title>Chess Timer Online</title>
-        <style>
-            body {
-                font-size: 300%;
-                text-align: center;
-            }
-            button {
-                font-size: 120%;
-            }
-            input {
-                font-size: 120%;
-            }
-        </style>
-    </head>
-    <body>
-        <div id="joinDiv">
-            <h1>Chess Timer Online</h1>
-            <input id="code" placeholder="Code" size=15/>
-            <button id="join" onclick="join()">Join</button>
-            <br/>
-            <br/>
-            <input id="time" placeholder="Time (Minutes)" size=15/>
-            <button id="create" onclick="create()">Create</button>
-            <div id="timeSettings" style="padding-top: 50px">
-            <strong>Advanced Time Settings</strong>
-                <div id="row">
-                    <input id="timeBuffer" placeholder="Buffer (Seconds)" size=15/>
-                    <input id="timeIncrement" placeholder="Increment (Seconds)" size=15/>
-                </div>
-            </div>
-        </div>
-        <div id="roomDiv" style="display:none">
-            <h3 id="codeH"></h3>
-            <br/>
-            <button id="switchButton" onclick="swap()">Switch</button>
-            <button id="pauseButton" onclick="pause()">Start/Stop</button>
-            <h1 id="t1" style="color:blue"></h1>
-            <br/>
-            <h1 id="t2" style="color:green"></h1>
-        </div>
-        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
-        <script src="./client/js/index.js"></script>
-    </body>
+<!DOCTYPE html>
+<html>
+    <head>
+        <title>Chess Timer Online</title>
+        <style>
+            body {
+                font-size: 300%;
+                text-align: center;
+            }
+            button {
+                font-size: 120%;
+            }
+            input {
+                font-size: 120%;
+            }
+        </style>
+    </head>
+    <body>
+        <div id="joinDiv">
+            <h1>Chess Timer Online</h1>
+            <input id="code" placeholder="Code" size=15/>
+            <button id="join" onclick="join()">Join</button>
+            <br/>
+            <br/>
+            <input id="time" placeholder="Time (Minutes)" size=15/>
+            <button id="create" onclick="create()">Create</button>
+            <div id="timeSettings" style="padding-top: 50px">
+            <strong>Advanced Time Settings</strong>
+                <div id="row">
+                    <input id="timeBuffer" placeholder="Buffer (Seconds)" size=15/>
+                    <input id="timeIncrement" placeholder="Increment (Seconds)" size=15/>
+                </div>
+            </div>
+        </div>
+        <div id="roomDiv" style="display:none">
+            <h3 id="codeH"></h3>
+            <br/>
+            <button id="switchButton" onclick="swap()">Switch</button>
+            <button id="pauseButton" onclick="pause()">Start/Stop</button>
+            <h1 id="t1" style="color:blue"></h1>
+            <br/>
+            <h1 id="t2" style="color:green"></h1>
+        </div>
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
+        <script src="./client/js/index.js"></script>
+    </body>
 </html>
\ No newline at end of file
diff --git a/index.js b/client/js/index.js
similarity index 96%
rename from index.js
rename to client/js/index.js
index fd63d59..d18e704 100644
--- a/index.js
+++ b/client/js/index.js
@@ -1,203 +1,203 @@
-//some of the HTML elements
-var joinDiv = document.getElementById('joinDiv');
-var roomDiv = document.getElementById('roomDiv');
-var codeInput = document.getElementById('code');
-var timeInput = document.getElementById('time');
-var timeBufferInput = document.getElementById('timeBuffer');
-var timeIncrementInput = document.getElementById('timeIncrement');
-var t1h = document.getElementById('t1');
-var t2h = document.getElementById('t2');
-var pauseB = document.getElementById('pauseButton');
-var codeH = document.getElementById('codeH');
-
-//the room id
-var code = 0;
-//the room
-var room = {};
-
-//POST the creation request to server and open room div if successful
-function create() {
-    console.log('time: ' + timeInput.value);
-    var data = {
-        time: parseInt(timeInput.value),
-        buffer: parseInt(timeBufferInput.value),
-        increment: parseInt(timeIncrementInput.value),
-    };
-    $.post('./create',data,function(data,status) {
-        if(data == 'invalid') {
-            alert("Time must be between 1 and 740 minutes.");
-            return;
-        }
-        if(data == 'err') {
-            alert("Error, please refresh the page and try again.");
-            return;
-        }
-        code = data;
-        joinDiv.style.display = "none";
-        roomDiv.style.display = "inline-block";
-        codeH.innerHTML = "Code: " + code;
-        setUpdateInterval();
-    });
-}
-
-//try to get initial room info from code in input box
-function join() {
-    var id = codeInput.value;
-    var data = {code: id};
-    $.post('./info',data,function(data,status) {
-        if(data == 'invalid') {
-            console.log('failed room check with id ' + id)
-            alert("Invalid Room Code.");
-            console.log("failed room check with code " + code);
-            alert('It appears this room no longer exists.');
-        } else if(data == 'err') {
-            alert("Error, please refresh the page and try again.");
-        } else {
-            room = data;
-            code = id;
-            joinDiv.style.display = "none";
-            roomDiv.style.display = "inline-block";
-            codeH.innerHTML = "Code: " + id;
-            setUpdateInterval();
-        }
-    });
-}
-
-//switch which timer is counting down
-function swap() {
-    var data = {code, s: 0};
-    room.activeBuffer = room.buffer; //just to keep the local update smooth
-    $.post('./switch',data,function(data,status) {
-        if(data == 'invalid') {
-            alert("Invalid Room Code.");
-            return false;
-        }
-        if(data == 'err') {
-            alert("Error, please refresh the page and try again.");
-            return false;
-        }
-        room = data;
-        return true;
-    });
-}
-
-//pause/unpause timer
-function pause() {
-    var s = 1;
-    if(!room.p) {
-        s = 2;
-    }
-    var data = {code, s};
-    $.post('./switch',data,function(data,status) {
-        if(data == 'invalid') {
-            alert("Invalid Room Code.");
-            return false;
-        }
-        if(data == 'err') {
-            alert("Error, please refresh the page and try again.");
-            return false;
-        }
-        room = data;
-        return true;
-    });
-}   
-
-//update the room display
-function updateRoomDisplay() {
-    var h1 = Math.floor(room.t1/3600);
-    var m1 = Math.floor(room.t1/60)-h1*60;
-    var s1 = Math.floor(room.t1)-h1*3600-m1*60;
-    
-    var hs1 = h1.toString();
-    if(h1 < 10) {
-        hs1 = "0" + hs1;
-    }
-    var ms1 = m1.toString();
-    if(m1 < 10) {
-        ms1 = "0" + ms1;
-    }
-    var ss1 = s1.toString();
-    if(s1 < 10) {
-        ss1 = "0" + ss1;
-    }
-    t1h.innerHTML = hs1 + ":" + ms1 + ":" + ss1;
-    
-    var h2 = Math.floor(room.t2/3600);
-    var m2 = Math.floor(room.t2/60)-h2*60;
-    var s2 = Math.floor(room.t2)-h2*3600-m2*60;
-    var hs2 = h2.toString();
-    if(h2 < 10) {
-        hs2 = "0" + hs2;
-    }
-    var ms2 = m2.toString();
-    if(m2 < 10) {
-        ms2 = "0" + ms2;
-    }
-    var ss2 = s2.toString();
-    if(s2 < 10) {
-        ss2 = "0" + ss2;
-    }
-    t2h.innerHTML = hs2 + ":" + ms2 + ":" + ss2;
-
-
-    if(room.m1) {
-        t1h.style["text-decoration"] = "underline";
-        t2h.style["text-decoration"] = "none";
-    } else {
-        t1h.style["text-decoration"] = "none";
-        t2h.style["text-decoration"] = "underline";
-    }
-
-    if(room.t1 <=0 ) {
-        t1h.style.color = "red";
-    }
-    if(room.t2 <= 0) {
-        t2h.style.color = "red";
-    }
-}
-
-
-//update room info from server every second
-function setUpdateInterval() {
-    var roomInfo = setInterval(function() {
-        var data = {code};
-        $.post('./info',data,function(data,status) {
-            if(data == 'invalid') {
-                alert("Invalid Room Code.");
-                clearInterval(roomInfo);
-                console.log("failed room check with code " + code);
-                alert('It appears this room no longer exists.');
-            } else if(data == 'err') {
-                alert("Error, please refresh the page and try again.");
-            } else {
-                room = data;
-            }
-        });
-        updateRoomDisplay();
-    }, 1000);
-}
-
-//update room clock locally between server updates
-var prevTime = performance.now();
-setInterval(function() {
-    let time = performance.now();
-    let delta = (time-prevTime)/1000;
-    // Check buffer before for local updates to avoid backwards ticks
-    if (room && room.activeBuffer && room.activeBuffer > 0) {
-        room.activeBuffer -= delta;
-        delta = -1* room.activeBuffer; 
-        if (delta < 0) {
-            return;
-        }
-    }
-    prevTime = time;
-    if(room && !room.p) {
-        if(room.m1 && room.t1 > 0) {
-            room.t1 -= delta;
-            updateRoomDisplay();
-        } else if(!room.m1 && room.t2 > 0) {
-            room.t2 -= delta;
-            updateRoomDisplay();
-        }
-    }
+//some of the HTML elements
+var joinDiv = document.getElementById('joinDiv');
+var roomDiv = document.getElementById('roomDiv');
+var codeInput = document.getElementById('code');
+var timeInput = document.getElementById('time');
+var timeBufferInput = document.getElementById('timeBuffer');
+var timeIncrementInput = document.getElementById('timeIncrement');
+var t1h = document.getElementById('t1');
+var t2h = document.getElementById('t2');
+var pauseB = document.getElementById('pauseButton');
+var codeH = document.getElementById('codeH');
+
+//the room id
+var code = 0;
+//the room
+var room = {};
+
+//POST the creation request to server and open room div if successful
+function create() {
+    console.log('time: ' + timeInput.value);
+    var data = {
+        time: parseInt(timeInput.value),
+        buffer: parseInt(timeBufferInput.value),
+        increment: parseInt(timeIncrementInput.value),
+    };
+    $.post('./create',data,function(data,status) {
+        if(data == 'invalid') {
+            alert("Time must be between 1 and 740 minutes.");
+            return;
+        }
+        if(data == 'err') {
+            alert("Error, please refresh the page and try again.");
+            return;
+        }
+        code = data;
+        joinDiv.style.display = "none";
+        roomDiv.style.display = "inline-block";
+        codeH.innerHTML = "Code: " + code;
+        setUpdateInterval();
+    });
+}
+
+//try to get initial room info from code in input box
+function join() {
+    var id = codeInput.value;
+    var data = {code: id};
+    $.post('./info',data,function(data,status) {
+        if(data == 'invalid') {
+            console.log('failed room check with id ' + id)
+            alert("Invalid Room Code.");
+            console.log("failed room check with code " + code);
+            alert('It appears this room no longer exists.');
+        } else if(data == 'err') {
+            alert("Error, please refresh the page and try again.");
+        } else {
+            room = data;
+            code = id;
+            joinDiv.style.display = "none";
+            roomDiv.style.display = "inline-block";
+            codeH.innerHTML = "Code: " + id;
+            setUpdateInterval();
+        }
+    });
+}
+
+//switch which timer is counting down
+function swap() {
+    var data = {code, s: 0};
+    room.activeBuffer = room.buffer; //just to keep the local update smooth
+    $.post('./switch',data,function(data,status) {
+        if(data == 'invalid') {
+            alert("Invalid Room Code.");
+            return false;
+        }
+        if(data == 'err') {
+            alert("Error, please refresh the page and try again.");
+            return false;
+        }
+        room = data;
+        return true;
+    });
+}
+
+//pause/unpause timer
+function pause() {
+    var s = 1;
+    if(!room.p) {
+        s = 2;
+    }
+    var data = {code, s};
+    $.post('./switch',data,function(data,status) {
+        if(data == 'invalid') {
+            alert("Invalid Room Code.");
+            return false;
+        }
+        if(data == 'err') {
+            alert("Error, please refresh the page and try again.");
+            return false;
+        }
+        room = data;
+        return true;
+    });
+}   
+
+//update the room display
+function updateRoomDisplay() {
+    var h1 = Math.floor(room.t1/3600);
+    var m1 = Math.floor(room.t1/60)-h1*60;
+    var s1 = Math.floor(room.t1)-h1*3600-m1*60;
+    
+    var hs1 = h1.toString();
+    if(h1 < 10) {
+        hs1 = "0" + hs1;
+    }
+    var ms1 = m1.toString();
+    if(m1 < 10) {
+        ms1 = "0" + ms1;
+    }
+    var ss1 = s1.toString();
+    if(s1 < 10) {
+        ss1 = "0" + ss1;
+    }
+    t1h.innerHTML = hs1 + ":" + ms1 + ":" + ss1;
+    
+    var h2 = Math.floor(room.t2/3600);
+    var m2 = Math.floor(room.t2/60)-h2*60;
+    var s2 = Math.floor(room.t2)-h2*3600-m2*60;
+    var hs2 = h2.toString();
+    if(h2 < 10) {
+        hs2 = "0" + hs2;
+    }
+    var ms2 = m2.toString();
+    if(m2 < 10) {
+        ms2 = "0" + ms2;
+    }
+    var ss2 = s2.toString();
+    if(s2 < 10) {
+        ss2 = "0" + ss2;
+    }
+    t2h.innerHTML = hs2 + ":" + ms2 + ":" + ss2;
+
+
+    if(room.m1) {
+        t1h.style["text-decoration"] = "underline";
+        t2h.style["text-decoration"] = "none";
+    } else {
+        t1h.style["text-decoration"] = "none";
+        t2h.style["text-decoration"] = "underline";
+    }
+
+    if(room.t1 <=0 ) {
+        t1h.style.color = "red";
+    }
+    if(room.t2 <= 0) {
+        t2h.style.color = "red";
+    }
+}
+
+
+//update room info from server every second
+function setUpdateInterval() {
+    var roomInfo = setInterval(function() {
+        var data = {code};
+        $.post('./info',data,function(data,status) {
+            if(data == 'invalid') {
+                alert("Invalid Room Code.");
+                clearInterval(roomInfo);
+                console.log("failed room check with code " + code);
+                alert('It appears this room no longer exists.');
+            } else if(data == 'err') {
+                alert("Error, please refresh the page and try again.");
+            } else {
+                room = data;
+            }
+        });
+        updateRoomDisplay();
+    }, 1000);
+}
+
+//update room clock locally between server updates
+var prevTime = performance.now();
+setInterval(function() {
+    let time = performance.now();
+    let delta = (time-prevTime)/1000;
+    // Check buffer before for local updates to avoid backwards ticks
+    if (room && room.activeBuffer && room.activeBuffer > 0) {
+        room.activeBuffer -= delta;
+        delta = -1* room.activeBuffer; 
+        if (delta < 0) {
+            return;
+        }
+    }
+    prevTime = time;
+    if(room && !room.p) {
+        if(room.m1 && room.t1 > 0) {
+            room.t1 -= delta;
+            updateRoomDisplay();
+        } else if(!room.m1 && room.t2 > 0) {
+            room.t2 -= delta;
+            updateRoomDisplay();
+        }
+    }
 }, 100);
\ No newline at end of file
