2016-03-31 17:06:21 -06:00
{% extends 'templates/base.html' %}
2017-04-13 22:45:25 -06:00
{% block title %}{{super()}}{% if mapuser.name %} | {{mapuser.name}}{% endif %}{% endblock %}
2016-03-31 17:06:21 -06:00
{% block head %}
2016-06-04 04:54:57 -06:00
{{super()}}
2017-08-22 17:32:25 -06:00
< link href = "/static/css/.map.min.css" rel = "stylesheet" >
2017-04-14 18:18:20 -06:00
< style > / * T h e s e s t y l e s i n c l u d e v a l u e s p a s s e d f r o m t o t h e t e m p l a t e f r o m t h e s e r v e r . O t h e r s t y l e s a r e i n m a p . c s s * /
2017-08-22 17:32:25 -06:00
{% if noHeader!='0' %} main { top: 0; } {% endif %}
2016-03-31 17:06:21 -06:00
2017-09-27 12:11:49 -06:00
{% if mapuser.settings.showStreetview and disp=='2' %}
2016-03-31 17:06:21 -06:00
/* show both */
2016-05-31 21:54:21 -06:00
@media (orientation: landscape) {
2017-09-16 20:33:27 -06:00
#map, #view {
2017-04-14 18:18:20 -06:00
display: inline-block;
width: 50%;
height: 100%;
}
2017-09-16 20:33:27 -06:00
#view { float:right; }
2016-03-31 17:06:21 -06:00
}
@media (orientation: portrait) {
2017-09-16 20:33:27 -06:00
#map, #view {
2017-04-14 18:18:20 -06:00
width: 100%;
height: 50%;
2016-03-31 17:06:21 -06:00
}
2017-09-16 20:33:27 -06:00
#view { bottom:0; }
2016-06-04 04:54:57 -06:00
}
2016-05-31 21:54:21 -06:00
{% elif mapuser.settings.showStreetview and disp=='1' %}
2016-03-31 17:06:21 -06:00
/* show streetview */
2017-04-14 18:18:20 -06:00
#map { display:none; }
2017-09-16 20:33:27 -06:00
#view {
2017-04-14 18:18:20 -06:00
width: 100%;
height: 100%;
}
2016-03-31 17:06:21 -06:00
{% else %}
/* show map */
#map {
2017-04-14 18:18:20 -06:00
width: 100%;
height: 100%;
}
2017-09-16 20:33:27 -06:00
#view { display:none; }
2016-03-31 17:06:21 -06:00
{% endif %}
< / style >
{% endblock %}
{% block main %}
2016-06-04 04:54:57 -06:00
2017-05-08 18:12:58 -06:00
{% if user and newuserurl %}
2017-05-19 18:21:49 -06:00
< div class = 'page-mask' > < / div >
2017-05-19 16:45:18 -06:00
< div id = 'welcome' class = 'popup' >
2017-05-08 18:12:58 -06:00
2017-05-19 18:21:49 -06:00
< div class = 'topbar' >
< h2 > Welcome!< / h2 >
< div class = 'close' onclick = "$('#welcome').hide();$('.page-mask').hide();" > ✖️< / div >
< / div >
< p > This is your map. It's publicly avaliable at < a href = "{{newuserurl}}" > {{newuserurl}}< / a > . You can change that URL and other settings in < b > < a href = "/settings" > settings< / a > < / b > . Set your location by clicking < b > set< / b > below. Clear it by clicking < b > clear< / b > . To track your location, click < b > track< / b > or download the < a href = "/android" > android app< / a > . For more information, see the < b > < a href = "/help" > help< / a > < / b > page. < / p >
< div class = 'buttons' >
< a class = 'btn main' onclick = "$('#welcome').hide();$('.page-mask').hide();" > Got it!< / a >
< / div >
2017-05-08 18:12:58 -06:00
< / div >
{% endif %}
2017-09-27 12:11:49 -06:00
<!-- Map -->
{% if disp!='1' %}
< div id = 'map' > < / div >
{% endif %}
<!-- Streetview -->
2017-09-27 21:03:39 -06:00
{% if mapuser.settings.showStreetview and disp!='0' %}
2017-09-27 12:11:49 -06:00
< div id = 'view' > < img id = 'viewImg' alt = "Streetview image" / > < / div >
{% endif %}
2016-06-04 04:54:57 -06:00
2017-04-14 18:18:20 -06:00
< div id = 'notset' class = 'centered alert alert-warning' >
2016-05-31 21:54:21 -06:00
{% if user.id == mapuser.id %}
2017-04-14 18:18:20 -06:00
Your location is unset. You can click 'set' below to set it to your current position.
{% else %}
This user has no location set.
2016-05-31 21:54:21 -06:00
{% endif %}
2016-03-31 17:06:21 -06:00
< / div >
2017-06-27 11:49:36 -06:00
{% if user.id == mapuser.id and mapuser._id != 'demo' %}
2017-08-22 17:32:25 -06:00
< link rel = "stylesheet" type = "text/css" href = "/static/css/.controls.min.css" >
2017-04-14 18:18:20 -06:00
< div id = 'controls' >
{% if mapuser.settings.showStreetview and disp!='0' %}
< style >
@media (orientation: portrait) {
#controls { bottom:30px }
}
< / style >
{% endif %}
2017-03-13 23:52:54 -06:00
2017-04-17 23:05:54 -06:00
< button id = 'set-loc' class = 'btn set' title = "Click here to set your location" > Set< / button >
2017-04-26 22:49:11 -06:00
< button id = 'track-loc' class = 'btn track' title = "Click here to track your location" > < i class = 'fa fa-crosshairs' > < / i > Track< / button >
2017-04-17 23:05:54 -06:00
< button id = 'clear-loc' class = 'btn clear' title = "Click here to clear your location" > Clear< / button >
2017-04-13 22:45:25 -06:00
2017-04-14 18:18:20 -06:00
< / div >
{% endif %}
{% endblock %}
{% block javascript %}
{{super()}}
2017-06-23 12:33:17 -06:00
2017-06-23 09:54:33 -06:00
<!-- Variables from server - side -->
< script >
2017-04-14 18:18:20 -06:00
const mapuser = JSON.parse('{{mapuser |dump|safe}}'),
2017-06-23 12:33:17 -06:00
mapKey = "{{mapApi |safe}}",
2017-04-25 11:44:11 -06:00
noHeader = "{{noHeader |safe}}",
disp = "{{disp |safe}}", // 0=map, 1=streetview, 2=both
userid = "{{user._id |safe}}",
token = "{{user.sk32 |safe}}";
2016-03-31 17:06:21 -06:00
< / script >
2016-06-12 18:18:34 -06:00
2017-06-23 12:35:23 -06:00
<!-- Webpacked bundles -->
2017-06-30 13:03:59 -06:00
< script type = "application/javascript" src = "/static/js/.map.bun.js" > < / script >
2017-11-05 11:06:37 -07:00
<!-- {% if user.id == mapuser.id %} -->
<!-- <script type="application/javascript" src="/static/js/.controls.bun.js"></script> -->
<!-- {% endif %} -->
2017-06-23 12:33:17 -06:00
2017-08-22 17:32:25 -06:00
{% endblock %}