From 49ba7be5ee5cee14116d36a9b38ec9a2e8125b0e Mon Sep 17 00:00:00 2001
From: Marlon Portmann <>
Date: Thu, 27 Oct 2022 12:35:35 +0200
Subject: [PATCH] marker anklicken zeigt infos aus datenbank in DOM an
---
css/style.css | 23 +++++++++++++++-
index.php | 15 +++++++++++
js/functions.js | 56 +++++++++++++++++++++++++++++++++++++++
loadMap.js | 16 +++++------
system/alleInfosHolen.php | 12 +++++++++
system/ideeSpeichern.php | 23 ++++++++++++++++
6 files changed, 135 insertions(+), 10 deletions(-)
create mode 100644 system/alleInfosHolen.php
create mode 100644 system/ideeSpeichern.php
diff --git a/css/style.css b/css/style.css
index 23e3ebc..ae556f3 100644
--- a/css/style.css
+++ b/css/style.css
@@ -1,12 +1,33 @@
h1 {
- color: blue;
+ color: black;
}
#map {
height: 100vh;
+ width: 80vh;
+ float: left;
}
#location {
height: 30px;
width: 30px;
}
+
+#formular-wrapper {
+ height: 50vh;
+ width: 50vh;
+ float: left;
+}
+
+
+#idee {
+ height: 50vh;
+ width: 50vh;
+ float: left;
+}
+
+
+.ideeBilder {
+ width: 80px;
+ height: 80px;
+}
diff --git a/index.php b/index.php
index de2e73d..1b52d64 100644
--- a/index.php
+++ b/index.php
@@ -17,6 +17,21 @@ dbVerbindungErzeugen()
spinn mit!!
+
+
+
+
+
diff --git a/js/functions.js b/js/functions.js
index e69de29..3dcc8c3 100644
--- a/js/functions.js
+++ b/js/functions.js
@@ -0,0 +1,56 @@
+
+
+/* ideeSpeichern();
+function ideeSpeichern(titel, inhalt) {
+
+let url = "system/ideeSpeichern.php";
+let formData = new FormData();
+formData.append('titel', titel);
+formData.append('inhalt', inhalt);
+fetch(url,
+ {
+ body: formData,
+ method: "post",
+ })
+ .then((response) => {
+ return response.json();
+ })
+ .then((markerData) => {
+
+
+
+
+ }
+ .catch(function(error) {
+ console.log("error: " + error.message);
+ });
+}
+
+*/
+
+function ideeAnzeigen(data) {
+ document.querySelectorAll('.loeschen').forEach(e => e.remove());
+ let titelErstellen = document.createElement("h1");
+ let titelInhalt = document.createTextNode(data.titel);
+ titelErstellen.appendChild(titelInhalt);
+ titelErstellen.classList.add("loeschen")
+ document.getElementById('idee').appendChild(titelErstellen);
+
+ let inhaltErstellen = document.createElement("p");
+ let inhaltInhalt = document.createTextNode(data.inhalt);
+ inhaltErstellen.appendChild(inhaltInhalt);
+ inhaltErstellen.classList.add("loeschen")
+ document.getElementById('idee').appendChild(inhaltErstellen);
+
+ let likesErstellen = document.createElement("p");
+ let likes = document.createTextNode(data.likes + " Likes");
+ likesErstellen.appendChild(likes);
+ likesErstellen.classList.add("loeschen")
+ document.getElementById('idee').appendChild(likesErstellen);
+
+ let bild = document.createElement("img");
+ bild.src = "https://upload.wikimedia.org/wikipedia/commons/f/f9/Phoenicopterus_ruber_in_S%C3%A3o_Paulo_Zoo.jpg";
+ bild.classList.add("ideeBilder")
+ bild.classList.add("loeschen")
+ document.getElementById('idee').appendChild(bild);
+}
diff --git a/loadMap.js b/loadMap.js
index 864923c..340afc4 100644
--- a/loadMap.js
+++ b/loadMap.js
@@ -15,6 +15,8 @@ function initMap() {
strictBounds: false,
},
zoom: 13,
+ disableDefaultUI: true,
+
});
infoWindow = new google.maps.InfoWindow();
addMarkers();
@@ -29,20 +31,14 @@ addMarkers();
-
-
-
-
function addMarkers(){
-
- let url = "system/alleMarkerHolen.php";
+ let url = "system/alleInfosHolen.php";
fetch(url)
.then((response) => {
return response.json();
})
.then((markerData) => {
- console.log("test");
for (let i = 0; i < markerData.length; i++) {
if (markerData[i].sichtbarkeit = 1) {
const marker = new google.maps.Marker({
@@ -56,8 +52,10 @@ function addMarkers(){
animation: google.maps.Animation.DROP,
});
+
+
marker.addListener("click", () => {
- console.log("hello this is idea number:" + markerData[i].titel);
+ ideeAnzeigen(markerData[i]);
})
}
else {
@@ -70,7 +68,7 @@ function addMarkers(){
})
.catch(function(error) {
- console.log('Error: ' + error.message);
+ console.log('Error!: ' + error.message);
});
}
diff --git a/system/alleInfosHolen.php b/system/alleInfosHolen.php
new file mode 100644
index 0000000..4fe1e45
--- /dev/null
+++ b/system/alleInfosHolen.php
@@ -0,0 +1,12 @@
+
+
+query($sql);
+ $resultatArray = $resultat ->fetchAll();
+ echo json_encode($resultatArray);
+ ?>
diff --git a/system/ideeSpeichern.php b/system/ideeSpeichern.php
new file mode 100644
index 0000000..af2cd13
--- /dev/null
+++ b/system/ideeSpeichern.php
@@ -0,0 +1,23 @@
+
+
+
+prepare($sql);
+$stmt->execute(array($titel, $inhalt));
+
+echo $db->lastInsertId();
+
+ ?>