resoved conflicts

css/style.css

@@ -48,6 +48,22 @@ h1 {
   height: 60px;
 }
 
+<<<<<<< HEAD
+p.commentText{
+  display: inline-block;
+  padding-right: 20px;
+}
+
+p.commentLikeNumber{
+  display: inline-block;
+  padding-right: 20px;
+}
+
+img.commentLike{
+  width: 15px;
+  display: inline-block;
+}
+=======
 .image-preview ._list {
   padding-top: 20px;
 }
@@ -67,3 +83,4 @@ h1 {
   height: 80px;
   padding: 0 10px 6px;
 }
+>>>>>>> 0e5f580c74883f876fdcee5c7870c58168ae8893

js/functions.js

@@ -28,16 +28,91 @@ fetch(url,
 
 */
 
-// submit kommentar nicht seite neu laden
+//LocalLike Objekt erstellen
+
+let localLikes = {}
+
+
 
 $(document).ready(function(){
+
+
+  // submit kommentar nicht seite neu laden
+
     $("#kommentarform").submit(function(e) {
         console.log("Submitted")
         e.preventDefault(); // avoid to execute the actual submit of the form.
     });
+
+
+
+
+  //LocalStorage erstellen oder auslesen
+
+  if(localStorage.getItem('localLikes')){
+    //likes auslesen
+
+    localLikes = JSON.parse(localStorage.getItem('localLikes'))
+
+    console.log("Stored local Likes:")
+    console.log(localLikes)
+
+  }else{
+
+    //LocalLikes leer
+
+    localLikes = {
+      ideen: [],
+      kommentare: []
+    }
+
+    console.log("New Local Likes created")
+    console.log(localLikes)
+
+    localStorage.setItem('localLikes',JSON.stringify(localLikes));
+
+  }
 })
 
-// idee laden
+
+
+//LocalStorage Anpassen (Likes hinzufügen oder entfernen)
+
+
+function chageLocalStorrage(typ, id, addRemove){
+
+  if(typ =="idee"){
+
+    if(addRemove == "add" && !localLikes.ideen.includes(id)){
+      localLikes.ideen.push(id);
+      console.log("like added");
+      console.log(localLikes);
+    }else if(addRemove == "remove" && localLikes.ideen.includes(id)){
+      let index = localLikes.ideen.indexOf(id);
+      localLikes.ideen.splice(index, 1);
+      console.log("like removed");
+      console.log(localLikes);
+    }
+
+  }else if(typ == "kommentar"){
+
+    if(addRemove == "add"){
+      localLikes.kommentare.push(id);
+    }else if(addRemove == "remove"){
+      let index = localLikes.kommentare.indexOf(id);
+      localLikes.kommentare.splice(index, 1);
+    }
+
+
+  }
+
+  localStorage.setItem('localLikes',JSON.stringify(localLikes));
+
+}
+
+
+
+// IDEE ANZEIGEN
 
 
 
@@ -60,7 +135,7 @@ function ideeAnzeigen(data) {
   let likesErstellen = document.createElement("p");
   let likes = document.createTextNode(data.likes + " Likes");
   likesErstellen.appendChild(likes);
-  likesErstellen.classList.add("loeschen");
+  likesErstellen.classList.add("likeDisplay");
   document.getElementById('idee').appendChild(likesErstellen);
 
   let bild = document.createElement("img");
@@ -71,20 +146,38 @@ function ideeAnzeigen(data) {
   console.log(data);
 
 
+  let ideeLike = document.createElement("img");
+  ideeLike.classList.add("herz");
 
 
-  let herz = document.createElement("img");
+  //check if user has liked Idea before,load proper image and set class
-  herz.src= "../images/herz-0.png";
-  herz.classList.add("herz");
-  herz.classList.add("loeschen");
-  document.getElementById('idee').appendChild(herz);
-  herz.addEventListener('click', function() {
-    herz.src= "../images/herz-1.png";
 
-    $.post('system/addLike.php/?id=' + data.id, {}).done(function(response){
+  if(localLikes.ideen.includes(data.id)){
-      $("#mypar").html(response.amount);
+    ideeLike.src= "../images/herz-1.png";
+    ideeLike.classList.add("liked");
+  }else{
+    ideeLike.src= "../images/herz-0.png";
+    ideeLike.classList.add("unliked");
+  }
 
-    });
+  document.getElementById('idee').appendChild(ideeLike);
+
+
+
+  ideeLike.addEventListener('click', function() {
+
+    if(localLikes.ideen.includes(data.id)){
+      ideeLike.src= "../images/herz-0.png";
+      ideeLike.classList.add("unliked");
+      ideeLike.classList.remove("liked");
+      removeLike("idee", data.id)
+    }else{
+
+      ideeLike.src= "../images/herz-1.png";
+      ideeLike.classList.add("liked");
+      ideeLike.classList.remove("unliked");
+      addLike("idee", data.id)
+    }
 
 
   });
@@ -103,6 +196,82 @@ function ideeAnzeigen(data) {
 };
 
 
+
+
+//Like Hinzufügen
+
+function addLike(typ, id, element){
+
+
+
+  if(typ == "idee"){
+
+      //increment likes in DB
+    $.post('system/addLike.php/?typ=idee&id=' + id, {}).done(function(response){
+
+
+        //neue Likes anzeigen
+
+        $("p.likeDisplay").html(response + " Likes")
+
+    });
+
+    //add like in LocalStorage
+    chageLocalStorrage("idee", id, "add")
+
+
+
+
+  }else if(typ == "kommentar"){
+    $.post('system/addLike.php/?typ=kommentar&id=' + id, {}).done(function(response){
+
+
+      element.prev().html(response + " Likes")
+
+
+    });
+
+  //add like in LocalStorage
+    chageLocalStorrage("kommentar", id, "add")
+  }
+
+}
+
+function removeLike(typ, id, element){
+
+  //decrement likes in DB
+
+  if(typ == "idee"){
+    $.post('system/removeLike.php/?typ=idee&id=' + id, {}).done(function(response){
+
+
+      $("p.likeDisplay").html(response + " Likes")
+
+
+    });
+
+    chageLocalStorrage("idee", id, "remove")
+
+  }else if(typ == "kommentar"){
+    $.post('system/removeLike.php/?typ=kommentar&id=' + id, {}).done(function(response){
+
+
+      element.prev().html(response + " Likes")
+
+
+    });
+
+    chageLocalStorrage("kommentar", id, "remove")
+
+  }
+
+
+}
+
+
+
+
+
 //  kommentar formular likesErstellen
 
 function kommentarErstellen(idee_id) {
@@ -111,7 +280,7 @@ function kommentarErstellen(idee_id) {
 
   let formular = document.createElement("form");
   formular.classList.add("formular");
-  formular.setAttribute("action", "https://751068-4.web.fhgr.ch/system/kommentarSpeichern.php");
+  formular.setAttribute("action", "../system/kommentarSpeichern.php");
   formular.setAttribute("method", "post");
   formular.setAttribute("id", "kommentarform");
   document.getElementById("idee").appendChild(formular);
@@ -143,7 +312,7 @@ function kommentarErstellen(idee_id) {
 
     $.ajax({
       type: "POST",
-      url: "https://751068-4.web.fhgr.ch/system/kommentarSpeichern.php",
+      url: "/system/kommentarSpeichern.php",
       data: form.serialize(),
     })
       e.preventDefault();
@@ -153,27 +322,6 @@ function kommentarErstellen(idee_id) {
   });
 };
 
-/* function installWidgetPreviewMultiple(widget, list) {
-  widget.onChange(function(fileGroup) {
-    list.empty()
-    if (fileGroup) {
-      $.when.apply(null, fileGroup.files()).done(function() {
-        $.each(arguments, function(i, fileInfo) {
-          var src = fileInfo.cdnUrl + '-/scale_crop/160x160/center/'
-
-          list.append($('<div/>', {class: '_item'}).append([$('<img/>', {src: src}), fileInfo.name]))
-        })
-      })
-    }
-  })
-}
-$(function() {
-  $('.image-preview').each(function() {
-    installWidgetPreviewMultiple(uploadcare.MultipleWidget($(this).children('input')), $(this).children('._list'))
-  })
-})
-
-*/
 
 
 // Idee formular erstellen
@@ -184,7 +332,7 @@ function formularErstellen(koordianten) {
 
   let formular = document.createElement("form");
   formular.classList.add("formular");
-  formular.setAttribute("action", "https://751068-4.web.fhgr.ch/system/ideeSpeichern.php");
+  formular.setAttribute("action", "../system/ideeSpeichern.php");
   formular.setAttribute("method", "post");
   formular.setAttribute("id", "form");
   document.getElementById("idee").appendChild(formular);
@@ -248,29 +396,87 @@ function formularErstellen(koordianten) {
 
 function kommentareAnzeigen(idee_id){
 
-  document.getElementById("kommentare_container").innerHTML = "";
 
-  let  url = "system/alleKommentareHolen.php/?id=" + idee_id;
+  $.post("./system/alleKommentareHolen.php/?id=" + idee_id, {}).done(function(comments){
-  fetch(url)
+
-    .then((response) => {
+    let k = document.createElement("h3");
-      return response.json();
+    let k_text = document.createTextNode("Kommentare:");
-    })
+    k.appendChild(k_text);
-    .then((data) => {
+    document.getElementById('kommentare_container').appendChild(k);
-        let k = document.createElement("h3");
+
-        let k_text = document.createTextNode("Kommentare:");
+
-        k.appendChild(k_text);
+    let commentArray = JSON.parse(comments);
-        k.classList.add("loeschen")
+
-        document.getElementById('kommentare_container').appendChild(k);
+
+    for (var i = 0; i < commentArray.length; i++) {
+
+
+      let thisComment = commentArray[i];
+
+
+      let kommentarContainer = $("<div>").addClass("comment");
+
+
+      let kommentarText = $("<p>").addClass("commentText");
+      kommentarText.text(thisComment.k_text);
+      kommentarText.appendTo(kommentarContainer);
+
+      let kommentarLikeNumber = $("<p>").text(thisComment.k_likes + " Likes").addClass("commentLikeNumber");
+      kommentarLikeNumber.appendTo(kommentarContainer);
+
+      let kommentarLikeButton = $("<img>").addClass("unliked commentLike")
+
+
+      if(localLikes.kommentare.includes(thisComment.k_id)){
+        kommentarLikeButton.attr("src", "../images/herz-1.png");
+        kommentarLikeButton.addClass("liked");
+      }else{
+        kommentarLikeButton.attr("src", "../images/herz-0.png");
+        kommentarLikeButton.addClass("unliked");
+      }
+
+      kommentarLikeButton.appendTo(kommentarContainer);
+
+      kommentarContainer.appendTo($("#kommentare_container"));
+
+
+
+
+      kommentarLikeButton.click( function() {
+
+        if(localLikes.kommentare.includes(thisComment.k_id)){
+          kommentarLikeButton.attr("src", "../images/herz-0.png");
+          kommentarLikeButton.addClass("unliked");
+          kommentarLikeButton.removeClass("liked");
+          removeLike("kommentar", thisComment.k_id, $(this))
+        }else{
+
+          kommentarLikeButton.attr("src", "../images/herz-1.png");
+          kommentarLikeButton.addClass("liked");
+          kommentarLikeButton.removeClass("unliked");
+          addLike("kommentar", thisComment.k_id, $(this))
 
-        for (var i = 0; i < data.length; i++) {
-          let kommentarErstellen = document.createElement("p");
-          let kommentar = document.createTextNode(data[i].k_text);
-          kommentarErstellen.appendChild(kommentar);
-          kommentarErstellen.classList.add("loeschen");
-          document.getElementById('kommentare_container').appendChild(kommentarErstellen);
         }
-    })
+
-    .catch(function(error) {
+
-      console.log('Error!: ' + error.message);
+      });
-    });
+
+
+
+
+      /*
+
+      let kommentarErstellen = document.createElement("p");
+      let kommentar = document.createTextNode(commentArray[i].k_text);
+      kommentarErstellen.appendChild(kommentar);
+      kommentarErstellen.classList.add("comment");
+      document.getElementById('kommentare_container').appendChild(kommentarErstellen);
+
+      */
+    }
+
+
+  });
+
+
   }

system/addLike.php

@@ -7,17 +7,39 @@ require_once('data.php');
   $db = dbVerbindungErzeugen();
 
   $id = $_GET["id"];
-  $sql = "SELECT likes FROM idee WHERE id = $id";
+  $typ = $_GET["typ"];
+
+  if ($typ == "idee") {
+    $sql = "SELECT likes FROM idee WHERE id = $id";
  	$resultat = $db->query($sql);
  	$likeCount = $resultat ->fetchColumn();
   $likeCount += 1;
 
 
-	echo ($likeCount);
+	
 
   $sql = "UPDATE idee SET likes=? WHERE id=?";
  $stmt = $db->prepare($sql);
  $stmt->execute(array($likeCount, $id));
 
+  } elseif ($typ == "kommentar"){
+
+    $sql = "SELECT k_likes FROM kommentar WHERE k_id = $id";
+    $resultat = $db->query($sql);
+    $likeCount = $resultat ->fetchColumn();
+   $likeCount += 1;
+ 
+ 
+
+ 
+   $sql = "UPDATE kommentar SET k_likes=? WHERE k_id=?";
+  $stmt = $db->prepare($sql);
+  $stmt->execute(array($likeCount, $id));
+
+  }
+
+  echo ($likeCount);
+  
+
 
 ?>

system/ideeSpeichern.php

@@ -23,7 +23,7 @@ $stmt->execute(array($titel, $inhalt, $lat, $lng));
 
 echo $db->lastInsertId();
 
-header("Location: https://751068-4.web.fhgr.ch/");
+header("Location: /");
 die();
 
   ?>

system/removeLike.php

@@ -0,0 +1,46 @@
+<?php
+require_once('data.php');
+?>
+
+<?php
+
+  $db = dbVerbindungErzeugen();
+
+  $id = $_GET["id"];
+  $typ = $_GET["typ"];
+
+  if ($typ == "idee") {
+    $sql = "SELECT likes FROM idee WHERE id = $id";
+ 	$resultat = $db->query($sql);
+ 	$likeCount = $resultat ->fetchColumn();
+  
+  if ($likeCount > 0){
+    $likeCount -= 1;
+  }
+
+
+	echo ($likeCount);
+
+  $sql = "UPDATE idee SET likes=? WHERE id=?";
+ $stmt = $db->prepare($sql);
+ $stmt->execute(array($likeCount, $id));
+
+  } elseif ($typ == "kommentar"){
+
+    $sql = "SELECT k_likes FROM kommentar WHERE k_id = $id";
+    $resultat = $db->query($sql);
+    $likeCount = $resultat ->fetchColumn();
+   $likeCount -= 1;
+ 
+ 
+   echo ($likeCount);
+ 
+   $sql = "UPDATE kommentar SET k_likes=? WHERE k_id=?";
+  $stmt = $db->prepare($sql);
+  $stmt->execute(array($likeCount, $id));
+
+  }
+  
+
+
+?>