2016-03-31 17:06:21 -06:00
{% extends 'templates/base.html' %}
2016-04-25 00:37:32 -06:00
{% block title %}{{super()}} | Dashboard{% endblock %}
2016-03-31 17:06:21 -06:00
{% block head %}
2016-04-25 00:37:32 -06:00
{{super()}}
2016-03-31 17:06:21 -06:00
< style >
.google-play {
width:150px;
border: #fbc93d solid 1px;
border-radius:10px; }
< / style >
{% endblock %}
{% block main %}
< section class = 'dark' >
< div class = 'container' >
2016-04-25 00:37:32 -06:00
< h1 > Welcome{% if user.name %}, {{user.name}}{% endif %}!< / h1 >
< p > To view your location, use this link: < a href = "/trac/{{ user.slug }}" > https://tracman.org/trac/{{user.slug}}< / a > < / p >
< p > You can also embed a map into your website with this code.  Be sure to set the width and height attributes to suit your circumstance.  < / p >
< pre > < iframe src=" https://tracman.org/trac/{{user.slug}}?noheader=1" width=" 90%" style=" height:90vh;" > < /iframe> < / pre >
2016-03-31 17:06:21 -06:00
< / div >
< br >
< div class = 'container' >
< h2 > App< / h2 >
2016-04-25 00:37:32 -06:00
< p > Click the button below to download the app from the google play store, if you haven't already.  < / p >
2016-03-31 17:06:21 -06:00
< p > < a href = "https://play.google.com/store/apps/details?id=us.keithirwin.tracman&utm_source=global_co&utm_medium=prtnr&utm_content=Mar2515&utm_campaign=PartBadge&pcampaignid=MKT-AC-global-none-all-co-pr-py-PartBadges-Oct1515-1" > < img class = 'google-play' alt = "Get it on Google Play" src = "https://play.google.com/intl/en_us/badges/images/apps/en-play-badge.png" / > < / a > < / p >
< p > Without the app running, your location won't update. But you can also set your location to this device's geolocation by clicking the button below. < / p >
< p > < button id = 'manual-set' class = 'btn' style = "display:block; margin:auto;" onclick = "setLocation()" > < i class = "fa fa-map-marker" > < / i >   Update location manually< / button > < / p >
< / div >
< br >
< div class = 'container' >
< h2 > Settings< / h2 >
< script src = "/static/js/validator.min.js" > < / script >
< form id = 'settings-form' class = 'col-lg-10 col-lg-offset-1 form-horizontal' data-toggle = "validator" role = "form" method = "post" >
2016-04-25 00:10:40 -06:00
< div id = 'name' class = 'form-group' title = "This appears in your page's title. " >
2016-03-31 17:06:21 -06:00
< label class = 'control-label col-sm-2 col-lg-3' for = "name" > Name< / label >
< div class = 'input-group col-xs-12 col-sm-10 col-lg-9' >
2016-04-25 00:37:32 -06:00
< input class = 'form-control' name = "name" type = "text" value = "{{user.name}}"
2016-03-31 17:06:21 -06:00
maxlength="160" data-error="Invalid input">< br >
< / div >
< div class = 'help-block with-errors col-xs-12 col-sm-10 col-sm-offset-2 col-lg-9 col-lg-offset-3' > < / div >
< / div >
2016-04-25 00:37:32 -06:00
< div id = 'slug' class = 'form-group' title = "This is the URL which shows your location. Be careful whom you share it with! " >
2016-03-31 17:06:21 -06:00
< label class = 'control-label col-sm-2 col-lg-3' for = "slug" > URL< / label >
< div class = 'input-group col-xs-12 col-sm-10 col-lg-9' >
< span class = 'input-group-addon' > tracman.org/trac/< / span >
2016-04-25 00:37:32 -06:00
< input class = 'form-control' type = "text" name = "slug" value = "{{user.slug}}" required data-remote = "/validate"
2016-03-31 17:06:21 -06:00
maxlength="160" data-remote-error="That URL is already taken. " data-error="Invalid input">< br >
< / div >
< div class = 'help-block with-errors col-xs-12 col-sm-10 col-sm-offset-2 col-lg-9 col-lg-offset-3' > < / div >
< / div >
2016-04-25 00:10:40 -06:00
< div id = 'units' class = 'form-group col-xs-12' title = "Select imperial units for feet and miles/hour. Select metric units if you are a commie. " >
2016-03-31 17:06:21 -06:00
< label class = 'control-label col-sm-4 col-lg-3' for = "units" > Units< / label >
< div class = 'input-group col-sm-8 col-lg-9' >
< div class = 'radio-inline' > < label >
< input type = "radio" name = "units" value = "imperial" { % if user . settings . units = = ' imperial ' % } checked { % endif % } >
Imperial
< / label > < / div >
< div class = 'radio-inline' > < label >
< input type = "radio" name = "units" value = "metric" { % if user . settings . units = = ' metric ' % } checked { % endif % } >
Metric
< / label > < / div >
< / div >
< / div >
2016-04-25 00:10:40 -06:00
< div id = 'defaultMap' class = 'form-group col-xs-12' title = "Shows whether to show a satellite image or standard google road map as the default on your page. Visitors will have the option to change this. Note that satellite images load slower. " >
2016-03-31 17:06:21 -06:00
< label class = 'control-label col-sm-4 col-lg-3' for = "map" > Default map< / label >
< div class = 'input-group col-sm-8 col-lg-9' >
< div class = 'radio-inline' > < label >
< input type = "radio" name = "map" value = "road" { % if user . settings . defaultMap = = ' road ' % } checked { % endif % } >
Road
< / label > < / div >
< div class = 'radio-inline' > < label >
< input type = "radio" name = "map" value = "sat" { % if user . settings . defaultMap = = ' sat ' % } checked { % endif % } >
Satellite
< / label > < / div >
< / div >
< / div >
2016-04-25 00:10:40 -06:00
< div id = 'defaultZoom' class = 'form-group col-xs-12' title = "Shows the initial map zoom level on your page. A higher number means more zoom. Note that the size of the viewing window will also have an effect on how much of the map a visitor can see. " >
2016-03-31 17:06:21 -06:00
< label class = 'control-label col-xs-6 col-sm-4 col-lg-3' for = "map" > Default zoom< / label >
< div class = 'input-group col-xs-6 col-sm-8 col-lg-9' >
< select class = 'c-select' name = "zoom" >
< option { % if user . settings . defaultZoom = =1 % } selected { % endif % } value = "1" > 1 World< / option >
< option { % if user . settings . defaultZoom = =2 % } selected { % endif % } value = "2" > 2< / option >
< option { % if user . settings . defaultZoom = =3 % } selected { % endif % } value = "3" > 3< / option >
< option { % if user . settings . defaultZoom = =4 % } selected { % endif % } value = "4" > 4< / option >
< option { % if user . settings . defaultZoom = =5 % } selected { % endif % } value = "5" > 5 Landmass< / option >
< option { % if user . settings . defaultZoom = =6 % } selected { % endif % } value = "6" > 6< / option >
< option { % if user . settings . defaultZoom = =7 % } selected { % endif % } value = "7" > 7< / option >
< option { % if user . settings . defaultZoom = =8 % } selected { % endif % } value = "8" > 8< / option >
< option { % if user . settings . defaultZoom = =9 % } selected { % endif % } value = "9" > 9< / option >
< option { % if user . settings . defaultZoom = =10 % } selected { % endif % } value = "10" > 10 City< / option >
< option { % if user . settings . defaultZoom = =11 % } selected { % endif % } value = "11" > 11< / option >
< option { % if user . settings . defaultZoom = =12 % } selected { % endif % } value = "12" > 12< / option >
< option { % if user . settings . defaultZoom = =13 % } selected { % endif % } value = "13" > 13< / option >
< option { % if user . settings . defaultZoom = =14 % } selected { % endif % } value = "14" > 14< / option >
< option { % if user . settings . defaultZoom = =15 % } selected { % endif % } value = "15" > 15 Streets< / option >
< option { % if user . settings . defaultZoom = =16 % } selected { % endif % } value = "16" > 16< / option >
< option { % if user . settings . defaultZoom = =17 % } selected { % endif % } value = "17" > 17< / option >
< option { % if user . settings . defaultZoom = =18 % } selected { % endif % } value = "18" > 18< / option >
< option { % if user . settings . defaultZoom = =19 % } selected { % endif % } value = "19" > 19< / option >
< option { % if user . settings . defaultZoom = =20 % } selected { % endif % } value = "20" > 20 Buildings< / option >
< / select >
< / div >
< / div >
2016-04-25 00:37:32 -06:00
< div id = 'showSpeed' class = 'form-group col-xs-12' title = "PRO ONLY! Shows a spedometer on the map." >
2016-03-31 17:06:21 -06:00
< label class = 'control-label col-xs-6 col-sm-4 col-lg-3' for = "showSpeed" > Show speed{% if not user.isPro %} < span class = 'red' > (PRO)< / span > {% endif %}< / label >
< div class = 'input-group col-xs-6 col-sm-8 col-lg-9' >
< input class = 'form-control' name = "showSpeed" type = "checkbox" { % if not user . isPro % } disabled { % elif user . settings . showSpeed % } checked { % else % } { % endif % } > < br >
< / div >
< / div >
2016-04-25 00:37:32 -06:00
< div id = 'showAltitude' class = 'form-group col-xs-12' title = "PRO ONLY! Shows the current elevation on the map. " >
2016-03-31 17:06:21 -06:00
< label class = 'control-label col-xs-6 col-sm-4 col-lg-3' for = "showAlt" > Show altitude{% if not user.isPro %} < span class = 'red' > (PRO)< / span > {% endif %}< / label >
< div class = 'input-group col-xs-6 col-sm-8 col-lg-9' >
< input class = 'form-control' name = "showAlt" type = "checkbox" { % if not user . isPro % } disabled { % elif user . settings . showAlt % } checked { % else % } { % endif % } > < br >
< / div >
< / div >
2016-04-25 00:37:32 -06:00
< div id = 'showStreet' class = 'form-group col-xs-12' title = "PRO ONLY! Shows a Google street view image from your current location, oriented in the direction of travel. This feature is EXPERIMENTAL. " >
2016-03-31 17:06:21 -06:00
< label class = 'control-label col-xs-6 col-sm-4 col-lg-3' for = "showStreet" > Show street view{% if not user.isPro %} < span class = 'red' > (PRO)< / span > < br > {% endif %} (experimental)< / label >
< div class = 'input-group col-xs-6 col-sm-8 col-lg-9' >
< input class = 'form-control' name = "showStreet" type = "checkbox" { % if not user . isPro % } disabled { % elif user . settings . showStreetview % } checked { % else % } { % endif % } > < br >
< / div >
< / div >
2016-04-25 00:10:40 -06:00
< div id = 'submit' class = 'form-group col-xs-12' style = "margin: 30px 0;" >
2016-03-31 17:06:21 -06:00
< input class = 'btn yellow col-xs-10 col-xs-offset-1 col-sm-offset-2 col-sm-4 col-lg-offset-3 col-lg-6' type = "submit" value = "Save" >
< / div >
< / form >
2016-04-25 00:37:32 -06:00
{% if not user.isPro %}< p style = "clear:both" > Want to try < a href = "/pro" > Tracman Pro< / a > ?  It's free during beta testing.  < / p > {% endif %}
< p style = "clear:both" > Would you like to submit a < a href = "/suggestion" > suggestion< / a > or < a href = "/bug" > bug report< / a > ?  < / p >
2016-03-31 17:06:21 -06:00
< / div >
< / section >
< script src = "https://cdn.socket.io/socket.io-1.2.0.js" > < / script >
< script >
var socket = io.connect();
socket.on('connect', function(){
2016-04-25 00:37:32 -06:00
socket.emit('room', 'app-{{user.id}}');
2016-03-31 17:06:21 -06:00
});
function setLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(pos){
socket.emit('app', {
2016-04-25 00:37:32 -06:00
usr: '{{user.id}}',
2016-03-31 17:06:21 -06:00
lat: pos.coords.latitude,
lon: pos.coords.longitude,
spd: (pos.coords.speed||0)
});
alert('Location updated! ');
location.reload();
}, function(err){
alert('ERROR: '+err);
}, { enableHighAccuracy:true });
2016-04-25 00:37:32 -06:00
} else { alert('Unable to set location. '); }
2016-03-31 17:06:21 -06:00
}
< / script >
{% endblock %}