initial page

assets/js/dateUtils.js

@@ -0,0 +1,40 @@
+function calculateDuration(startDate, endDate) {
+  const start = new Date(startDate);
+  const end = endDate ? new Date(endDate) : new Date();
+
+  const years = end.getFullYear() - start.getFullYear();
+  const months = end.getMonth() - start.getMonth();
+
+  let totalMonths = years * 12 + months;
+  if (end.getDate() < start.getDate()) {
+    totalMonths--;
+  }
+
+  const finalYears = Math.floor(totalMonths / 12);
+  const finalMonths = totalMonths % 12;
+
+  let duration = "";
+  if (finalYears > 0) {
+    duration += `${finalYears} year${finalYears > 1 ? "s" : ""}`;
+  }
+  if (finalMonths > 0) {
+    if (duration) duration += " ";
+    duration += `${finalMonths} month${finalMonths > 1 ? "s" : ""}`;
+  }
+  return duration;
+}
+
+function formatDateRange(startDate, endDate) {
+  const start = new Date(startDate);
+  const end = endDate ? new Date(endDate) : new Date();
+
+  const formatDate = (date) => {
+    return date.toLocaleDateString("en-US", {
+      month: "short",
+      year: "numeric",
+    });
+  };
+
+  const duration = calculateDuration(startDate, endDate);
+  return `${formatDate(start)} - ${endDate ? formatDate(end) : "Present"} · ${duration}`;
+}

assets/js/landing-page-animations.js

@@ -0,0 +1,23 @@
+const { animate, scroll } = Motion;
+
+const yearsExperience = document.getElementById("years-experience");
+const programmingLangues = document.getElementById("programming-languages");
+
+const startDate = new Date("2019-01-01");
+years = Math.floor((new Date() - startDate) / 1000 / 60 / 60 / 24 / 365);
+
+animate(0, years, {
+  duration: 2,
+  ease: "circOut",
+  onUpdate: (latest) => {
+    yearsExperience.innerHTML = Math.round(latest);
+  },
+});
+
+animate(0, 4, {
+  duration: 2,
+  ease: "circOut",
+  onUpdate: (latest) => {
+    programmingLangues.innerHTML = Math.round(latest);
+  },
+});