Merge branch 'bnewbold-forms'

24 files changed, 854 insertions, 423 deletions

diff --git a/python/fatcat_web/templates/405.html b/python/fatcat_web/templates/405.html
new file mode 100644
index 00000000..97d21d73
--- /dev/null
+++ b/python/fatcat_web/templates/405.html
@@ -0,0 +1,12 @@
+{% extends "base.html" %}
+{% block body %}
+
+<center>
+<div style="font-size: 8em;">405</div>
+<div style="font-size: 3em;">Method Not Allowed</div>
+
+<p>Either we have a bug, or you tried something weird (like making up a URL).
+
+</center>
+
+{% endblock %}
diff --git a/python/fatcat_web/templates/auth_account.html b/python/fatcat_web/templates/auth_account.html
index 57155722..4b1562d7 100644
--- a/python/fatcat_web/templates/auth_account.html
+++ b/python/fatcat_web/templates/auth_account.html
@@ -1,27 +1,33 @@
 {% extends "base.html" %}
 {% block body %}
 
-<h1>Your Account</h1>
+<h1 class="ui header">
+  <i class="settings icon"></i>
+  Account Settings
+</h1>
 
 <p><b>Username:</b> <code>{{ current_user.username }}</code>
 <p><b>Editor Id:</b> <code><a href="/editor/{{ current_user.editor_id }}">{{ current_user.editor_id }}</a></code>
 
-<div>
-<p>Change username:
+<br>
+<div class="ui segment">
+<h3 class="ui header">Change Username</h3>
 <form class="" role="change_username" action="/auth/change_username" method="post">
+  <input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
   <div class="ui form">
-      <div class="ui action input medium fluid">
+    <div class="ui action input medium">
       <input type="text" name="username" value="{{ current_user.username }}" aria-label="account username">
-      <button class="ui button">Update</button>
+      <button class="ui red button">Update</button>
     </div>
   </div>
 </form>
 </div>
 
-<p>In the future, you might be able to...
+<br>
+<p>In the future, you will be able to...
 <ul>
-  <li>Create a bot user
-  <li>Generate an API token
+  <li>Create and manage bot accounts
+  <li>Generate API tokens
 </ul>
 
 {% endblock %}
diff --git a/python/fatcat_web/templates/base.html b/python/fatcat_web/templates/base.html
index d3353ca4..dda905e0 100644
--- a/python/fatcat_web/templates/base.html
+++ b/python/fatcat_web/templates/base.html
@@ -59,10 +59,10 @@
       <div class="ui simple dropdown item">
       {{ current_user.username }} <i class="dropdown icon"></i>
         <div class="menu">
-          <a class="item" href="#"><i class="edit icon"></i>Edits in Progress</a>
-          <a class="item" href="/editor/{{ current_user.editor_id }}/changelog"><i class="history icon"></i>History</a>
+          <a class="item" href="/editor/{{ current_user.editor_id }}/editgroups"><i class="history icon"></i>Edit History</a>
+          <a class="item" href="/editor/{{ current_user.editor_id }}/annotations"><i class="edit icon"></i>Comment History</a>
           <div class="divider"></div>
-          <a class="item" href="/auth/account"><i class="user icon"></i>Account</a>
+          <a class="item" href="/auth/account"><i class="settings icon"></i>Account</a>
           <a class="item" href="/auth/logout"><i class="sign out icon"></i>Logout</a>
         </div>
       </div>
@@ -84,7 +84,7 @@
     <div class="header">Now Hear This...</div>
     <ul class="list">
     {% for message in messages %}
-      <li>{{ message }}
+      <li>{{ message|safe }}
     {% endfor %}
     </ul>
     </div>
diff --git a/python/fatcat_web/templates/changelog.html b/python/fatcat_web/templates/changelog.html
index f33fe7c8..7d5505bc 100644
--- a/python/fatcat_web/templates/changelog.html
+++ b/python/fatcat_web/templates/changelog.html
@@ -4,20 +4,31 @@
 <h1 class="ui header">Recent Changes
 <div class="sub header"><code>changelog</code></div></h1>
 
-Limited to the most recent ~50 entries.
+Limited to the most recent entries.
 
 <table class="ui table">
   <thead><tr><th>Changelog<br>Index
-             <th>Timestamp (UTC)
              <th>Editgroup
-             <th>Editor
              <th>Description
   <tbody>
   {% for entry in entries %}
-  <tr><td><a href="/changelog/{{ entry.index }}">{{ entry.index }}</a>
-      <td>{{ entry.timestamp }}
-      <td><a href="/editgroup/{{ entry.editgroup_id }}">{{ entry.editgroup_id }}</a>
-      <td><a href="/editor/{{ entry.editgroup.editor_id }}">{{ entry.editgroup.editor_id }}</a>
+  <tr><td><a href="/changelog/{{ entry.index }}">#{{ entry.index }}</a>
+          <br>{{ entry.timestamp.strftime("%Y-%m-%d %H:%M:%S") }}
+      <td>
+        {#
+        {% if entry.editgroup.editor.is_bot %}
+          <i class="icon bug"></i>
+        {% else %}
+          <i class="icon user"></i>
+        {% endif %}
+        #}
+        Editor: <code><a href="/editor/{{ entry.editgroup.editor_id }}">
+          {{ entry.editgroup.editor_id[:8] }}...</a>
+        </a></code>
+        <br>
+        <small><code><a href="/editgroup/{{ entry.editgroup.editgroup_id }}">
+          {{ entry.editgroup.editgroup_id }}
+        </a></code></small>
       <td>{% if entry.editgroup.description != None %}{{ entry.editgroup.description }}{% endif %}
   {% endfor %}
 </table>
diff --git a/python/fatcat_web/templates/changelog_view.html b/python/fatcat_web/templates/changelog_view.html
index 1a758559..8c4684d5 100644
--- a/python/fatcat_web/templates/changelog_view.html
+++ b/python/fatcat_web/templates/changelog_view.html
@@ -7,7 +7,7 @@
 </div>
 </h1>
 
-<br><b>Timestamp:</b> {{ entry.timestamp }}
+<br><b>Timestamp:</b> {{ entry.timestamp.strftime("%Y-%m-%d %H:%M:%S") }}
 <br><b><a href="/editgroup/{{editgroup.editgroup_id}}">Editgroup</a></b>
 <br>
 {% endblock %}
diff --git a/python/fatcat_web/templates/container_create.html b/python/fatcat_web/templates/container_create.html
index 15288142..5dde37bf 100644
--- a/python/fatcat_web/templates/container_create.html
+++ b/python/fatcat_web/templates/container_create.html
@@ -1,7 +1,8 @@
-{% extends "base.html" %}
-{% block body %}
+{% extends "container_edit.html" %}
+
+{% block edit_form_prefix %}
 <div class="ui segment">
-<h1 class="ui header">Adding a New Container</h1>
+<h1 class="ui header">Create New Container Entity</h1>
 
 <p>A "container" is a anything that groups publications together. For example,
 a journal (eg, "New England Journal of Medicine"), conference proceedings, a
@@ -9,160 +10,18 @@ book series, or a blog.
 
 <p>Not all publications are in a container.
 
-<form class="ui form" id="add_container_form" method="post" action="/container/create">
-
-  <h3 class="ui dividing header">The Basics</h3>
-
-  <div class="ui huge field required">
-    <label>Name or Title</label>
-    <input name="container_name" type="text" placeholder="Title of Container (in English)">
-  </div>
-
-  <div class="ui field required">
-    <label>Type of Container</label>
-    <select class="ui dropdown" id="container_type">
-      <option value="">Primary Type</option>
-      <option value="journal">Journal</option>
-      <option value="book-series">Book Series</option>
-      <option value="conference">Conference Proceedings</option>
-      <option value="blog">Blog</option>
-      <option value="other">Other</option>
-    </select>
-  </div>
-
-  <!-- Publisher -->
-  <div class="ui huge field required">
-    <label>Name of Publisher</label>
-    <input name="container_publisher" type="text" placeholder="Name of Publisher">
-  </div>
-
-  <!-- Identifier -->
-  <div class="ui huge field required">
-    <label>ISSN Number</label>
-    <input name="container_issn" type="text" placeholder="eg, 1234-567X">
-  </div>
-
-  <!-- Primary/Original Language -->
-  <div class="field">
-    <label>Primary Language</label>
-    <select class="ui search select dropdown" id="language-select">
-      <option value="">Select if Appropriate</option>
-      <option value="en">English</option>
-      <option value="es">Spanish</option>
-      <option value="">Russian</option>
-      <option value="">Thai</option>
-      <option value="">Indonesian</option>
-      <option value="">Chinese</option>
-    </select>
-  </div>
-
-  <!-- Subject / Categorization / Tags -->
-  <div class="field">
-    <label>Subject</label>
-    <select multiple="" class="ui dropdown" id="subjects">
-      <option value="">Select Subject/Tags</option>
-      <option value="AF">Natural Sciences</option>
-      <option value="AX">Humanities</option>
-      <option value="AL">Arts</option>
-      <option value="AL">Engineering</option>
-      <option value="AL">Other</option>
-    </select>
-  </div>
-
-  <!-- Date -->
-  <!-- Container / Part-Of -->
-  <!-- Region -->
 
-  <!-- Anything Else? -->
-  <h3 class="ui dividing header">Anything Else?</h3>
-
-<div class="ui submit button">Create container</div>
-
-<p><i>Entity will be created as part of the current edit group, which needs to be
-submited and approved before the entity will formally be included in the
-catalog.</i>
+<form class="ui form" id="create_container_form" method="POST" action="/container/create">
+{% endblock %}
 
+{% block edit_form_suffix %}
+  <br><br>
+  <input class="ui primary submit button" type="submit" value="Create Container!">
+  <p>
+  <i>New entity will be part of the current editgroup, which needs to be
+  submited and approved before the entity will formally be included in the
+  catalog.</i>
 </form>
-
 </div>
 {% endblock %}
 
-{% block postscript %}
-<script>
-<!-- Form validation code -->
-$(document).ready(function() {
-
-  $('#add_container_form')
-    .form({
-        fields: {
-        name: {
-            identifier: 'name',
-            rules: [
-            {
-                type   : 'empty',
-                prompt : 'Please enter your name'
-            }
-            ]
-        },
-        skills: {
-            identifier: 'skills',
-            rules: [
-            {
-                type   : 'minCount[2]',
-                prompt : 'Please select at least two skills'
-            }
-            ]
-        },
-        gender: {
-            identifier: 'gender',
-            rules: [
-            {
-                type   : 'empty',
-                prompt : 'Please select a gender'
-            }
-            ]
-        },
-        username: {
-            identifier: 'username',
-            rules: [
-            {
-                type   : 'empty',
-                prompt : 'Please enter a username'
-            }
-            ]
-        },
-        password: {
-            identifier: 'password',
-            rules: [
-            {
-                type   : 'empty',
-                prompt : 'Please enter a password'
-            },
-            {
-                type   : 'minLength[6]',
-                prompt : 'Your password must be at least {ruleValue} characters'
-            }
-            ]
-        },
-        terms: {
-            identifier: 'terms',
-            rules: [
-            {
-                type   : 'checked',
-                prompt : 'You must agree to the terms and conditions'
-            }
-            ]
-        }
-        }
-    })
-    ;
-
-  $('#container_type').dropdown();
-  $('#subjects').dropdown();
-  $('#language-select').dropdown();
-
-  console.log("Page loaded");
-
-});
-</script>
-{% endblock %}
diff --git a/python/fatcat_web/templates/container_edit.html b/python/fatcat_web/templates/container_edit.html
new file mode 100644
index 00000000..2a3f6f5f
--- /dev/null
+++ b/python/fatcat_web/templates/container_edit.html
@@ -0,0 +1,50 @@
+{% import "edit_macros.html" as edit_macros %}
+{% extends "base.html" %}
+
+{% block body %}
+{% block edit_form_prefix %}
+<div class="ui segment">
+<h1 class="ui header">Edit Container Entity</h1>
+
+<form class="ui form" id="edit_container_form" method="POST" action="/container/{{ entity.ident }}/edit">
+{% endblock %}
+  {{ form.hidden_tag() }}
+
+  <br>
+  {{ edit_macros.editgroup_dropdown(form) }}
+
+  <h3 class="ui dividing header">The Basics</h3>
+  <br>
+  {{ edit_macros.form_field_inline(form.container_type, "required") }}
+  {{ edit_macros.form_field_inline(form.name, "required") }}
+  {{ edit_macros.form_field_inline(form.publisher) }}
+  {{ edit_macros.form_field_inline(form.issnl) }}
+  {{ edit_macros.form_field_inline(form.wikidata_qid) }}
+
+  <br>
+  <h3 class="ui dividing header">Submit</h3>
+  {{ edit_macros.form_field_basic(form.edit_description) }}
+  This description will be attached to the individual edit, not to the
+  editgroup as a whole.
+{% block edit_form_suffix %}
+  <br><br>
+  <input class="ui primary submit button" type="submit" value="Update Container!">
+  <p>
+  <i>Edit will be part of the current editgroup, which needs to be submited and
+  approved before the change is included in the catalog.</i>
+</form>
+</div>
+{% endblock %}
+{% endblock %}
+
+{% block postscript %}
+<script>
+<!-- Form code -->
+$(document).ready(function() {
+
+  $('.ui.accordion').accordion();
+
+});
+</script>
+{% endblock %}
+
diff --git a/python/fatcat_web/templates/container_view.html b/python/fatcat_web/templates/container_view.html
index 1e9a524b..3d0627ca 100644
--- a/python/fatcat_web/templates/container_view.html
+++ b/python/fatcat_web/templates/container_view.html
@@ -68,9 +68,10 @@
   {% if container.extra != None and container.extra.ISSNe != None and (container.extra.ISSNe|length > 0) %}
     <br><i class="icon plug"></i>Electronic: &nbsp;<code>{{ container.extra.ISSNe }}</code>
   {% endif %}
+  <br>
 {% endif %}
 {% if container.wikidata_qid != None %}
-  <br><b>Wikidata:</b> &nbsp;<a href="https://wikidata.org/wiki/{{ container.wikidata_qid }}"><code>{{ container.wikidata_qid }}</code></a>
+  <b>Wikidata</b> &nbsp;<a href="https://wikidata.org/wiki/{{ container.wikidata_qid }}"><code>{{ container.wikidata_qid }}</code></a>
 {% endif %}
   </div><div class="ui segment attached">
 {% endif %}
diff --git a/python/fatcat_web/templates/csrf_error.html b/python/fatcat_web/templates/csrf_error.html
new file mode 100644
index 00000000..357f9047
--- /dev/null
+++ b/python/fatcat_web/templates/csrf_error.html
@@ -0,0 +1,10 @@
+{% extends "base.html" %}
+{% block body %}
+
+<center>
+<div style="font-size: 8em;">400</div>
+<div style="font-size: 3em;">Cross-Site Scripting Error</div>
+{{ reason }}
+</center>
+
+{% endblock %}
diff --git a/python/fatcat_web/templates/edit_macros.html b/python/fatcat_web/templates/edit_macros.html
new file mode 100644
index 00000000..9bd14596
--- /dev/null
+++ b/python/fatcat_web/templates/edit_macros.html
@@ -0,0 +1,56 @@
+
+{% macro form_field_errors(field) -%}
+  {% if field.errors %}
+    <div class="ui pointing red label">
+    {% for err in field.errors %}
+        {{ err }}
+    {% endfor %}
+    </div>
+  {% endif %}
+{%- endmacro %}
+
+{% macro form_field_basic(field, div_classes="") -%}
+<div class="field {{ div_classes }} {% if field.errors %}error{% endif %}">
+  {{ field.label }}
+  {{ field() }}
+  {{ form_field_errors(field) }}
+</div>
+{%- endmacro %}
+
+{% macro form_field_inline(field, div_classes="") -%}
+<div class="ui grid">
+  <div class="three wide column middle aligned right aligned" {# style="padding-right: 0.5rem;" #}>
+    <div class="field inline {{ div_classes }} {% if field.errors %}error{% endif %}">
+      {{ field.label }}
+    </div>
+  </div>
+  <div class="twelve wide column" {# style="padding-left: 0.5rem;" #}>
+    <div class="field {{ div_classes }} {% if field.errors %}error{% endif %}">
+      {{ field() }}
+      {{ form_field_errors(field) }}
+    </div>
+  </div>
+  <div class="one wide column">
+  </div>
+</div>
+{%- endmacro %}
+
+{% macro editgroup_dropdown(form) -%}
+  <div class="ui accordion">
+    <div class="{% if not editgroup_id %}active{% endif %} title">
+      <h3><i class="dropdown icon"></i>Editgroup Meta</h3>
+    </div>
+    <div class="{% if not editgroup_id %}active{% endif %} content">
+      {% if editgroup_id %}
+        <p>You have an editgroup in progress, and this edit will be included by
+        default. You can override this below.
+      {% else %}
+        <p>No existing editgroup is in progress (or at least, not is selected).
+        An existing ID can be pasted in, or if you leave that blank but give a
+        description, a new editgroup will be created for this edit.
+      {% endif %}
+      {{ form_field_inline(form.editgroup_id) }}
+      {{ form_field_inline(form.editgroup_description) }}
+    </div>
+  </div>
+{%- endmacro %}
diff --git a/python/fatcat_web/templates/editgroup_reviewable.html b/python/fatcat_web/templates/editgroup_reviewable.html
new file mode 100644
index 00000000..b1ece6af
--- /dev/null
+++ b/python/fatcat_web/templates/editgroup_reviewable.html
@@ -0,0 +1,31 @@
+{% extends "base.html" %}
+{% block body %}
+
+<h1 class="ui header">Reviewable Editgroups
+</h1>
+
+Limited to the most recent entries.
+
+<table class="ui table">
+  <thead><tr><th>Editgroup
+             <th>Description
+  <tbody>
+  {% for editgroup in entries %}
+  <tr><td>
+        {% if editgroup.editor.is_bot %}
+          <i class="icon bug"></i>
+        {% else %}
+          <i class="icon user"></i>
+        {% endif %}
+        <a href="/editor/{{ editgroup.editor_id }}">{{ editgroup.editor.username }}</a>
+        <br>
+        Submitted: {{ editgroup.submitted.strftime("%Y-%m-%d %H:%M:%S") }}
+        <br>
+        <small><code><a href="/editgroup/{{ editgroup.editgroup_id }}">
+          {{ editgroup.editgroup_id }}
+        </a></code></small>
+      <td>{% if editgroup.description != None %}{{ editgroup.description }}{% endif %}
+  {% endfor %}
+</table>
+
+{% endblock %}
diff --git a/python/fatcat_web/templates/editgroup_view.html b/python/fatcat_web/templates/editgroup_view.html
index 2341f06a..f7f3ad45 100644
--- a/python/fatcat_web/templates/editgroup_view.html
+++ b/python/fatcat_web/templates/editgroup_view.html
@@ -1,4 +1,6 @@
 {% extends "base.html" %}
+{% import "entity_macros.html" as entity_macros %}
+
 {% block body %}
 
 {% macro edit_list(edits, entity_type, entity_name) -%}
@@ -35,13 +37,60 @@
 
 {# extended by changelog_entry #}
 {% block editgroupheader %}
-<h1 class="ui header">Edit Group
+{% if not editgroup.changelog_index %}
+  <div class="ui right floated center aligned segment">
+    {% if auth_to.accept %}
+      <form id="submit_editgroup_form" method="POST" action="/editgroup/{{ editgroup.editgroup_id }}/accept">
+        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
+        <button class="ui orange button">Accept Edits</button>
+      </form><br>
+    {% endif %}
+    {% if auth_to.submit %}
+      {% if editgroup.submitted %}
+        <form id="submit_editgroup_form" method="POST" action="/editgroup/{{ editgroup.editgroup_id }}/unsubmit">
+          <input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
+          <button class="ui button">Un-Submit</button>
+        </form><br>
+        <form id="submit_editgroup_form" method="POST" action="/editgroup/{{ editgroup.editgroup_id }}/submit">
+          <input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
+          <button class="ui button">Re-Submit</button>
+        </form>
+      {% else %}
+        <form id="submit_editgroup_form" method="POST" action="/editgroup/{{ editgroup.editgroup_id }}/submit">
+          <input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
+          <button class="ui primary button">Submit</button>
+        </form>
+      {% endif %}
+    {% endif %}
+  </div>
+{% endif %}
+
+<h1 class="ui header">Editgroup
 <div class="sub header"><code>editgroup {{ editgroup.editgroup_id }}</code></div></h1>
 {% endblock %}
 
-<b>Editor:</b> <a href="/editor/{{editgroup.editor_id}}">{{ editgroup.editor.username }}</a>
-<br><b>Description:</b> {{ editgroup.description }}
-<br><br>
+<p><b>What is an editgroup?</b>
+An editgroup is a set of entity edits, bundled together into a coherent,
+reviewable bundle.
+<br>
+
+<br><b>Status:</b>
+{% if editgroup.changelog_index %}
+  Merged (<a href="/changelog/{{ editgroup.changelog_index }}">Changelog #{{ editgroup.changelog_index }}</a>)
+{% elif editgroup.submitted %}
+  Submitted ({{ editgroup.submitted.strftime("%Y-%m-%d %H:%M:%S") }})
+{% else %}
+  Not Submitted
+{% endif %}
+
+<br><b>Editor:</b> <a href="/editor/{{editgroup.editor_id}}">{{ editgroup.editor.username }}</a>
+<br><b>Description:</b>
+{% if editgroup.description %}
+  {{ editgroup.description }}
+{% else %}
+  <i>none</i>
+{% endif %}
+<br><br clear="all">
 
 <div class="ui styled fluid accordion">
   {{ edit_list(editgroup.edits.works, "work", "Work") }}
@@ -53,11 +102,51 @@
   {{ edit_list(editgroup.edits.webcaptures, "webcapture", "Web Capture") }}
 </div>
 
-
 <br>
-<p><b>What is an editgroup?</b>
-An editgroup is a set of entity edits, bundled together into a coherent,
-reviewable bundle.
+<h2 class="ui header">Comments and Annotations</h2>
+{% for annotation in editgroup.annotations|reverse %}
+  <div class="ui segments">
+    <div class="ui top attached secondary segment">
+      {% if annotation.editor.is_bot %}
+        <i class="icon bug"></i>
+      {% else %}
+        <i class="icon user"></i>
+      {% endif %}
+      <b><a href="/editor/{{ annotation.editor_id }}">{{ annotation.editor.username}}</a></b>
+      {% if annotation.editor.is_admin %}
+        <span class="ui tiny olive label">Admin</span>
+      {% endif %}
+      at {{ annotation.created.strftime("%Y-%m-%d %H:%M:%S") }}
+    </div>
+    {% if annotation.extra %}
+    <div class="ui attached segment">
+      {{ entity_macros.extra_metadata(annotation.extra) }}
+    </div>
+    {% endif %}
+    <div class="ui bottom attached segment">
+      {{ annotation.comment_markdown|markdown(escape=True) }}
+    </div>
+  </div>
+{% else %}
+  <i>None!</i>
+{% endfor %}
+
+{% if not editgroup.changelog_index and auth_to.annotate %}
+  <div class="ui segment">
+    <h3 class="ui header">Add Comment</h3>
+    <form class="ui form" id="submit_editgroup_annotation_form" method="POST" action="/editgroup/{{ editgroup.editgroup_id }}/annotation">
+      <input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
+      <div class="field">
+        <textarea rows="2" name="comment_markdown" required type="text" value=""></textarea>
+      </div>
+      <i>Markdown is allowed</i>
+      <button class="ui right floated primary button">
+        <i class="icon edit"></i> Submit
+      </button>
+      <br>
+    </form><br>
+  </div>
+{% endif %}
 
 {% endblock %}
 
diff --git a/python/fatcat_web/templates/editor_annotations.html b/python/fatcat_web/templates/editor_annotations.html
new file mode 100644
index 00000000..c46039f5
--- /dev/null
+++ b/python/fatcat_web/templates/editor_annotations.html
@@ -0,0 +1,35 @@
+{% extends "base.html" %}
+{% block body %}
+
+<h1 class="ui header">Comments and Annotations
+<div class="sub header">
+    <code>editor
+      <a href="/editor/{{editor.editor_id}}">{{ editor.username }}</a>
+    </code>
+  </a>
+</div>
+</h1>
+
+<br>
+{% for annotation in annotations %}
+  <div class="ui segments">
+    <div class="ui top attached secondary segment">
+      On <b><small><code><a href="/editgroup/{{ annotation.editgroup_id }}">
+        {{ annotation.editgroup_id }}
+      </a></code></small></b>
+      at {{ annotation.created.strftime("%Y-%m-%d %H:%M:%S") }}
+    </div>
+    {% if annotation.extra %}
+    <div class="ui attached segment">
+      {{ entity_macros.extra_metadata(annotation.extra) }}
+    </div>
+    {% endif %}
+    <div class="ui bottom attached segment">
+      {{ annotation.comment_markdown|markdown(escape=True) }}
+    </div>
+  </div>
+{% else %}
+  <i>None!</i>
+{% endfor %}
+
+{% endblock %}
diff --git a/python/fatcat_web/templates/editor_editgroups.html b/python/fatcat_web/templates/editor_editgroups.html
index cb9b2f56..3c3dd20d 100644
--- a/python/fatcat_web/templates/editor_editgroups.html
+++ b/python/fatcat_web/templates/editor_editgroups.html
@@ -1,25 +1,35 @@
 {% extends "base.html" %}
 {% block body %}
 
-<h1 class="ui header">Editor Changelog: {{ editor.username }}
+<h1 class="ui header">Edit History
 <div class="sub header">
-  <a href="/editor/{{editor.editor_id}}">
-    <code>editor {{ editor.editor_id }}</code>
+    <code>editor
+      <a href="/editor/{{editor.editor_id}}">{{ editor.username }}</a>
+    </code>
   </a>
 </div>
 </h1>
 
-<p>Changes accepted (aka, merged editgroups):
 <table class="ui table">
-  <thead><tr><th>Created (UTC)
+  <thead><tr>{# <th>Created (UTC) #}
+             <th>Status
              <th>Editgroup
-             <th>Editor
              <th>Description
   <tbody>
   {% for editgroup in editgroups %}
-  <tr><td>{{ editgroup.created }}
-      <td><code><a href="/editgroup/{{ editgroup.editgroup_id }}">{{ editgroup.editgroup_id }}</a></code>
-      <td><code><a href="/editor/{{ editgroup.editor_id }}">{{ editgroup.editor_id }}</a></code>
+  <tr>{# <td>{{ editgroup.created.strftime("%Y-%m-%d %H:%M:%S") }} #}
+      <td>{% if editgroup.changelog_index %}
+            Merged
+            <br><a href="/changelog/{{ editgroup.changelog_index }}">#{{ editgroup.changelog_index }}</a>
+          {% elif editgroup.submitted %}
+            Submitted
+            <br>{{ editgroup.submitted.strftime("%Y-%m-%d %H:%M:%S") }}
+          {% else %}
+            Work in Progress
+          {% endif %}
+      <td><small><code><a href="/editgroup/{{ editgroup.editgroup_id }}">
+            {{ editgroup.editgroup_id }}
+          </a></code></small>
       <td>{% if editgroup.description != None %}{{ editgroup.description }}{% endif %}
   {% endfor %}
 </table>
diff --git a/python/fatcat_web/templates/editor_view.html b/python/fatcat_web/templates/editor_view.html
index eef4f040..c62f8d93 100644
--- a/python/fatcat_web/templates/editor_view.html
+++ b/python/fatcat_web/templates/editor_view.html
@@ -7,6 +7,7 @@
 </div>
 </h1>
 
-<p><b><a href="/editor/{{ editor.editor_id }}/changelog">View editor's changelog</a></b>
+<p><b><a href="/editor/{{ editor.editor_id }}/editgroups">Edit History</a></b>
+<p><b><a href="/editor/{{ editor.editor_id }}/annotations">Comments and Annotation History</a></b>
 
 {% endblock %}
diff --git a/python/fatcat_web/templates/file_create.html b/python/fatcat_web/templates/file_create.html
new file mode 100644
index 00000000..a7c99b96
--- /dev/null
+++ b/python/fatcat_web/templates/file_create.html
@@ -0,0 +1,20 @@
+{% extends "file_edit.html" %}
+
+{% block edit_form_prefix %}
+<div class="ui segment">
+<h1 class="ui header">Create New File Entity</h1>
+
+<form class="ui form" id="create_file_form" method="POST" action="/file/create">
+{% endblock %}
+
+{% block edit_form_suffix %}
+  <br><br>
+  <input class="ui primary submit button" type="submit" value="Create File!">
+  <p>
+  <i>New entity will be part of the current editgroup, which needs to be
+  submited and approved before the entity will formally be included in the
+  catalog.</i>
+</form>
+</div>
+{% endblock %}
+
diff --git a/python/fatcat_web/templates/file_edit.html b/python/fatcat_web/templates/file_edit.html
new file mode 100644
index 00000000..279acca9
--- /dev/null
+++ b/python/fatcat_web/templates/file_edit.html
@@ -0,0 +1,233 @@
+{% import "edit_macros.html" as edit_macros %}
+{% extends "base.html" %}
+
+{% block body %}
+{% block edit_form_prefix %}
+<div class="ui segment">
+<h1 class="ui header">Edit File Entity</h1>
+
+<form class="ui form" id="edit_file_form" method="POST" action="/file/{{ entity.ident }}/edit">
+{% endblock %}
+  {{ form.hidden_tag() }}
+
+  <br>
+  {{ edit_macros.editgroup_dropdown(form) }}
+
+  <br>
+  <h3 class="ui dividing header">File Metadata</h3>
+
+  {{ edit_macros.form_field_inline(form.size, "required") }}
+  {{ edit_macros.form_field_inline(form.mimetype) }}
+  {{ edit_macros.form_field_inline(form.md5) }}
+  {{ edit_macros.form_field_inline(form.sha1, "required") }}
+  {{ edit_macros.form_field_inline(form.sha256) }}
+
+  <br>
+  <h3 class="ui dividing header">Locations (URLs)</h3>
+  <i>Public web (no login/paywall) locations of this exact file (should match
+  by hashes).</i>
+  <br><br>
+  <div class="list-group" id="url_list" name="url_list">
+  {% for cform in form.urls %}
+    <div class="list-group-item ui grid" style="padding-right: 1em;">
+      {{ cform.hidden_tag() }}
+      <div class="one wide column middle aligned center aligned" style="padding-bottom: 0px; padding-right: 0px; padding-left: 0px;">
+        <i class="arrows alternate vertical icon"></i>
+      </div>
+      <div class="three wide column" style="padding-bottom: 0px; padding-left: 0px;">
+        <div class="field {% if cform.rel.errors %}error{% endif %}">
+          {{ cform.rel() }}
+        </div>
+      </div>
+      <div class="eleven wide column" style="padding-bottom: 0px;">
+        <div class="field {% if cform.url.errors %}error{% endif %}">
+          {{ cform.url() }}
+        </div>
+      </div>
+      <div class="one wide column right aligned" style="padding-bottom: 0px; padding-left: 0rem;">
+        <button type="button" class="ui icon red button delete-url-button"><i class="trash icon"></i></button>
+      </div>
+    </div>
+  {% endfor %}
+  </div>
+  <br>
+  <button type="button" id="add-url-button" class="ui right floated icon green button" style="margin-right: 0.3rem;">
+    <i class="plus icon"></i>
+  </button>
+
+  <br>
+  <h3 class="ui dividing header">Releases</h3>
+  <i>Usually one, but sometimes multiple Release entities (by FCID) that this
+  file is a fulltext copy of.</i>
+  <br><br>
+  <div class="list-group" id="release_id_list" name="release_id_list">
+  {% for rfield in form.release_ids %}
+    <div class="list-group-item ui grid" style="padding-right: 1em;">
+      <div class="one wide column middle aligned center aligned" style="padding-bottom: 0px; padding-right: 0px; padding-left: 0px;">
+      </div>
+      <div class="fourteen wide column" style="padding-bottom: 0px;">
+        <div class="field {% if rfield.errors %}error{% endif %}">
+          {{ rfield() }}
+        </div>
+      </div>
+      <div class="one wide column right aligned" style="padding-bottom: 0px; padding-left: 0rem;">
+        <button type="button" class="ui icon red button delete-release_id-button"><i class="trash icon"></i></button>
+      </div>
+    </div>
+  {% endfor %}
+  </div>
+  <br>
+  <button type="button" id="add-release_id-button" class="ui right floated icon green button" style="margin-right: 0.3rem;">
+    <i class="plus icon"></i>
+  </button>
+
+  <br>
+  <h3 class="ui dividing header">Submit</h3>
+  {{ edit_macros.form_field_basic(form.edit_description) }}
+  This description will be attached to the individual edit, not to the
+  editgroup as a whole.
+{% block edit_form_suffix %}
+  <br><br>
+  <input class="ui primary submit button" type="submit" value="Update File!">
+  <p>
+  <i>Edit will be part of the current editgroup, which needs to be submited and
+  approved before the change is included in the catalog.</i>
+</form>
+</div>
+{% endblock %}
+{% endblock %}
+
+{% block postscript %}
+<script>
+<!-- Form code -->
+$(document).ready(function() {
+
+  $('.ui.accordion').accordion();
+
+  var fixup_url_numbering = function(group_item) {
+    items = Array.from(group_item.querySelectorAll(".list-group-item"))
+    for (var i = 0; i < items.length; i++) {
+      var item_el = items[i];
+      input_el = item_el.querySelectorAll("input")[0];
+      select_el = item_el.querySelectorAll("select")[0];
+      //console.log(input_el.id);
+      //console.log(select_el.id);
+      input_el.id = "urls-" + i + "-url";
+      input_el.name = input_el.id;
+      select_el.id = "urls-" + i + "-rel";
+      select_el.name = select_el.id;
+      //console.log(input_el.id);
+      //console.log(select_el.id);
+    };
+    console.log("re-named url rows up to i=" + i);
+  };
+
+  var url_list = document.getElementById('url_list');
+  fixup_url_numbering(url_list);
+
+  var url_delete_handler = function(ev) {
+    row = ev.target.parentNode.parentNode;
+    // I don't understand why this hack is needed; maybe because of the sortable stuff?
+    if(!row.classList.contains("list-group-item")) {
+        row = row.parentNode;
+    }
+    // console.log(row);
+    console.assert(row.classList.contains("list-group-item"));
+    row.parentNode.removeChild(row);
+    fixup_url_numbering(url_list);
+  };
+
+  var attach_url_delete_handler = function(topthing) {
+    Array.from(topthing.querySelectorAll(".delete-url-button")).forEach((el) => {
+      el.addEventListener("click", url_delete_handler);
+    });
+  };
+  attach_url_delete_handler(document);
+
+  // XXX: really need some way to not duplicate this code from above...
+  var url_template = `
+  <div class="list-group-item ui grid" style="padding-right: 1em;">
+      <div class="one wide column middle aligned center aligned" style="padding-bottom: 0px; padding-right: 0px; padding-left: 0px;">
+      </div>
+      <div class="three wide column" style="padding-bottom: 0px; padding-left: 0px;">
+        <select id="urls-X-rel" name="urls-X-rel"><option selected value="web">Public Web</option><option value="webarchive">Web Archive</option><option value="repository">Repository</option><option value="social">Academic Social Network</option><option value="publisher">Publisher</option><option value="dweb">Decentralized Web</option></select>
+      </div>
+      <div class="eleven wide column" style="padding-bottom: 0px;">
+        <input id="urls-X-url" name="urls-X-url" type="text" value="">
+      </div>
+      <div class="one wide column right aligned" style="padding-bottom: 0px; padding-left: 0rem;">
+        <button type="button" class="ui icon red button delete-url-button"><i class="trash icon"></i></button>
+      </div>
+    </div>
+  `;
+
+  var add_url_button = document.getElementById("add-url-button");
+  add_url_button.addEventListener("click", function(){
+    url_list.insertAdjacentHTML('beforeend', url_template);
+    attach_url_delete_handler(url_list.lastElementChild);
+    fixup_url_numbering(url_list);
+  });
+
+  var fixup_release_id_numbering = function(group_item) {
+    items = Array.from(group_item.querySelectorAll(".list-group-item"))
+    for (var i = 0; i < items.length; i++) {
+      var item_el = items[i];
+      input_el = item_el.querySelectorAll("input")[0];
+      //console.log(input_el.id);
+      input_el.id = "release_ids-" + i;
+      input_el.name = input_el.id;
+      //console.log(input_el.id);
+    };
+    console.log("re-named release_id rows up to i=" + i);
+  };
+
+  var release_id_list = document.getElementById('release_id_list');
+  fixup_release_id_numbering(release_id_list);
+
+  var release_id_delete_handler = function(ev) {
+    row = ev.target.parentNode.parentNode;
+    // I don't understand why this hack is needed; maybe because of the sortable stuff?
+    if(!row.classList.contains("list-group-item")) {
+        row = row.parentNode;
+    }
+    // console.log(row);
+    console.assert(row.classList.contains("list-group-item"));
+    row.parentNode.removeChild(row);
+    fixup_release_id_numbering(release_id_list);
+  };
+
+  var attach_release_id_delete_handler = function(topthing) {
+    Array.from(topthing.querySelectorAll(".delete-release_id-button")).forEach((el) => {
+      el.addEventListener("click", release_id_delete_handler);
+    });
+  };
+  attach_release_id_delete_handler(document);
+
+  // XXX: really need some way to not duplicate this code from above...
+  var release_id_template = `
+  <div class="list-group-item ui grid" style="padding-right: 1em;">
+      <div class="one wide column middle aligned center aligned" style="padding-bottom: 0px; padding-right: 0px; padding-left: 0px;">
+      </div>
+      <div class="fourteen wide column" style="padding-bottom: 0px;">
+        <div class="field ">
+          <input id="release_ids-X" name="release_ids-X" type="text" value="" required>
+        </div>
+      </div>
+      <div class="one wide column right aligned" style="padding-bottom: 0px; padding-left: 0rem;">
+        <button type="button" class="ui icon red button delete-release_id-button"><i class="trash icon"></i></button>
+      </div>
+    </div>
+  `;
+
+  var add_release_id_button = document.getElementById("add-release_id-button");
+  add_release_id_button.addEventListener("click", function(){
+    release_id_list.insertAdjacentHTML('beforeend', release_id_template);
+    attach_release_id_delete_handler(release_id_list.lastElementChild);
+    fixup_release_id_numbering(release_id_list);
+  });
+
+  console.log("Page loaded");
+
+});
+</script>
+{% endblock %}
diff --git a/python/fatcat_web/templates/home.html b/python/fatcat_web/templates/home.html
index d55cc96b..f4d9d8f6 100644
--- a/python/fatcat_web/templates/home.html
+++ b/python/fatcat_web/templates/home.html
@@ -55,6 +55,7 @@ indexing (aka, linking together of pre-prints and final copies).
         <br>published version of a Work
 {% if config.FATCAT_DOMAIN == 'fatcat.wiki' %}
     <td><a href="/release/search">Search</a>
+        <a href="/release/create">Create</a>
     <td><a href="/release/tb24ghkawzgaho5bkim3cbmbnu">Paper</a>
 {% else %}
     <td><a href="/release/search">Search</a>
@@ -111,7 +112,7 @@ indexing (aka, linking together of pre-prints and final copies).
     <td>
     <td><a href="/file/wklqsb5apzfhbbxxc7rgu2yw6m">PDF</a>
 {% else %}
-    <td>
+    <td><a href="/file/create">Create</a>
     <td><a href="/file/wklqsb5apzfhbbxxc7rgu2yw6m">PDF</a> (prod)
         <br><a href="/file/aaaaaaaaaaaaamztaaaaaaaaai">Dummy</a>
         <br><a href="/file/aaaaaaaaaaaaamztaaaaaaaaam">Realistic</a>
diff --git a/python/fatcat_web/templates/release_changelog.html b/python/fatcat_web/templates/release_changelog.html
deleted file mode 100644
index 706a5642..00000000
--- a/python/fatcat_web/templates/release_changelog.html
+++ /dev/null
@@ -1,17 +0,0 @@
-{% extends "base.html" %}
-{% block body %}
-
-<h1>Release Changelog: {{ release.id }}</h1>
-
-<p>release: <a href="/release/{{ release.id }}">{{ release.id }}</a>
-
-<p>Changelog:
-<ul>
-{% for entry in changelog_entries %}
-  <li><a href="/editgroup/{{ entry.editgroup }}">Edit Group #{{ entry.editgroup }}</a> (on {{ entry.timestamp }})
-{% else %}
-NONE
-{% endfor %}
-</ul>
-
-{% endblock %}
diff --git a/python/fatcat_web/templates/release_create.html b/python/fatcat_web/templates/release_create.html
index ac8a8169..5ec2efe5 100644
--- a/python/fatcat_web/templates/release_create.html
+++ b/python/fatcat_web/templates/release_create.html
@@ -1,215 +1,20 @@
-{% extends "base.html" %}
-{% block body %}
-<div class="ui segment">
-<h1 class="ui header">Adding a New Thing</h1>
-
-<form class="ui form" id="add_work_form">
-
-  <h3 class="ui dividing header">The Basics</h3>
-
-  <div class="ui huge field required">
-    <label>Title</label>
-    <input name="work_title" type="text" placeholder="Title of Work (in English)">
-  </div>
-
-  <div class="ui field required">
-    <label>Type of Work</label>
-    <select class="ui dropdown" id="work_type">
-      <option value="">Primary Type</option>
-      <option value="journal-article">Journal Article</option>
-      <option value="book">Book</option>
-      <option value="book-chapter">Book Chapter</option>
-      <option value="dataset">Dataset</option>
-      <option value="dissertation">Thesis or Dissertation</option>
-      <option value="monograph">Monograph</option>
-      <option value="proceedings-article">Conference Proceeding</option>
-      <option value="report">Report</option>
-      <option value="other">Other</option>
-    </select>
-  </div>
-
-  <!-- Primary Creators/Authors -->
-  <div class="ui field search" id="work_creators">
-    <label>Primary Creator(s)</label>
-    <div class="ui icon input">
-      <input class="prompt" type="text" placeholder="Search...">
-      <i class="search icon"></i>
-    </div>
-    <div class="results"></div>
-  </div>
-
-  <!-- Description (not an abstract) -->
-  <div class="ui field">
-    <label>Description</label>
-    <div class="field">
-      <label>Not an abstract...</label>
-      <textarea rows="2"></textarea>
-    </div>
-  </div>
-
-  <!-- Primary/Original Language -->
-  <div class="field">
-    <label>Primary Language</label>
-    <select class="ui search select dropdown" id="language-select">
-      <option value="">Select if Appropriate</option>
-      <option value="en">English</option>
-      <option value="es">Spanish</option>
-    </select>
-  </div>
-
-  <!-- Subject / Categorization / Tags -->
-  <div class="field">
-    <label>Subject</label>
-    <select multiple="" class="ui dropdown" id="subjects">
-      <option value="">Select Subject/Tags</option>
-      <option value="AF">Afghanistan</option>
-      <option value="AX">Åland Islands</option>
-      <option value="AL">Albania</option>
-      <option value="DZ">Algeria</option>
-      <option value="AS">American Samoa</option>
-      <option value="AD">Andorra</option>
-      <option value="AO">Angola</option>
-    </select>
-  </div>
-
-
-  <h3 class="ui dividing header">Primary Release / Edition</h3>
-
-  <!-- Contributors (and how) -->
-  <div class="ui field search" id="release_creators">
-    <label>Primary Creator(s)</label>
-    <div class="ui icon input">
-      <input class="prompt" type="text" placeholder="Search...">
-      <i class="search icon"></i>
-    </div>
-    <div class="results"></div>
-  </div>
+{% extends "release_edit.html" %}
 
-  <!-- Date -->
-  <!-- Container / Part-Of -->
-  <!-- Publisher -->
-  <!-- Identifier -->
-  <!-- Language -->
-  <!-- Type / Media -->
-  <!-- Issue / Volume / Pages / Chapter -->
-
-  <!-- Anything Else? -->
-  <h3 class="ui dividing header">Anything Else?</h3>
+{% block edit_form_prefix %}
+<div class="ui segment">
+<h1 class="ui header">Create New Release Entity</h1>
 
-  <!-- File / Copy / URL -->
-  <!-- Citations -->
+<form class="ui form" id="create_release_form" method="POST" action="/release/create">
+{% endblock %}
 
-<div class="ui submit button">Create Work</div>
+{% block edit_form_suffix %}
+  <br><br>
+  <input class="ui primary submit button" type="submit" value="Create Release!">
+  <p>
+  <i>New entity will be part of the current editgroup, which needs to be
+  submited and approved before the entity will formally be included in the
+  catalog.</i>
 </form>
-
 </div>
 {% endblock %}
 
-{% block postscript %}
-<script>
-<!-- Form validation code -->
-$(document).ready(function() {
-
-  $('#add_work_form')
-    .form({
-        fields: {
-        name: {
-            identifier: 'name',
-            rules: [
-            {
-                type   : 'empty',
-                prompt : 'Please enter your name'
-            }
-            ]
-        },
-        skills: {
-            identifier: 'skills',
-            rules: [
-            {
-                type   : 'minCount[2]',
-                prompt : 'Please select at least two skills'
-            }
-            ]
-        },
-        gender: {
-            identifier: 'gender',
-            rules: [
-            {
-                type   : 'empty',
-                prompt : 'Please select a gender'
-            }
-            ]
-        },
-        username: {
-            identifier: 'username',
-            rules: [
-            {
-                type   : 'empty',
-                prompt : 'Please enter a username'
-            }
-            ]
-        },
-        password: {
-            identifier: 'password',
-            rules: [
-            {
-                type   : 'empty',
-                prompt : 'Please enter a password'
-            },
-            {
-                type   : 'minLength[6]',
-                prompt : 'Your password must be at least {ruleValue} characters'
-            }
-            ]
-        },
-        terms: {
-            identifier: 'terms',
-            rules: [
-            {
-                type   : 'checked',
-                prompt : 'You must agree to the terms and conditions'
-            }
-            ]
-        }
-        }
-    })
-    ;
-
-  var example_authors = [
-    { title: 'Andorra' },
-    { title: 'United Arab Emirates' },
-    { title: 'Afghanistan' },
-    { title: 'Antigua' },
-    { title: 'Anguilla' },
-    { title: 'Albania' },
-    { title: 'Armenia' },
-    { title: 'Netherlands Antilles' },
-    { title: 'Angola' },
-    { title: 'Argentina' },
-    { title: 'American Samoa' },
-    { title: 'Austria' },
-    { title: 'Australia' },
-    { title: 'Aruba' },
-  ];
-
-  $('#work_creators')
-    .search({
-        source: example_authors
-    })
-  ;
-
-  $('#release_creators')
-    .search({
-        source: example_authors
-    })
-  ;
-
-  $('#work_type').dropdown();
-  $('#subjects').dropdown();
-  $('#language-select').dropdown();
-
-  console.log("Page loaded");
-
-});
-</script>
-{% endblock %}
diff --git a/python/fatcat_web/templates/release_edit.html b/python/fatcat_web/templates/release_edit.html
new file mode 100644
index 00000000..16c189ab
--- /dev/null
+++ b/python/fatcat_web/templates/release_edit.html
@@ -0,0 +1,218 @@
+{% import "edit_macros.html" as edit_macros %}
+{% extends "base.html" %}
+
+{% block body %}
+{% block edit_form_prefix %}
+<div class="ui segment">
+<h1 class="ui header">Edit Release Entity</h1>
+
+<form class="ui form" id="edit_release_form" method="POST" action="/release/{{ entity.ident }}/edit">
+{% endblock %}
+  {{ form.hidden_tag() }}
+
+  <br>
+  {{ edit_macros.editgroup_dropdown(form) }}
+
+  <br>
+  <h3 class="ui dividing header">The Basics</h3>
+  <div class="ui grid">
+    <div class="three wide column" style="padding-bottom: 0px;"></div>
+    <div class="twelve wide column" style="padding-bottom: 0px;">
+      <div class="ui equal width fields">
+        {{ edit_macros.form_field_basic(form.release_type, "required") }}
+        {{ edit_macros.form_field_basic(form.release_status) }}
+      </div>
+    </div>
+    <div class="one wide column" style="padding-bottom: 0px;"></div>
+  </div>
+
+  {{ edit_macros.form_field_inline(form.title, "required") }}
+  {{ edit_macros.form_field_inline(form.original_title) }}
+  {{ edit_macros.form_field_inline(form.work_id) }}
+  {{ edit_macros.form_field_inline(form.release_date) }}
+  <div class="ui grid">
+    <div class="three wide column" style="padding-bottom: 0px;"></div>
+    <div class="twelve wide column" style="padding-bottom: 0px;">
+      <div class="ui equal width fields">
+        {{ edit_macros.form_field_basic(form.language) }}
+        {{ edit_macros.form_field_basic(form.license_slug) }}
+      </div>
+    </div>
+    <div class="one wide column" style="padding-bottom: 0px;"></div>
+  </div>
+
+  <br>
+  <h3 class="ui dividing header">Contributors</h3>
+  <div class="list-group" id="contrib_list" name="contrib_list">
+  {% for cform in form.contribs %}
+    <div class="list-group-item ui grid" style="padding-right: 1em;">
+      {{ cform.hidden_tag() }}
+      <div class="one wide column middle aligned center aligned sortable-handle" style="padding-bottom: 0px; padding-right: 0px; padding-left: 0px;">
+        <i class="arrows alternate vertical icon"></i>
+      </div>
+      <div class="three wide column" style="padding-bottom: 0px; padding-left: 0px;">
+        <div class="field {% if cform.role.errors %}error{% endif %}">
+          {{ cform.role() }}
+        </div>
+      </div>
+      <div class="eleven wide column" style="padding-bottom: 0px;">
+        <div class="field {% if cform.raw_name.errors %}error{% endif %}">
+          {{ cform.raw_name() }}
+        </div>
+      </div>
+      <div class="one wide column right aligned" style="padding-bottom: 0px; padding-left: 0rem;">
+        <button type="button" class="ui icon red button delete-contrib-button"><i class="trash icon"></i></button>
+      </div>
+    </div>
+  {% endfor %}
+  </div>
+  <br>
+  <button type="button" id="add-contrib-button" class="ui right floated icon green button" style="margin-right: 0.3rem;">
+    <i class="plus icon"></i>
+  </button>
+  <br>
+
+  <br>
+  <h3 class="ui dividing header">Identifers</h3>
+  <br>
+  {{ edit_macros.form_field_inline(form.doi) }}
+  {{ edit_macros.form_field_inline(form.wikidata_qid) }}
+  {{ edit_macros.form_field_inline(form.isbn13) }}
+  <div class="ui grid">
+    <div class="three wide column" style="padding-bottom: 0px;"></div>
+    <div class="twelve wide column" style="padding-bottom: 0px;">
+      <div class="ui equal width fields">
+        {{ edit_macros.form_field_basic(form.pmid) }}
+        {{ edit_macros.form_field_basic(form.pmcid) }}
+      </div>
+    </div>
+    <div class="one wide column" style="padding-bottom: 0px;"></div>
+  </div>
+
+  <br>
+  <h3 class="ui dividing header">Container</h3>
+  <br>
+  {{ edit_macros.form_field_inline(form.container_id) }}
+  {{ edit_macros.form_field_inline(form.publisher) }}
+  <br>
+  <div class="ui grid">
+    <div class="three wide column" style="padding-bottom: 0px;"></div>
+    <div class="twelve wide column" style="padding-bottom: 0px;">
+      <div class="ui equal width fields">
+        {{ edit_macros.form_field_basic(form.pages) }}
+        {{ edit_macros.form_field_basic(form.volume) }}
+        {{ edit_macros.form_field_basic(form.issue) }}
+      </div>
+    </div>
+    <div class="one wide column" style="padding-bottom: 0px;"></div>
+  </div>
+
+  <br><br>
+  <h3 class="ui dividing header">Submit</h3>
+  {{ edit_macros.form_field_basic(form.edit_description) }}
+  This description will be attached to the individual edit, not to the
+  editgroup as a whole.
+{% block edit_form_suffix %}
+  <br><br>
+  <input class="ui primary submit button" type="submit" value="Update Release!">
+  <p>
+  <i>Edit will be part of the current editgroup, which needs to be submited and
+  approved before the change is included in the catalog.</i>
+</form>
+</div>
+{% endblock %}
+{% endblock %}
+
+{% block postscript %}
+<script src="https://cdn.jsdelivr.net/npm/sortablejs@latest/Sortable.min.js"></script>
+<script>
+<!-- Form code -->
+$(document).ready(function() {
+
+  // these javascript dropdowns hide the original <input>, which breaks browser
+  // form focusing (eg, for required fields) :(
+  //$('#release_type').dropdown();
+  //$('#release_status').dropdown();
+  $('.ui.accordion').accordion();
+
+  var fixup_contrib_numbering = function(group_item) {
+    items = Array.from(group_item.querySelectorAll(".list-group-item"))
+    for (var i = 0; i < items.length; i++) {
+      var item_el = items[i];
+      prev_el = item_el.querySelectorAll("input")[0];
+      input_el = item_el.querySelectorAll("input")[1];
+      select_el = item_el.querySelectorAll("select")[0];
+      //console.log(input_el.id);
+      //console.log(select_el.id);
+      input_el.id = "contribs-" + i + "-raw_name";
+      input_el.name = input_el.id;
+      prev_el.id = "contribs-" + i + "-prev_index";
+      prev_el.name = prev_el.id;
+      select_el.id = "contribs-" + i + "-role";
+      select_el.name = select_el.id;
+      //console.log(input_el.id);
+      //console.log(select_el.id);
+    };
+    console.log("re-named contrib rows up to i=" + i);
+  };
+
+  var contrib_list = document.getElementById('contrib_list');
+  var contrib_sortable = Sortable.create(contrib_list, {
+    handle: '.sortable-handle',
+    animation: 150,
+    onSort: function(evt) {
+      fixup_contrib_numbering(contrib_list);
+    },
+  });
+  fixup_contrib_numbering(contrib_list);
+
+  var contrib_delete_handler = function(ev) {
+    row = ev.target.parentNode.parentNode;
+    // I don't understand why this hack is needed; maybe because of the sortable stuff?
+    if(!row.classList.contains("list-group-item")) {
+        row = row.parentNode;
+    }
+    // console.log(row);
+    console.assert(row.classList.contains("list-group-item"));
+    row.parentNode.removeChild(row);
+    fixup_contrib_numbering(contrib_list);
+  };
+
+  var attach_contrib_delete_handler = function(topthing) {
+    Array.from(topthing.querySelectorAll(".delete-contrib-button")).forEach((el) => {
+      el.addEventListener("click", contrib_delete_handler);
+    });
+  };
+  attach_contrib_delete_handler(document);
+
+  // XXX: really need some way to not duplicate this code from above...
+  var contrib_template = `
+  <div class="list-group-item ui grid" style="padding-right: 1em;">
+      <input id="contribs-X-prev_index" name="contribs-X-prev_index" type="hidden" value="">
+      <div class="one wide column middle aligned center aligned sortable-handle" style="padding-bottom: 0px; padding-right: 0px; padding-left: 0px;">
+        <i class="arrows alternate vertical icon"></i>
+      </div>
+      <div class="three wide column" style="padding-bottom: 0px; padding-left: 0px;">
+        <select id="contribs-X-role" name="contribs-X-role"><option value="author">Author</option><option value="editor">Editor</option><option value="translator">Translator</option></select>
+      </div>
+      <div class="eleven wide column" style="padding-bottom: 0px;">
+        <input id="contribs-X-raw_name" name="contribs-X-raw_name" type="text" value="">
+      </div>
+      <div class="one wide column right aligned" style="padding-bottom: 0px; padding-left: 0rem;">
+        <button type="button" class="ui icon red button delete-contrib-button"><i class="trash icon"></i></button>
+      </div>
+    </div>
+  `;
+
+  var add_contrib_button = document.getElementById("add-contrib-button");
+  add_contrib_button.addEventListener("click", function(){
+    contrib_list.insertAdjacentHTML('beforeend', contrib_template);
+    attach_contrib_delete_handler(contrib_list.lastElementChild);
+    fixup_contrib_numbering(contrib_list);
+  });
+
+  console.log("Page loaded");
+
+});
+</script>
+{% endblock %}
diff --git a/python/fatcat_web/templates/release_view.html b/python/fatcat_web/templates/release_view.html
index d2078d13..fa157193 100644
--- a/python/fatcat_web/templates/release_view.html
+++ b/python/fatcat_web/templates/release_view.html
@@ -262,7 +262,7 @@
   <tbody>
   {% for webcapture in entity.webcaptures %}
   <tr><td><b><a href="{{ webcapture.original_url }}">{{ webcapture.original_url }}</a></b>
-      <br>{{ webcapture.timestamp }} | {{ webcapture.cdx|count }} resources
+      <br>{{ webcapture.timestamp.strftime("%Y-%m-%d %H:%M:%S") }} | {{ webcapture.cdx|count }} resources
       <br><small><code><a href="/webcapture/{{ webcapture.ident }}">webcapture:{{ webcapture.ident }}</a></code></small>
       <td class="single line">
         {% for url in webcapture.archive_urls[:5] %}
diff --git a/python/fatcat_web/templates/stats.html b/python/fatcat_web/templates/stats.html
index f11ca820..d117e1a4 100644
--- a/python/fatcat_web/templates/stats.html
+++ b/python/fatcat_web/templates/stats.html
@@ -7,7 +7,7 @@ You can also fetch these numbers <a href="./stats.json">as JSON</a>.
 
 <h3>Changelog</h3>
 
-<p>Latest changelog index is {{ stats.changelog.latest.index }} ({{ stats.changelog.latest.timestamp[:10] }}).
+<p>Latest changelog index is {{ stats.changelog.latest.index }} ({{ stats.changelog.latest.timestamp.strftime("%Y-%m-%d %H:%M:%S") }}).
 
 <h3>Entities</h3>
 
diff --git a/python/fatcat_web/templates/webcapture_view.html b/python/fatcat_web/templates/webcapture_view.html
index a6c628d9..921d5d48 100644
--- a/python/fatcat_web/templates/webcapture_view.html
+++ b/python/fatcat_web/templates/webcapture_view.html
@@ -43,7 +43,7 @@
           <code><a href="{{ row.url }}">{{ row.url}}</a></code>
         </div>
         <div style="margin-left: 1em;">
-          {{ row.timestamp }}
+          {{ row.timestamp.strftime("%Y-%m-%d %H:%M:%S") }}
           {% if row.mimetype %}| {{ row.mimetype }}{% endif %}
           <br>
           <code><small style="color: #666;">
@@ -72,7 +72,7 @@ No known public archive for this webcapture.
 
 {% if webcapture.timestamp != None %}
 <div class="ui segment attached">
-  <p><b>Capture Time</b> &nbsp;{{ webcapture.timestamp }}
+  <p><b>Capture Time</b> &nbsp;{{ webcapture.timestamp.strftime("%Y-%m-%d %H:%M:%S") }}
 </div>
 {% endif %}