From 6aab43a9bbec43974cbfa473726762b678eb5b96 Mon Sep 17 00:00:00 2001
From: jshjelse <jshjelse@stud.ntnu.no>
Date: Fri, 20 Oct 2023 22:24:29 +0200
Subject: [PATCH] =?UTF-8?q?Begynne=20s=C3=A5=20sm=C3=A5tt?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
index.html | 5 +++--
javascript/fileHandler.js | 28 ++++++++++++++++++++++++++++
javascript/openFileExplorer.js | 4 ++++
3 files changed, 35 insertions(+), 2 deletions(-)
create mode 100644 javascript/fileHandler.js
diff --git a/index.html b/index.html
index f6a4956..46f687c 100644
--- a/index.html
+++ b/index.html
@@ -60,9 +60,9 @@
</div>
<div style="margin-left: 10px; margin-top: 5px; margin-bottom: 5px;">
- <input type="file" accept=".zip" none="dialog" id="fileInput">
+ <input type="file" accept=".geojson" none="dialog" id="fileInput">
<div class="box3">
- <button class="onClick" onclick="clickMe()">Click here to choose a new layer</button>
+ <button id="loadButton" class="onClick" onclick="clickMe()">Click here to choose a new layer</button>
<svg onclick="handleFile()" style="cursor: pointer; margin-right: 2vw;" xmlns="http://www.w3.org/2000/svg"
width="6vh" height="6vh" fill="currentColor" class="bi bi-plus-circle-fill" viewBox="0 0 16 16">
@@ -281,6 +281,7 @@
<script src="javascript/leafletLayerControl.js"></script>
<script src="javascript/turfFormatConverter.js"></script>
<script src="javascript/tutorial.js"></script>
+ <script src="javascript/fileHandler.js"></script>
<!-- Map functions -->
diff --git a/javascript/fileHandler.js b/javascript/fileHandler.js
new file mode 100644
index 0000000..abe77ce
--- /dev/null
+++ b/javascript/fileHandler.js
@@ -0,0 +1,28 @@
+function handleFile() {
+
+ const fileHandler = document.getElementById('fileInput');
+ const selectedFile = fileHandler.files[0];
+
+ if (selectedFile == null) {
+ return alert("No chosen file!")
+ }
+
+ console.log(selectedFile);
+
+ var fr = new FileReader();
+ fileHandler.value = "";
+ document.getElementById("loadButton").style.backgroundColor = "orangered";
+
+ /*
+ fr.onload = function() {
+ var layer = omnivore.geojson(fr.result).addTo(map);
+ map.fitBounds(layer.getBounds())
+ }
+
+ fr.readAsDataURL(selectedFile);
+
+ console.log("Kanskje bra...")
+ */
+
+ //console.log(data)
+}
diff --git a/javascript/openFileExplorer.js b/javascript/openFileExplorer.js
index 3bdee1a..5c2a4bc 100644
--- a/javascript/openFileExplorer.js
+++ b/javascript/openFileExplorer.js
@@ -3,3 +3,7 @@ const dialog = document.getElementById("fileInput"); // Input-feltet vi har skju
function clickMe() {
dialog.click();
}
+
+dialog.addEventListener('change', () => {
+ document.getElementById("loadButton").style.backgroundColor = "green";
+})
--
GitLab