From 08e4a27c0db7fc2867cce3eb6f80799148c03ba6 Mon Sep 17 00:00:00 2001
From: Karan Jayachandra <karan.jayachandra@nxp.com>
Date: Fri, 25 Jul 2025 15:30:07 +0200
Subject: Moved to a mobile friendly CSS framework

---
 app/__init__.py | 27 ++++++++++++++-------------
 1 file changed, 14 insertions(+), 13 deletions(-)

(limited to 'app/__init__.py')

diff --git a/app/__init__.py b/app/__init__.py
index 3d3b498..639f030 100644
--- a/app/__init__.py
+++ b/app/__init__.py
@@ -54,19 +54,29 @@ def get_list_of_courts():
     return render_template("courts.j2", courts=g.courts.all())
 
 
+def login_required(f):
+    @wraps(f)
+    def decorated_function(*args, **kwargs):
+        if not is_logged_in():
+            response = Response("User isn't logged in!")
+            response.headers["HX-Redirect"] = url_for("simplelogin.login")
+            return response
+        return f(*args, **kwargs)
+
+    return decorated_function
+
+
 @app.route("/propose", methods=["POST"])
+@login_required
 def get_random_games():
-    if not is_logged_in():
-        return redirect(url_for("login"))
     g.levels = int(request.form["levels"].split()[0])
     g.teams = request.form["team"] == "Teams"
     return render_template("games.j2", games=g.propose(), title="Proposal")
 
 
 @app.route("/confirm", methods=["POST"])
+@login_required
 def confirm_games():
-    if not is_logged_in():
-        return redirect(url_for("simplelogin.login"))
     return render_template("games.j2", games=g.confirm(), title=f"Round: {g.round()}")
 
 
@@ -76,15 +86,6 @@ def clear_games():
         "games.j2", games=g.current_round(), title=f"Round: {g.round()}"
     )
 
-def login_required(f):
-    @wraps(f)
-    def decorated_function(*args, **kwargs):
-        if not is_logged_in():
-            response = Response("User isn't logged in!")
-            response.headers["HX-Redirect"] = url_for("simplelogin.login")
-            return response
-        return f(*args, **kwargs)
-    return decorated_function
 
 @app.route("/reset", methods=["POST"])
 @login_required
-- 
cgit v1.3.1


From 63e1b52e1b76e136e6534949980d85ffe413f0c9 Mon Sep 17 00:00:00 2001
From: Karan Jayachandra <karan.jayachandra@nxp.com>
Date: Fri, 25 Jul 2025 16:06:20 +0200
Subject: Working mobile and desktop version

---
 app/__init__.py           |  3 +-
 app/static/custom.js      | 91 -----------------------------------------------
 app/static/file.js        | 11 ++++++
 app/static/timer.js       | 91 +++++++++++++++++++++++++++++++++++++++++++++++
 app/templates/controls.j2 | 12 +++----
 app/templates/games.j2    |  2 +-
 app/templates/index.j2    |  4 +--
 app/templates/macros.j2   |  4 +--
 app/templates/players.j2  | 14 ++------
 9 files changed, 117 insertions(+), 115 deletions(-)
 delete mode 100644 app/static/custom.js
 create mode 100644 app/static/file.js
 create mode 100644 app/static/timer.js

(limited to 'app/__init__.py')

diff --git a/app/__init__.py b/app/__init__.py
index 639f030..0e0ea09 100644
--- a/app/__init__.py
+++ b/app/__init__.py
@@ -31,7 +31,7 @@ g = Session()
 
 @app.route("/", methods=["GET"])
 def home():
-    return render_template("index.j2", url_for=url_for)
+    return render_template("index.j2", url_for=url_for, login_status=is_logged_in())
 
 
 @app.route("/control", methods=["GET"])
@@ -46,6 +46,7 @@ def get_list_of_players():
         regulars=g.players.regulars(),
         guests=g.players.guests(),
         url_for=url_for,
+        login_status=is_logged_in(),
     )
 
 
diff --git a/app/static/custom.js b/app/static/custom.js
deleted file mode 100644
index 3daeb17..0000000
--- a/app/static/custom.js
+++ /dev/null
@@ -1,91 +0,0 @@
-let minsPerRound = Number(sessionStorage.getItem("minsPerRound")) || 12;
-let timerRunningFlag = Number(sessionStorage.getItem("timerRunningFlag")) || 0;
-let deadline = Number(sessionStorage.getItem("deadline")) || new Date().getTime();
-let clock = 0;
-
-function setTimer(m, s) {
-    let timer = document.getElementById("timer-display");
-    m = m < 10 ? ("0" + m) : m;
-    s = s < 10 ? ("0" + s) : s;
-    timer.value = `${m}:${s}`;
-}
-
-function setSessionData() {
-    sessionStorage.setItem("deadline", deadline);
-    sessionStorage.setItem("minsPerRound", minsPerRound);
-    sessionStorage.setItem("timerRunningFlag", timerRunningFlag);
-}
-
-function resetTimer() {
-    clearInterval(clock);
-    setTimer(minsPerRound, 0);
-    timerRunningFlag = 0;
-    setSessionData();
-}
-
-function updateTimer(milliseconds) {
-    const m = Math.floor((milliseconds % (1000 * 60 * 60)) / (1000 * 60));
-    const s = Math.floor((milliseconds % (1000 * 60)) / 1000);
-    setTimer(m, s);
-}
-
-function refreshTimer() {
-    const now = new Date().getTime();
-    const millisecondsToDeadline = deadline - now;
-    if (millisecondsToDeadline > 0) {
-        updateTimer(millisecondsToDeadline);
-        return;
-    }
-    resetTimer();
-    const notification = new Notyf({
-        duration: 30 * 1000, 
-        position: {x: 'center', y: 'top'},
-        types: [{
-            type: 'success',
-            background: 'indianred',
-            duration: 1000 * 1000,
-            dismissible: true
-        }]
-    });
-    notification.success("Round completed");
-}
-
-function startTimer(fresh) {
-    if (fresh) {
-        now = new Date().getTime();
-        const millisecondsToDeadline = minsPerRound * 60 * 1000;
-        deadline = now + millisecondsToDeadline;
-    }
-    timerRunningFlag = 1;
-    setSessionData();
-    clock = setInterval(refreshTimer, 1000);
-}
-
-window.onload = function () {
-    if (timerRunningFlag) 
-        startTimer(0); 
-    else resetTimer();
-
-    document.getElementById("timer-start").addEventListener('click', ()=> {
-        if (timerRunningFlag != 0) return;
-        startTimer(1);
-    });
-
-    document.getElementById("timer-stop").addEventListener('click', ()=>{
-        resetTimer();
-    });
-
-    document.getElementById("timer-inc").addEventListener('click', ()=> {
-        if (timerRunningFlag == 0) {
-            minsPerRound += 1;
-            resetTimer();
-        }
-    });
-
-    document.getElementById("timer-dec").addEventListener('click', ()=> {
-        if (timerRunningFlag == 0 && minsPerRound != 0) {
-            minsPerRound -= 1;
-            resetTimer();
-        }
-    });
-}
\ No newline at end of file
diff --git a/app/static/file.js b/app/static/file.js
new file mode 100644
index 0000000..403ddf6
--- /dev/null
+++ b/app/static/file.js
@@ -0,0 +1,11 @@
+window.onload = function() {
+    const fileInput = document.querySelector("#file-js input[type=file]");
+        if (fileInput !== null) {
+            fileInput.onchange = () => {
+            if (fileInput.files.length > 0) {
+                const fileName = document.querySelector("#file-js .file-name");
+                fileName.textContent = fileInput.files[0].name;
+            }
+        }
+    };
+}
\ No newline at end of file
diff --git a/app/static/timer.js b/app/static/timer.js
new file mode 100644
index 0000000..e8e7854
--- /dev/null
+++ b/app/static/timer.js
@@ -0,0 +1,91 @@
+let minsPerRound = Number(sessionStorage.getItem("minsPerRound")) || 12;
+let timerRunningFlag = Number(sessionStorage.getItem("timerRunningFlag")) || 0;
+let deadline = Number(sessionStorage.getItem("deadline")) || new Date().getTime();
+let clock = 0;
+
+function setTimer(m, s) {
+    let timer = document.getElementById("timer-display");
+    m = m < 10 ? ("0" + m) : m;
+    s = s < 10 ? ("0" + s) : s;
+    timer.value = `${m}:${s}`;
+}
+
+function setSessionData() {
+    sessionStorage.setItem("deadline", deadline);
+    sessionStorage.setItem("minsPerRound", minsPerRound);
+    sessionStorage.setItem("timerRunningFlag", timerRunningFlag);
+}
+
+function resetTimer() {
+    clearInterval(clock);
+    setTimer(minsPerRound, 0);
+    timerRunningFlag = 0;
+    setSessionData();
+}
+
+function updateTimer(milliseconds) {
+    const m = Math.floor((milliseconds % (1000 * 60 * 60)) / (1000 * 60));
+    const s = Math.floor((milliseconds % (1000 * 60)) / 1000);
+    setTimer(m, s);
+}
+
+function refreshTimer() {
+    const now = new Date().getTime();
+    const millisecondsToDeadline = deadline - now;
+    if (millisecondsToDeadline > 0) {
+        updateTimer(millisecondsToDeadline);
+        return;
+    }
+    resetTimer();
+    const notification = new Notyf({
+        duration: 30 * 1000, 
+        position: {x: 'center', y: 'top'},
+        types: [{
+            type: 'success',
+            background: 'indianred',
+            duration: 1000 * 1000,
+            dismissible: true
+        }]
+    });
+    notification.success("Round completed");
+}
+
+function startTimer(fresh) {
+    if (fresh) {
+        now = new Date().getTime();
+        const millisecondsToDeadline = minsPerRound * 60 * 1000;
+        deadline = now + millisecondsToDeadline;
+    }
+    timerRunningFlag = 1;
+    setSessionData();
+    clock = setInterval(refreshTimer, 1000);
+}
+
+window.onload = function () {
+    if (timerRunningFlag) 
+        startTimer(0); 
+    else resetTimer();
+
+    document.getElementById("timer-start").addEventListener('click', ()=> {
+        if (timerRunningFlag != 0) return;
+        startTimer(1);
+    });
+
+    document.getElementById("timer-stop").addEventListener('click', ()=>{
+        resetTimer();
+    });
+
+    document.getElementById("timer-inc").addEventListener('click', ()=> {
+        if (timerRunningFlag == 0) {
+            minsPerRound += 1;
+            resetTimer();
+        }
+    });
+
+    document.getElementById("timer-dec").addEventListener('click', ()=> {
+        if (timerRunningFlag == 0 && minsPerRound != 0) {
+            minsPerRound -= 1;
+            resetTimer();
+        }
+    });
+}
\ No newline at end of file
diff --git a/app/templates/controls.j2 b/app/templates/controls.j2
index 14e7520..8e7440e 100644
--- a/app/templates/controls.j2
+++ b/app/templates/controls.j2
@@ -1,10 +1,4 @@
 {% from "macros.j2" import court_button %}
-<h3>Courts</h3>
-<div class="parent">
-{% for court in courts %}
-    {{ court_button(court) }}
-{% endfor %}
-</div>
 <h3>Generation</h3>
 <div class="grid">
     <div class="select is-responsive">
@@ -47,4 +41,10 @@
 <div class="grid">
 <button id="timer-start"><i class="fas fa-light fa-play"></i></button>
 <button id="timer-stop"><i class="fas fa-light fa-stop"></i></button>
+</div>
+<h3>Courts</h3>
+<div class="parent">
+{% for court in courts %}
+    {{ court_button(court) }}
+{% endfor %}
 </div>
\ No newline at end of file
diff --git a/app/templates/games.j2 b/app/templates/games.j2
index ce2a412..5041ce1 100644
--- a/app/templates/games.j2
+++ b/app/templates/games.j2
@@ -10,7 +10,7 @@
 </thead>
 <tbody>
 {% for game in games %}
-    <tr {% if game.team_1[0].first_name == 'RESERVED' %} class="is-danger" {% endif %}>
+    <tr {% if game.team_1[0].first_name == 'RESERVED' %} data-theme="dark" {% endif %}>
         <th align="center" style="width: 8%;">{{ game.court.id }}</th>
         <td style="width: 23%;"><strong>{{ game.team_1[0].first_name }}</strong>{{ " " + game.team_1[0].last_name }}</th>
         <td style="width: 23%;"><strong>{{ game.team_1[1].first_name }}</strong>{{ " " + game.team_1[1].last_name }}</th>
diff --git a/app/templates/index.j2 b/app/templates/index.j2
index 8a13fa0..af6ca4c 100644
--- a/app/templates/index.j2
+++ b/app/templates/index.j2
@@ -3,7 +3,7 @@
 <html lang="en">
 	{{ header(url_for) }}
 	<body>
-		<header class="container">{{ navbar(url_for) }}</header>
+		<header class="container">{{ navbar(url_for, login_status) }}</header>
 		<main class="container">
 			<h2>Games</h2>
 			<div hx-post="/clear" hx-swap="outerHTML" hx-trigger="load"></div>
@@ -11,6 +11,6 @@
 			<div hx-get="/control" hx-swap="outerHTML" hx-trigger="load"></div>
 		</main>
 		<footer class="container">{{ footer() }}</footer>
-		<script defer src="{{ url_for('static', filename='custom.js') }}"></script>
+		<script src="{{ url_for('static', filename='timer.js') }}"></script>
 	</body>
 </html>
diff --git a/app/templates/macros.j2 b/app/templates/macros.j2
index 17a2940..e82b910 100644
--- a/app/templates/macros.j2
+++ b/app/templates/macros.j2
@@ -31,7 +31,7 @@
 {%- endmacro %}
 
 
-{% macro navbar(url_for) -%}
+{% macro navbar(url_for, login_status) -%}
 <nav>
   <ul>
     <li><strong>Match Up!</strong></li>
@@ -39,7 +39,7 @@
   <ul>
     <li><a href="/">Games</a></li>
     <li><a href="/players">Players</a></li>
-    <li><a href="/login/">Admin</a></li>
+    {% if login_status %}<li><a href="/logout/">Logout</a></li>{% else %}<li><a href="/login/">Login</a></li>{% endif %} 
   </ul>
 </nav>
 {%- endmacro %}
\ No newline at end of file
diff --git a/app/templates/players.j2 b/app/templates/players.j2
index 4b9660e..bacb215 100644
--- a/app/templates/players.j2
+++ b/app/templates/players.j2
@@ -3,7 +3,7 @@
 <html lang="en">
 	{{ header(url_for) }}
 	<body>
-	<header class="container">{{ navbar(url_for) }}</header>
+	<header class="container">{{ navbar(url_for, login_status) }}</header>
 		<main class="container">
 			<h3 >Members</h3>
             <div class="parent">
@@ -34,17 +34,7 @@
 				</form>
 			</div>
 			<footer class="container">{{ footer() }}</footer>
-			<script>
-				const fileInput = document.querySelector("#file-js input[type=file]");
-					if (fileInput !== null) {
-						fileInput.onchange = () => {
-						if (fileInput.files.length > 0) {
-							const fileName = document.querySelector("#file-js .file-name");
-							fileName.textContent = fileInput.files[0].name;
-						}
-					}
-				};
-			</script>
+			<script src="{{ url_for('static', filename='file.js') }}"></script>
 		</main>
 	</body>
 </html>
\ No newline at end of file
-- 
cgit v1.3.1