forms: Selectize label input in update forms

Add autocomplete to labels field of update form in the patch details
view (only visible for users with project admin rights).

Author: fstachura

htdocs/css/style.css

@@ -471,6 +471,14 @@ select[class^=change-property-], .archive-patch-select, .add-bundle {
     margin: 0px 4px 0px 4px;
 }
 
+.labels-field {
+    padding: 4px;
+    margin-right: 8px;
+    box-sizing: border-box;
+    border-radius: 4px;
+    min-width: 200px;
+}
+
 .patch-form-submit {
     font-weight: bold;
     padding: 4px;

patchwork/forms.py

@@ -150,6 +150,9 @@ def __init__(self, instance=None, project=None, *args, **kwargs):
                 Q(project=project) | Q(project=None)
             ),
             required=False,
+            widget=forms.SelectMultiple(
+                attrs={'class': 'labels-field', 'placeholder': 'Labels'}
+            ),
         )
 
     class Meta:
@@ -234,6 +237,9 @@ def __init__(self, project, *args, **kwargs):
             queryset=Label.objects.filter(
                 Q(project=project) | Q(project=None)
             ),
+            widget=forms.SelectMultiple(
+                attrs={'class': 'labels-field', 'placeholder': 'Labels to add'}
+            ),
             required=False,
         )
         self.fields['state'] = OptionalModelChoiceField(

patchwork/templates/patchwork/partials/patch-forms.html

@@ -1,3 +1,16 @@
+{% load static %}
+
+<script type="text/javascript">
+$(document).ready(function() {
+    $('.labels-field').selectize({
+        maxItems: null,
+        persist: false,
+        hideSelected: true,
+        searchField: 'labels',
+    });
+});
+</script>
+
 <div class="patch-forms" id="patch-forms">
 {% if patch_form %}
   <div id="patch-form-properties" class="patch-form">