src/App.svelte

   1 <script>
   2   import 'bootstrap/dist/css/bootstrap.css';
   3   import 'bootstrap/dist/js/bootstrap.bundle.js';
   4
   5   import { onMount } from 'svelte';
   6   import { page, refresh_page } from './lib/stores.js';
   7
   8   import Footer from './components/Footer.svelte';
   9   import SearchPage from './pages/SearchPage.svelte';
  10   import ReversePage from './pages/ReversePage.svelte';
  11   import DetailsPage from './pages/DetailsPage.svelte';
  12   import PolygonsPage from './pages/PolygonsPage.svelte';
  13   import DeletablePage from './pages/DeletablePage.svelte';
  14   import StatusPage from './pages/StatusPage.svelte';
  15   import AboutPage from './pages/AboutPage.svelte';
  16
  17   let view = $state();
  18
  19   onMount(() => {
  20     page.subscribe((pageinfo) => {
  21       if (pageinfo.tab !== view) {
  22         view = pageinfo.tab;
  23       }
  24     })
  25   });
  26
  27   refresh_page();
  28 </script>
  29
  30 <!-- deal with back-button and other user action -->
  31 <svelte:window on:popstate={() => refresh_page()} />
  32
  33 {#if view === 'search'}
  34 <SearchPage />
  35 {:else if view === 'reverse'}
  36 <ReversePage />
  37 {:else if view === 'details'}
  38 <DetailsPage />
  39 {:else if view === 'deletable'}
  40 <DeletablePage />
  41 {:else if view === 'polygons'}
  42 <PolygonsPage />
  43 {:else if view === 'status'}
  44 <StatusPage />
  45 {:else if view === 'about'}
  46 <AboutPage />
  47 {/if}
  48 <Footer/>