Ismail/nodeMap
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

_document.js for Next.js JavaScript-Datei einbinden Vorbereitung

Browse Source
This commit is contained in:
ISA
2024-04-15 16:06:17 +02:00
parent 06ca0b1ab1
commit de7b4d17a7
15 changed files with 338 additions and 120 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
.next/cache/webpack/client-development-fallback/index.pack.gz.old vendored
View File

Binary file not shown.

BIN
.next/cache/webpack/client-development/index.pack.gz.old vendored
View File

Binary file not shown.

BIN
.next/cache/webpack/server-development/index.pack.gz.old vendored
View File

Binary file not shown.

2
.next/server/components_MapComponent_js.js
View File

File diff suppressed because one or more lines are too long

22
.next/server/pages/_document.js
View File

File diff suppressed because one or more lines are too long

13
.next/server/pages/_error.js
View File

File diff suppressed because one or more lines are too long

13
.next/server/pages/index.js
View File

File diff suppressed because one or more lines are too long

10
.next/server/vendor-chunks/next.js
View File

@@ -384,6 +384,16 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({\n value: true\n}));
/***/ }),
/***/ "./node_modules/next/document.js":
/*!***************************************!*\
!*** ./node_modules/next/document.js ***!
\***************************************/
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
eval("module.exports = __webpack_require__(/*! ./dist/pages/_document */ \"./node_modules/next/dist/pages/_document.js\")\n//# sourceURL=[module]\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiLi9ub2RlX21vZHVsZXMvbmV4dC9kb2N1bWVudC5qcyIsIm1hcHBpbmdzIjoiQUFBQSxpSEFBa0QiLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8vLi9ub2RlX21vZHVsZXMvbmV4dC9kb2N1bWVudC5qcz85YTE0Il0sInNvdXJjZXNDb250ZW50IjpbIm1vZHVsZS5leHBvcnRzID0gcmVxdWlyZSgnLi9kaXN0L3BhZ2VzL19kb2N1bWVudCcpXG4iXSwibmFtZXMiOltdLCJzb3VyY2VSb290IjoiIn0=\n//# sourceURL=webpack-internal:///./node_modules/next/document.js\n");
/***/ }),
/***/ "./node_modules/next/dynamic.js":
/*!**************************************!*\
!*** ./node_modules/next/dynamic.js ***!

2
.next/static/chunks/components_MapComponent_js.js
View File

File diff suppressed because one or more lines are too long

2
.next/static/chunks/webpack.js
View File

@@ -153,7 +153,7 @@
/******/
/******/ /* webpack/runtime/getFullHash */
/******/ !function() {
/******/ __webpack_require__.h = function() { return "79d56825454c319a"; }
/******/ __webpack_require__.h = function() { return "3771899ba32da642"; }
/******/ }();
/******/
/******/ /* webpack/runtime/global */

12
.next/trace
View File

File diff suppressed because one or more lines are too long

198
components/MapComponent.js
View File

@@ -211,82 +211,130 @@ const MapComponent = ({ locations, onLocationUpdate }) => {
loadData();
};
//-----Kontextmenu----ende------------
const showAddStationPopup = (e, map) => {
const popupContent = `
<form id="addStationForm" class="m-0 p-2 w-full">
<div class="flex items-center mb-4">
<label for="name" class="block mr-2 flex-none">Name:</label>
<input
type="text"
id="name"
name="name"
placeholder="Name der Station"
class="block p-2 flex-grow border-2 border-gray-200 rounded-md text-sm"
/>
</div>
<div class="flex items-center mb-4">
<label for="type" class="block mr-3 flex-none">Type:</label>
<input
type="text"
id="type"
name="type"
placeholder="Typ der Station"
class="block p-2 flex-grow border-2 border-gray-200 rounded-md text-sm"
/>
</div>
<div class="flex items-center mb-4">
<label for="lat" class="block mr-2 flex-none">Breitengrad:</label>
<input
type="text"
id="lat"
name="lat"
value="${e.latlng.lat.toFixed(5)}"
readonly
class="block p-2 flex-grow border-2 border-gray-200 rounded-md text-sm"
/>
</div>
<div class="flex items-center mb-4">
<label for="lng" class="block mr-2 flex-none">Längengrad:</label>
<input
type="text"
id="lng"
name="lng"
value="${e.latlng.lng.toFixed(5)}"
readonly
class="block p-2 flex-grow border-2 border-gray-200 rounded-md text-sm"
/>
</div>
<button
type="submit"
class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded w-full"
>
Station hinzufügen
</button>
</form>
`;
console.log("intialMap in hinzufügen: ", initialMap);
L.popup().setLatLng(e.latlng).setContent(popupContent).openOn(initialMap);
};
setTimeout(() => {
const form = document.getElementById("addStationForm");
if (form) {
form.addEventListener("submit", async (event) => {
event.preventDefault();
const name = event.target.description.value;
const type = event.target.position.value;
const lat = event.target.lat.value;
const lng = event.target.lng.value;
// Hier wird `onAddLocation` mit den Werten aufgerufen, die aus dem Formular gesammelt wurden
await onAddLocation(name, type, lat, lng);
map.closePopup();
});
// Ensure this function is only called when map is initialized and available
const showAddStationPopup = (e) => {
if (!initialMap) {
console.log("Map is not initialized.");
return;
}
}, 10);
const popupContent = L.DomUtil.create("div");
popupContent.innerHTML = `
<form id="addStationForm" class="m-0 p-2 w-full">
<div class="flex items-center mb-4">
<label for="name" class="block mr-2 flex-none">Name:</label>
<input
type="text"
id="name"
name="name"
placeholder="Name der Station"
class="block p-2 flex-grow border-2 border-gray-200 rounded-md text-sm"
/>
</div>
<div class="flex items-center mb-4">
<label for="type" class="block mr-3 flex-none">Type:</label>
<input
type="text"
id="type"
name="type"
placeholder="Typ der Station"
class="block p-2 flex-grow border-2 border-gray-200 rounded-md text-sm"
/>
</div>
<div class="flex items-center mb-4">
<label for="lat" class="block mr-2 flex-none">Breitengrad:</label>
<input
type="text"
id="lat"
name="lat"
value="${e.latlng.lat.toFixed(5)}"
readonly
class="block p-2 flex-grow border-2 border-gray-200 rounded-md text-sm"
/>
</div>
<div class="flex items-center mb-4">
<label for="lng" class="block mr-2 flex-none">Längengrad:</label>
<input
type="text"
id="lng"
name="lng"
value="${e.latlng.lng.toFixed(5)}"
readonly
class="block p-2 flex-grow border-2 border-gray-200 rounded-md text-sm"
/>
</div>
<button
type="submit"
class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded w-full"
>
Station hinzufügen
</button>
</form>
`;
L.popup().setLatLng(e.latlng).setContent(popupContent).openOn(initialMap);
// Attach event listener here
L.DomEvent.on(popupContent, "submit", handleSubmit);
};
/*
const handleSubmit = (event) => {
event.preventDefault();
const form = event.target;
const data = {
name: form.name.value,
type: form.type.value,
latitude: form.lat.value,
longitude: form.lng.value,
};
onAddLocation(name, type, lat, lng);
console.log("Name: ", name, "Type: ", type, "Lat: ", lat, "Lng: ", lng);
map.closePopup();
};
*/
// Funktion zum Hinzufügen eines neuen Standorts
async function handleSubmit(event) {
event.preventDefault();
const form = event.target;
const data = {
name: form.name.value,
type: form.type.value,
latitude: form.lat.value,
longitude: form.lng.value,
};
try {
const response = await fetch("/api/addLocation", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
const result = await response.json();
if (response.ok) {
console.log("Standort hinzugefügt:", result);
alert("Standort erfolgreich hinzugefügt!");
form.reset(); // Formular zurücksetzen
// Hier könntest du weitere Aktionen durchführen, wie das Schließen des Popups oder das Aktualisieren der Marker auf der Karte
} else {
throw new Error(
result.error || "Ein unbekannter Fehler ist aufgetreten."
);
}
} catch (error) {
console.error("Fehler beim Hinzufügen des Standorts:", error);
alert(error.message);
}
}
function fly(stationValue) {
var x = 51.41321407879154;

22
pages/_document.js Normal file
View File

@@ -0,0 +1,22 @@
// pages/_document.js
import Document, { Html, Head, Main, NextScript } from "next/document";
class MyDocument extends Document {
render() {
return (
<Html lang="de">
<Head>
{/* Hier Meta-Tags oder Schriftarten einbinden */}
{/* Das Script wird hier eingebunden, um es auf allen Seiten verfügbar zu machen */}
<script src="/config.js" defer></script>
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
);
}
}
export default MyDocument;

92
public/js/config.js
View File

@@ -1,10 +1,10 @@
/**
/**
* @file config.js
* @author Andreas Tholen
* Contact: info@littwin-systechnik.de
* @version 0.5.3
* @description Config-File for the TALAS.Map
**/
**/
//Versionsnummer
var mapVersion = "0.5.3";
@@ -22,33 +22,57 @@ var mapZoomMin = 4;
var mapZoomMax = 17;
//Datenquelle
var offlineData = false;
var offlineData = false;
var serverURL = "http://10.10.0.13";
var url_string = window.location;
var url = new URL(url_string);
var c = url.searchParams.get("m");
//c = 10;
console.log("idMap: "+c);
var user = url.searchParams.get("u");
if (user === null) {
user = 487;
}
console.log("idUser: "+user);
var url_string = window.location;
var url = new URL(url_string);
var c = url.searchParams.get("m");
//c = 10;
console.log("idMap: " + c);
var user = url.searchParams.get("u");
if (user === null) {
user = 487;
}
console.log("idUser: " + user);
// Kartedaten einlesen
var mapDataStaticUrl = serverURL+"/talas5/ClientData/WebserviceMap.asmx/GisStationsStaticDistrict?idMap="+c+"&idUser="+user;
var mapDataStatusUrl = serverURL+"/talas5/ClientData/WebserviceMap.asmx/GisStationsStatusDistrict?idMap="+c+"&idUser="+user;
var mapDataMeasures = serverURL+"/talas5/ClientData/WebserviceMap.asmx/GisStationsMeasurements?idMap="+c;
var mapDataIconUrl = serverURL+"/talas5/ClientData/WebserviceMap.asmx/GetIconsStatic";
var mapDataSystemUrl = serverURL+"/talas5/ClientData/WebserviceMap.asmx/GisSystemStatic?idMap="+c+"&idUser="+user;
const mapStaticOfflineURL = "offlineTestData/idMap"+c+"GisStationenStatic.json";
const mapStatusOfflineURL = "offlineTestData/idMap"+c+"GisStationenStatus.json";
const mapSystemOfflineURL = "offlineTestData/idMap"+c+"GisSystemStatic.json";
var mapDataStaticUrl =
serverURL +
"/talas5/ClientData/WebserviceMap.asmx/GisStationsStaticDistrict?idMap=" +
c +
"&idUser=" +
user;
var mapDataStatusUrl =
serverURL +
"/talas5/ClientData/WebserviceMap.asmx/GisStationsStatusDistrict?idMap=" +
c +
"&idUser=" +
user;
var mapDataMeasures =
serverURL +
"/talas5/ClientData/WebserviceMap.asmx/GisStationsMeasurements?idMap=" +
c;
var mapDataIconUrl =
serverURL + "/talas5/ClientData/WebserviceMap.asmx/GetIconsStatic";
var mapDataSystemUrl =
serverURL +
"/talas5/ClientData/WebserviceMap.asmx/GisSystemStatic?idMap=" +
c +
"&idUser=" +
user;
const mapStaticOfflineURL =
"offlineTestData/idMap" + c + "GisStationenStatic.json";
const mapStatusOfflineURL =
"offlineTestData/idMap" + c + "GisStationenStatus.json";
const mapSystemOfflineURL =
"offlineTestData/idMap" + c + "GisSystemStatic.json";
const mapIconsOfflineURL = "offlineTestData/icons.json";
const mapMeasuresOfflineURL = "offlineTestData/idMap"+c+"GisSystemMeasures.json";
const mapMeasuresOfflineURL =
"offlineTestData/idMap" + c + "GisSystemMeasures.json";
//das kann auskommentiert werden
/*
if (offlineData) {
console.log("%cSYSTEM| Offline Daten aktiviert!", 'color: blue');
mapDataStaticUrl = mapStaticOfflineURL;
@@ -59,12 +83,22 @@ if (offlineData) {
console.log("%cSYSTEM| Static URL: %c"+mapDataStaticUrl, 'color: blue', 'color: green');
console.log("%cSYSTEM| Status URL: %c"+mapDataStatusUrl, 'color: blue', 'color: green');
}
*/
// Update Zeit
var updateIntervall = 5000; // in Millisekunden
// example -> L.marker([51.5, -0.09], {icon: greenIcon}).addTo(map);
console.log("%cSYSTEM| Kartenfunktionen geladen", 'color: blue');
console.log("%cSYSTEM| Die aktuelle Fenstergröße Breite: " + window.innerWidth+"px Höhe: "+window.innerHeight + "px", 'color: blue');
console.log("%cMAP| Marker-Icons preload abgeschlossen", 'color: green');
console.log("%cMAP| Updateintervall: "+updateIntervall+" ms", 'color: green');
console.log("%cSYSTEM| Kartenfunktionen geladen", "color: blue");
console.log(
"%cSYSTEM| Die aktuelle Fenstergröße Breite: " +
window.innerWidth +
"px Höhe: " +
window.innerHeight +
"px",
"color: blue"
);
console.log("%cMAP| Marker-Icons preload abgeschlossen", "color: green");
console.log(
"%cMAP| Updateintervall: " + updateIntervall + " ms",
"color: green"
);

70
public/js/config2.js Normal file
View File

@@ -0,0 +1,70 @@
/**
* @file config.js
* @author Andreas Tholen
* Contact: info@littwin-systechnik.de
* @version 0.5.3
* @description Config-File for the TALAS.Map
**/
//Versionsnummer
var mapVersion = "0.5.3";
//Visual Config
var standardSideMenu = true;
var fullSideMenu = false;
// Window Height erkennen
var windowHeight = window.innerHeight;
//console.log("windowheighet:"+windowHeight);
//Zoom
var mapZoomMin = 4;
var mapZoomMax = 17;
//Datenquelle
var offlineData = false;
var serverURL = "http://10.10.0.13";
var url_string = window.location;
var url = new URL(url_string);
var c = url.searchParams.get("m");
//c = 10;
console.log("idMap: "+c);
var user = url.searchParams.get("u");
if (user === null) {
user = 487;
}
console.log("idUser: "+user);
// Kartedaten einlesen
var mapDataStaticUrl = serverURL+"/talas5/ClientData/WebserviceMap.asmx/GisStationsStaticDistrict?idMap="+c+"&idUser="+user;
var mapDataStatusUrl = serverURL+"/talas5/ClientData/WebserviceMap.asmx/GisStationsStatusDistrict?idMap="+c+"&idUser="+user;
var mapDataMeasures = serverURL+"/talas5/ClientData/WebserviceMap.asmx/GisStationsMeasurements?idMap="+c;
var mapDataIconUrl = serverURL+"/talas5/ClientData/WebserviceMap.asmx/GetIconsStatic";
var mapDataSystemUrl = serverURL+"/talas5/ClientData/WebserviceMap.asmx/GisSystemStatic?idMap="+c+"&idUser="+user;
const mapStaticOfflineURL = "offlineTestData/idMap"+c+"GisStationenStatic.json";
const mapStatusOfflineURL = "offlineTestData/idMap"+c+"GisStationenStatus.json";
const mapSystemOfflineURL = "offlineTestData/idMap"+c+"GisSystemStatic.json";
const mapIconsOfflineURL = "offlineTestData/icons.json";
const mapMeasuresOfflineURL = "offlineTestData/idMap"+c+"GisSystemMeasures.json";
if (offlineData) {
console.log("%cSYSTEM| Offline Daten aktiviert!", 'color: blue');
mapDataStaticUrl = mapStaticOfflineURL;
mapDataSystemUrl = mapSystemOfflineURL;
mapDataStatusUrl = mapStatusOfflineURL;
mapDataIconUrl = mapIconsOfflineURL;
mapDataMeasures = mapMeasuresOfflineURL;
console.log("%cSYSTEM| Static URL: %c"+mapDataStaticUrl, 'color: blue', 'color: green');
console.log("%cSYSTEM| Status URL: %c"+mapDataStatusUrl, 'color: blue', 'color: green');
}
// Update Zeit
var updateIntervall = 5000; // in Millisekunden
// example -> L.marker([51.5, -0.09], {icon: greenIcon}).addTo(map);
console.log("%cSYSTEM| Kartenfunktionen geladen", 'color: blue');
console.log("%cSYSTEM| Die aktuelle Fenstergröße Breite: " + window.innerWidth+"px Höhe: "+window.innerHeight + "px", 'color: blue');
console.log("%cMAP| Marker-Icons preload abgeschlossen", 'color: green');
console.log("%cMAP| Updateintervall: "+updateIntervall+" ms", 'color: green');