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>