Commit e65a993d authored by Patrick's avatar Patrick
Browse files

Add Favorite Place functionality (only on local)

parent c2721857
......@@ -928,4 +928,19 @@ app.get('/TrafficFlow', async (req, res) => {
reject(error);
});
});
}
\ No newline at end of file
}
const connectionFav = {
user: 'postgres', // name of the user account
database: 'FavoritPlaces', // name of the database
password: 'ahpk94meteor', // env var: PGPASSWORD
host: '193.196.38.112', // Server hosting the postgres database (host: '35.187.21.114')
port: 5432, // env var: PGPORT
max: 10, // max number of clients in the pool
idleTimeoutMillis: 30000 // how long a client is allowed to remain idle before being closed
}
const dbFav = pgp(connectionFav);
console.log('successful connected to DB: FavoritPlaces!')
\ No newline at end of file
......@@ -441,7 +441,9 @@ function CON_buildTFLOWJson(inputData,type){
// - receive coordinates and return a geojson
app.get('/addPoint', async (req, res) => {
try {
var data = req.query;
console.log(data)
var Punktadd = {
"type":"FeatureCollection",
"name":"data_point",
......@@ -910,4 +912,140 @@ function STA_getApiResponse(url) {
reject(error);
});
});
}
\ No newline at end of file
}
const connectionFav = {
user: 'postgres', // name of the user account
database: 'FavoritPlaces', // name of the database
password: 'ahpk94meteor', // env var: PGPASSWORD
host: '193.196.38.112', // Server hosting the postgres database (host: '35.187.21.114')
port: 5432, // env var: PGPORT
max: 10, // max number of clients in the pool
idleTimeoutMillis: 30000 // how long a client is allowed to remain idle before being closed
}
const dbFav = pgp(connectionFav);
console.log('successful connected to DB: FavoritPlaces!')
// ---- Accidents ----
// - 3Parts -
// - get request from the html page
app.get('/FavPlacesDB', async (req, res) => {
console.log('FavPlacesDB angekommen!')
try{
let APIout = await getDBResult('');
console.log(APIout)
let json_con = await buildFavJson(APIout,"CONSTRUCTION");
// console.log(json_con)
var json_cons = {
"name":"FavouritePlaces" + "01",
"type":"FeatureCollection",
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },
"features": json_con
};
res.json(json_cons)
}catch (error) {
console.log(error)
}
});
// - request from the here API
function getDBResult(url) {
return new Promise(function (resolve, reject) {
let query_string = " SELECT id, lat, lon, contenttext, approved, timestamp FROM public.places WHERE approved = true;"
// query_string += "from noisesensor;";
console.log(query_string)
// request the data rsr
dbFav.result(query_string)
.then(result => {
// res.json(result.rows);
console.log((result.rows));
resolve((result.rows));
})
.catch(function (error) {
// handle error
// console.log(error);
reject(error);
});
});
}
// - build geojson from response
function buildFavJson(inputData,type){
return new Promise(function (resolve, reject) {
try {
var JsonFeature = [];
var json_acc = inputData
var length = json_acc.length;
// console.log(length)
for (var i = 0; i <= length - 1; i++){
//console.log(json_acc.TRAFFIC_ITEMS.TRAFFIC_ITEM[i])
var lat = json_acc[i].lat;
var lon = json_acc[i].lon;
// var type = json_acc.TRAFFIC_ITEMS.TRAFFIC_ITEM[i].TRAFFIC_ITEM_TYPE_DESC;
var id = json_acc[i].id;
var contenttext = json_acc[i].contenttext;
var timestamp = json_acc[i].timestamp;
// console.log(i)
JsonFeature.push({
"type":"Feature",
"properties": { "id": id, "name": "datapoint" , "contenttext": contenttext, "timestamp": timestamp, "lat":lat, "lon":lon},
"geometry":{
"type":"MultiPoint",
"coordinates": [ [parseFloat(lon), parseFloat(lat)]]
}
})
}
resolve(JsonFeature)
}catch(error){ reject(error)}
});
};
app.post('/saveFavPoint', function (req, res) {
try {
const data = req.body;
// = "select sensor_id from public.noisesensor;"
let query_string = " INSERT INTO public.places( lat, lon, contenttext, approved, timestamp) VALUES (" + data.lat + ", " + data.lon + ", '" + data.contentext + "', 'false' , NOW()); "
// query_string += "from noisesensor;";
console.log(query_string)
// request the data rsr
dbFav.result(query_string)
.then(result => {
res.json(result.rows);
})
.catch(error => {
console.log('ERROR:', error);
});
console.log('.../saveFavPoint successful!');
}
catch (err) {
console.log('.../saveFavPoint failed!\n' + err);
}
});
\ No newline at end of file
......@@ -146,6 +146,79 @@
"type": "vcs.vcm.widgets.BalloonInfo",
"name": "Balloon Info",
"balloonTypes": [
{
"template": [
"<div class='balloon' id='myBalloon'>",
"<div class='balloon-content'>",
"<h1 class='balloon-title'>Balloon header</h1>",
"<% for (var key in obj) { %>",
"<% if (obj[key] instanceof Object){%>",
"<% for (var key2 in obj[key]) { %>",
"<p class='balloon-text'><span class='balloon-street'> <strong> <%=key%>.<%=key2%> </strong> : <%=obj[key][key2]%></span><br></p>",
"<% } %>",
"<% } else{ %>",
"<p class='balloon-text'>",
"<span class='balloon-street'> <strong> <%=key%> </strong> : <%=obj[key]%></span><br>",
"</p>",
"<% } %>",
"<% } %>",
"</div>",
"<div class='balloon-close-col'>",
"<button class='close-balloon'><i class='fa fa-times fa-lg'></i></button>",
"</div>",
"<div class='dialog-image-balloon'></div>",
"<div class='balloon-left-edge'></div>",
"</div>"
],
"layerTypes": [
null
],
"layerNames": [
"FavPlaces"
],
"minTop": "balloonHeight + 30",
"minLeft": "70",
"allAvailable": true,
"properties": [],
"balloonHeader": "Balloon header"
},{
"template": [
"<div class='balloon' id='myBalloon'>",
"<div class='balloon-content'>",
"<h1 class='balloon-title'>Write your Comment here:</h1>",
"<% for (var key in obj) { %>",
"<% if (obj[key] instanceof Object){%>",
"<% for (var key2 in obj[key]) { %>",
"<p class='balloon-text'><span class='balloon-street'> <strong> <%=key%>.<%=key2%> </strong> : <%=obj[key][key2]%></span><br></p>",
"<% } %>",
"<% } else{ %>",
"<p class='balloon-text'>",
"<span class='balloon-street'> <strong> <%=key%> </strong> : <%=obj[key]%></span><br>",
"</p>",
"<% } %>",
"<% } %>",
"</div>",
"<div><textarea id='favoritText' rows='4' cols='50' maxlength='250'>Bitte geben Sie hier Ihre Gedanken ein.</textarea></div>",
"<button id='FavSaveButton' type='button' onclick='this.disabled=true;disableButton();saveFavPoint();' class='top-nav buttonset one btn_home btn_size' style='text-decoration: none;'>Speichern</button>",
"<div class='balloon-close-col'>",
"<button class='close-balloon'><i class='fa fa-times fa-lg'></i></button>",
"</div>",
"<div class='dialog-image-balloon'></div>",
"<div class='balloon-left-edge'></div>",
"</div>"
],
"layerTypes": [
null
],
"layerNames": [
"favpoint"
],
"minTop": "balloonHeight + 30",
"minLeft": "70",
"allAvailable": true,
"properties": [],
"balloonHeader": "Balloon header"
},
{
"template": [
"<div class='balloon' id='myBalloon'>",
......
.Disabled {
background-color: #afafaf !important;
color: white !important;
}
.Disabled:hover {
background-color: #afafaf !important;
color: #121212 !important;
}
\ No newline at end of file
......@@ -226,6 +226,7 @@
</p><br>
<img id="dragFrom" onmouseover="setPointStartEnd('fav')" ondragstart="dragstart_handler(event);" draggable=true src="templates/locationSM.png" style="height:30px;height: 30px; display: inline-block; position: absolute;cursor: -webkit-grab; cursor: grab;">
</div><br><br>
<a onclick="getFavoritePlaces()">Welche Orte sind für andere interessant? Finden Sie es hier heraus.</a>
</div>
</div>
......@@ -824,6 +825,7 @@
<script src="js/STAnoise.js"></script>
<link href="templates/sliders.css" rel="stylesheet">
<link rel="stylesheet" href="css/menu.css">
<script>
var startVCM = function() {
......@@ -835,7 +837,7 @@
}
}
</script>
<link rel="stylesheet" href="css/dragable.css">
<!--script>
vcs.vcm.Framework.activateLogging();
vcs.vcm.Framework.loadConfig('config.json');
......@@ -845,6 +847,7 @@
<script src='lib/vcm_ui.js'></script>
<script src="js/SimStadtApi_stud.js"></script>
<script src="js/here.js"></script>
<script src="js/favoriteplaces.js"></script>
<script src="js/codepoly.js"></script>
<script src="templates/custom.js"></script>
<script src="templates/newDevBahn.js"></script>
......
......@@ -108,7 +108,7 @@ function dragDrop(e) {
// var text = document.getElementById('Epunktlon');
// text.value = ballonContent.lon;
// visualize a Point at the clicked location
setPoint("fav", pointd);
setPointFav("fav", pointd);
}
}
......
......@@ -20,6 +20,7 @@
// var RoutecalcUrl = '/partizipation/Routecalc'
// var navPublicTUrl = '/partizipation/navPublicT'
// var NoiseRealTimeUrl = '/partizipation/NoiseRealTime'
// var FavortiePlacesUrl = '/partizipation/getFavPlaces'
// var getNoiseHistUrl = '/partizipation/getNoiseHist'
// var getSTANoiseHistUrl = '/partizipation/getSTANoiseHist'
......@@ -48,5 +49,7 @@ var navPointUrl = '/navPoint'
var RoutecalcUrl = '/Routecalc'
var navPublicTUrl = '/navPublicT'
var NoiseRealTimeUrl = '/NoiseRealTime'
var FavoritePlacesUrl = 'http://localhost:8083/FavPlacesDB'
var getNoiseHistUrl = '/getNoiseHist'
var getSTANoiseHistUrl = '/getSTANoiseHist'
\ No newline at end of file
var getSTANoiseHistUrl = '/getSTANoiseHist'
var saveFavPOINT = '/saveFavPoint'
\ No newline at end of file
function getFavoritePlaces() {
// console.log("arrive")
// Sensor.id = sensorid
// console.log(Sensor.id)
var favplaces = new vcs.vcm.layer.GeoJSON({
name: "FavPlaces",
url: FavoritePlacesUrl,
data: geojson,
projection: {
epsg: 4326
},
altitudeMode : "relativeToGround",
style: {
image: {
icon: {
src: "./templates/locationSMgreen.png",
scale: 0.5
}
}
},
heightAboveGround: 0
})
framework.addLayer(favplaces)
favplaces.activate(true);
}
var favdatapoint = {
slat:"",
slon:"",
sloc:"",
}
//-- Set point in the map
function setPointFav(location, pointd){
favdatapoint.slat = pointd.lat
favdatapoint.slon = pointd.lon
favdatapoint.sloc = location
var layern = [location + "point"]
var layers = framework.getLayers();
// hide layer if it already exists
for (var i = 0; i< layers.length; i++) {
var layer = layers[i];
if(layern.indexOf(layer.name) >= 0){
layer.activate(false);
}
}
// delete layer if it already exists
framework.removeLayerByName(location + "point")
// visualizing with vcs GeoJson function
pointlayer = new vcs.vcm.layer.GeoJSON({
name: location + "point",
url: addPointurl + "?slat=" + pointd.lat + "&slon=" + pointd.lon + "&sloc=" + location,
data: geojson,
projection: {
epsg: 4326
},
altitudeMode : "relativeToGround",
style: {
image: {
icon: {
src: "./templates/locationSM.png",
scale: 0.5
}
}
},
heightAboveGround: 0
})
framework.addLayer(pointlayer)
pointlayer.activate(true);
}
function saveFavPoint(){
var favdatapoint2 = {
lat:"",
lon:"",
contentext: document.getElementById("favoritText").value
}
favdatapoint2.lat = favdatapoint.slat;
favdatapoint2.lon = favdatapoint.slon;
// var incidents = getTraffic()
try {
$.ajax({
type: "POST",
url: saveFavPOINT,
data: favdatapoint2,
}).done(function (newdata) {
convertdata(newdata);
});
function convertdata(data) {
navcardata = data;
console.log(navcardata)
}
return navcardata
}
catch (err) {
console.log('loading Gas Values from DB failed!');
}
}
function disableButton(){
var element = document.getElementById("FavSaveButton");
element.classList.add("Disabled");
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment