websites: default: add auto price series type

websites/default/scripts/simulation.js

@@ -76,7 +76,7 @@ export function init({
             input.value = value;
             stateValue = value;
           }
-        },
+        }
       );
 
       input.addEventListener("input", () => {
@@ -139,7 +139,7 @@ export function init({
             input.value = value;
             stateValue = value;
           }
-        },
+        }
       );
 
       input.addEventListener("change", () => {
@@ -328,7 +328,7 @@ export function init({
               keyPrefix,
               key: "top-up-freq",
             },
-          },
+          }
         ),
       },
     },
@@ -356,7 +356,7 @@ export function init({
               keyPrefix,
               key: "swap-freq",
             },
-          },
+          }
         ),
       },
     },
@@ -369,7 +369,7 @@ export function init({
             keyPrefix,
             key: "interval-start",
           },
-        },
+        }
       ),
       end: signals.createSignal(/** @type {Date | null} */ (new Date()), {
         save: {
@@ -391,7 +391,7 @@ export function init({
   };
 
   parametersElement.append(
-    utils.dom.createHeader("Save in Bitcoin").headerElement,
+    utils.dom.createHeader("Save in Bitcoin").headerElement
   );
 
   /**
@@ -410,7 +410,9 @@ export function init({
    * @param {string} param0.text
    */
   function createColoredSpan({ color, text }) {
-    return `<span style="color: ${colors[color]()}; font-weight: 500; text-transform: uppercase;
+    return `<span style="color: ${colors[
+      color
+    ]()}; font-weight: 500; text-transform: uppercase;
       font-size: var(--font-size-sm);">${text}</span>`;
   }
 
@@ -429,9 +431,9 @@ export function init({
           title: "Initial Dollar Amount",
           signal: settings.dollars.initial.amount,
           signals,
-        }),
+        })
       ),
-    }),
+    })
   );
 
   parametersElement.append(
@@ -449,9 +451,9 @@ export function init({
           list: frequencies.list,
           signal: settings.dollars.topUp.frenquency,
           deep: true,
-        }),
+        })
       ),
-    }),
+    })
   );
 
   parametersElement.append(
@@ -469,9 +471,9 @@ export function init({
           title: "Top Up Dollar Amount",
           signal: settings.dollars.topUp.amount,
           signals,
-        }),
+        })
       ),
-    }),
+    })
   );
 
   parametersElement.append(
@@ -489,9 +491,9 @@ export function init({
           title: "Initial Swap Amount",
           signal: settings.bitcoin.investment.initial,
           signals,
-        }),
+        })
       ),
-    }),
+    })
   );
 
   parametersElement.append(
@@ -508,9 +510,9 @@ export function init({
           list: frequencies.list,
           signal: settings.bitcoin.investment.frequency,
           deep: true,
-        }),
+        })
       ),
-    }),
+    })
   );
 
   parametersElement.append(
@@ -528,9 +530,9 @@ export function init({
           title: "Bitcoin Recurrent Investment",
           signal: settings.bitcoin.investment.recurrent,
           signals,
-        }),
+        })
       ),
-    }),
+    })
   );
 
   parametersElement.append(
@@ -547,9 +549,9 @@ export function init({
           title: "First Simulation Date",
           signal: settings.interval.start,
           signals,
-        }),
+        })
       ),
-    }),
+    })
   );
 
   parametersElement.append(
@@ -566,9 +568,9 @@ export function init({
           title: "Last Simulation Day",
           signal: settings.interval.end,
           signals,
-        }),
+        })
       ),
-    }),
+    })
   );
 
   parametersElement.append(
@@ -589,9 +591,9 @@ export function init({
           step: 0.01,
           signals,
           placeholder: "Fees",
-        }),
+        })
       ),
-    }),
+    })
   );
 
   const p1 = window.document.createElement("p");
@@ -606,94 +608,94 @@ export function init({
   const owner = signals.getOwner();
 
   const totalInvestedAmountData = signals.createSignal(
-    /** @type {LineData<Time>[]} */ ([]),
+    /** @type {LineData<number>[]} */ ([]),
     {
       equals: false,
-    },
+    }
   );
   const bitcoinValueData = signals.createSignal(
-    /** @type {LineData<Time>[]} */ ([]),
+    /** @type {LineData<number>[]} */ ([]),
     {
       equals: false,
-    },
+    }
   );
   const bitcoinData = signals.createSignal(
-    /** @type {LineData<Time>[]} */ ([]),
+    /** @type {LineData<number>[]} */ ([]),
     {
       equals: false,
-    },
+    }
   );
   const resultData = signals.createSignal(
-    /** @type {LineData<Time>[]} */ ([]),
+    /** @type {LineData<number>[]} */ ([]),
     {
       equals: false,
-    },
+    }
   );
   const dollarsLeftData = signals.createSignal(
-    /** @type {LineData<Time>[]} */ ([]),
+    /** @type {LineData<number>[]} */ ([]),
     {
       equals: false,
-    },
+    }
   );
   const totalValueData = signals.createSignal(
-    /** @type {LineData<Time>[]} */ ([]),
+    /** @type {LineData<number>[]} */ ([]),
     {
       equals: false,
-    },
+    }
   );
   const investmentData = signals.createSignal(
-    /** @type {LineData<Time>[]} */ ([]),
+    /** @type {LineData<number>[]} */ ([]),
     {
       equals: false,
-    },
+    }
   );
   const bitcoinAddedData = signals.createSignal(
-    /** @type {LineData<Time>[]} */ ([]),
+    /** @type {LineData<number>[]} */ ([]),
     {
       equals: false,
-    },
+    }
   );
   const averagePricePaidData = signals.createSignal(
-    /** @type {LineData<Time>[]} */ ([]),
+    /** @type {LineData<number>[]} */ ([]),
     {
       equals: false,
-    },
+    }
   );
   const bitcoinPriceData = signals.createSignal(
-    /** @type {LineData<Time>[]} */ ([]),
+    /** @type {LineData<number>[]} */ ([]),
     {
       equals: false,
-    },
+    }
   );
   const buyCountData = signals.createSignal(
-    /** @type {LineData<Time>[]} */ ([]),
+    /** @type {LineData<number>[]} */ ([]),
     {
       equals: false,
-    },
+    }
   );
   const totalFeesPaidData = signals.createSignal(
-    /** @type {LineData<Time>[]} */ ([]),
+    /** @type {LineData<number>[]} */ ([]),
     {
       equals: false,
-    },
+    }
   );
   const daysCountData = signals.createSignal(
-    /** @type {LineData<Time>[]} */ ([]),
+    /** @type {LineData<number>[]} */ ([]),
     {
       equals: false,
-    },
+    }
   );
   const profitableDaysRatioData = signals.createSignal(
-    /** @type {LineData<Time>[]} */ ([]),
+    /** @type {LineData<number>[]} */ ([]),
     {
       equals: false,
-    },
+    }
   );
   const unprofitableDaysRatioData = signals.createSignal(
-    /** @type {LineData<Time>[]} */ ([]),
+    /** @type {LineData<number>[]} */ ([]),
     {
       equals: false,
-    },
+    }
   );
 
   const index = () => /** @type {DateIndex} */ (0);
@@ -933,8 +935,7 @@ export function init({
             let lastSatsAdded = 0;
 
             range.forEach((date, index) => {
-              const year = date.getUTCFullYear();
-              const time = utils.date.toString(date);
+              const time = date.valueOf() / 1000;
 
               if (topUpFrequency.isTriggerDay(date)) {
                 dollars += topUpAmount;
@@ -1095,16 +1096,21 @@ export function init({
             p1.innerHTML = `After exchanging ${serInvestedAmount} in the span of ${serDaysCount} days, you would have accumulated ${serSats} Satoshis (${serBitcoin} Bitcoin) worth today ${serBitcoinValue} at an average price of ${serAveragePricePaid} per Bitcoin with a return of investment of ${serRoi}, have ${serDollars} left and paid a total of ${serTotalFeesPaid} in fees.`;
 
             const dayDiff = Math.floor(
-              utils.date.differenceBetween(new Date(), lastInvestDay),
+              utils.date.differenceBetween(new Date(), lastInvestDay)
             );
             const serDailyInvestment = c("emerald", fd(dailyInvestment));
             const setLastSatsAdded = c("orange", f(lastSatsAdded));
-            p2.innerHTML = `You would've last bought ${c("blue", dayDiff ? `${f(dayDiff)} ${dayDiff > 1 ? "days" : "day"} ago` : "today")} and exchanged ${serDailyInvestment} for approximately ${setLastSatsAdded} Satoshis`;
+            p2.innerHTML = `You would've last bought ${c(
+              "blue",
+              dayDiff
+                ? `${f(dayDiff)} ${dayDiff > 1 ? "days" : "day"} ago`
+                : "today"
+            )} and exchanged ${serDailyInvestment} for approximately ${setLastSatsAdded} Satoshis`;
 
             const serProfitableDaysRatio = c("green", fp(profitableDaysRatio));
             const serUnprofitableDaysRatio = c(
               "red",
-              fp(unprofitableDaysRatio),
+              fp(unprofitableDaysRatio)
             );
 
             p3.innerHTML = `You would've been ${serProfitableDaysRatio} of the time profitable and ${serUnprofitableDaysRatio} of the time unprofitable.`;
@@ -1114,7 +1120,7 @@ export function init({
               (lowestAnnual4YReturn) => {
                 const serLowestAnnual4YReturn = c(
                   "cyan",
-                  `${fp(lowestAnnual4YReturn)}`,
+                  `${fp(lowestAnnual4YReturn)}`
                 );
 
                 const lowestAnnual4YReturnPercentage = 1 + lowestAnnual4YReturn;
@@ -1130,22 +1136,22 @@ export function init({
                 const bitcoinValueAfter4y = bitcoinValueReturn(4);
                 const serBitcoinValueAfter4y = c(
                   "purple",
-                  fd(bitcoinValueAfter4y),
+                  fd(bitcoinValueAfter4y)
                 );
                 const bitcoinValueAfter10y = bitcoinValueReturn(10);
                 const serBitcoinValueAfter10y = c(
                   "fuchsia",
-                  fd(bitcoinValueAfter10y),
+                  fd(bitcoinValueAfter10y)
                 );
                 const bitcoinValueAfter21y = bitcoinValueReturn(21);
                 const serBitcoinValueAfter21y = c(
                   "pink",
-                  fd(bitcoinValueAfter21y),
+                  fd(bitcoinValueAfter21y)
                 );
 
                 /** @param {number} v */
                 p4.innerHTML = `The lowest annual return after 4 years has historically been ${serLowestAnnual4YReturn}.<br/>Using it as the baseline, your Bitcoin would be worth ${serBitcoinValueAfter4y} after 4 years, ${serBitcoinValueAfter10y} after 10 years and ${serBitcoinValueAfter21y} after 21 years.`;
-              },
+              }
             );
 
             totalInvestedAmountData.set((a) => a);
@@ -1163,7 +1169,7 @@ export function init({
             daysCountData.set((a) => a);
             profitableDaysRatioData.set((a) => a);
             unprofitableDaysRatioData.set((a) => a);
-          },
+          }
         );
       });
     });