From 579fca3c197f8b3f2fcbb3dc05b2b7b666815e9c Mon Sep 17 00:00:00 2001
From: 0d0acre <0d0acre@esiliati.org>
Date: Sat, 21 Sep 2024 01:11:50 +0200
Subject: [PATCH] Format and fix date

---
 public/index.html            |  8 +++--
 public/js/dayjs/dayjs.min.js |  1 +
 public/js/map.js             | 39 +++++++++++-----------
 public/js/mapInit.js         |  3 +-
 public/js/markerHandler.js   | 65 ++++++++++++++++++++++--------------
 server/dbHandler.js          | 13 ++++----
 6 files changed, 74 insertions(+), 55 deletions(-)
 create mode 100644 public/js/dayjs/dayjs.min.js

diff --git a/public/index.html b/public/index.html
index 733fa61..8f9b1f4 100644
--- a/public/index.html
+++ b/public/index.html
@@ -98,6 +98,7 @@
       setTimeout(closePopup, 13000);
 
       window.addEventListener('load', () => {
+        /*
         // Add a click event listener to the button
         const gpsButton = document.getElementById("gps-button");
         gpsButton.addEventListener("click", function () {
@@ -107,9 +108,12 @@
             lc.start();
           }
         });
+        */
       });
     </script>
-    <script src="./js/dist/L.Control.Locate.min.js"></script>
-    <script type="module" type="text/javascript" src="/js/map.js"></script>
+
+    <script defer src="./js/dayjs/dayjs.min.js"></script>
+    <script defer src="./js/dist/L.Control.Locate.min.js"></script>
+    <script defer type="module" type="text/javascript" src="/js/map.js"></script>
   </body>
 </html>
diff --git a/public/js/dayjs/dayjs.min.js b/public/js/dayjs/dayjs.min.js
new file mode 100644
index 0000000..61916d8
--- /dev/null
+++ b/public/js/dayjs/dayjs.min.js
@@ -0,0 +1 @@
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).dayjs=e()}(this,(function(){"use strict";var t=1e3,e=6e4,n=36e5,r="millisecond",i="second",s="minute",u="hour",a="day",o="week",c="month",f="quarter",h="year",d="date",l="Invalid Date",$=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,y=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,M={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_"),ordinal:function(t){var e=["th","st","nd","rd"],n=t%100;return"["+t+(e[(n-20)%10]||e[n]||e[0])+"]"}},m=function(t,e,n){var r=String(t);return!r||r.length>=e?t:""+Array(e+1-r.length).join(n)+t},v={s:m,z:function(t){var e=-t.utcOffset(),n=Math.abs(e),r=Math.floor(n/60),i=n%60;return(e<=0?"+":"-")+m(r,2,"0")+":"+m(i,2,"0")},m:function t(e,n){if(e.date()<n.date())return-t(n,e);var r=12*(n.year()-e.year())+(n.month()-e.month()),i=e.clone().add(r,c),s=n-i<0,u=e.clone().add(r+(s?-1:1),c);return+(-(r+(n-i)/(s?i-u:u-i))||0)},a:function(t){return t<0?Math.ceil(t)||0:Math.floor(t)},p:function(t){return{M:c,y:h,w:o,d:a,D:d,h:u,m:s,s:i,ms:r,Q:f}[t]||String(t||"").toLowerCase().replace(/s$/,"")},u:function(t){return void 0===t}},g="en",D={};D[g]=M;var p="$isDayjsObject",S=function(t){return t instanceof _||!(!t||!t[p])},w=function t(e,n,r){var i;if(!e)return g;if("string"==typeof e){var s=e.toLowerCase();D[s]&&(i=s),n&&(D[s]=n,i=s);var u=e.split("-");if(!i&&u.length>1)return t(u[0])}else{var a=e.name;D[a]=e,i=a}return!r&&i&&(g=i),i||!r&&g},O=function(t,e){if(S(t))return t.clone();var n="object"==typeof e?e:{};return n.date=t,n.args=arguments,new _(n)},b=v;b.l=w,b.i=S,b.w=function(t,e){return O(t,{locale:e.$L,utc:e.$u,x:e.$x,$offset:e.$offset})};var _=function(){function M(t){this.$L=w(t.locale,null,!0),this.parse(t),this.$x=this.$x||t.x||{},this[p]=!0}var m=M.prototype;return m.parse=function(t){this.$d=function(t){var e=t.date,n=t.utc;if(null===e)return new Date(NaN);if(b.u(e))return new Date;if(e instanceof Date)return new Date(e);if("string"==typeof e&&!/Z$/i.test(e)){var r=e.match($);if(r){var i=r[2]-1||0,s=(r[7]||"0").substring(0,3);return n?new Date(Date.UTC(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)):new Date(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)}}return new Date(e)}(t),this.init()},m.init=function(){var t=this.$d;this.$y=t.getFullYear(),this.$M=t.getMonth(),this.$D=t.getDate(),this.$W=t.getDay(),this.$H=t.getHours(),this.$m=t.getMinutes(),this.$s=t.getSeconds(),this.$ms=t.getMilliseconds()},m.$utils=function(){return b},m.isValid=function(){return!(this.$d.toString()===l)},m.isSame=function(t,e){var n=O(t);return this.startOf(e)<=n&&n<=this.endOf(e)},m.isAfter=function(t,e){return O(t)<this.startOf(e)},m.isBefore=function(t,e){return this.endOf(e)<O(t)},m.$g=function(t,e,n){return b.u(t)?this[e]:this.set(n,t)},m.unix=function(){return Math.floor(this.valueOf()/1e3)},m.valueOf=function(){return this.$d.getTime()},m.startOf=function(t,e){var n=this,r=!!b.u(e)||e,f=b.p(t),l=function(t,e){var i=b.w(n.$u?Date.UTC(n.$y,e,t):new Date(n.$y,e,t),n);return r?i:i.endOf(a)},$=function(t,e){return b.w(n.toDate()[t].apply(n.toDate("s"),(r?[0,0,0,0]:[23,59,59,999]).slice(e)),n)},y=this.$W,M=this.$M,m=this.$D,v="set"+(this.$u?"UTC":"");switch(f){case h:return r?l(1,0):l(31,11);case c:return r?l(1,M):l(0,M+1);case o:var g=this.$locale().weekStart||0,D=(y<g?y+7:y)-g;return l(r?m-D:m+(6-D),M);case a:case d:return $(v+"Hours",0);case u:return $(v+"Minutes",1);case s:return $(v+"Seconds",2);case i:return $(v+"Milliseconds",3);default:return this.clone()}},m.endOf=function(t){return this.startOf(t,!1)},m.$set=function(t,e){var n,o=b.p(t),f="set"+(this.$u?"UTC":""),l=(n={},n[a]=f+"Date",n[d]=f+"Date",n[c]=f+"Month",n[h]=f+"FullYear",n[u]=f+"Hours",n[s]=f+"Minutes",n[i]=f+"Seconds",n[r]=f+"Milliseconds",n)[o],$=o===a?this.$D+(e-this.$W):e;if(o===c||o===h){var y=this.clone().set(d,1);y.$d[l]($),y.init(),this.$d=y.set(d,Math.min(this.$D,y.daysInMonth())).$d}else l&&this.$d[l]($);return this.init(),this},m.set=function(t,e){return this.clone().$set(t,e)},m.get=function(t){return this[b.p(t)]()},m.add=function(r,f){var d,l=this;r=Number(r);var $=b.p(f),y=function(t){var e=O(l);return b.w(e.date(e.date()+Math.round(t*r)),l)};if($===c)return this.set(c,this.$M+r);if($===h)return this.set(h,this.$y+r);if($===a)return y(1);if($===o)return y(7);var M=(d={},d[s]=e,d[u]=n,d[i]=t,d)[$]||1,m=this.$d.getTime()+r*M;return b.w(m,this)},m.subtract=function(t,e){return this.add(-1*t,e)},m.format=function(t){var e=this,n=this.$locale();if(!this.isValid())return n.invalidDate||l;var r=t||"YYYY-MM-DDTHH:mm:ssZ",i=b.z(this),s=this.$H,u=this.$m,a=this.$M,o=n.weekdays,c=n.months,f=n.meridiem,h=function(t,n,i,s){return t&&(t[n]||t(e,r))||i[n].slice(0,s)},d=function(t){return b.s(s%12||12,t,"0")},$=f||function(t,e,n){var r=t<12?"AM":"PM";return n?r.toLowerCase():r};return r.replace(y,(function(t,r){return r||function(t){switch(t){case"YY":return String(e.$y).slice(-2);case"YYYY":return b.s(e.$y,4,"0");case"M":return a+1;case"MM":return b.s(a+1,2,"0");case"MMM":return h(n.monthsShort,a,c,3);case"MMMM":return h(c,a);case"D":return e.$D;case"DD":return b.s(e.$D,2,"0");case"d":return String(e.$W);case"dd":return h(n.weekdaysMin,e.$W,o,2);case"ddd":return h(n.weekdaysShort,e.$W,o,3);case"dddd":return o[e.$W];case"H":return String(s);case"HH":return b.s(s,2,"0");case"h":return d(1);case"hh":return d(2);case"a":return $(s,u,!0);case"A":return $(s,u,!1);case"m":return String(u);case"mm":return b.s(u,2,"0");case"s":return String(e.$s);case"ss":return b.s(e.$s,2,"0");case"SSS":return b.s(e.$ms,3,"0");case"Z":return i}return null}(t)||i.replace(":","")}))},m.utcOffset=function(){return 15*-Math.round(this.$d.getTimezoneOffset()/15)},m.diff=function(r,d,l){var $,y=this,M=b.p(d),m=O(r),v=(m.utcOffset()-this.utcOffset())*e,g=this-m,D=function(){return b.m(y,m)};switch(M){case h:$=D()/12;break;case c:$=D();break;case f:$=D()/3;break;case o:$=(g-v)/6048e5;break;case a:$=(g-v)/864e5;break;case u:$=g/n;break;case s:$=g/e;break;case i:$=g/t;break;default:$=g}return l?$:b.a($)},m.daysInMonth=function(){return this.endOf(c).$D},m.$locale=function(){return D[this.$L]},m.locale=function(t,e){if(!t)return this.$L;var n=this.clone(),r=w(t,e,!0);return r&&(n.$L=r),n},m.clone=function(){return b.w(this.$d,this)},m.toDate=function(){return new Date(this.valueOf())},m.toJSON=function(){return this.isValid()?this.toISOString():null},m.toISOString=function(){return this.$d.toISOString()},m.toString=function(){return this.$d.toUTCString()},M}(),k=_.prototype;return O.prototype=k,[["$ms",r],["$s",i],["$m",s],["$H",u],["$W",a],["$M",c],["$y",h],["$D",d]].forEach((function(t){k[t[1]]=function(e){return this.$g(e,t[0],t[1])}})),O.extend=function(t,e){return t.$i||(t(e,_,O),t.$i=!0),O},O.locale=w,O.isDayjs=S,O.unix=function(t){return O(1e3*t)},O.en=D[g],O.Ls=D,O.p={},O}));
\ No newline at end of file
diff --git a/public/js/map.js b/public/js/map.js
index ae24bcb..e17f7f1 100644
--- a/public/js/map.js
+++ b/public/js/map.js
@@ -3,21 +3,15 @@ import { initEvents } from "./eventHandler.js";
 import { mapInit } from "./mapInit.js";
 
 let editMode = false;
+const lastUpdateCheck = new Date().getTime();
 
-let map = mapInit();
-let lastUpdateCheck = new Date().getTime();
-
-// initMarkers(markerPopupExample, L, map);
+const map = mapInit();
+    
 initEvents(map);
 
-await fetchAllMarkers();
-
-setInterval(fetchNewMarkers, 5000);
 
 async function fetchAllMarkers() {
-  let response = await fetch("/fetchMarkers", {
-    method: "GET",
-  });
+  const response = await fetch("/fetchMarkers");
 
   let markers = await response.json();
   console.log(markers);
@@ -26,16 +20,13 @@ async function fetchAllMarkers() {
   });
 }
 
-export async function fetchNewMarkers() {
-  let response = await fetch(
-    "/updateMarkers?" + new URLSearchParams({ fromDate: lastUpdateCheck }),
-    {
-      method: "GET",
-    }
-  );
 
-  let markers = await response.json();
-  console.log(markers);
+export async function fetchNewMarkers() {
+  const searchParams = new URLSearchParams({ fromDate: lastUpdateCheck });
+
+  const response = await fetch(`/updateMarkers?${searchParams.toString()}`);
+
+  const markers = await response.json();
 
   markers.forEach((marker) => {
     createMarker(marker, L, map);
@@ -43,3 +34,13 @@ export async function fetchNewMarkers() {
 
   lastUpdateCheck = new Date().getTime();
 }
+
+const main = async () => {
+    await fetchAllMarkers();
+    
+    setInterval(fetchNewMarkers, 5000);   
+}
+
+main().then(() => {
+    console.log("Completed")
+}).catch(console.error)
\ No newline at end of file
diff --git a/public/js/mapInit.js b/public/js/mapInit.js
index 94c39cf..cbcfb75 100644
--- a/public/js/mapInit.js
+++ b/public/js/mapInit.js
@@ -4,8 +4,7 @@
 
 export function mapInit() {
   const coordsPiazzaMaggiore = [44.49385, 11.34316];
-
-  var map = L.map("map").setView(coordsPiazzaMaggiore, 13);
+  const map = L.map("map").setView(coordsPiazzaMaggiore, 13);
 
   L.tileLayer("https://tile.openstreetmap.org/{z}/{x}/{y}.png", {
     maxZoom: 19,
diff --git a/public/js/markerHandler.js b/public/js/markerHandler.js
index 26e9256..74a9491 100644
--- a/public/js/markerHandler.js
+++ b/public/js/markerHandler.js
@@ -1,17 +1,28 @@
+const formatDate = (date) => {
+  const day = date.getDate();
+  const month = date.getMonth() + 1;
+  const year = date.getFullYear();
+
+  return `${day}/${month}/${year}`;
+};
+const formatTime = (date) => {
+  return date.toTimeString().split(" ")[0];
+};
+
 export function initMarkers(markerList, L, map) {
   markerList.forEach((customMarker) => {
-    var marker = L.marker([customMarker.x, customMarker.y]).addTo(map);
-    let popUpContentTitle = "<h1>" + customMarker.title + "</h1>";
-    let popUpContentdescription = "<p>" + customMarker.description + "</p>";
-    let popUpContentImage =
+    const marker = L.marker([customMarker.x, customMarker.y]).addTo(map);
+    const popUpContentTitle = "<h1>" + customMarker.title + "</h1>";
+    const popUpContentdescription = "<p>" + customMarker.description + "</p>";
+    const popUpContentImage =
       "<img src='/img/" + customMarker.imgName + "'</img>";
-    let popUpContentDate =
+    const popUpContentDate =
       "<br><p>Inserito il: " +
       markerData.ts.substring(0, 10) +
       "<br>alle " +
       markerData.ts.substring(11, 16) +
       "</p>";
-    let popUpContent =
+    const popUpContent =
       popUpContentTitle +
       popUpContentdescription +
       popUpContentImage +
@@ -21,21 +32,22 @@ export function initMarkers(markerList, L, map) {
 }
 
 export function createMarker(markerData, L, map, returnMarker = false) {
-  var marker = L.marker([
+  const marker = L.marker([
     markerData.coordinate.y,
     markerData.coordinate.x,
   ]).addTo(map);
-  let popUpContentTitle = "<h1>" + markerData.name + "</h1>";
-  let popUpContentdescription = "<p>" + markerData.description + "</p>";
-  let popUpContentImage = "<img src='/imgs/" + markerData.filename + "'</img>";
-  let popUpContentDate =
-    "<br><p>Inserito il: " +
-    markerData.ts.substring(0, 10) +
-    "<br>alle: " +
-    markerData.ts.substring(11, 16) +
-    "</p>";
-  //let popUpContentHour = "<p>" + "alle: " + markerData.ts.substring(11, 16) + "</p>";
-  let popUpContent =
+  const date = new Date(markerData.ts);
+
+  const popUpContentTitle = "<h1>" + markerData.name + "</h1>";
+  const popUpContentdescription = "<p>" + markerData.description + "</p>";
+  const popUpContentImage =
+    "<img src='/imgs/" + markerData.filename + "'</img>";
+  const popUpContentDate = `<br><p>Inserito il: ${formatDate(
+    date
+  )} <br>alle: ${formatTime(date)}</p>`;
+
+  //const popUpContentHour = "<p>" + "alle: " + markerData.ts.substring(11, 16) + "</p>";
+  const popUpContent =
     popUpContentTitle +
     popUpContentdescription +
     popUpContentImage +
@@ -47,12 +59,12 @@ export function createMarker(markerData, L, map, returnMarker = false) {
 }
 
 export function createMarkerTemp(markerData, L, map, returnMarker = false) {
-  var marker = L.marker([
+  const marker = L.marker([
     markerData.coordinate.y,
     markerData.coordinate.x,
   ]).addTo(map);
-  let popUpContentdescription = "<p>" + markerData.description + "</p>";
-  let popUpContent = popUpContentdescription;
+  const popUpContentdescription = "<p>" + markerData.description + "</p>";
+  const popUpContent = popUpContentdescription;
   marker.bindPopup(popUpContent);
   if (returnMarker) {
     return marker;
@@ -60,12 +72,15 @@ export function createMarkerTemp(markerData, L, map, returnMarker = false) {
 }
 
 export function updateMarkers(markerList, L, map) {
-  var layers = L.LayerGroup(), //layers contains all markers..
-    contained = []; //makers in map boundingbox
+  const layers = L.LayerGroup(); //layers contains all markers..
+  const contained = []; //makers in map boundingbox
 
   layers.eachLayer(function (l) {
-    if (l instanceof L.Marker && map.getBounds().contains(l.getLatLng()))
-      contained.push(l);
+    if (
+      layer instanceof L.Marker &&
+      map.getBounds().contains(layer.getLatLng())
+    )
+      contained.push(layer);
   });
   console.log(contained);
 }
diff --git a/server/dbHandler.js b/server/dbHandler.js
index ecaa3bf..2a44f95 100644
--- a/server/dbHandler.js
+++ b/server/dbHandler.js
@@ -9,19 +9,18 @@ const pool = mysql.createPool({
 });
 
 function addMarker(marker) {
-  let insertQuery = "INSERT INTO markers VALUES (?,?,?,POINT(?,?),?)";
-  const date = new Date().toISOString();
-  const datePart = date.slice(0, 10); // '2024-09-06'
-  const timePart = date.slice(11, 19); // '21:33:44'
-  const formattedDate = `${datePart} ${timePart}`;
-  let query = mysql.format(insertQuery, [
+  const insertQuery = "INSERT INTO markers VALUES (?,?,?,POINT(?,?),?)";
+  const date = new Date();
+  
+  const query = mysql.format(insertQuery, [
     marker.name,
     marker.description,
     marker.filename,
     marker.long,
     marker.lat,
-    formattedDate,
+    date,
   ]);
+  
   pool.query(query, (err, response) => {
     if (err) {
       console.error(err);