implement greenzone feature, step 1

snippets/map.html

@@ -5,6 +5,7 @@
  <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"
    integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA=="
    crossorigin=""></script>
+   <script type="text/javascript" src="/static/js/Map.SelectArea.min.js"></script>
 {{end}}
 {{define "body_content"}}
 {{ if ne .UserName "" }}
@@ -18,6 +19,22 @@
 <script src="static/bulma-calendar/js/bulma-calendar.min.js"></script>
 <script src="static/js/map.js"></script>
 
+<div id="yesnomodal" class="modal">
+  <div class="modal-background"></div>
+  <div class="modal-card">
+    <header class="modal-card-head">
+      <p class="modal-card-title">Koordinaten als gr&uuml;ne Zone &uuml;bernehmen?</p>
+    </header>
+    <div class="modal-card-body">
+      <!-- Content ... -->
+    </div>
+    <footer class="modal-card-foot">
+      <button id="modal-yes" class="button is-success">Ja</button>
+      <button id="modal-no" class="button">Nein</button>
+    </footer>
+  </div>
+</div>
+
 <div class="columns is-mobile" id="myselectors">
   <div class="column is-narrow py-1">
     <div id="reportrange" class="datepicker" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc; width: 100%">