Wrapper for HTML pages and start of the config web interface

data/config.html

@@ -1,8 +1,50 @@
 
  <main role="main" class="inner DAU">
    <h1 class="DAU-heading">Config</h1>
-   <p class="lead">Hey look it's DAU.</p>
+   <p class="lead">Discord-auto-upload configuration</p>
+
+   <form class="">
+     <div class="form-row align-items-center config-item" data-key="webhook">
+       <div class="col-sm-5 my-1">
+         <span>Discord WebHook URL</span>
+       </div>
+       <div class="col-sm-4 my-1">
+         <label class="sr-only" for="inlineFormInputName">Name</label>
+         <input type="text" class="form-control rest-field" placeholder="https://....">
+       </div>
+       <div class="col-auto my-1">
+         <button type="submit" class="btn btn-primary">update</button>
+       </div>
+     </div>
+   </form>
+
    <p class="lead">
      <a href="#" class="btn btn-lg btn-secondary">Learn more</a>
    </p>
  </main>
+
+
+<script>
+$(document).ready(function() {
+  // populate each field
+  $('.config-item').each(function() {
+    el = $(this);
+    $.get('/rest/config/'+el.data('key'))
+     .done(function(d) {
+       el.find('.rest-field').val(d.Value);
+     });
+  });
+
+  // respond to button clicks to update
+  $('.config-item button').on('click', function(e,f) {
+    key = $(this).parents('.config-item').data('key');
+    val = $(this).parents('.config-item').find('.rest-field').val();
+    $.post('/rest/config/'+key, { value: val })
+     .done(function(d) {
+       alert('Updated config');
+     });
+
+    return false;
+  });
+});
+</script>

data/dau.css

@@ -38,7 +38,7 @@ body {
   box-shadow: inset 0 0 5rem rgba(0, 0, 0, .5);
 }
 
-.cover-container {
+.DAU-container {
   max-width: 42em;
 }
 

data/wrapper.tmpl

@@ -6,7 +6,7 @@
 
 
   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
-  <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
+  <script   src="https://code.jquery.com/jquery-3.5.1.min.js"   integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="   crossorigin="anonymous"></script>
   <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-Piv4xVNRyMGpqkS2by6br4gNJ7DXjqk09RmUpJ8jgGtD7zP9yug3goQfGII0yAns" crossorigin="anonymous"></script>