feat(frontend): ✨ Fractional Scaling

frontend/composables/use-fraction.ts

@@ -0,0 +1,76 @@
+/* frac.js (C) 2012-present SheetJS -- http://sheetjs.com */
+/* https://developer.aliyun.com/mirror/npm/package/frac/v/0.3.0 Apache license */
+
+function frac(x: number, D: number, mixed: Boolean) {
+  let n1 = Math.floor(x);
+  let d1 = 1;
+  let n2 = n1 + 1;
+  let d2 = 1;
+  if (x !== n1)
+    while (d1 <= D && d2 <= D) {
+      const m = (n1 + n2) / (d1 + d2);
+      if (x === m) {
+        if (d1 + d2 <= D) {
+          d1 += d2;
+          n1 += n2;
+          d2 = D + 1;
+        } else if (d1 > d2) d2 = D + 1;
+        else d1 = D + 1;
+        break;
+      } else if (x < m) {
+        n2 = n1 + n2;
+        d2 = d1 + d2;
+      } else {
+        n1 = n1 + n2;
+        d1 = d1 + d2;
+      }
+    }
+  if (d1 > D) {
+    d1 = d2;
+    n1 = n2;
+  }
+  if (!mixed) return [0, n1, d1];
+  const q = Math.floor(n1 / d1);
+  return [q, n1 - q * d1, d1];
+}
+function cont(x: number, D: number, mixed: Boolean) {
+  const sgn = x < 0 ? -1 : 1;
+  let B = x * sgn;
+  let P_2 = 0;
+  let P_1 = 1;
+  let P = 0;
+  let Q_2 = 1;
+  let Q_1 = 0;
+  let Q = 0;
+  let A = Math.floor(B);
+  while (Q_1 < D) {
+    A = Math.floor(B);
+    P = A * P_1 + P_2;
+    Q = A * Q_1 + Q_2;
+    if (B - A < 0.00000005) break;
+    B = 1 / (B - A);
+    P_2 = P_1;
+    P_1 = P;
+    Q_2 = Q_1;
+    Q_1 = Q;
+  }
+  if (Q > D) {
+    if (Q_1 > D) {
+      Q = Q_2;
+      P = P_2;
+    } else {
+      Q = Q_1;
+      P = P_1;
+    }
+  }
+  if (!mixed) return [0, sgn * P, Q];
+  const q = Math.floor((sgn * P) / Q);
+  return [q, sgn * P - q * Q, Q];
+}
+
+export const useFraction = function () {
+  return {
+    frac,
+    cont,
+  };
+};

frontend/composables/use-recipe-foods.ts

@@ -1,8 +1,10 @@
-import { useAsync, ref, reactive } from "@nuxtjs/composition-api";
+import { useAsync, ref, reactive, Ref } from "@nuxtjs/composition-api";
 import { useAsyncKey } from "./use-utils";
 import { useApiSingleton } from "~/composables/use-api";
 import { Food } from "~/api/class-interfaces/recipe-foods";
 
+let foodStore: Ref<Food[] | null> | null = null;
+
 export const useFoods = function () {
   const api = useApiSingleton();
   const loading = ref(false);
@@ -23,15 +25,15 @@ export const useFoods = function () {
         return data;
       }, useAsyncKey());
 
-      loading.value = false
+      loading.value = false;
       return units;
     },
     async refreshAll() {
       loading.value = true;
       const { data } = await api.foods.getAll();
 
-      if (data) {
-        foods.value = data;
+      if (data && foodStore) {
+        foodStore.value = data;
       }
 
       loading.value = false;
@@ -44,8 +46,8 @@ export const useFoods = function () {
 
       loading.value = true;
       const { data } = await api.foods.createOne(workingFoodData);
-      if (data && foods.value) {
-        foods.value.push(data);
+      if (data && foodStore?.value) {
+        foodStore.value.push(data);
       } else {
         this.refreshAll();
       }
@@ -61,7 +63,7 @@ export const useFoods = function () {
 
       loading.value = true;
       const { data } = await api.foods.updateOne(workingFoodData.id, workingFoodData);
-      if (data && foods.value) {
+      if (data && foodStore?.value) {
         this.refreshAll();
       }
       loading.value = false;
@@ -69,7 +71,7 @@ export const useFoods = function () {
     async deleteOne(id: string | number) {
       loading.value = true;
       const { data } = await api.foods.deleteOne(id);
-      if (data && foods.value) {
+      if (data && foodStore?.value) {
         this.refreshAll();
       }
     },
@@ -83,9 +85,14 @@ export const useFoods = function () {
       workingFoodData.name = item.name;
       workingFoodData.description = item.description;
     },
+    flushStore() {
+      foodStore = null;
+    },
   };
 
-  const foods = actions.getAll();
+  if (!foodStore) {
+    foodStore = actions.getAll();
+  }
 
-  return { foods, workingFoodData, deleteTargetId, actions, validForm };
+  return { foods: foodStore, workingFoodData, deleteTargetId, actions, validForm };
 };

frontend/composables/use-recipe-units.ts

@@ -1,8 +1,10 @@
-import { useAsync, ref, reactive } from "@nuxtjs/composition-api";
+import { useAsync, ref, reactive, Ref } from "@nuxtjs/composition-api";
 import { useAsyncKey } from "./use-utils";
 import { useApiSingleton } from "~/composables/use-api";
 import { Unit } from "~/api/class-interfaces/recipe-units";
 
+let unitStore: Ref<Unit[] | null> | null = null;
+
 export const useUnits = function () {
   const api = useApiSingleton();
   const loading = ref(false);
@@ -12,6 +14,7 @@ export const useUnits = function () {
   const workingUnitData = reactive({
     id: 0,
     name: "",
+    fraction: true,
     abbreviation: "",
     description: "",
   });
@@ -24,15 +27,15 @@ export const useUnits = function () {
         return data;
       }, useAsyncKey());
 
-      loading.value = false
+      loading.value = false;
       return units;
     },
     async refreshAll() {
       loading.value = true;
       const { data } = await api.units.getAll();
 
-      if (data) {
-        units.value = data;
+      if (data && unitStore) {
+        unitStore.value = data;
       }
 
       loading.value = false;
@@ -45,8 +48,8 @@ export const useUnits = function () {
 
       loading.value = true;
       const { data } = await api.units.createOne(workingUnitData);
-      if (data && units.value) {
-        units.value.push(data);
+      if (data && unitStore?.value) {
+        unitStore.value.push(data);
       } else {
         this.refreshAll();
       }
@@ -62,7 +65,7 @@ export const useUnits = function () {
 
       loading.value = true;
       const { data } = await api.units.updateOne(workingUnitData.id, workingUnitData);
-      if (data && units.value) {
+      if (data && unitStore?.value) {
         this.refreshAll();
       }
       loading.value = false;
@@ -70,7 +73,7 @@ export const useUnits = function () {
     async deleteOne(id: string | number) {
       loading.value = true;
       const { data } = await api.units.deleteOne(id);
-      if (data && units.value) {
+      if (data && unitStore?.value) {
         this.refreshAll();
       }
     },
@@ -83,12 +86,18 @@ export const useUnits = function () {
     setWorking(item: Unit) {
       workingUnitData.id = item.id;
       workingUnitData.name = item.name;
+      workingUnitData.fraction = item.fraction;
       workingUnitData.abbreviation = item.abbreviation;
       workingUnitData.description = item.description;
     },
+    flushStore() {
+      unitStore = null;
+    },
   };
 
-  const units = actions.getAll();
+  if (!unitStore) {
+    unitStore = actions.getAll();
+  }
 
-  return { units, workingUnitData, deleteTargetId, actions, validForm };
+  return { units: unitStore, workingUnitData, deleteTargetId, actions, validForm };
 };

frontend/composables/use-recipes.ts

@@ -1,5 +1,5 @@
 import { useAsync, ref } from "@nuxtjs/composition-api";
-import {set } from "@vueuse/core"
+import { set } from "@vueuse/core";
 import { useAsyncKey } from "./use-utils";
 import { useApiSingleton } from "~/composables/use-api";
 import { Recipe } from "~/types/api-types/recipe";
@@ -31,7 +31,6 @@ export const useRecipes = (all = false, fetchRecipes = true) => {
     const { data } = await api.recipes.getAll(start, end);
     if (data) {
       set(recipes, data);
-      
     }
   }