From 743bc78790c970c6c69aadca1e622d3b5813312c Mon Sep 17 00:00:00 2001
From: michael chance <chance529@gmail.com>
Date: Sun, 4 Sep 2022 20:43:13 -0700
Subject: [PATCH] First pass at exclusive size filters

---
 src/components/FiltersSlideover.vue |  1 +
 src/stores/filters.js               | 43 ++++++++++++++++++++++++-----
 2 files changed, 37 insertions(+), 7 deletions(-)

diff --git a/src/components/FiltersSlideover.vue b/src/components/FiltersSlideover.vue
index c495c5ce..8de08846 100644
--- a/src/components/FiltersSlideover.vue
+++ b/src/components/FiltersSlideover.vue
@@ -136,6 +136,7 @@ defineProps({
                     mode="tags"
                     placeholder="Any size"
                     v-model="filters.size"
+                    :groups="true"
                     :options="filters.sizeOptions"
                   ></Multiselect>
                 </div>
diff --git a/src/stores/filters.js b/src/stores/filters.js
index fa423e77..f382a883 100644
--- a/src/stores/filters.js
+++ b/src/stores/filters.js
@@ -26,12 +26,28 @@ export const useFilters = defineStore("filters", {
       },
       size: helpers.migrateLocalStorage("filtersSize", "size", []),
       sizeOptions: [
-        { value: "tiny", label: "Tiny" },
-        { value: "small", label: "Small" },
-        { value: "medium", label: "Medium" },
-        { value: "large", label: "Large" },
-        { value: "huge", label: "Huge" },
-        { value: "gargantuan", label: "Gargantuan" },
+        {
+            label:"Include",
+            options:[
+                { value: "tiny", label: "Tiny" },
+                { value: "small", label: "Small" },
+                { value: "medium", label: "Medium" },
+                { value: "large", label: "Large" },
+                { value: "huge", label: "Huge" },
+                { value: "gargantuan", label: "Gargantuan" },
+            ]
+        },
+        {
+            label:"Exclude",
+            options:[
+                { value: "ex-tiny", label: "-Tiny" },
+                { value: "ex-small", label: "-Small" },
+                { value: "ex-medium", label: "-Medium" },
+                { value: "ex-large", label: "-Large" },
+                { value: "ex-huge", label: "-Huge" },
+                { value: "ex-gargantuan", label: "-Gargantuan" },
+            ]
+        }
       ],
       legendary: helpers.migrateLocalStorage(
         "filtersLegendary",
@@ -173,7 +189,20 @@ export const useFilters = defineStore("filters", {
         return {
           search: (monster) => this.searchFor(monster.searchable),
           alignment: (monster) => monster.alignment.bits & state.alignment.bits,
-          size: (monster) => state.size.includes(monster.size.toLowerCase()),
+          size: (monster) => {
+            const monsterSize = monster.size.toLowerCase();
+            const exclusiveFilters = state.size.filter((s)=>s.indexOf('ex-') === 0);
+            const inclusiveFilters = state.size.filter((s)=>s.indexOf('ex-') !== 0);
+
+            const isNotExcluded =
+              exclusiveFilters.length === 0 ||
+              !exclusiveFilters.includes(`ex-${monsterSize}`);
+            const isIncluded =
+              inclusiveFilters.length === 0 ||
+              inclusiveFilters.includes(monsterSize);
+            
+            return isNotExcluded && isIncluded;
+          },
           type: (monster) => state.type.includes(monster.type.toLowerCase()),
           environment: (monster) =>
             state.environment.find((environment) =>