5 files changed, 110 insertions, 16 deletions

diff --git a/ogcp/templates/actions/delete_repo.html b/ogcp/templates/actions/delete_repo.html
index 17902dd..8c32a8c 100644
--- a/ogcp/templates/actions/delete_repo.html
+++ b/ogcp/templates/actions/delete_repo.html
@@ -9,9 +9,28 @@
 
 <h2 class="mx-5 subhead-heading">{{_('Delete repo')}}</h2>
 
-{{ wtf.quick_form(form,
-		  action=url_for('action_repo_delete'),
-                  method='post',
-                  button_map={'submit': 'danger'},
-                  extra_classes="mx-5") }}
+<form class="form mx-5" method="POST">
+    {{ form.hidden_tag() }}
+
+    {{ form.server() }}
+    {{ form.repo_id() }}
+
+    <div class="form-group">
+        {{ form.name.label }}
+        {{ form.name(class="form-control") }}
+    </div>
+
+    <div class="form-group" id="ip-fields">
+        {{ form.addr.label }}
+        {% for addr in form.addr %}
+            {{ addr(class="form-control mb-2") }}
+        {% endfor %}
+    </div>
+
+    <div class="form-group">
+        {{ form.submit(class="btn btn-primary") }}
+    </div>
+
+</form>
+
 {% endblock %}
diff --git a/ogcp/templates/actions/repo_details.html b/ogcp/templates/actions/repo_details.html
index 674abc2..212a63b 100644
--- a/ogcp/templates/actions/repo_details.html
+++ b/ogcp/templates/actions/repo_details.html
@@ -9,5 +9,23 @@
 
 <h2 class="mx-5 subhead-heading">{{_('Repo details')}}</h2>
 
-{{ wtf.quick_form(form, extra_classes="mx-5") }}
+<form class="form mx-5" method="POST">
+    {{ form.hidden_tag() }}
+
+    {{ form.server() }}
+    {{ form.repo_id() }}
+
+    <div class="form-group">
+        {{ form.name.label }}
+        {{ form.name(class="form-control") }}
+    </div>
+
+    <div class="form-group" id="ip-fields">
+        {{ form.addr.label }}
+        {% for addr in form.addr %}
+            {{ addr(class="form-control mb-2") }}
+        {% endfor %}
+    </div>
+</form>
+
 {% endblock %}
diff --git a/ogcp/templates/actions/repos_add.html b/ogcp/templates/actions/repos_add.html
index 338f96c..19f02bf 100644
--- a/ogcp/templates/actions/repos_add.html
+++ b/ogcp/templates/actions/repos_add.html
@@ -9,9 +9,6 @@
 
 <h2 class="mx-5 subhead-heading">{{_('Add repo')}}</h2>
 
-{{ wtf.quick_form(form,
-                  action=url_for('action_repo_add'),
-                  method='post',
-                  button_map={'submit': 'primary'},
-                  extra_classes="mx-5") }}
+{% include 'repo_inspector.html' %}
+
 {% endblock %}
diff --git a/ogcp/templates/actions/repos_update.html b/ogcp/templates/actions/repos_update.html
index 15c6b64..1278648 100644
--- a/ogcp/templates/actions/repos_update.html
+++ b/ogcp/templates/actions/repos_update.html
@@ -9,9 +9,6 @@
 
 <h2 class="mx-5 subhead-heading">{{_('Update repo')}}</h2>
 
-{{ wtf.quick_form(form,
-                  action=url_for('action_repo_update'),
-                  method='post',
-                  button_map={'submit': 'primary'},
-                  extra_classes="mx-5") }}
+{% include 'repo_inspector.html' %}
+
 {% endblock %}
diff --git a/ogcp/templates/repo_inspector.html b/ogcp/templates/repo_inspector.html
new file mode 100644
index 0000000..ccedf5f
--- /dev/null
+++ b/ogcp/templates/repo_inspector.html
@@ -0,0 +1,63 @@
+<form class="form mx-5" method="POST">
+    {{ form.hidden_tag() }}
+
+    {{ form.server() }}
+    {{ form.repo_id() }}
+
+    <div class="form-group">
+        {{ form.name.label }}
+        {{ form.name(class="form-control", required=True) }}
+    </div>
+
+    <div class="form-group">
+        {{ form.addr.label }}
+        <div id="ip-fields">
+            {% for addr in form.addr %}
+            <div class="d-flex align-items-center mb-2">
+                {{ addr(class="form-control me-2", placeholder=_("Enter IP Address"), required=True) }}
+                <button type="button" class="btn btn-danger" onclick="removeIPField(this)">{{_('Remove') }}</button>
+            </div>
+            {% endfor %}
+        </div>
+        <button type="button" class="btn btn-primary" onclick="addIPField()">{{_('Add address') }}</button>
+
+        {{ form.submit(class="btn btn-success") }}
+    </div>
+</form>
+
+<script>
+    function addIPField() {
+        const container = document.createElement('div');
+        container.classList.add('d-flex', 'align-items-center', 'mb-2');
+
+        const newField = document.createElement('input');
+        newField.setAttribute('type', 'text');
+        newField.setAttribute('name', 'addr-' + document.querySelectorAll('input[name^="addr-"]').length);
+        newField.classList.add('form-control', 'me-2');
+        newField.setAttribute('placeholder', '{{ _('Enter IP Address') }}');
+        newField.required = true;
+
+        const removeButton = document.createElement('button');
+        removeButton.setAttribute('type', 'button');
+        removeButton.classList.add('btn', 'btn-danger');
+        removeButton.innerText = '{{ _('Remove') }}';
+        removeButton.onclick = function() {
+            removeIPField(this);
+        };
+
+        container.appendChild(newField);
+        container.appendChild(removeButton);
+        document.getElementById('ip-fields').appendChild(container);
+    }
+
+    function removeIPField(elem) {
+        const ipFieldsContainer = document.getElementById('ip-fields');
+        const ipFieldDivs = ipFieldsContainer.querySelectorAll('.d-flex');
+
+        if (ipFieldDivs.length <= 1) {
+            return;
+        }
+        const parentDiv = elem.parentElement;
+        parentDiv.remove();
+    }
+</script>
\ No newline at end of file