XPUB
/
XPPL
57
0
Fork 2
Code Issues Pull Requests Releases Wiki Activity

minor fixes

Browse Source
geo
Alexander Roidl 2 years ago
parent 96e1f8d02a
commit 9e32d21b59
4 changed files with 414 additions and 452 deletions
Show Stats Download Patch File Download Diff File

2
app/__init__.py
Unescape Escape View File

@ -24,7 +24,7 @@ app.config['SECRET_KEY'] = 'super secret key'
#app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:////tmp/mydatabase.db'
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
#app.config['SQLALCHEMY_DATABASE_URI'] = 'rqlite+pyrqlite://localhost:4001/'
app.config['DEBUG'] = True
app.config['DEBUG'] = False
app.config['PORT'] = 80
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///' + os.path.join(basedir, 'mydatabase.db')

7
app/static/css/style.css
Unescape Escape View File

@ -81,9 +81,7 @@ audio{
width: 10%;
}
.locations_list .row div:last-of-type{
}
.locations_list .row div:last-of-type {}
.locations_list .row div {
width: 20%;
@ -279,7 +277,8 @@ margin: 4em 0;
}
#button_group button, #button_group select{
#button_group button,
#button_group select {
background-color: grey;
color: white;
font-size: 0.9em;

160
app/templates/home.html
Unescape Escape View File

@ -6,8 +6,23 @@
<div class="compass">
<div id="arrow" class="arrow"><svg viewBox="0 0 25 25" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd"><path class="st0" d="M13,2.6l6.2,7.5L20,9.5l-7.5-9L5,9.5l0.8,0.6L12,2.6v21.9h1C13,24.5,13,2.6,13,2.6z"/></svg></div>
<div id="goal" class="compass-goal"><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21.94 21.94"><defs><style>.cls-1{fill:#3fb800;opacity:.3;}</style></defs><g id="Layer_1-2"><circle class="cls-1" cx="10.97" cy="10.97" r="10.97"/></g></svg></div>
<div id="arrow" class="arrow"><svg viewBox="0 0 25 25" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd"
clip-rule="evenodd">
<path class="st0" d="M13,2.6l6.2,7.5L20,9.5l-7.5-9L5,9.5l0.8,0.6L12,2.6v21.9h1C13,24.5,13,2.6,13,2.6z" /></svg>
</div>
<div id="goal" class="compass-goal"><svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21.94 21.94">
<defs>
<style>
.cls-1 {
fill: #3fb800;
opacity: .3;
}
</style>
</defs>
<g id="Layer_1-2">
<circle class="cls-1" cx="10.97" cy="10.97" r="10.97" />
</g>
</svg></div>
<div class="my-point"></div>
</div>
@ -16,8 +31,10 @@
<!-- <h1 class="header" id="title">GEO</h1> -->
<div id="button_group">
<div id="distance_close">(distance to mosquito)</div>
<button id="store_location" onclick="store_location()"><img src="/static/img/hangout.png" alt="">add hangout</button>
<button id="store_location_mosquito" onclick="store_location_mosquito()"><img src="/static/img/mosquito.png" alt="">add mosquito</button>
<button id="store_location" onclick="store_location()"><img src="/static/img/hangout.png" alt="">add
hangout</button>
<button id="store_location_mosquito" onclick="store_location_mosquito()"><img src="/static/img/mosquito.png"
alt="">add mosquito</button>
<button id="add_text" onclick="add_text()"><img src="/static/img/text.png" alt="">add message</button>
<button id="add_audio" onclick="add_audio()"><img src="/static/img/audio.png" alt=""> add audio</button>
@ -33,9 +50,6 @@
</div>
</div>
<!-- HEADING DIRECTION https://stackoverflow.com/questions/46033649/heading-javascript-geolocation -->
<!-- COMPASS CROSS DEVICE https://stackoverflow.com/questions/16048514/can-i-use-javascript-to-get-the-compass-heading-for-ios-and-android-->
@ -64,14 +78,18 @@
var markerArray = [];
var circleArray = [];
var mosquitoArray = [];
var view="closest";
var view = "me";
var workingCompass = false;
var map_view = false;
function assign_data(data) {
locations = data;
}
assign_data({{ data_locations|tojson }});
assign_data({
{
data_locations | tojson
}
});
var map = L.map('map', {
attributionControl: false,
@ -90,18 +108,27 @@
attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
})
function toggle_map() {
if (map_view) {
map.removeLayer(backgroundLayer)
}
else{
} else {
map.addLayer(backgroundLayer)
}
map_view = !map_view
}
var myIcon = L.icon({
iconUrl: '/static/img/me.png',
iconSize: [30, 30],
iconAnchor: [15, 15],
popupAnchor: [-3, -76],
});
var myPositionCircle = L.marker([50.505, 30.57], {
icon: myIcon
}).addTo(map);
circleArray.push(myPositionCircle);
locations.forEach(function (item, index) {
try {
@ -113,24 +140,21 @@
iconAnchor: [25, 25],
popupAnchor: [-3, -76],
});
}
else if(item.loc_type=="audio"){
} else if (item.loc_type == "audio") {
icon = L.icon({
iconUrl: '/static/img/audio.png',
iconSize: [50, 50],
iconAnchor: [25, 25],
popupAnchor: [-3, -76],
});
}
else if(item.loc_type=="mosquito"){
} else if (item.loc_type == "mosquito") {
icon = L.icon({
iconUrl: '/static/img/mosquito.png',
iconSize: [50, 50],
iconAnchor: [25, 25],
popupAnchor: [-3, -76],
});
}
else if(item.loc_type=="hangout"){
} else if (item.loc_type == "hangout") {
icon = L.icon({
iconUrl: '/static/img/hangout.png',
iconSize: [50, 50],
@ -138,7 +162,9 @@
popupAnchor: [-3, -76],
});
}
var circle = L.marker([item.latitude, item.longitude], {icon: icon}).addTo(map).on("click", e => circleClick(e));
var circle = L.marker([item.latitude, item.longitude], {
icon: icon
}).addTo(map).on("click", e => circleClick(e));
circle.id = item.id;
circleArray.push(circle);
@ -151,36 +177,16 @@
}
});
// var myPositionCircle = L.circle([48.172934, 9.01236], {
// color: 'red',
// stroke:false,
// fillColor: 'red',
// fillOpacity: 0.5,
// radius: 10
// }).addTo(map);
var myIcon = L.icon({
iconUrl: '/static/img/me.png',
iconSize: [50, 50],
iconAnchor: [25, 25],
popupAnchor: [-3, -76],
});
var myPositionCircle = L.marker([50.505, 30.57], {icon: myIcon}).addTo(map);
circleArray.push(myPositionCircle);
var x = document.getElementById("position");
let id;
let target;
let options;
//first: latitude, second: longitude
//first: latitude, second: longitude 51.915528423609125, 4.477065873620031
target = {
latitude : 48.172934,
longitude: 9.01236
latitude: 51.915528423609125,
longitude: 4.477065873620031
};
var my_location = {
@ -193,9 +199,7 @@
my_location.longitude = crd.longitude;
my_location.latitude = crd.latitude;
if(view == "closest") updateView()
console.log("updated")
updateView()
x.innerHTML = "Latitude: " + crd.latitude +
"<br>Longitude: " + crd.longitude +
@ -216,7 +220,6 @@
// id = navigator.geolocation.watchPosition(success, error, options);
}
options = {
enableHighAccuracy: true,
timeout: 1000,
@ -237,8 +240,7 @@
var text;
if (d < 1) {
text = Math.round(d * 100) / 100 * 1000 + " m";
}
else{
} else {
text = Math.round(d * 100) / 100 + " km"
}
return text;
@ -252,42 +254,11 @@
}
function store_location() {
// console.log("storing location");
// console.log(my_location)
// var xhr = new XMLHttpRequest();
// xhr.open("POST", "./addlocation", true);
// xhr.setRequestHeader('Content-Type', 'application/json');
// xhr.send(JSON.stringify({
// longitude: my_location.longitude,
// latitude: my_location.latitude
// }));
// xhr.onreadystatechange=function(){
// if (xhr.readyState==4 && xhr.status==200){
// location.reload();
// }
// }
window.location.href = "addhangout/" + my_location.longitude + "/" + my_location.latitude + "/";
}
function store_location_mosquito() {
// console.log("storing location");
// console.log(my_location)
// var xhr = new XMLHttpRequest();
// xhr.open("POST", "./addlocationmosquito", true);
// xhr.setRequestHeader('Content-Type', 'application/json');
// xhr.send(JSON.stringify({
// longitude: my_location.longitude,
// latitude: my_location.latitude
// }));
// xhr.onreadystatechange=function(){
// if (xhr.readyState==4 && xhr.status==200){
// location.reload();
// }
// }
window.location.href = "addmosquito/" + my_location.longitude + "/" + my_location.latitude + "/";
}
@ -307,22 +278,16 @@
if (view == "all") {
var group = new L.featureGroup(circleArray);
map.fitBounds(group.getBounds().pad(0.4));
}
else if(view == "closest"){
} else if (view == "closest") {
var closest = L.GeometryUtil.closestLayer(map, mosquitoArray, myPositionCircle.getLatLng());
// L.polyline([closest.layer.getLatLng(), myPositionCircle.getLatLng()], {
// color: 'black',
// weight: 1,
// }).addTo(map)
document.getElementById("distance_close").innerHTML = "closest mosquito: " + distance(closest.layer.getLatLng().lat,closest.layer.getLatLng().lng,myPositionCircle.getLatLng().lat, myPositionCircle.getLatLng().lng)
document.getElementById("distance_close").innerHTML = "closest mosquito: " + distance(closest.layer.getLatLng()
.lng, closest.layer.getLatLng().lat, myPositionCircle.getLatLng().lng, myPositionCircle.getLatLng().lat)
var group = new L.featureGroup([closest.layer, myPositionCircle]);
map.fitBounds(group.getBounds().pad(0.4));
}
else if(view == "me"){
} else if (view == "me") {
map.setView([my_location.latitude, my_location.longitude], zoom_level);
}
else if(view == "free"){
} else if (view == "free") {
}
}
@ -399,7 +364,10 @@
function locationHandler(position) {
const { latitude, longitude } = position.coords;
const {
latitude,
longitude
} = position.coords;
pointDegree = calcDegreeToPoint(latitude, longitude);
if (pointDegree < 0) {
@ -411,11 +379,11 @@
// Qibla geolocation
var closest = L.GeometryUtil.closestLayer(map, mosquitoArray, myPositionCircle.getLatLng());
if (workingCompass == true) {
if(parseFloat(distance(closest.layer.getLatLng().lat,closest.layer.getLatLng().lng,myPositionCircle.getLatLng().lat, myPositionCircle.getLatLng().lng).split(" "))<20){
if (parseFloat(distance(closest.layer.getLatLng().lat, closest.layer.getLatLng().lng, myPositionCircle.getLatLng()
.lat, myPositionCircle.getLatLng().lng).split(" ")) < 20) {
document.getElementById("arrow").style.display = "none";
document.getElementById("goal").style.display = "block";
}
else{
} else {
document.getElementById("arrow").style.display = "block";
document.getElementById("goal").style.display = "none";
}
@ -442,8 +410,6 @@
init();
//
</script>
{% endblock js %}

3
app/views.py
Unescape Escape View File

@ -117,8 +117,6 @@ def addtext(lng, lat):
upload_form = UploadText()
longitude = lng
latitude = lat
print(longitude)
print(latitude)
if request.method == 'POST':
if upload_form.validate_on_submit():
@ -147,7 +145,6 @@ def addaudio(lng, lat):
longitude = upload_form.longitude.data
latitude = upload_form.latitude.data
file = request.files['file']
print(file.filename)
locations = db.session.query(Location).all()
id = len(locations)+1
# Getting the current date and time

Write Preview
Loading…
Cancel
Save