Add auto-complete boxes for selecting include/exclude characters

botc/settings.py

@@ -42,6 +42,7 @@
     "allauth.socialaccount.providers.discord",
     "markdownify.apps.MarkdownifyConfig",
     "corsheaders",
+    "django_select2",
 ]
 
 MIDDLEWARE = [

pyproject.toml

@@ -23,6 +23,7 @@ dependencies = [
     "django-cors-headers<5.0.0,>=4.3.0",
     "jsonschema<5.0.0,>=4.23.0",
     "bleach>=6.2.0",
+    "django-select2>=8.4.1",
 ]
 requires-plugins = { poetry-plugin-export = ">=1.8" }
 package-mode = false

scripts/filters.py

@@ -1,11 +1,10 @@
-import re
-
 import django_filters
 from django_filters import rest_framework as filters
 from django import forms
+from django_select2.forms import ModelSelect2MultipleWidget
 from django.contrib.postgres.search import TrigramSimilarity
 
-from scripts import models, widgets, script_json
+from scripts import models, widgets
 
 edition_choices = (
     (models.Edition.BASE, models.Edition.BASE.label),
@@ -27,20 +26,14 @@ def annotate_queryset(queryset, field, value):
 
 
 def include_characters(queryset, value):
-    for character in re.split(",|;|:|/", value):
-        character = script_json.strip_special_characters(character.strip())
-        if character in ",;:/":
-            continue
-        queryset = queryset.filter(content__contains=[{"id": name_to_id(character)}])
+    for character in value.values_list("character_id", flat=True):
+        queryset = queryset.filter(content__contains=[{"id": character}])
     return queryset
 
 
 def exclude_characters(queryset, value):
-    for character in re.split(",|;|:|/", value):
-        character = script_json.strip_special_characters(character.strip())
-        if character in ",;:/":
-            continue
-        queryset = queryset.exclude(content__contains=[{"id": name_to_id(character)}])
+    for character in value.values_list("character_id", flat=True):
+        queryset = queryset.exclude(content__contains=[{"id": character}])
     return queryset
 
 
@@ -54,8 +47,38 @@ class BaseScriptVersionFilter(filters.FilterSet):
         widget=forms.CheckboxInput,
         label="Display All Versions",
     )
-    include = django_filters.filters.CharFilter(method="include_characters", label="Includes characters")
-    exclude = django_filters.filters.CharFilter(method="exclude_characters", label="Excludes characters")
+    include = django_filters.filters.ModelMultipleChoiceFilter(
+        queryset=models.ClocktowerCharacter.objects.all().order_by("character_name"),
+        method="include_characters",
+        widget=ModelSelect2MultipleWidget(
+            model=models.ClocktowerCharacter,
+            search_fields=["character_name__icontains"],
+            attrs={
+                "data-placeholder": "Include Characters",
+                "data-minimum-input-length": 1,
+                "data-theme": "bootstrap4",
+                "data-dropdown-auto-width": "true",
+                "data-width": "10em",
+            },
+        ),
+        label="Include Characters",
+    )
+    exclude = django_filters.filters.ModelMultipleChoiceFilter(
+        queryset=models.ClocktowerCharacter.objects.all().order_by("character_name"),
+        method="exclude_characters",
+        widget=ModelSelect2MultipleWidget(
+            model=models.ClocktowerCharacter,
+            search_fields=["character_name__icontains"],
+            attrs={
+                "data-placeholder": "Exclude Characters",
+                "data-minimum-input-length": 1,
+                "data-theme": "bootstrap4",
+                "data-dropdown-auto-width": "true",
+                "data-width": "10em",
+            },
+        ),
+        label="Exclude Characters",
+    )
     author = django_filters.filters.CharFilter(method="search_authors", label="Author")
     search = django_filters.filters.CharFilter(method="search_scripts", label="Search")
     mono_demon = django_filters.filters.BooleanFilter(
@@ -100,10 +123,14 @@ def filter_my_scripts(self, queryset, name, value):
         return queryset
 
     def include_characters(self, queryset, name, value):
-        return include_characters(queryset, value)
+        for character in value:
+            queryset = queryset.filter(content__contains=[{"id": name_to_id(character.character_name)}])
+        return queryset
 
     def exclude_characters(self, queryset, name, value):
-        return exclude_characters(queryset, value)
+        for character in value:
+            queryset = queryset.exclude(content__contains=[{"id": name_to_id(character.character_name)}])
+        return queryset
 
     def search_scripts(self, queryset, name, value):
         queryset = annotate_queryset(queryset, "script__name", value)

scripts/forms.py

@@ -1,4 +1,5 @@
 from django import forms
+from django_select2.forms import ModelSelect2MultipleWidget
 from django.core.exceptions import ValidationError
 from django.core.validators import FileExtensionValidator
 import jsonschema.exceptions
@@ -140,8 +141,34 @@ class AdvancedSearchForm(forms.Form):
     name = forms.CharField(max_length=constants.MAX_SCRIPT_NAME_LENGTH, required=False)
     author = forms.CharField(max_length=constants.MAX_AUTHOR_NAME_LENGTH, required=False)
     script_type = forms.ChoiceField(choices=models.ScriptTypes.choices, initial=models.ScriptTypes.FULL)
-    includes_characters = forms.CharField(required=False)
-    excludes_characters = forms.CharField(required=False)
+    includes_characters = forms.ModelMultipleChoiceField(
+        queryset=models.ClocktowerCharacter.objects.all().order_by("character_name"),
+        widget=ModelSelect2MultipleWidget(
+            model=models.ClocktowerCharacter,
+            search_fields=["character_name__icontains"],
+            attrs={
+                "data-placeholder": "Type to search characters...",
+                "data-minimum-input-length": 1,
+                "data-theme": "bootstrap4",
+            },
+        ),
+        required=False,
+        label="Includes Characters",
+    )
+    excludes_characters = forms.ModelMultipleChoiceField(
+        queryset=models.ClocktowerCharacter.objects.all().order_by("character_name"),
+        widget=ModelSelect2MultipleWidget(
+            model=models.ClocktowerCharacter,
+            search_fields=["character_name__icontains"],
+            attrs={
+                "data-placeholder": "Type to search characters...",
+                "data-minimum-input-length": 1,
+                "data-theme": "bootstrap4",
+            },
+        ),
+        required=False,
+        label="Excludes Characters",
+    )
     edition = forms.ChoiceField(choices=models.Edition.choices, initial=models.Edition.CLOCKTOWER_APP)
     minimum_number_of_likes = forms.IntegerField(required=False)
     minimum_number_of_favourites = forms.IntegerField(required=False)

scripts/templates/advanced_search.html

@@ -20,6 +20,7 @@
     {% buttons %}
         <button type="submit" class="btn btn-primary m-1">Submit</button>
     {% endbuttons %}
+    {{ form.media.js }}
 </form>
 
 {% endblock %}

scripts/templates/base.html

@@ -23,6 +23,9 @@
 
 <head>
     <meta name="google-site-verification" content="e7R5G0n4MYvX8KBMqBcy6QS-0sLf-10F6Fp3CULDhVI" />
+    {{ form.media.css }}
+    {{ filter.form.media.css }}
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ttskch/select2-bootstrap4-theme/dist/select2-bootstrap4.min.css">
 </head>
 
 <body class="d-flex flex-column h-100">

scripts/templates/scriptlist.html

@@ -23,6 +23,7 @@
             </div>
         </div>
     </div>
+    {{ filter.form.media.js }}
 </form>
 {% endif %}
 

scripts/urls.py

@@ -96,6 +96,7 @@
     path("script/search", views.AdvancedSearchView.as_view(), name="advanced_search"),
     path("script/search/results", views.AdvancedSearchResultsView.as_view()),
     path("script/upload", views.ScriptUploadView.as_view(), name="upload"),
+    path("select2/", include("django_select2.urls")),
     path("statistics", views.StatisticsView.as_view()),
     path("statistics/<str:character>", views.StatisticsView.as_view()),
     path("statistics/tags/<int:tags>", views.StatisticsView.as_view()),