Version 1.5.1

CHANGELOG.md

@@ -1,3 +1,9 @@
+## 1.5.1 / 2023-11-14 21:10+01:00
+
+## Improved
+* Disallow choosing non-game purchase as related purchase
+* Improve display of purchases
+
 ## 1.5.0 / 2023-11-14 19:27+01:00
 
 ## New

Dockerfile

@@ -6,7 +6,7 @@ RUN npm install && \
 
 FROM python:3.10.9-slim-bullseye
 
-ENV VERSION_NUMBER 1.5.0
+ENV VERSION_NUMBER 1.5.1
 ENV PROD 1
 ENV PYTHONUNBUFFERED=1
 

games/forms.py

@@ -56,7 +56,9 @@ class PurchaseForm(forms.ModelForm):
     )
     platform = forms.ModelChoiceField(queryset=Platform.objects.order_by("name"))
     related_purchase = forms.ModelChoiceField(
-        queryset=Purchase.objects.order_by("edition__sort_name")
+        queryset=Purchase.objects.filter(type=Purchase.GAME).order_by(
+            "edition__sort_name"
+        )
     )
 
     class Meta:

games/models.py

@@ -128,10 +128,15 @@ class Purchase(models.Model):
     )
 
     def __str__(self):
-        platform_info = self.platform
+        additional_info = [
-        if self.platform != self.edition.platform:
+            self.get_type_display() if self.type != Purchase.GAME else "",
-            platform_info = f"{self.edition.platform} version on {self.platform}"
+            f"{self.edition.platform} version on {self.platform}"
-        return f"{self.edition} ({platform_info}, {self.edition.year_released}, {self.get_ownership_type_display()})"
+            if self.platform != self.edition.platform
+            else self.platform,
+            self.edition.year_released,
+            self.get_ownership_type_display(),
+        ]
+        return f"{self.edition} ({', '.join(filter(None, map(str, additional_info)))})"
 
     def is_game(self):
         return self.type == self.GAME

games/static/js/add_purchase.js

@@ -1,4 +1,9 @@
-import { syncSelectInputUntilChanged, getEl, conditionalElementHandler } from "./utils.js";
+import {
+  syncSelectInputUntilChanged,
+  getEl,
+  disableElementsWhenTrue,
+  disableElementsWhenFalse,
+} from "./utils.js";
 
 let syncData = [
   {
@@ -11,21 +16,15 @@ let syncData = [
 
 syncSelectInputUntilChanged(syncData, "form");
 
-
+function setupElementHandlers() {
-let myConfig = [
+  disableElementsWhenTrue("#id_type", "game", [
-  () => {
+    "#id_name",
-    return getEl("#id_type").value == "game";
+    "#id_related_purchase",
-  },
+  ]);
-  ["#id_name", "#id_related_purchase"],
+  disableElementsWhenFalse("#id_type", "game", ["#id_date_finished"]);
-  (el) => {
-    el.disabled = "disabled";
-  },
-  (el) => {
-    el.disabled = "";
-  }
-]
-
-document.DOMContentLoaded = conditionalElementHandler(...myConfig)
-getEl("#id_type").onchange = () => {
-  conditionalElementHandler(...myConfig)
 }
+
+document.addEventListener("DOMContentLoaded", setupElementHandlers);
+getEl("#id_type").onchange = () => {
+  setupElementHandlers();
+};

games/static/js/utils.js

@@ -99,37 +99,72 @@ function getEl(selector) {
     return document.getElementsByClassName(selector)
   }
   else {
-    return document.getElementsByName(selector)
+    return document.getElementsByTagName(selector)
   }
 }
 
 /**
- * @description Does something to elements when something happens.
+ * @description Applies different behaviors to elements based on multiple conditional configurations.
- * @param {() => boolean} condition The condition that is being tested.
+ * Each configuration is an array containing a condition function, an array of target element selectors,
- * @param {string[]} targetElements
+ * and two callback functions for handling matched and unmatched conditions.
- * @param {(elementName: HTMLElement) => void} callbackfn1 Called when the condition matches.
+ * @param {...Array} configs Each configuration is an array of the form:
- * @param {(elementName: HTMLElement) => void} callbackfn2 Called when the condition doesn't match.
+ *   - 0: {function(): boolean} condition - Function that returns true or false based on a condition.
+ *   - 1: {string[]} targetElements - Array of CSS selectors for target elements.
+ *   - 2: {function(HTMLElement): void} callbackfn1 - Function to execute when condition is true.
+ *   - 3: {function(HTMLElement): void} callbackfn2 - Function to execute when condition is false.
  */
-function conditionalElementHandler(condition, targetElements, callbackfn1, callbackfn2) {
+function conditionalElementHandler(...configs) {
-  if (condition()) {
+  configs.forEach(([condition, targetElements, callbackfn1, callbackfn2]) => {
-    targetElements.forEach((elementName) => {
+    if (condition()) {
-      let el = getEl(elementName);
+      targetElements.forEach(elementName => {
-      if (el === null) {
+        let el = getEl(elementName);
-        console.error("Element ${elementName} doesn't exist.");
+        if (el === null) {
-      } else {
+          console.error(`Element ${elementName} doesn't exist.`);
-        callbackfn1(el);
+        } else {
-      }
+          callbackfn1(el);
-    });
+        }
-  } else {
+      });
-    targetElements.forEach((elementName) => {
+    } else {
-      let el = getEl(elementName);
+      targetElements.forEach(elementName => {
-      if (el === null) {
+        let el = getEl(elementName);
-        console.error("Element ${elementName} doesn't exist.");
+        if (el === null) {
-      } else {
+          console.error(`Element ${elementName} doesn't exist.`);
-        callbackfn2(el);
+        } else {
-      }
+          callbackfn2(el);
-    });
+        }
-  }
+      });
+    }
+  });
 }
 
-export { toISOUTCString, syncSelectInputUntilChanged, getEl, conditionalElementHandler };
+function disableElementsWhenFalse(targetSelect, targetValue, elementList) {
+  return conditionalElementHandler([
+    () => {
+      return getEl(targetSelect).value != targetValue;
+    },
+    elementList,
+    (el) => {
+      el.disabled = "disabled";
+    },
+    (el) => {
+      el.disabled = "";
+    },
+  ]);
+}
+
+function disableElementsWhenTrue(targetSelect, targetValue, elementList) {
+  return conditionalElementHandler([
+    () => {
+      return getEl(targetSelect).value == targetValue;
+    },
+    elementList,
+    (el) => {
+      el.disabled = "disabled";
+    },
+    (el) => {
+      el.disabled = "";
+    },
+  ]);
+}
+
+export { toISOUTCString, syncSelectInputUntilChanged, getEl, conditionalElementHandler, disableElementsWhenFalse, disableElementsWhenTrue, getValueFromProperty };

pyproject.toml

@@ -1,6 +1,6 @@
 [tool.poetry]
 name = "timetracker"
-version = "1.5.0"
+version = "1.5.1"
 description = "A simple time tracker."
 authors = ["Lukáš Kucharczyk <lukas@kucharczyk.xyz>"]
 license = "GPL"