Added icons for GPX display

This commit is contained in:
Vadim Likholetov 2023-11-26 21:06:43 +02:00
parent 8296df372f
commit b521402aa0
5 changed files with 41 additions and 32 deletions

BIN
static/pin-icon-end.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 960 B

BIN
static/pin-icon-start.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 971 B

BIN
static/pin-icon-wpt.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 660 B

BIN
static/pin-shadow.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@ -11,7 +11,7 @@
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script> <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<!-- Include leaflet-gpx plugin --> <!-- Include leaflet-gpx plugin -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-gpx/1.5.1/gpx.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-gpx/1.7.0/gpx.min.js"></script>
<style> <style>
#map { #map {
@ -40,7 +40,8 @@
<p>Created at: {{ sar.SARCall.created }}</p> <p>Created at: {{ sar.SARCall.created }}</p>
<p>Last updated: {{ sar.SARCall.updated }}</p> <p>Last updated: {{ sar.SARCall.updated }}</p>
</div> </div>
<p><strong>Coordination manager:</strong> {{ sar.SARCall.coordination_officer.full_name }}</p> <p><strong>Coordination
manager:</strong> {{ sar.SARCall.coordination_officer.full_name }}</p>
<p><strong>Search manager:</strong> {{ sar.SARCall.search_officer.full_name }}</p> <p><strong>Search manager:</strong> {{ sar.SARCall.search_officer.full_name }}</p>
<p>Status: {{ sar.SARStatus.name }}</p> <p>Status: {{ sar.SARStatus.name }}</p>
{% if is_logged_in %} {% if is_logged_in %}
@ -157,7 +158,8 @@
<!-- Add Comment Form --> <!-- Add Comment Form -->
{% if is_logged_in %} {% if is_logged_in %}
<form action="{{ url_for('add_comment', sar_call_id=sar.SARCall.id) }}" method="post" enctype="multipart/form-data"> <form action="{{ url_for('add_comment', sar_call_id=sar.SARCall.id) }}" method="post"
enctype="multipart/form-data">
<div class="form-group"> <div class="form-group">
<label for="text">Comment:</label> <label for="text">Comment:</label>
<textarea name="text" class="form-control"></textarea> <textarea name="text" class="form-control"></textarea>
@ -168,7 +170,7 @@
</div> </div>
<button type="submit" class="btn btn-primary">Add Comment</button> <button type="submit" class="btn btn-primary">Add Comment</button>
</form> </form>
{% endif %} {% endif %}
</div> </div>
<!-- GPX File Upload Modal --> <!-- GPX File Upload Modal -->
@ -210,7 +212,14 @@
fetch('/get_gpx/' + gpxId) fetch('/get_gpx/' + gpxId)
.then(response => response.text()) .then(response => response.text())
.then(gpxData => { .then(gpxData => {
new L.GPX(gpxData, {async: true}).on('loaded', function (e) { new L.GPX(gpxData, {
async: true,
marker_options: {
startIconUrl: '/static/pin-icon-start.png',
endIconUrl: '/static/pin-icon-end.png',
shadowUrl: '/static/pin-shadow.png'
}
}).on('loaded', function (e) {
map.fitBounds(e.target.getBounds()); map.fitBounds(e.target.getBounds());
}).addTo(map); }).addTo(map);
}) })