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 = '';
   8
   9   function formatShortOSMType(sType) {
  10     if (sType === 'node') return 'N';
  11     if (sType === 'way') return 'W';
  12     if (sType === 'relation') return 'R';
  13     return '';
  14   }
  15
  16   function handleClick() {
  17     window.history.pushState([], '', 'details.html' + url_params);
  18     refresh_page();
  19   }
  20
  21   $: {
  22     if (feature !== null && feature.osm_type) {
  23       let param = '?osmtype=';
  24       if (feature.osm_type.length == 1) {
  25         param += encodeURIComponent(feature.osm_type);
  26       } else {
  27         param += formatShortOSMType(feature.osm_type);
  28       }
  29       param += '&osmid=' + encodeURIComponent(feature.osm_id);
  30       if (feature.class) {
  31         param += '&class=' + encodeURIComponent(feature.class);
  32       } else if (feature.category) {
  33         param += '&class=' + encodeURIComponent(feature.category);
  34       }
  35       url_params = param
  36     } else {
  37         url_params = '';
  38     }
  39  }
  40 </script>
  41
  42 <a on:click|preventDefault|stopPropagation={handleClick} href="details.html{url_params}" class={extra_classes}><slot></slot></a>