Get caching working

Author: fallaciousreasoning

src/components/MapFeatures.svelte

@@ -58,6 +58,8 @@
   const toggleAllFeatures = (visible: boolean) => {
     if (!visible) $fragment.featureLayers = []
     else $fragment.featureLayers = featureLayers.map((l) => l.get('id'))
+
+    for (const feature of featureLayers) feature.setVisible(visible)
   }
 </script>
 

src/components/SettingsView.svelte

@@ -36,7 +36,7 @@
   <div>
     <h4 class="mt-2 font-semibold text-base">Layers</h4>
     <div class="flex flex-col gap-2 my-1">
-      {#each layerDefinitions.filter((l) => l.type === 'base') as layer}
+      {#each layerDefinitions as layer}
         <Card>
           <h5 class="font-semibold">{layer.name}</h5>
           <div class="text-gray-500 italic">{layer.description}</div>

src/layers/layerDefinitions.ts

@@ -4,10 +4,10 @@ import { pickRandom } from "../utils/random";
 import RenderEvent from "ol/render/Event";
 
 export interface BaseLayerDefinition {
-    id: string;
     name: string;
     description: string;
     defaultVisible?: boolean;
+    defaultCache?: boolean;
 }
 
 export type TileLayerDefinition = BaseLayerDefinition & {
@@ -25,7 +25,6 @@ export type LayerDefinition = BaseLayerDefinition
 
 export const linzTopo: TileLayerDefinition =
 {
-    id: 'linz-topo',
     name: "LINZ Topo",
     description: "The LINZ topographic map",
     type: "base",
@@ -38,21 +37,18 @@ export const linzTopo: TileLayerDefinition =
 export const layerDefinitions: TileLayerDefinition[] = [
     linzTopo,
     {
-        id: 'osm',
         name: "Open Street Maps",
         description: "Street maps provided by openstreetmaps",
         type: 'base',
         url: 'https://{a-c}.tile.openstreetmap.org/{z}/{x}/{y}.png'
     },
     {
-        id: 'open-topo-maps',
         name: "Open Topo Maps",
         description: "Topographic maps based on publicly available data",
         type: 'base',
         url: 'https://{a-c}.tile.opentopomap.org/{z}/{x}/{y}.png'
     },
     {
-        id: 'linz-arial',
         name: 'LINZ Aerial Imagery',
         description: "High resolution imagery of New Zealand, provided by LINZ",
         type: 'base',
@@ -61,7 +57,6 @@ export const layerDefinitions: TileLayerDefinition[] = [
         }
     },
     {
-        id: 'hillshade',
         name: "Hillshade",
         description: "Terrain relief overlay",
         type: 'overlay',

src/sources/cachingSource.ts

@@ -11,7 +11,7 @@ type CacheOptions = Omit<Options, "url"> & {
 
 const getShouldCache = async (layer: { name: string }) => {
     const store = await getCurrentSettings();
-    return store.layers?.[layer.name]?.cache ?? false;
+    return store.layers?.[layer.name]?.cache ?? true
 }
 
 export const getCacheId = (props: { name }, tile: TileCoord) => `${props.name}/${tile[2]}/${tile[0]}/${tile[1]}`;