From 474901cfc42fe95621333ff40ef97094bfec5dbb Mon Sep 17 00:00:00 2001
From: Gautier Pelloux-Prayer <gautier+git@damsy.net>
Date: Tue, 25 Apr 2017 11:37:35 +0200
Subject: [PATCH] Move custom profile in sidebar

---
 bower.json            |  6 +++++-
 css/style.css         |  2 +-
 index.html            | 40 +++++++++++-----------------------------
 js/control/Profile.js |  6 +++++-
 4 files changed, 22 insertions(+), 32 deletions(-)

diff --git a/bower.json b/bower.json
index c661863..8e3bda3 100644
--- a/bower.json
+++ b/bower.json
@@ -25,7 +25,8 @@
     "leaflet.locatecontrol": "^0.60.0",
     "font-awesome": "^4.7.0",
     "bootstrap-select": "hugdx/bootstrap-select#patch-1",
-    "leaflet-sidebar": "^0.1.9"
+    "leaflet-sidebar": "^0.1.9",
+    "autosize": "^3.0.20"
   },
   "overrides": {
     "leaflet": {
@@ -98,6 +99,9 @@
         "css/font-awesome.css",
         "fonts/*"
       ]
+    },
+    "autosize": {
+      "main":  "dist/autosize.js"
     }
   }
 }
diff --git a/css/style.css b/css/style.css
index cfa57f8..b7b7991 100644
--- a/css/style.css
+++ b/css/style.css
@@ -102,7 +102,7 @@ footer {
 }
 
 /* track messages (data tab) */
-#tab_data {
+#tab_data, #profile_upload {
     font-size: x-small;
 }
 
diff --git a/index.html b/index.html
index 441ad79..17cd62f 100644
--- a/index.html
+++ b/index.html
@@ -19,8 +19,6 @@
         </div>
         <div class="collapse navbar-toggleable-sm" id="collapsingNavbar">
             <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">
                     <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>
@@ -115,33 +113,6 @@
         </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 -->
     <div class="modal fade" id="about" tabindex="-1" role="dialog" aria-labelledby="About window" aria-hidden="true">
         <div class="modal-dialog" role="document">
@@ -198,6 +169,17 @@
 
 
     <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>
             <div class="tab-content">
diff --git a/js/control/Profile.js b/js/control/Profile.js
index 41c1c3d..2a45dd0 100644
--- a/js/control/Profile.js
+++ b/js/control/Profile.js
@@ -5,6 +5,7 @@ BR.Profile = L.Class.extend({
         L.DomUtil.get('upload').onclick = L.bind(this._upload, this);
         L.DomUtil.get('clear').onclick = L.bind(this.clear, this);
         this.ele = L.DomUtil.get('profile_upload');
+        autosize(this.ele);
         this.message = new BR.Message('profile_message', {
             alert: true
         });
@@ -15,7 +16,8 @@ BR.Profile = L.Class.extend({
 
         evt.preventDefault();
         this.ele.value = null;
-        this.ele.defaultValue = this.ele.value;
+        this.ele.defaultValue = null;
+        autosize.update(this.ele);
 
         this.fire('clear');
         button.blur();
@@ -43,11 +45,13 @@ BR.Profile = L.Class.extend({
                     if (!this.profileName || this.profileName === profileName) {
                         ele.value = profileText;
                         ele.defaultValue = ele.value;
+                        autosize.update(this.ele);
                     }
                 }, this));
             } else {
                 ele.value = this.cache[profileName];
                 ele.defaultValue = ele.value;
+                autosize.update(this.ele);
             }
         }
     },