vadikas/SARBase
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixed create_sar JS

Browse Source
This commit is contained in:
Vadim Likholetov 2023-12-10 12:42:32 +02:00
parent a33c77d2d0
commit 4426c4cae5
7 changed files with 76 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
.idea/SARBase.iml
View File

@ -11,12 +11,19 @@
</content> </content>
<orderEntry type="jdk" jdkName="Python 3.9 (SARBase)" jdkType="Python SDK" /> <orderEntry type="jdk" jdkName="Python 3.9 (SARBase)" jdkType="Python SDK" />
<orderEntry type="sourceFolder" forTests="false" /> <orderEntry type="sourceFolder" forTests="false" />
<orderEntry type="library" name="leaflet-control-geocoder" level="application" />
<orderEntry type="library" name="leaflet-gpx" level="application" />
<orderEntry type="library" name="@turf/turf" level="application" />
<orderEntry type="library" name="jquery-3.5.1.slim" level="application" />
<orderEntry type="library" name="leaflet.draw" level="application" /> <orderEntry type="library" name="leaflet.draw" level="application" />
<orderEntry type="library" name="leaflet-control-geocoder" level="application" /> <orderEntry type="library" name="leaflet-control-geocoder" level="application" />
<orderEntry type="library" name="leaflet" level="application" /> <orderEntry type="library" name="leaflet" level="application" />
<orderEntry type="library" name="jquery-3.5.1.slim" level="application" /> <orderEntry type="library" name="jquery" level="application" />
<orderEntry type="library" name="leaflet" level="application" />
<orderEntry type="library" name="leaflet.draw" level="application" />
<orderEntry type="library" name="bootstrap" level="application" />
<orderEntry type="library" name="popper.js" level="application" />
<orderEntry type="library" name="@turf/turf" level="application" /> <orderEntry type="library" name="@turf/turf" level="application" />
<orderEntry type="library" name="leaflet-gpx" level="application" />
</component> </component>
<component name="PackageRequirementsSettings"> <component name="PackageRequirementsSettings">
<option name="removeUnused" value="true" /> <option name="removeUnused" value="true" />

2
.idea/jsLibraryMappings.xml
View File

@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<project version="4"> <project version="4">
<component name="JavaScriptLibraryMappings"> <component name="JavaScriptLibraryMappings">
<file url="file://$PROJECT_DIR$" libraries="{@turf/turf, jquery-3.5.1.slim, leaflet, leaflet-gpx, leaflet.draw}" /> <file url="file://$PROJECT_DIR$" libraries="{@turf/turf, bootstrap, jquery, leaflet, leaflet-control-geocoder, leaflet.draw, popper.js}" />
</component> </component>
</project> </project>

6
templates/base.html
View File

@ -2,11 +2,7 @@
<html lang="en"> <html lang="en">
<head> <head>
<!-- ... meta tags, styles, etc. ... --> <!-- ... meta tags, styles, etc. ... -->
{% include 'jscripts.html' %}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<title>{% block title %}Default Title{% endblock %}</title> <title>{% block title %}Default Title{% endblock %}</title>
</head> </head>

73
templates/create_sar.html
View File

@ -6,11 +6,6 @@
{% block content %} {% block content %}
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css"/>
<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"></script>
<link rel="stylesheet" href="https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.css"/>
<script src="https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.js"></script>
<div class="container mt-5"> <div class="container mt-5">
<h2>Create SAR Call</h2> <h2>Create SAR Call</h2>
@ -83,21 +78,48 @@
<button type="submit" class="btn btn-primary">Create</button> <button type="submit" class="btn btn-primary">Create</button>
</form> </form>
</div> </div>
<div id="map" style="width: 600px; height: 400px;"></div>
<div id="map"></div>
<script> <script>
var map = L.map('map').setView([60.19, 20.37], 13); // Default to London, adjust as needed# var map;
{# = L.map('map').setView([60.19, 20.37], 13); // Default to London, adjust as needed##}
var marker; var marker;
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
// Function to initialize map with user's location // Function to initialize map with user's location
function initializeMap(lat, lon) { function initializeMap(lat, lon) {
map = L.map('map').setView([lat, lon], 13); map = L.map('map').setView([lat, lon], 13);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
// Add the geocoder
L.Control.geocoder({
defaultMarkGeocode: true
})
.on('markgeocode', function (e) {
if (marker) {
map.removeLayer(marker);
}
var latlng = e.geocode.center;
L.marker(latlng).addTo(map);
map.setView(latlng, map.getZoom());
// Update your form fields with the selected location
document.querySelector('input[name="latitude"]').value = latlng.lat;
document.querySelector('input[name="longitude"]').value = latlng.lng;
})
.addTo(map);
map.on('click', function (e) {
if (marker) {
map.removeLayer(marker);
}
marker = L.marker(e.latlng).addTo(map);
document.querySelector('input[name="latitude"]').value = e.latlng.lat;
document.querySelector('input[name="longitude"]').value = e.latlng.lng;
});
} }
@ -115,37 +137,10 @@
} }
// Add the geocoder
L.Control.geocoder({
defaultMarkGeocode: true
})
.on('markgeocode', function (e) {
if (marker) {
map.removeLayer(marker);
}
var latlng = e.geocode.center;
L.marker(latlng).addTo(map);
map.setView(latlng, map.getZoom());
// Update your form fields with the selected location
document.querySelector('input[name="latitude"]').value = latlng.lat;
document.querySelector('input[name="longitude"]').value = latlng.lng;
})
.addTo(map);
map.on('click', function (e) {
if (marker) {
map.removeLayer(marker);
}
marker = L.marker(e.latlng).addTo(map);
document.querySelector('input[name="latitude"]').value = e.latlng.lat;
document.querySelector('input[name="longitude"]').value = e.latlng.lng;
});
// If editing, set the marker to the existing coordinates // If editing, set the marker to the existing coordinates
var latInput = document.querySelector('input[name="latitude"]'); var latInput = document.querySelector('input[name="latitude"]');
var lngInput = document.querySelector('input[name="longitude"]'); var lngInput = document.querySelector('input[name="longitude"]');
if (latInput.value && lngInput.value) { if (latInput.value && lngInput.value) {
marker = L.marker([latInput.value, lngInput.value]).addTo(map); marker = L.marker([latInput.value, lngInput.value]).addTo(map);
} }

5
templates/edit_sar.html
View File

@ -6,8 +6,7 @@
{% block content %} {% block content %}
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css"/>
<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"></script>
<h2>Edit SAR Call</h2> <h2>Edit SAR Call</h2>
<div class="container mt-5"> <div class="container mt-5">
@ -114,7 +113,7 @@
<button type="submit" class="btn btn-primary">Update</button> <button type="submit" class="btn btn-primary">Update</button>
</form> </form>
<div id="map" style="width: 600px; height: 400px;"></div> <div id="map"></div>
<script> <script>
var map = L.map('map').setView([60.19, 20.37], 13); // Default to London, adjust as needed var map = L.map('map').setView([60.19, 20.37], 13); // Default to London, adjust as needed

29
templates/jscripts.html Normal file
View File

@ -0,0 +1,29 @@
<!-- Stylesheets -->
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://unpkg.com/leaflet-control-geocoder@2.4.0/dist/Control.Geocoder.css"/>
<!-- Scripts -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"></script>
<script src="https://unpkg.com/leaflet-control-geocoder@2.4.0/dist/Control.Geocoder.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.js"></script>
<script src='https://unpkg.com/@turf/turf@6/turf.min.js'></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<script src="/static/togpx.js"></script>
<style>
#map {
height: 400px;
}
.button {
margin: 5px;
}
.comment-text {
white-space: pre-line;
}
</style>

27
templates/sar_details.html
View File

@ -6,33 +6,6 @@
{% block content %} {% block content %}
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css"/>
<!-- Leaflet.draw CSS -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.css">
<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"></script>
<!-- Leaflet.draw JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.js"></script>
<!-- Include leaflet-gpx plugin -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-gpx/1.7.0/gpx.min.js"></script>
<script src='https://unpkg.com/@turf/turf@6/turf.min.js'></script>
<script src="/static/togpx.js"></script>
<style>
#map {
height: 400px;
}
.button {
margin: 5px;
}
.comment-text {
white-space: pre-line;
}
</style>
<div class="container mt-4"> <div class="container mt-4">
<h2 class="mb-4">#{{ sar.SARCall.id }} : {{ sar.SARCall.title }}</h2> <h2 class="mb-4">#{{ sar.SARCall.id }} : {{ sar.SARCall.title }}</h2>
<div class="card mb-4"> <div class="card mb-4">