From e6d6109575657d0c34b859bef901d558d0b9022e Mon Sep 17 00:00:00 2001
From: Simon Brooke <simon@journeyman.cc>
Date: Sat, 30 Jun 2018 19:19:01 +0100
Subject: [PATCH] Tactical commit during work on user interface

---
 .gitignore                                    |  1 +
 project.clj                                   |  4 +-
 resources/templates/app.html                  |  4 +-
 .../auto/list-addresses-Addresses.html        | 57 ++++++++++++-------
 resources/templates/base.html                 |  6 +-
 youyesyet.adl.xml                             | 19 ++++---
 6 files changed, 58 insertions(+), 33 deletions(-)

diff --git a/.gitignore b/.gitignore
index fa895de..5e02010 100644
--- a/.gitignore
+++ b/.gitignore
@@ -10,6 +10,7 @@ pom.xml.asc
 /resources/public/content/.git
 /resources/public/vendor
 /bower_components/
+/resources/public/js/lib/
 .lein-deps-sum
 .lein-repl-history
 .lein-plugins/
diff --git a/project.clj b/project.clj
index 5e77ef4..61956c8 100644
--- a/project.clj
+++ b/project.clj
@@ -61,7 +61,9 @@
             [lein-less "1.7.5"]
             [lein-codox "0.10.3"]]
 
-  :bower-dependencies [[leaflet "0.7.3"]]
+  :bower-dependencies [[leaflet "0.7.3"]
+                       [jquery "3.3.1"]]
+  :bower {:directory "resources/public/js/lib"}
 
   :cucumber-feature-paths ["test/clj/features"]
 
diff --git a/resources/templates/app.html b/resources/templates/app.html
index 6b7bccb..7b181ca 100644
--- a/resources/templates/app.html
+++ b/resources/templates/app.html
@@ -28,8 +28,8 @@
 <!-- ATTENTION \/ -->
 <!-- ATTENTION /\ -->
 <!-- Leaflet -->
-<link rel="stylesheet" href="vendor/leaflet/dist/leaflet.css" />
-<script src="vendor/leaflet/dist/leaflet.js"></script>
+<link rel="stylesheet" href="js/lib/leaflet/dist/leaflet.css" />
+{% script "js/lib/leaflet/dist/leaflet.js" %}
 {% script "/js/app.js" %}
 {% endblock %}
 
diff --git a/resources/templates/auto/list-addresses-Addresses.html b/resources/templates/auto/list-addresses-Addresses.html
index aa6e297..7ad3988 100644
--- a/resources/templates/auto/list-addresses-Addresses.html
+++ b/resources/templates/auto/list-addresses-Addresses.html
@@ -19,14 +19,30 @@ See [Application Description Language](https://github.com/simon-brooke/adl).-->
 </title>
 
 {% endblock %}
-
-{% block content %}
-<form id='content' class='list'>
+{% block big-links %}
 <div class='big-link-container'>
-<a href='form-addresses-Address'>
+<a href='form-addresses-Address' class="big-link">
 Add a new Address
 </a>
 </div>
+<div class='big-link-container'>
+<a role="button" class="big-link" id="next-selector" href="javascript:void(0)"
+   onclick="document.querySelector('content').submit()">
+Next
+</a>
+</div>
+{% endblock %}
+{% block content %}
+<form id='content' class='list'>
+{% csrf-field %}
+<input id="offset" type="hidden" value="{{offset|0}}"/>
+<input id="limit" type="hidden" value="{{limit|50}}"/>
+<div class='back-link-container'>
+<input id='page' name='page' disabled='{% ifequal offset 0 %} false {% else %} true {% endifequal %}' value='Previous'/>
+</div>
+<div class='big-link-container'>
+<input id='page' name='page' disabled='false' value='Next'/>
+</div>
 <table caption='addresses'>
 <thead>
 <tr>
@@ -114,12 +130,6 @@ View
 {% endfor %}
 </tbody>
 <tfoot>
-<div class='back-link-container'>
-<input id='page' name='page' disabled='{% ifequal offset 0 %} false {% else %} true {% endifequal %}' value='Previous'/>
-</div>
-<div class='big-link-container'>
-<input id='page' name='page' disabled='false' value='Next'/>
-</div>
 </tfoot>
 </table>
 </form>
@@ -132,38 +142,38 @@ View
 <img height='24' width='24' src='img/credits/ric-logo.png'/>
 
             A project of the
-            
+
 <a href='https://radical.scot/'>
 Radical Independence Campaign
 </a>
  ||
             Version {{version}}
-          
+
 </div>
 <div>
 <img src='img/credits/luminus-logo.png' alt='Clojure' width='16' height='16'/>
-Built with 
+Built with
 <a href='http://www.luminusweb.net/'>
 LuminusWeb
 </a>
  ||
-            
+
 <img src='img/credits/clojure-icon.gif' alt='Clojure' width='16' height='16'/>
- Powered by 
+ Powered by
 <a href='http://clojure.org'>
 Clojure
 </a>
  ||
-            
+
 <img src='img/credits/github-logo-transparent.png' alt='GitHub' width='16' height='16'/>
-Find me/fork me on 
+Find me/fork me on
 <a href='https://github.com/simon-brooke/smeagol'>
 Github
 </a>
  ||
-            
+
 <img src='img/credits/gnu.small.png' alt='Free Software Foundation' width='16' height='16'/>
-Licensed under the 
+Licensed under the
 <a href='http://www.gnu.org/licenses/gpl-2.0.html'>
 GNU General Public License version 2.0
 </a>
@@ -171,4 +181,11 @@ GNU General Public License version 2.0
 </div>
 </footer>
 
-{% endblock %}
\ No newline at end of file
+{% endblock %}
+{% block extra-script %}
+var form = document.getElementById("content");
+
+document.getElementById("next-selector").addEventListener("click", function () {
+  form.submit();
+});
+{% endblock %}
diff --git a/resources/templates/base.html b/resources/templates/base.html
index 227b668..a219f55 100644
--- a/resources/templates/base.html
+++ b/resources/templates/base.html
@@ -1,6 +1,8 @@
 <!DOCTYPE html>
 <html>
   <head>
+    {% block head %}
+    <!-- head: if you want entire custom head content, override this block. -->
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
     <meta name="viewport" content="width=device-width, initial-scale=1"/>
     <link rel="stylesheet" type="text/css" href="css/yyy-common.css" />
@@ -8,10 +10,12 @@
     <link rel="stylesheet" type="text/css" href="css/spinner.css" />
     <link href="https://fonts.googleapis.com/css?family=Archivo+Black|Archivo+Narrow" rel="stylesheet"/>
     <title>{{site-title}}: {{title}}</title>
+    {% script "js/lib/jquery/dist/jquery.min.js" %}
     {% block extra-head %}
     <!-- extra-head: put any additional markup to go into the head of your document into this block -->
     <!-- e.g. script tags, link tags -->
     {% endblock %}
+    {% endblock %}
   </head>
   <body>
     {% block whole-page %}
@@ -32,7 +36,7 @@
           {% endif %}
         </menu>
       </div>
-      <img id="site-logo" src="{{site-logo}}" alt="{{site-title}}" width="64" height="64"/>
+      <!-- img id="site-logo" src="{{site-logo}}" alt="{{site-title}}" width="64" height="64"/ -->
       <h1>{{title}}</h1>
     </header>
     {% endblock %}
diff --git a/youyesyet.adl.xml b/youyesyet.adl.xml
index a9ab863..d542d6f 100644
--- a/youyesyet.adl.xml
+++ b/youyesyet.adl.xml
@@ -14,15 +14,16 @@
   </documentation>
   <content>
     <head>
-        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-        <meta name="viewport" content="width=device-width, initial-scale=1"/>
-        <link rel="stylesheet" type="text/css" href="css/yyy-common.css" />
-        <link rel="stylesheet" type="text/css" href="css/yyy-site.css" />
-        <link rel="stylesheet" type="text/css" href="css/spinner.css" />
-        <link href="https://fonts.googleapis.com/css?family=Archivo+Black|Archivo+Narrow" rel="stylesheet"/>
-        <title>{{site-title}}: {{title}}</title>
-      </head>
-    <top> </top>
+      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
+      <meta name="viewport" content="width=device-width, initial-scale=1"/>
+      <link rel="stylesheet" type="text/css" href="css/yyy-common.css" />
+      <link rel="stylesheet" type="text/css" href="css/yyy-site.css" />
+      <link rel="stylesheet" type="text/css" href="css/spinner.css" />
+      <link href="https://fonts.googleapis.com/css?family=Archivo+Black|Archivo+Narrow" rel="stylesheet"/>
+      <title>{{site-title}}: {{title}}</title>
+    </head>
+    <top>
+    </top>
     <foot>
       <footer>
         <div id="credits">