Move custom profile in sidebar

This commit is contained in:
Gautier Pelloux-Prayer 2017-04-25 11:37:35 +02:00
parent 3cc0a3b9ee
commit 474901cfc4
4 changed files with 22 additions and 32 deletions

View file

@ -25,7 +25,8 @@
"leaflet.locatecontrol": "^0.60.0", "leaflet.locatecontrol": "^0.60.0",
"font-awesome": "^4.7.0", "font-awesome": "^4.7.0",
"bootstrap-select": "hugdx/bootstrap-select#patch-1", "bootstrap-select": "hugdx/bootstrap-select#patch-1",
"leaflet-sidebar": "^0.1.9" "leaflet-sidebar": "^0.1.9",
"autosize": "^3.0.20"
}, },
"overrides": { "overrides": {
"leaflet": { "leaflet": {
@ -98,6 +99,9 @@
"css/font-awesome.css", "css/font-awesome.css",
"fonts/*" "fonts/*"
] ]
},
"autosize": {
"main": "dist/autosize.js"
} }
} }
} }

View file

@ -102,7 +102,7 @@ footer {
} }
/* track messages (data tab) */ /* track messages (data tab) */
#tab_data { #tab_data, #profile_upload {
font-size: x-small; font-size: x-small;
} }

View file

@ -19,8 +19,6 @@
</div> </div>
<div class="collapse navbar-toggleable-sm" id="collapsingNavbar"> <div class="collapse navbar-toggleable-sm" id="collapsingNavbar">
<div class="nav navbar-nav"> <div class="nav navbar-nav">
<a class="nav-item nav-link" href="" data-toggle="modal" data-target="#options">
<span class="fa fa-lg fa-cog"></span>&nbsp;Options</a>
<div class="nav-item dropdown"> <div class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false"> <a class="nav-link dropdown-toggle" href="" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
<span class="fa fa-lg fa-cloud-download"></span>&nbsp;Download</a> <span class="fa fa-lg fa-cloud-download"></span>&nbsp;Download</a>
@ -115,33 +113,6 @@
</div> </div>
</div> </div>
<!-- Options modal window -->
<div class="modal fade" id="options" tabindex="-1" role="dialog" aria-labelledby="Help window" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title">Options</h4>
</div>
<div class="modal-body">
<form>
<label for="profile_upload">Custom routing profile:</label>
<textarea class="form-control" type="text" id="profile_upload" spellcheck="false" wrap="off" rows="5"></textarea>
<div id="profile_message"></div>
<div class="form-group" id="profile_buttons">
<button id="clear" type="button" class="btn btn-sm"><span class="fa fa-eraser"></span> Clear</button>
<button id="upload" type="button" class="btn btn-sm" data-uploading-text="Uploading…"><span class="fa fa-cloud-upload"></span> Upload</button>
<a href="http://brouter.de/brouter/costfunctions.html" target="_blank" class="btn btn-sm btn-info pull-right"><span class="fa fa-question"></span> Help</a>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- About modal window --> <!-- About modal window -->
<div class="modal fade" id="about" tabindex="-1" role="dialog" aria-labelledby="About window" aria-hidden="true"> <div class="modal fade" id="about" tabindex="-1" role="dialog" aria-labelledby="About window" aria-hidden="true">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
@ -198,6 +169,17 @@
<div id="sidebar"> <div id="sidebar">
<form>
<label for="profile_upload">Custom routing profile</label>
<textarea class="form-control" type="text" id="profile_upload" spellcheck="false" wrap="off" placeholder="Write your custom profile here."></textarea>
<div id="profile_message"></div>
<div class="form-group" id="profile_buttons">
<button id="clear" type="button" class="btn btn-sm"><span class="fa fa-eraser"></span> Clear</button>
<button id="upload" type="button" class="btn btn-sm" data-uploading-text="Uploading…"><span class="fa fa-cloud-upload"></span> Upload</button>
<a href="http://brouter.de/brouter/costfunctions.html" target="_blank" class="btn btn-sm btn-info pull-right"><span class="fa fa-question"></span> Help</a>
</div>
</form>
<ul id="tab" class="nav nav-tabs" role="tablist"> <ul id="tab" class="nav nav-tabs" role="tablist">
</ul> </ul>
<div class="tab-content"> <div class="tab-content">

View file

@ -5,6 +5,7 @@ BR.Profile = L.Class.extend({
L.DomUtil.get('upload').onclick = L.bind(this._upload, this); L.DomUtil.get('upload').onclick = L.bind(this._upload, this);
L.DomUtil.get('clear').onclick = L.bind(this.clear, this); L.DomUtil.get('clear').onclick = L.bind(this.clear, this);
this.ele = L.DomUtil.get('profile_upload'); this.ele = L.DomUtil.get('profile_upload');
autosize(this.ele);
this.message = new BR.Message('profile_message', { this.message = new BR.Message('profile_message', {
alert: true alert: true
}); });
@ -15,7 +16,8 @@ BR.Profile = L.Class.extend({
evt.preventDefault(); evt.preventDefault();
this.ele.value = null; this.ele.value = null;
this.ele.defaultValue = this.ele.value; this.ele.defaultValue = null;
autosize.update(this.ele);
this.fire('clear'); this.fire('clear');
button.blur(); button.blur();
@ -43,11 +45,13 @@ BR.Profile = L.Class.extend({
if (!this.profileName || this.profileName === profileName) { if (!this.profileName || this.profileName === profileName) {
ele.value = profileText; ele.value = profileText;
ele.defaultValue = ele.value; ele.defaultValue = ele.value;
autosize.update(this.ele);
} }
}, this)); }, this));
} else { } else {
ele.value = this.cache[profileName]; ele.value = this.cache[profileName];
ele.defaultValue = ele.value; ele.defaultValue = ele.value;
autosize.update(this.ele);
} }
} }
}, },