improvements to web interface for people who don't have tiny fingers …

…or eagle-eye vision
adangert · Aug 24, 2017 · 58d41d0 · 58d41d0
1 parent 31b7a05
commit 58d41d0
Show file tree

Hide file tree

Showing 5 changed files with 43 additions and 35 deletions.
diff --git a/static/jouststyle.css b/static/jouststyle.css
@@ -0,0 +1,8 @@
+body{font-size: 15pt;}
+button{font-size:16pt;}
+img{text-align: center;}
+input[type=checkbox] {transform: scale(2); vertical-align:middle; margin: 5pt;}
+input {font-size: 16pt;}
+select {font-size: 16pt;}
+table {font-size: 14pt;}
+#title {text-align: center;}
diff --git a/templates/basic.html b/templates/basic.html
@@ -0,0 +1,15 @@
+<html><head>
+<title>Joustmania!</title>
+<link rel="stylesheet" type="text/css" href='{{ url_for('static', filename='jouststyle.css') }}'>
+<script type=text/javascript src='{{ url_for('static', filename='jquery.js') }}'></script>
+<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0'>
+<title>Joustmania!</title>
+{% block header %}
+{% endblock %}
+</head>
+<body>
+<div id='title'><img src='{{ url_for('static', filename='PiPartyLogo2small.png') }}' /><br /><br /></div>
+{% block body %}
+{% endblock %}
+</body>
+</html>
diff --git a/templates/battery.html b/templates/battery.html
@@ -1,6 +1,7 @@
-<html><head>
+{% extends "basic.html" %}
+{% block header %}
 <style>
-table,td {border:1px solid black;  padding:5px; font-weight:bold;}
+table,td {border:1pt solid black;  padding:3pt;}
 table{border-collapse: collapse;}
 
 .batt5, .batt4{background-color:#80ff80;}
@@ -13,15 +14,9 @@
 .act1{background-color:lightgray;}
 .act0{background-color:#80ff80;}
 </style>
+{% endblock %}
 
-<title>Joustmania!</title>
-<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0'>
-</head>
-<body>
-
-<div id='title'>
-<img src='{{ url_for('static', filename='PiPartyLogo2small.png') }}' /><br /><br />
-</div>
+{% block body %}
 Note: Does not update during games.<br/><br/>
 <table><tr><td>MAC Address</td><td>Battery</td><td>Active</td></tr>
 {% for move in ns.battery_status %}
@@ -32,5 +27,4 @@
 <br/>
 <a href="/battery"><button type="button">Refresh</button></a>
 <a href="/"><button type="button">Go Back</button></a>
-</body>
-</html>
+{% endblock %}
diff --git a/templates/joustmania.html b/templates/joustmania.html
@@ -1,7 +1,5 @@
-<html><head>
-<title>Joustmania!</title>
-<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0'>
-<script type=text/javascript src='{{ url_for('static', filename='jquery.js') }}'></script>
+{% extends "basic.html" %}
+{% block header %}
 <script>
 function updateStatus(){
     $.ajax({
@@ -134,13 +132,9 @@
     setInterval(updateStatus,500);
 });
 </script>
-<body>
-
-<div id='title'>
-
-<img src='{{ url_for('static', filename='PiPartyLogo2small.png') }}' /><br /><br />
-</div>
+{% endblock %}
 
+{% block body %}
 <div class='main_status'>
 Curent mode: <span id='game_mode'>Joust Null</span><br />
 Game status: <span id='game_status'>False</span><br />
@@ -222,4 +216,4 @@
 Cannot connect to Joustmania!
 </div>
 
-</body></html>
+{% endblock %}
diff --git a/templates/settings.html b/templates/settings.html
@@ -1,7 +1,5 @@
-<html><head>
-<title>Joustmania!</title>
-<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0'>
-<script type=text/javascript src='{{ url_for('static', filename='jquery.js') }}'></script>
+{% extends "basic.html" %}
+{% block header %}
 <script>
 function updateStatus(){
     $.ajax({
@@ -24,12 +22,12 @@
     setInterval(updateStatus,1000);
 });
 </script>
-<body>
+<style>
+p{line-height: 200%}
+</style>
+{% endblock %}
 
-<div id='title'>
-
-<img src='{{ url_for('static', filename='PiPartyLogo2small.png') }}' /><br /><br />
-</div>
+{% block body %}
 <div class="lol">
 {% with message = get_flashed_messages() %}
   {% if message %}
@@ -54,7 +52,7 @@ <h3>Admin Settings</h3>
 <p>
 {{ form.sensitivity }} {{form.sensitivity.label}}
 </p>
-<p>
+<p id="random">
 Random Mode Game Selection<br />
 {% for item in form.random_modes %}
     {{ item(checked=item.data in settings.con_games) }} {{ item.label }} <br />
@@ -64,5 +62,4 @@ <h3>Admin Settings</h3>
 </form>
 <a href="/"><button type="button">Go Back</button></a>
 </div>
-
-</body></html>
+{% endblock %}