From 29725ef38b51ec23544ea68c8a99e910193f08e3 Mon Sep 17 00:00:00 2001
From: Maarten <maartenzam@gmail.com>
Date: Fri, 11 Oct 2024 09:16:06 +0200
Subject: [PATCH] Date formatting

---
 src/lib/components/Timeline.svelte | 6 +++++-
 src/routes/+page.svelte            | 4 ++--
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/lib/components/Timeline.svelte b/src/lib/components/Timeline.svelte
index 181d7f5..82a0b57 100644
--- a/src/lib/components/Timeline.svelte
+++ b/src/lib/components/Timeline.svelte
@@ -35,6 +35,10 @@
 		.domain([0, max(cases.map(d => d.attribution_total_score))])
 		.range([0.2, 1])
 	$: ticks = xScale.ticks(5);
+	$: timeRangeDays = (xScale.domain()[1] - xScale.domain()[0])/86400000
+	$: dateFormat = timeRangeDays > 100
+		? utcFormat('%b')
+		: utcFormat('%b %-d')
 
 	const actorNations = ['Other', 'China', 'Iran', 'North Korea', 'Russia'];
 	const colors = ['#555555', '#bf0a0a', '#0f8a0f', '#8a4d0f', '#0f4c8a'];
@@ -203,7 +207,7 @@
 						class="time-axis-tick-label"
 						x={xScale(tick)}
 						y={height/2 - marginsKeyEvents.bottom + 24}
-						text-anchor={'middle'}>{utcFormat('%b')(tick)}</text
+						text-anchor={'middle'}>{dateFormat(tick)}</text
 					>
 				{/each}
 				{#if xScale}
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index d1a590d..227ffbf 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -29,7 +29,8 @@
 		fullTimeRange
 	} from '../stores/filters';
 
-    //$: console.log($timeRangeFilter)
+    $: console.log($timeRangeFilter)
+    //$: console.log($fullTimeRange)
 
 	$: innerWidth = 0;
 	$: isMobile = innerWidth < 520;
@@ -46,7 +47,6 @@
 		);
 		cases = response;
 		cases = cases.filter((d) => d.attribution_id != '');
-        console.log(cases)
 		cases.forEach((d) => {
 			d.platform = splitString(d.platforms);
             d.medium = splitString(d.medium)