aed-mapa/index.html

224 wiersze
13 KiB
HTML

<!DOCTYPE html>
<html lang="pl">
<head>
<title>AED - mapa defibrylatorów</title>
<meta charset="utf-8" />
<meta name="title" content="AED - mapa defibrylatorów">
<meta name="description" content="Mapa defibrylatorów AED w Polsce oparta o otwarte dane z projektu OpenStreetMap">
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
<link rel="canonical" href="https://aed.openstreetmap.org.pl" />
<link rel="apple-touch-icon" sizes="180x180" href="src/favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="./src/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="./src/favicon/favicon-16x16.png">
<link rel="manifest" href="site.webmanifest">
<link rel="mask-icon" href="./src/favicon/safari-pinned-tab.svg" color="#5bbad5">
<link rel="shortcut icon" href="./src/favicon/favicon.ico">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="msapplication-config" content="./src/favicon/browserconfig.xml">
<meta name="theme-color" content="#f5f5f5">
<meta property="og:type" content="website">
<meta property="og:url" content="https://aed.openstreetmap.org.pl">
<meta property="og:title" content="AED - mapa defibrylatorów">
<meta property="og:description" content="Mapa defibrylatorów AED w Polsce oparta o otwarte dane z projektu OpenStreetMap">
<meta property="og:image" content="https://aed.openstreetmap.org.pl/src/img/meta-image.png">
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://aed.openstreetmap.org.pl">
<meta property="twitter:title" content="AED - mapa defibrylatorów">
<meta property="twitter:description" content="Mapa defibrylatorów AED w Polsce oparta o otwarte dane z projektu OpenStreetMap">
<meta property="twitter:image" content="https://aed.openstreetmap.org.pl/src/img/meta-image.png">
<script src='./src/osmauth.min.js'></script>
<script src="https://unpkg.com/maplibre-gl@1.15.2/dist/maplibre-gl.js"></script>
<script src="https://openingh.openstreetmap.de/opening_hours.js/opening_hours+deps.min.js" defer></script>
<link href="https://unpkg.com/maplibre-gl@1.15.2/dist/maplibre-gl.css" rel="stylesheet" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma-checkradio@2.1.2/dist/css/bulma-checkradio.min.css" />
<link rel="stylesheet" href="./src/css/main.css" />
</head>
<body>
<nav class="navbar is-success p-1" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="has-text-weight-light navbar-item has-text-white-ter is-size-4 is-size-5-mobile pr-1 pl-2" href="#">
Mapa <span class="has-text-weight-semibold pl-1">AED</span>
</a>
<div class="navbar-item is-hidden-touch">
<span class="has-text-grey-light has-text-weight-light mr-3">|</span>
<span class="has-text-weight-light is-size-6 is-size-7-touch pl-0">
tworzona z ❤️ przez <a class="has-text-weight-medium" href="https://openstreetmap.org.pl/" target="_blank" title="Odwiedź stronę polskiej społeczności OSM" rel="noopener" style="color:#effaf5;">OpenStreetMap Polska</a>
</span>
</div>
<div class="navbar-item is-hidden-desktop osm-caption-mobile">
<span class="has-text-grey-light has-text-weight-light mr-3 is-size-4">|</span>
<span class="has-text-weight-light is-size-6 is-size-7-touch pl-0">
tworzona z ❤️ przez <a class="has-text-weight-medium" href="https://openstreetmap.org.pl/" target="_blank" title="Odwiedź stronę polskiej społeczności OSM" rel="noopener" style="color:#effaf5;">OpenStreetMap Polska</a>
</span>
</div>
<a role="button" class="navbar-burger has-text-white-ter is-transparent" data-target="navMenu" aria-label="menu" aria-expanded="false">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="navMenu" class="navbar-menu">
<div class="navbar-end">
<div class="navbar-item">
<svg class="icon" style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="#ffc83d" d="M11 15H6L13 1V9H18L11 23V15Z" />
</svg>
<span class="has-text-white has-text-weight-light ">dodaliśmy już&nbsp;</span>
<span class="has-text-white-ter has-text-weight-semibold" id="aed-number">
<button class="button is-success has-background-green is-loading is-small"></button>
</span>
<span class="has-text-white has-text-weight-light ml-1">AED</span>
</div>
<div class="navbar-item px-1">
<a href="https://wiki.openstreetmap.org/wiki/Pl:Przewodnik_dla_pocz%C4%85tkuj%C4%85cych"
class="button is-success has-text-weight-light is-outlined" target="_blank" rel="noopener">Przewodnik OSM</a>
</div>
<div class="navbar-item" id="span-login"></div>
<div id="navbar-logged" class="navbar-item has-dropdown is-hoverable">
<a id="navbar-username" class="navbar-link has-text-white-ter has-text-weight-light is-arrowless">
</a>
<div class="navbar-dropdown has-background-green">
<a class="navbar-item" id="logout">
<svg class="icon mr-1" style="width:24px;height:24px" viewBox="0 0 24 24">
<path fill="currentColor" d="M16,17V14H9V10H16V7L21,12L16,17M14,2A2,2 0 0,1 16,4V6H14V4H5V20H14V18H16V20A2,2 0 0,1 14,22H5A2,2 0 0,1 3,20V4A2,2 0 0,1 5,2H14Z" />
</svg> Wyloguj
</a>
</div>
</div>
<hr class="navbar-divider">
<div class="navbar-item px-1">
<a href="mailto:aed@openstreetmap.pl" class="button is-success has-text-weight-light is-outlined px-4">Kontakt</a>
</div>
<div class="navbar-item pb-0">
<a href="https://github.com/openstreetmap-polska/aed-mapa" target="_blank" rel="noopener">
<img title="Odwiedź nasz Github" class="github" src="./src/img/github-image.png" alt="Github" width="24" height="24"></a>
</div>
</div>
</div>
</nav>
<div id="sidebar-div" class="sidebar is-invisible">
<div class="card">
<div id="sidebar-header">
<div class="columns is-vcentered is-flex mr-0">
<div class="column is-one-quarter is-one-fifth-mobile ">
<img class="image" src="./src/img/card-image.png" alt="Placeholder image" id="sidebar-card-image">
</div>
<div class="column">
<p id="sidebar-caption" class="title has-text-white-ter has-text-weight-light"></p>
</div>
<button id="sidebar-button-close-touch" aria-label="Zamknij ekran boczny"
class="delete is-medium is-hidden-touch is-pulled-right close-button mr-2 mt-4"></button>
<button id="sidebar-button-close-desktop" aria-label="Zamknij ekran boczny"
class="delete is-large is-hidden-desktop is-pulled-right close-button mr-2 mt-4"></button>
</div>
</div>
<div class="card-content pt-3 pb-3">
<div id="sidebar-content-div" class="content"></div>
</div>
<footer class="card-footer">
<div class="has-background-success-light card-footer-item is-block has-text-centered is-size-7 has-text-weight-semibold p-1" id="sidebar-footer-button-left">
<a href="" target="_blank" rel="noopener"
class="has-background-success-light card-footer-item has-text-centered is-size-7 has-text-weight-semibold"></a>
</div>
</footer>
</div>
</div>
<div id="modal-div" class="modal">
<div class="modal-background"></div>
<div class="modal-card">
<header class="modal-card-head is-radiusless has-background-grey">
<svg class="icon mt-1 mr-2 has-text-white-ter" style="width:28px;height:28px" viewBox="0 0 24 24">
<path fill="currentColor" d="M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M11,17H13V11H11V17Z" />
</svg>
<p class="modal-card-title has-text-white-ter has-text-weight-light">
Komunikat
</p>
<button class="delete is-large" aria-label="close" onclick="closeModal()"></button>
</header>
<section id="modal-content" class="modal-card-body has-text-weight-light">
</section>
</div>
<button class="modal-close is-large" aria-label="close" onclick="closeModal()"></button>
</div>
<div id="map"></div>
<footer>
<div class="footer-partners is-white">
<div class="columns is-vcentered is-mobile is-gapless">
<div class="column is-narrow ml-2">
<span class="span-partners is-family-secondary has-text-grey-dark has-text-weight-medium is-size-6 is-size-7-mobile ml-3" >Partner:</span></div>
<div class="column is-narrow ml-1 ml-4 mt-1"><a target="_blank" title="Główny Urząd Geodezji i Kartografii" rel="noopener" href="http://www.gugik.gov.pl/">
<img class="image-gugik" src="./src/img/logo-gugik.png" /></a>
</div>
<div class="column">
<div class="attrib is-size-7 has-text-weight-light">
<span id="refresh-time" class="is-hidden-mobile pr-1">Ostatnia aktualizacja danych OSM:
<span class="has-text-grey-dark"></span>
</span>
<span class="osm-attribution">dane © <a target="_top" rel="noopener" href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors.</span>
</div>
</div>
</div>
</div>
</footer>
<button id="addNode" class="button is-success is-large is-hidden-touch has-text-weight-light"
style="bottom: 8px;left: 16px; position: fixed; bottom: 75px; right: 40px;">
<svg class="icon mr-2" viewBox="0 0 24 24">
<path fill="currentColor" d="M15 17H18V14H20V17H23V19H20V22H18V19H15V17M9 6.5C10.4 6.5 11.5 7.6 11.5 9S10.4 11.5 9 11.5 6.5 10.4 6.5 9 7.6 6.5 9 6.5M9 2C12.9 2 16 5.1 16 9C16 14.2 9 22 9 22S2 14.2 2 9C2 5.1 5.1 2 9 2M9 4C6.2 4 4 6.2 4 9C4 10 4 12 9 18.7C14 12 14 10 14 9C14 6.2 11.8 4 9 4Z" />
</svg>
Dodaj&nbsp;<span class="has-text-weight-semibold">AED</span>
</button>
<button id="addNode-mobile-1"
class="button is-floating is-medium is-success is-hidden-desktop add-button"
aria-label="Dodaj AED" style="bottom: 8px;left: 16px;">
<svg class="icon" viewBox="0 0 24 24">
<path fill="currentColor" d="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z" />
</svg>
</button>
<button id="addNode-mobile-2"
class="button is-floating is-medium is-success is-hidden-desktop is-hidden add-button"
aria-label="Dalej" style="bottom: 8px;left: 16px;">
<svg class="icon" viewBox="0 0 24 24">
<path fill="currentColor" d="M4,11V13H16L10.5,18.5L11.92,19.92L19.84,12L11.92,4.08L10.5,5.5L16,11H4Z" />
</svg>
</button>
<button id="addNode-mobile-3" class="button is-floating is-medium is-danger is-hidden-desktop is-hidden add-button"
style="bottom: 8px;left: 156px;" aria-label="Anuluj">
<svg class="icon" viewBox="0 0 24 24">
<path fill="currentColor" d="M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z" />
</svg>
</button>
<script>
if ('serviceWorker' in navigator){
window.addEventListener('load', () =>{
navigator.serviceWorker.register('serviceWorker.js')
.then(reg => {
console.log('SW registred', reg);
}).catch(err => {
console.log('SW registration faild!', err);
});
});
}
</script>
<script src="./src/other-ui-stuff.js"></script>
<script src="./src/map.js"></script>
<script src="./src/osm-integration.js"></script>
<!-- Cloudflare Web Analytics -->
<script defer src='https://static.cloudflareinsights.com/beacon.min.js'
data-cf-beacon='{"token": "117bf6ce871a40ac9bf5a7330f8538eb"}'></script>
<!-- End Cloudflare Web Analytics -->
</body>
</html>