Merge pull request #383 from bagage/feat/improve-mobile
Feat/improve mobile
This commit is contained in:
Norbert Renner
GitHub
commit
d3e344fd25
6 changed files with 442 additions and 245 deletions
137
css/style.css
137
css/style.css
|
|
@ -242,10 +242,6 @@ input#trackname:focus:invalid {
|
|||
display: flex;
|
||||
}
|
||||
|
||||
#profile_buttons {
|
||||
padding-top: 4px;
|
||||
}
|
||||
|
||||
/* track messages (data tab) */
|
||||
#tab_data,
|
||||
.CodeMirror {
|
||||
|
|
@ -788,3 +784,136 @@ table.dataTable.display tbody tr:hover.selected {
|
|||
.leaflet-control-layers-selector[disabled] ~ span {
|
||||
color: #777;
|
||||
}
|
||||
|
||||
/* make modals fullscreen on small devices (code from bootstrap 5) */
|
||||
.modal-fullscreen {
|
||||
width: 100vw;
|
||||
max-width: none;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
.modal-fullscreen .modal-content {
|
||||
height: 100%;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
.modal-fullscreen .modal-header {
|
||||
border-radius: 0;
|
||||
}
|
||||
.modal-fullscreen .modal-body {
|
||||
overflow-y: auto;
|
||||
}
|
||||
.modal-fullscreen .modal-footer {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
.modal-fullscreen-sm-down {
|
||||
width: 100vw;
|
||||
max-width: none;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
.modal-fullscreen-sm-down .modal-content {
|
||||
height: 100%;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
.modal-fullscreen-sm-down .modal-header {
|
||||
border-radius: 0;
|
||||
}
|
||||
.modal-fullscreen-sm-down .modal-body {
|
||||
overflow-y: auto;
|
||||
}
|
||||
.modal-fullscreen-sm-down .modal-footer {
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
@media (max-width: 767.98px) {
|
||||
.modal-fullscreen-md-down {
|
||||
width: 100vw;
|
||||
max-width: none;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
.modal-fullscreen-md-down .modal-content {
|
||||
height: 100%;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
.modal-fullscreen-md-down .modal-header {
|
||||
border-radius: 0;
|
||||
}
|
||||
.modal-fullscreen-md-down .modal-body {
|
||||
overflow-y: auto;
|
||||
}
|
||||
.modal-fullscreen-md-down .modal-footer {
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
@media (max-width: 991.98px) {
|
||||
.modal-fullscreen-lg-down {
|
||||
width: 100vw;
|
||||
max-width: none;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
.modal-fullscreen-lg-down .modal-content {
|
||||
height: 100%;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
.modal-fullscreen-lg-down .modal-header {
|
||||
border-radius: 0;
|
||||
}
|
||||
.modal-fullscreen-lg-down .modal-body {
|
||||
overflow-y: auto;
|
||||
}
|
||||
.modal-fullscreen-lg-down .modal-footer {
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
@media (max-width: 1199.98px) {
|
||||
.modal-fullscreen-xl-down {
|
||||
width: 100vw;
|
||||
max-width: none;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
.modal-fullscreen-xl-down .modal-content {
|
||||
height: 100%;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
.modal-fullscreen-xl-down .modal-header {
|
||||
border-radius: 0;
|
||||
}
|
||||
.modal-fullscreen-xl-down .modal-body {
|
||||
overflow-y: auto;
|
||||
}
|
||||
.modal-fullscreen-xl-down .modal-footer {
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
@media (max-width: 1399.98px) {
|
||||
.modal-fullscreen-xxl-down {
|
||||
width: 100vw;
|
||||
max-width: none;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
.modal-fullscreen-xxl-down .modal-content {
|
||||
height: 100%;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
.modal-fullscreen-xxl-down .modal-header {
|
||||
border-radius: 0;
|
||||
}
|
||||
.modal-fullscreen-xxl-down .modal-body {
|
||||
overflow-y: auto;
|
||||
}
|
||||
.modal-fullscreen-xxl-down .modal-footer {
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
511
index.html
511
index.html
|
|
@ -11,6 +11,7 @@
|
|||
<link rel="stylesheet" href="dist/brouter-web.css" />
|
||||
<!-- endinject -->
|
||||
</head>
|
||||
|
||||
<body class="flexcolumn">
|
||||
<nav class="navbar navbar-expand-md navbar-dark bg-dark">
|
||||
<button
|
||||
|
|
@ -60,7 +61,7 @@
|
|||
aria-haspopup="true"
|
||||
aria-expanded="false"
|
||||
data-i18n="[title]keyboard.generic-shortcut"
|
||||
data-i18n-options='{ "action": "$t(navbar.export-tooltip)", "key": "X" }'
|
||||
data-i18n-options="{ 'action': '$t(navbar.export-tooltip)', 'key': 'X' }"
|
||||
title="Export route"
|
||||
>
|
||||
<span class="fa fa-lg fa-cloud-download" aria-hidden="true"> </span>
|
||||
|
|
@ -70,7 +71,6 @@
|
|||
<div class="nav-item dropdown">
|
||||
<a
|
||||
class="nav-link dropdown-toggle"
|
||||
href=""
|
||||
data-toggle="dropdown"
|
||||
href="#"
|
||||
role="button"
|
||||
|
|
@ -78,12 +78,12 @@
|
|||
aria-haspopup="true"
|
||||
aria-expanded="false"
|
||||
data-i18n="[title]navbar.load.tooltip"
|
||||
data-i18n-options='{
|
||||
"tracksAction": "$t(navbar.load.tracks)",
|
||||
"tracksKey": "O",
|
||||
"nogosAction": "$t(navbar.load.nogos)",
|
||||
"nogosKey": "$t(keyboard.shift)+O"
|
||||
}'
|
||||
data-i18n-options="{
|
||||
'tracksAction': '$t(navbar.load.tracks)',
|
||||
'tracksKey': 'O',
|
||||
'nogosAction': '$t(navbar.load.nogos)',
|
||||
'nogosKey': '$t(keyboard.shift)+O'
|
||||
}"
|
||||
title="Load route"
|
||||
>
|
||||
<span class="fa fa-lg fa-cloud-upload" aria-hidden="true"> </span>
|
||||
|
|
@ -100,7 +100,7 @@
|
|||
class="dropdown-item"
|
||||
data-i18n="trackasroute.title"
|
||||
data-toggle="modal"
|
||||
data-target="#loadedittrackdlg"
|
||||
data-target="#loadedittrack"
|
||||
href="#"
|
||||
id="navbarLoadEditTracks"
|
||||
>Track as Route</a
|
||||
|
|
@ -119,7 +119,7 @@
|
|||
<div
|
||||
class="nav-item"
|
||||
data-i18n="[title]keyboard.generic-shortcut"
|
||||
data-i18n-options='{ "action": "$t(about.tooltip)", "key": "H" }'
|
||||
data-i18n-options="{ 'action': '$t(about.tooltip)', 'key': 'H' }"
|
||||
title="Show more information about BRouter-Web"
|
||||
>
|
||||
<a class="nav-link" href="#" data-toggle="modal" data-target="#about"
|
||||
|
|
@ -140,7 +140,7 @@
|
|||
aria-labelledby="Credits window"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-dialog modal-fullscreen-md-down" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h4 class="modal-title" data-i18n="credits.title">Credits</h4>
|
||||
|
|
@ -181,6 +181,11 @@
|
|||
<h5 data-i18n="credits.map-tiles">Map tiles</h5>
|
||||
<dl id="credits-maps"></dl>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-primary" data-i18n="modal.close" data-dismiss="modal">
|
||||
Close
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -194,7 +199,7 @@
|
|||
aria-labelledby="Layers window"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="modal-dialog modal-lg" role="document">
|
||||
<div class="modal-dialog modal-lg modal-fullscreen-md-down" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h4 class="modal-title" data-i18n="layers.customize">Customize layers</h4>
|
||||
|
|
@ -261,7 +266,7 @@
|
|||
aria-labelledby="About window"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-dialog modal-fullscreen-md-down" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h4 class="modal-title" data-i18n="about.title">About</h4>
|
||||
|
|
@ -341,7 +346,7 @@
|
|||
on the client.
|
||||
</p>
|
||||
</div>
|
||||
<div class="modal-footer mt-4">
|
||||
<div class="modal-footer">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-secondary"
|
||||
|
|
@ -368,7 +373,7 @@
|
|||
aria-labelledby="What's new window"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="modal-dialog modal-lg" role="document">
|
||||
<div class="modal-dialog modal-lg modal-fullscreen-md-down" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h4 class="modal-title" data-i18n="whatsnew.title">What's new?</h4>
|
||||
|
|
@ -379,7 +384,7 @@
|
|||
<div class="modal-body">
|
||||
<!-- will be filled automatically -->
|
||||
</div>
|
||||
<div class="modal-footer mt-4">
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-primary" data-i18n="modal.close" data-dismiss="modal">
|
||||
Close
|
||||
</button>
|
||||
|
|
@ -388,83 +393,6 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Load nogos modal window -->
|
||||
<div
|
||||
class="modal fade"
|
||||
id="loadNogos"
|
||||
tabindex="-1"
|
||||
role="dialog"
|
||||
aria-labelledby="Load nogos window"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h4 class="modal-title" data-i18n="loadNogos.title">Load no-go areas</h4>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p id="nogoError" class="invalid-feedback" style="display: none"></p>
|
||||
<form>
|
||||
<fieldset>
|
||||
<legend data-i18n="loadNogos.source">Source</legend>
|
||||
<p>
|
||||
<input type="text" id="nogoJSON" hidden />
|
||||
<label for="nogoURL" data-i18n="loadNogos.url">URL: </label>
|
||||
<input type="text" name="nogoURL" id="nogoURL" /><br />
|
||||
or<br />
|
||||
<label for="nogoFile" data-i18n="loadNogos.file">File (.geojson): </label>
|
||||
<input type="file" accept=".geojson" name="nogoFile" id="nogoFile" />
|
||||
</p>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend data-i18n="loadNogos.defaultProperties">Default properties</legend>
|
||||
<p>
|
||||
<label for="nogoWeight" data-i18n="loadNogos.nogoWeight"
|
||||
>No-go weight (-1 means impassable):
|
||||
</label>
|
||||
<input type="number" name="nogoWeight" id="nogoWeight" value="-1" min="-1" />
|
||||
</p>
|
||||
<p>
|
||||
<label for="nogoRadius" data-i18n="loadNogos.nogoRadius"
|
||||
>No-go radius for points (in meters):
|
||||
</label>
|
||||
<input type="number" name="nogoRadius" id="nogoRadius" value="20" min="0" />
|
||||
</p>
|
||||
<p>
|
||||
<label for="nogoBuffer" data-i18n="loadNogos.nogoBuffer"
|
||||
>Buffer no-go areas (in meters):
|
||||
</label>
|
||||
<input type="number" name="nogoBuffer" id="nogoBuffer" value="0" min="0" />
|
||||
</p>
|
||||
</fieldset>
|
||||
<div class="modal-footer">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-secondary"
|
||||
data-i18n="[value]modal.close"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Close
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-i18n="[value]loadNogos.load"
|
||||
id="submitNogos"
|
||||
>
|
||||
Load
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Export modal window -->
|
||||
<div
|
||||
class="modal fade"
|
||||
|
|
@ -474,7 +402,7 @@
|
|||
aria-labelledby="Export route window"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-dialog modal-fullscreen-md-down" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h4 class="modal-title" data-i18n="export.title">Export route</h4>
|
||||
|
|
@ -565,26 +493,22 @@
|
|||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
<div class="modal-footer">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-secondary"
|
||||
data-i18n="modal.close"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Close
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary"
|
||||
data-i18n="export.title"
|
||||
id="submitExport"
|
||||
>
|
||||
Export route
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-i18n="modal.close" data-dismiss="modal">
|
||||
Close
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary"
|
||||
data-i18n="export.title"
|
||||
form="export"
|
||||
id="submitExport"
|
||||
>
|
||||
Export route
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -592,13 +516,13 @@
|
|||
<!-- Track to Route modal window -->
|
||||
<div
|
||||
class="modal fade"
|
||||
id="loadedittrackdlg"
|
||||
id="loadedittrack"
|
||||
tabindex="-1"
|
||||
role="dialog"
|
||||
aria-labelledby="Load Track as route"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-dialog modal-lg modal-fullscreen-md-down" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h4 class="modal-title" data-i18n="trackasroute.title">Load Track as Route</h4>
|
||||
|
|
@ -609,65 +533,81 @@
|
|||
</div>
|
||||
<div class="modal-body">
|
||||
<form name="loadedittrackForm" id="loadedittrackForm">
|
||||
<div class="form-group row mt-4">
|
||||
<label class="col-sm-3" for="loadedittrackFile" data-i18n="trackasroute.file"
|
||||
<div class="form-group row">
|
||||
<label
|
||||
class="col-form-label col-sm-3"
|
||||
for="loadedittrackFile"
|
||||
data-i18n="trackasroute.file"
|
||||
>Trackfile</label
|
||||
>
|
||||
<div class="custom-control custom-file col-sm-8">
|
||||
<input
|
||||
type="file"
|
||||
accept=".gpx,.kml,.geojson,*.*"
|
||||
name="loadedittrackFile"
|
||||
id="loadedittrackFile"
|
||||
class="custom-file-input"
|
||||
/>
|
||||
<label
|
||||
for="loadedittrackFile"
|
||||
class="custom-file-label"
|
||||
style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis"
|
||||
>
|
||||
</label
|
||||
><br />
|
||||
<div class="col-sm-9">
|
||||
<div class="custom-control custom-file">
|
||||
<input
|
||||
type="file"
|
||||
accept=".gpx,.kml,.geojson,*.*"
|
||||
name="loadedittrackFile"
|
||||
id="loadedittrackFile"
|
||||
class="custom-file-input"
|
||||
/>
|
||||
<label
|
||||
for="loadedittrackFile"
|
||||
class="custom-file-label"
|
||||
data-i18n="[data-browse]trackasroute.browse"
|
||||
style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis"
|
||||
>
|
||||
</label
|
||||
><br />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group row mt-4">
|
||||
<label class="col-sm-3" for="cb_showtracklayer" data-i18n="trackasroute.tracklayer"
|
||||
<div class="form-group row">
|
||||
<label
|
||||
class="col-form-label col-sm-3"
|
||||
for="cb_showtracklayer"
|
||||
data-i18n="trackasroute.tracklayer"
|
||||
>Track Layer</label
|
||||
>
|
||||
<div class="custom-control custom-switch">
|
||||
<input
|
||||
type="checkbox"
|
||||
class="custom-control-input"
|
||||
id="cb_showtracklayer"
|
||||
checked="checked"
|
||||
/>
|
||||
<label
|
||||
class="custom-control-label"
|
||||
for="cb_showtracklayer"
|
||||
data-i18n="trackasroute.explaintracklayer"
|
||||
>(show Track as separate Layer)</label
|
||||
>
|
||||
<div class="col-sm-9">
|
||||
<div class="custom-control custom-switch">
|
||||
<input
|
||||
type="checkbox"
|
||||
class="custom-control-input"
|
||||
id="cb_showtracklayer"
|
||||
checked="checked"
|
||||
/>
|
||||
<label
|
||||
class="custom-control-label"
|
||||
for="cb_showtracklayer"
|
||||
data-i18n="trackasroute.explaintracklayer"
|
||||
>(show Track as separate Layer)</label
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group row mt-4">
|
||||
<label class="col-sm-3" for="cb_showpois" data-i18n="trackasroute.showpois"
|
||||
<div class="form-group row">
|
||||
<label
|
||||
class="col-form-label col-sm-3"
|
||||
for="cb_showpois"
|
||||
data-i18n="trackasroute.showpois"
|
||||
>POI's</label
|
||||
>
|
||||
<div class="custom-control custom-switch">
|
||||
<input
|
||||
type="checkbox"
|
||||
class="custom-control-input"
|
||||
id="cb_showpois"
|
||||
checked="checked"
|
||||
/>
|
||||
<label
|
||||
class="custom-control-label"
|
||||
for="cb_showpois"
|
||||
data-i18n="trackasroute.explainpoi"
|
||||
>(show waypoints as POI's)</label
|
||||
>
|
||||
<div class="col-sm-9">
|
||||
<div class="custom-control custom-switch">
|
||||
<input
|
||||
type="checkbox"
|
||||
class="custom-control-input"
|
||||
id="cb_showpois"
|
||||
checked="checked"
|
||||
/>
|
||||
<label
|
||||
class="custom-control-label"
|
||||
for="cb_showpois"
|
||||
data-i18n="trackasroute.explainpoi"
|
||||
>(show waypoints as POI's)</label
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -693,17 +633,19 @@
|
|||
for="simplify_tolerance"
|
||||
class="col-sm-3"
|
||||
data-i18n="trackasroute.fuzziness"
|
||||
>fuzziness</label
|
||||
>Fuzziness</label
|
||||
>
|
||||
<input
|
||||
type="range"
|
||||
class="custom-range col-sm-8"
|
||||
id="simplify_tolerance"
|
||||
min="-500"
|
||||
max="500"
|
||||
step="any"
|
||||
value="0"
|
||||
/>
|
||||
<div class="col-sm-9">
|
||||
<input
|
||||
type="range"
|
||||
class="custom-range"
|
||||
id="simplify_tolerance"
|
||||
min="-500"
|
||||
max="500"
|
||||
step="any"
|
||||
value="0"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -715,26 +657,145 @@
|
|||
>
|
||||
Please wait!
|
||||
</div>
|
||||
<div class="modal-footer mt-4">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-secondary"
|
||||
data-i18n="modal.close"
|
||||
data-dismiss="modal"
|
||||
>
|
||||
Close
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
data-i18n="trackasroute.title"
|
||||
id="submitLoadEditTrack"
|
||||
>
|
||||
Import Track
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-i18n="modal.close" data-dismiss="modal">
|
||||
Close
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
form="loadedittrackForm"
|
||||
data-i18n="trackasroute.title"
|
||||
id="submitLoadEditTrack"
|
||||
>
|
||||
Import Track
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Load nogos modal window -->
|
||||
<div
|
||||
class="modal fade"
|
||||
id="loadNogos"
|
||||
tabindex="-1"
|
||||
role="dialog"
|
||||
aria-labelledby="Load nogos window"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="modal-dialog modal-lg modal-fullscreen-md-down" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h4 class="modal-title" data-i18n="loadNogos.title">Load no-go areas</h4>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p id="nogoError" class="invalid-feedback" style="display: none"></p>
|
||||
<form name="loadNogosForm">
|
||||
<fieldset>
|
||||
<legend data-i18n="loadNogos.source">Source</legend>
|
||||
<div>
|
||||
<input type="text" id="nogoJSON" hidden />
|
||||
<div class="form-group row">
|
||||
<label for="nogoURL" class="col-form-label col-sm-3" data-i18n="loadNogos.url"
|
||||
>URL</label
|
||||
>
|
||||
<div class="col-sm-9">
|
||||
<input type="text" name="nogoURL" id="nogoURL" />
|
||||
</div>
|
||||
</div>
|
||||
<p data-i18n="modal.or">or</p>
|
||||
<div class="form-group row">
|
||||
<label
|
||||
class="col-form-label col-sm-3"
|
||||
for="loadNogosFile"
|
||||
data-i18n="loadNogos.file"
|
||||
>File (.geojson)</label
|
||||
>
|
||||
<div class="col-sm-9">
|
||||
<div class="custom-control custom-file">
|
||||
<input
|
||||
type="file"
|
||||
accept=".geojson"
|
||||
name="loadNogosFile"
|
||||
id="loadNogosFile"
|
||||
class="custom-file-input"
|
||||
/>
|
||||
<label
|
||||
for="loadNogosFile"
|
||||
class="custom-file-label"
|
||||
data-i18n="[data-browse]trackasroute.browse"
|
||||
style="
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
"
|
||||
>
|
||||
</label
|
||||
><br />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend data-i18n="loadNogos.defaultProperties">Default properties</legend>
|
||||
<div class="form-group row">
|
||||
<label
|
||||
class="col-form-label col-sm-8"
|
||||
for="nogoWeight"
|
||||
data-i18n="loadNogos.nogoWeight"
|
||||
>No-go weight (-1 means impassable):
|
||||
</label>
|
||||
<div class="col-sm-3">
|
||||
<input type="number" name="nogoWeight" id="nogoWeight" value="-1" min="-1" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group row">
|
||||
<label
|
||||
class="col-form-label col-sm-8"
|
||||
for="nogoRadius"
|
||||
data-i18n="loadNogos.nogoRadius"
|
||||
>No-go radius for points (in meters):
|
||||
</label>
|
||||
<div class="col-sm-3">
|
||||
<input type="number" name="nogoRadius" id="nogoRadius" value="20" min="0" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group row">
|
||||
<label
|
||||
class="col-form-label col-sm-8"
|
||||
for="nogoBuffer"
|
||||
data-i18n="loadNogos.nogoBuffer"
|
||||
>Buffer no-go areas (in meters):
|
||||
</label>
|
||||
<div class="col-sm-3">
|
||||
<input type="number" name="nogoBuffer" id="nogoBuffer" value="0" min="0" />
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-i18n="modal.close" data-dismiss="modal">
|
||||
Close
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
form="loadNogosForm"
|
||||
data-i18n="loadNogos.load"
|
||||
id="submitNogos"
|
||||
>
|
||||
Load
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -747,11 +808,11 @@
|
|||
href="#tab_layers_control"
|
||||
role="tab"
|
||||
data-i18n="[title]sidebar.tab-tooltip"
|
||||
data-i18n-options='{
|
||||
"action": "$t(sidebar.layers.tooltip)",
|
||||
"toggleKey": "T",
|
||||
"switchKey": "$t(keyboard.shift)+T"
|
||||
}'
|
||||
data-i18n-options="{
|
||||
'action': '$t(sidebar.layers.tooltip)',
|
||||
'toggleKey': 'T',
|
||||
'switchKey': '$t(keyboard.shift)+T'
|
||||
}"
|
||||
title="Select layers"
|
||||
>
|
||||
<!--
|
||||
|
|
@ -763,7 +824,7 @@
|
|||
class="fa"
|
||||
width="1em"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
viewbox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2.2"
|
||||
|
|
@ -781,11 +842,11 @@
|
|||
href="#tab_itinerary"
|
||||
role="tab"
|
||||
data-i18n="[title]sidebar.tab-tooltip"
|
||||
data-i18n-options='{
|
||||
"action": "$t(sidebar.itinerary.tooltip)",
|
||||
"toggleKey": "T",
|
||||
"switchKey": "$t(keyboard.shift)+T"
|
||||
}'
|
||||
data-i18n-options="{
|
||||
'action': '$t(sidebar.itinerary.tooltip)',
|
||||
'toggleKey': 'T',
|
||||
'switchKey': '$t(keyboard.shift)+T'
|
||||
}"
|
||||
title="Show Itinerary"
|
||||
><i class="fa fa-map-signs"></i
|
||||
></a>
|
||||
|
|
@ -795,11 +856,11 @@
|
|||
href="#tab_profile"
|
||||
role="tab"
|
||||
data-i18n="[title]sidebar.tab-tooltip"
|
||||
data-i18n-options='{
|
||||
"action": "$t(sidebar.customize-profile.tooltip)",
|
||||
"toggleKey": "T",
|
||||
"switchKey": "$t(keyboard.shift)+T"
|
||||
}'
|
||||
data-i18n-options="{
|
||||
'action': '$t(sidebar.customize-profile.tooltip)',
|
||||
'toggleKey': 'T',
|
||||
'switchKey': '$t(keyboard.shift)+T'
|
||||
}"
|
||||
title="Customize profile"
|
||||
><i class="fa fa-wrench"></i
|
||||
></a>
|
||||
|
|
@ -809,11 +870,11 @@
|
|||
href="#tab_data"
|
||||
role="tab"
|
||||
data-i18n="[title]sidebar.tab-tooltip"
|
||||
data-i18n-options='{
|
||||
"action": "$t(sidebar.data.tooltip)",
|
||||
"toggleKey": "T",
|
||||
"switchKey": "$t(keyboard.shift)+T"
|
||||
}'
|
||||
data-i18n-options="{
|
||||
'action': '$t(sidebar.data.tooltip)',
|
||||
'toggleKey': 'T',
|
||||
'switchKey': '$t(keyboard.shift)+T'
|
||||
}"
|
||||
title="Show detailed route data table"
|
||||
><i class="fa fa-table"></i
|
||||
></a>
|
||||
|
|
@ -823,11 +884,11 @@
|
|||
href="#tab_analysis"
|
||||
role="tab"
|
||||
data-i18n="[title]sidebar.tab-tooltip"
|
||||
data-i18n-options='{
|
||||
"action": "$t(sidebar.analysis.tooltip)",
|
||||
"toggleKey": "T",
|
||||
"switchKey": "$t(keyboard.shift)+T"
|
||||
}'
|
||||
data-i18n-options="{
|
||||
'action': '$t(sidebar.analysis.tooltip)',
|
||||
'toggleKey': 'T',
|
||||
'switchKey': '$t(keyboard.shift)+T'
|
||||
}"
|
||||
title="Analyse route"
|
||||
><i class="fa fa-pie-chart"></i
|
||||
></a>
|
||||
|
|
@ -846,7 +907,8 @@
|
|||
<div class="leaflet-sidebar-pane" id="tab_layers_control">
|
||||
<h1 class="leaflet-sidebar-header">
|
||||
<span class="leaflet-sidebar-close"><i class="fa fa-caret-right"></i></span
|
||||
><span class="leaflet-sidebar-expand"><i class="fa fa-expand"></i></span
|
||||
><span class="d-none d-md-block leaflet-sidebar-expand"
|
||||
><i class="fa fa-expand"></i></span
|
||||
><span data-i18n="sidebar.layers.title">Layers</span>
|
||||
</h1>
|
||||
<div id="layers-control-wrapper"></div>
|
||||
|
|
@ -910,7 +972,8 @@
|
|||
<div class="leaflet-sidebar-pane" id="tab_profile">
|
||||
<h1 class="leaflet-sidebar-header">
|
||||
<span class="leaflet-sidebar-close"><i class="fa fa-caret-right"></i></span
|
||||
><span class="leaflet-sidebar-expand"><i class="fa fa-expand"></i></span
|
||||
><span class="d-none d-md-block leaflet-sidebar-expand"
|
||||
><i class="fa fa-expand"></i></span
|
||||
><span data-i18n="sidebar.customize-profile.title">Customize profile</span>
|
||||
</h1>
|
||||
<form class="flexcolumn flexgrow">
|
||||
|
|
@ -951,7 +1014,7 @@
|
|||
aria-labelledby="params-tab"
|
||||
>
|
||||
<div id="profile_params"></div>
|
||||
<div class="form-group" id="profile_buttons">
|
||||
<div class="form-group pt-1">
|
||||
<button id="save" type="button" class="btn btn-primary btn-sm">
|
||||
<span class="fa fa-cloud-upload"></span>
|
||||
<span data-i18n="sidebar.profile.apply">Apply</span>
|
||||
|
|
@ -973,7 +1036,7 @@
|
|||
placeholder="Write your custom profile here."
|
||||
></textarea>
|
||||
<div id="profile_message"></div>
|
||||
<div class="form-group" id="profile_buttons">
|
||||
<div class="form-group pt-1">
|
||||
<button id="upload" type="button" class="btn btn-primary btn-sm">
|
||||
<span class="fa fa-cloud-upload"></span>
|
||||
<span data-i18n="sidebar.profile.apply">Apply</span>
|
||||
|
|
@ -998,7 +1061,9 @@
|
|||
<div class="leaflet-sidebar-pane" id="tab_data">
|
||||
<h1 class="leaflet-sidebar-header">
|
||||
<span class="leaflet-sidebar-close"><i class="fa fa-caret-right"></i></span>
|
||||
<span class="leaflet-sidebar-expand"><i class="fa fa-expand"></i></span>
|
||||
<span class="d-none d-md-block leaflet-sidebar-expand"
|
||||
><i class="fa fa-expand"></i
|
||||
></span>
|
||||
<span
|
||||
id="data-sync-map"
|
||||
class="sync-map active"
|
||||
|
|
@ -1015,7 +1080,9 @@
|
|||
<h1 class="leaflet-sidebar-header">
|
||||
<span data-i18n="sidebar.itinerary.title">Itinerary</span
|
||||
><span class="leaflet-sidebar-close"><i class="fa fa-caret-right"></i></span
|
||||
><span class="leaflet-sidebar-expand"><i class="fa fa-expand"></i></span>
|
||||
><span class="d-none d-md-block leaflet-sidebar-expand"
|
||||
><i class="fa fa-expand"></i
|
||||
></span>
|
||||
</h1>
|
||||
<div id="itinerary" class="flexcolumn flexgrow"></div>
|
||||
</div>
|
||||
|
|
@ -1133,7 +1200,7 @@
|
|||
aria-expanded="false"
|
||||
aria-label="Toggle elevation chart"
|
||||
data-i18n="[title]keyboard.generic-shortcut"
|
||||
data-i18n-options='{ "action": "$t(footer.elevation-chart)", "key": "E" }'
|
||||
data-i18n-options="{ 'action': '$t(footer.elevation-chart)', 'key': 'E' }"
|
||||
title="Toggle elevation chart"
|
||||
>
|
||||
<span class="fa fa-area-chart"></span>
|
||||
|
|
|
|||
|
|
@ -156,13 +156,13 @@ BR.routeLoader = function (map, layersControl, routing, pois) {
|
|||
if (typeof isBusy === undefined) {
|
||||
isBusy = false;
|
||||
}
|
||||
if (isBusy === true) $('#loadedittrackdlg #msg_busy').removeClass('invisible');
|
||||
else $('#loadedittrackdlg #msg_busy').addClass('invisible');
|
||||
if (isBusy === true) $('#loadedittrack #msg_busy').removeClass('invisible');
|
||||
else $('#loadedittrack #msg_busy').addClass('invisible');
|
||||
},
|
||||
|
||||
onManualCollapse: function (e) {
|
||||
//workaround for starting with closed collapse
|
||||
if ($('#loadedittrackdlg').is(':hidden')) return;
|
||||
if ($('#loadedittrack').is(':hidden')) return;
|
||||
this._options.isTestMode = $(e.target).hasClass('show');
|
||||
|
||||
if (this._options.isTestMode) {
|
||||
|
|
@ -172,13 +172,13 @@ BR.routeLoader = function (map, layersControl, routing, pois) {
|
|||
},
|
||||
|
||||
onAdd: function (map) {
|
||||
$('#loadedittrackdlg').on(
|
||||
$('#loadedittrack').on(
|
||||
'hidden.bs.modal',
|
||||
function (e) {
|
||||
this.cleanup();
|
||||
}.bind(this)
|
||||
);
|
||||
$('#loadedittrackdlg').on(
|
||||
$('#loadedittrack').on(
|
||||
'show.bs.modal',
|
||||
function (e) {
|
||||
$('#manual_collapse').collapse('hide');
|
||||
|
|
@ -195,7 +195,7 @@ BR.routeLoader = function (map, layersControl, routing, pois) {
|
|||
function () {
|
||||
this.addRoutingPoints();
|
||||
this.onBusyChanged(false);
|
||||
$('#loadedittrackdlg').modal('hide');
|
||||
$('#loadedittrack').modal('hide');
|
||||
}.bind(this),
|
||||
0
|
||||
);
|
||||
|
|
@ -203,7 +203,7 @@ BR.routeLoader = function (map, layersControl, routing, pois) {
|
|||
setTimeout(
|
||||
function () {
|
||||
this.convertTrackLocal();
|
||||
$('#loadedittrackdlg').modal('hide');
|
||||
$('#loadedittrack').modal('hide');
|
||||
}.bind(this),
|
||||
0
|
||||
);
|
||||
|
|
@ -214,7 +214,7 @@ BR.routeLoader = function (map, layersControl, routing, pois) {
|
|||
L.DomUtil.get('loadedittrackFile').onchange = L.bind(this.onFileChanged, this);
|
||||
this.onFileChanged({ target: L.DomUtil.get('loadedittrackFile') });
|
||||
|
||||
this.setDialogDraggable($('#loadedittrackdlg .modal-header'));
|
||||
this.setDialogDraggable($('#loadedittrack .modal-header'));
|
||||
|
||||
$('#manual_collapse').collapse('hide');
|
||||
$('#manual_collapse').on(
|
||||
|
|
|
|||
|
|
@ -78,14 +78,14 @@
|
|||
},
|
||||
"loadNogos": {
|
||||
"defaultProperties": "Default properties",
|
||||
"file": "File (.geojson): ",
|
||||
"file": "File (.geojson)",
|
||||
"load": "Load",
|
||||
"nogoBuffer": "Buffer no-go areas (in meters): ",
|
||||
"nogoRadius": "No-go radius for points (in meters): ",
|
||||
"nogoWeight": "No-go weight (-1 means impassable): ",
|
||||
"nogoBuffer": "Buffer no-go areas (in meters)",
|
||||
"nogoRadius": "No-go radius for points (in meters)",
|
||||
"nogoWeight": "No-go weight (-1 means impassable)",
|
||||
"source": "Source",
|
||||
"title": "Load no-go areas",
|
||||
"url": "URL: "
|
||||
"url": "URL"
|
||||
},
|
||||
"map": {
|
||||
"attribution-osm-long": "OpenStreetMap contributors",
|
||||
|
|
@ -266,10 +266,11 @@
|
|||
},
|
||||
"title": "BRouter web client",
|
||||
"trackasroute": {
|
||||
"browse": "Browse",
|
||||
"explainpoi": "(show waypoints as POI's)",
|
||||
"explaintracklayer": "(show Track as separate Layer)",
|
||||
"file": "Trackfile",
|
||||
"fuzziness": "fuzziness",
|
||||
"fuzziness": "Fuzziness",
|
||||
"pleasewait": "Please wait!",
|
||||
"showpois": "POI's",
|
||||
"title": "Load Track as Route",
|
||||
|
|
|
|||
|
|
@ -43,7 +43,7 @@
|
|||
"async": "~0.9.2",
|
||||
"bootbox": "~5.3.4",
|
||||
"bootstrap": "4.3.1",
|
||||
"bootstrap-select": "1.13.6",
|
||||
"bootstrap-select": "1.13.18",
|
||||
"bootstrap-slider": "^9.8.1",
|
||||
"codemirror": "^5.35.0",
|
||||
"core-js-bundle": "^3.8.3",
|
||||
|
|
|
|||
|
|
@ -2747,10 +2747,10 @@ bootbox@~5.3.4:
|
|||
jquery ">=1.12.0"
|
||||
popper.js ">=1.12.9"
|
||||
|
||||
bootstrap-select@1.13.6:
|
||||
version "1.13.6"
|
||||
resolved "https://registry.yarnpkg.com/bootstrap-select/-/bootstrap-select-1.13.6.tgz#dc41f8a7385ab4e385562b400d4cf2422f5ef852"
|
||||
integrity sha512-MsOZjYVv0jjHOCUV6CG3J8MSsosrKL8MlA8DacMhMqFq43tTxMjjd7Czo5a/upKPNHW6asFq29oyKJTrPva6FQ==
|
||||
bootstrap-select@1.13.18:
|
||||
version "1.13.18"
|
||||
resolved "https://registry.yarnpkg.com/bootstrap-select/-/bootstrap-select-1.13.18.tgz#4557119d58dc1159189977161c803962220e4dda"
|
||||
integrity sha512-V1IzK4rxBq5FrJtkzSH6RmFLFBsjx50byFbfAf8jYyXROWs7ZpprGjdHeoyq2HSsHyjJhMMwjsQhRoYAfxCGow==
|
||||
|
||||
bootstrap-slider@^9.8.1:
|
||||
version "9.10.0"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue