src/components/DetailsLink.svelte

   1 <script>
   2   import { refresh_page } from '../lib/stores.js';
   3
   4   export let extra_classes = '';
   5   export let feature = null;
   6
   7   let url_params = new URLSearchParams();
   8   let href = 'details.html';
   9
  10   function formatShortOSMType(sType) {
  11     if (sType === 'node') return 'N';
  12     if (sType === 'way') return 'W';
  13     if (sType === 'relation') return 'R';
  14     return '';
  15   }
  16
  17   function handleClick() {
  18     refresh_page('details', url_params);
  19   }
  20
  21   $: {
  22     let new_params = new URLSearchParams();
  23
  24     if (feature !== null) {
  25       if (feature.osm_type) {
  26         if (feature.osm_type.length === 1) {
  27           new_params.set('osmtype', feature.osm_type);
  28         } else {
  29           new_params.set('osmtype', formatShortOSMType(feature.osm_type));
  30         }
  31
  32         new_params.set('osmid', feature.osm_id);
  33
  34         if (feature.class) {
  35           new_params.set('class', feature.class);
  36         } else if (feature.category) {
  37           new_params.set('class', feature.category);
  38         }
  39       } else if (feature.place_id) {
  40         new_params.set('place_id', feature.place_id);
  41       }
  42     }
  43     url_params = new_params;
  44   }
  45
  46   $: {
  47     let param_str = url_params.toString();
  48     href = 'details.html' + (param_str ? '?' : '') + param_str;
  49   }
  50 </script>
  51
  52 <a on:click|preventDefault|stopPropagation={handleClick} href={href} class={extra_classes}><slot></slot></a>