Data update

src/lib/components/CaseCard.svelte

@@ -6,21 +6,21 @@
 </script>
 
 <div class="card" transition:fade id={'case-' + cardData.attribution_id}>
-	<!--div class="card-header">
+	<div class="card-header">
 		<div class="card-header-title">
-			<h2 class="is-size-3">Don't cases have titles?</h2>
+			<h2 class="is-size-3">{cardData.Short_Title}</h2>
 		</div>
-	</div-->
+	</div>
 	<div class="card-image">
 		<figure class="image">
-			<img src={`/images/${cardData.attribution_id}.jpg`} alt={cardData.image_credit} />
+			<img src={`/images/${cardData.Attribution_ID}.png`} />
 		</figure>
 	</div>
 	<div class="card-content">
 		<div class="content">
-			<p>{utcFormat('%B %d, %Y')(cardData.attribution_date)}, {cardData.attribution_id}</p>
+			<p>{utcFormat('%B %d, %Y')(new Date(cardData.Attribution_Date))}</p>
-			<p><a href={cardData.attribution_url} target='_blank'>{cardData.source}</a></p>
+			<p><a href={cardData.Attribution_URL} target='_blank'>{cardData.source}</a></p>
-			<p>{cardData.short_description}</p>
+			<p>{cardData.Short_Description}</p>
 			<p>
 				<button class="button is-info is-small" on:click={sourceFilter.selectOne(cardData.source)}
 					>{cardData.source}</button

src/lib/components/CaseTable.svelte

@@ -7,6 +7,7 @@
 <table class="table is-striped is-fullwidth">
     <thead>
         <tr>
+            <td>Title</td>
             <td>Description</td>
             <td>Attribution date</td>
             <td>Source</td>
@@ -18,11 +19,14 @@
         {#each cases as attrCase}
         {#if attrCase.show}
             <tr>
-                <td>{attrCase.short_description}</td>
+                <td>{attrCase.Short_Title}</td>
-                <td>{utcFormat('%B %d, %Y')(attrCase.attribution_date)}</td>
+                <td>{attrCase.Short_Description}</td>
+                <td>{utcFormat('%B %d, %Y')(new Date(attrCase.Attribution_Date))}</td>
                 <td>{attrCase.source}</td>
-                <td>{attrCase.source_category}</td>
+                <td>{attrCase.Source_Category}</td>
-                <td>{attrCase.actor_nation}</td>
+                <td>{#each attrCase.actor_nation as nation, i}
+                    {attrCase.actor_nation.length != (i + 1) ? nation + ', ' : nation}
+                    {/each}</td>
             </tr>
             {/if}
         {/each}

src/lib/components/Controls.svelte

@@ -16,8 +16,6 @@
 	} from '../../stores/filters';
 
 	export let cases;
-	export let isMobile;
-	$: console.log(isMobile)
 
 	function handleButtonClick() {
 		selectAllFilters();

src/routes/+page.svelte

@@ -33,38 +33,41 @@
 		const response = await csv(`https://fiat-2024-processed-data.s3.us-west-2.amazonaws.com/Demo_Attribution_Data.csv`);
 		//const response = await csv(`${base}/Demo_Attribution_Data.csv`);
 		cases = response;
+        cases = cases.filter(d => d.Attribution_ID != '')
         cases.forEach(d => {
-            d.platform = splitString(d.platform)
+            d.platform = splitString(d.Platforms)
-            d.actor_nation = splitString(d.actor_nation)
+            d.actor_nation = splitString(d.Actor_Nation)
-            d.methods = splitString(d.methods)
+            d.source = splitString(d.Source)
+            d.methods = splitString(d.Methods)
             d.attribution_total_score = +d.attribution_total_score
-            d.attribution_date = new Date(d.attribution_date)
+            d.attribution_date = new Date(d.Attribution_Date)
-            d.search = [d.short_description, d.platform, d.methods, d.source, d.source_nation, d.source_category].flat().join('__').toLowerCase()
+            d.search = [d.Short_Description, d.Short_Title, d.platform, d.methods, d.Source, d.Source_Nation, d.Source_cCtegory].flat().join('__').toLowerCase()
 
             d.show = false
         })
+
         platformFilter.init(cases, 'platform');
         actorNationFilter.init(cases, 'actor_nation');
         sourceFilter.init(cases, 'source')
-        sourceCategoryFilter.init(cases, 'source_category')
+        sourceCategoryFilter.init(cases, 'Source_Category')
         methodFilter.init(cases, 'methods')
         $attributionScoreFilter = attributionScoreDef;
         
-        //console.log(cases.map(d => d.campaign))
 	});
 
     $: if (cases) {
         cases = cases.map(d => ({
             ...d,
-            show: haveOverlap($actorNationFilter, d.actor_nation) 
+            show: haveOverlap($actorNationFilter, d.Actor_Nation) 
                 && haveOverlap($platformFilter, d.platform)
                 && haveOverlap($sourceFilter, d.source)
-                && haveOverlap($sourceCategoryFilter, d.source_category)
+                && haveOverlap($sourceCategoryFilter, d.Source_Category)
                 && haveOverlap($methodFilter, d.methods)
                 && withinRange($attributionScoreFilter, d.attribution_total_score)
                 && includesTextSearch($textSearchFilter, d.search)
         }))
     }
+    $: console.log(cases)
 
     let width = 1200
     let margin = {