1 files changed, 40 insertions, 0 deletions
diff --git a/servo/templates/devices/accessories_edit.html b/servo/templates/devices/accessories_edit.html
new file mode 100755
index 0000000..db390b3
--- /dev/null
+++ b/servo/templates/devices/accessories_edit.html
@@ -0,0 +1,40 @@
+{% extends "modal.html" %}
+{% load i18n %}
+
+{% block header %}{% trans "Manage Accessories" %}{% endblock header %}
+
+{% block body %}
+<form method="post" action="{{ action }}" class="form-search" id="acc-form">
+  {% csrf_token %}
+  <input type="text" id="filter-acc" autocomplete="off" name="name" style="width:500px"/>
+  <div id="acc-choices" style="margin-top:10px">
+    {% for a in selected %}
+    <div class="row-fluid">
+      <div class="span10">{{ a.name }}</div>
+      <div class="span1">
+      <a href="{{ action }}{{ a.id|safe }}/delete/" class="btn btn-small delete">{% trans "Remove" %}</a>
+      </div>
+    </div>
+    {% empty %}
+    <p class="empty muted">{% trans "No accessories added" %}</p>
+    {% endfor %}
+  </div>
+</form>
+<script type="text/javascript">
+  $(function() {
+    $('#acc-choices').on('click', 'a.delete', function() {
+      $('#acc-choices').load($(this).attr('href') + ' #acc-choices');
+      return false;
+    });
+    $('#filter-acc').typeahead({source: {{ choices_json }}});
+    $('#acc-form').submit(function(e) {
+      e.preventDefault();
+      url = $(this).attr('action');
+      $('#acc-choices').load(url + ' #acc-choices', $(this).serializeArray(),
+        function() {
+          $('#filter-acc').val('');
+        });
+    });
+  });
+</script>
+{% endblock body %}