2 files changed, 20 insertions, 0 deletions
diff --git a/src/pages/options/maps/maps.html b/src/pages/options/maps/maps.html
index 810cd36e..f571b4e8 100644
--- a/src/pages/options/maps/maps.html
+++ b/src/pages/options/maps/maps.html
@@ -89,10 +89,20 @@
   </section>
 
   <section class="option-block">
+
     <div class="some-block option-block">
       <h4>Enable</h4>
       <input id="disable-osm" type="checkbox" checked />
     </div>
+
+    <div class="some-block option-block">
+      <h4>Frontend</h4>
+      <select id="maps-frontend">
+        <option value="osm">OpenStreetMap</option>
+        <option value="facil">Facil Map</option>
+      </select>
+    </div>
+
   </section>
   <script type="module" src="../init.js"></script>
   <script type="module" src="./maps.js"></script>
diff --git a/src/pages/options/maps/maps.js b/src/pages/options/maps/maps.js
index 4372567b..400d5345 100644
--- a/src/pages/options/maps/maps.js
+++ b/src/pages/options/maps/maps.js
@@ -5,6 +5,16 @@ disableMapsElement.addEventListener("change",
     (event) => mapsHelper.setDisable(!event.target.checked)
 );
 
+let mapsFrontendElement = document.getElementById("maps-frontend");
+mapsFrontendElement.addEventListener("change",
+    event => {
+        let frontend = event.target.options[mapsFrontendElement.selectedIndex].value;
+        mapsHelper.setFrontend(frontend);
+    }
+);
+
 mapsHelper.init().then(() => {
     disableMapsElement.checked = !mapsHelper.getDisable();
+    let frontend = mapsHelper.getFrontend();
+    mapsFrontendElement.value = frontend;
 })
 \ No newline at end of file