Add profile editor (close #6)

www/js/updateprofile.js

@@ -0,0 +1,39 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+
+function loadProfilePage() {
+    app.preloader.show();
+    callAPI("getprofile", {
+        key: localStorage.getItem("key"),
+    }, function (data) {
+        $("#name").val(data.profile.name);
+        $("#bio").val(data.profile.bio);
+        app.input.resizeTextarea($("#bio"));
+        app.preloader.hide();
+    }, function (msg) {
+        app.preloader.hide();
+        app.dialog.alert(msg, "Error loading profile");
+    });
+}
+
+function saveProfile() {
+    app.preloader.show();
+    callAPI("setprofile", {
+        key: localStorage.getItem("key"),
+        name: $("#name").val(),
+        bio: $("#bio").val()
+    }, function (data) {
+        app.preloader.hide();
+        app.toast.create({
+            text: "<i class=\"fas fa-check\"></i> Profile updated!",
+            closeTimeout: 2000
+        }).open();
+    }, function (msg) {
+        app.preloader.hide();
+        app.dialog.alert(msg, "Error saving profile");
+    });
+}

www/pages/home.html

@@ -110,7 +110,7 @@
                         Your position will be visible for one hour. The timer
                         will reset every time you push the button.
                     </div>
-                    <div class="card-footer display-block">
+                    <div class="card-footer display-block padding-vertical">
                         <div class="button button-large button-fill button-round button-raised" onclick="broadcastLocation()">
                             Broadcast
                         </div>

www/pages/updateprofile.html

@@ -0,0 +1,57 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+
+<div class="page" data-name="updateprofile">
+
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="left">
+                <a href="#" class="link icon-only back">
+                    <i class="icon icon-back"></i>
+                </a>
+            </div>
+            <div class="title">My Profile</div>
+            <div class="right">
+                <a href="" onclick="saveProfile()" class="link">
+                    <i class="fas fa-cloud-upload-alt"></i> <span>Save</span>
+                </a>
+            </div>
+        </div>
+    </div>
+
+
+    <div class="page-content">
+
+        <div class="block">
+
+            <div class="list no-hairlines-md">
+                <ul>
+                    <li class="item-content item-input">
+                        <div class="item-inner">
+                            <div class="item-title item-label">Name</div>
+                            <div class="item-input-wrap">
+                                <input type="text" id="name" placeholder="Your name" />
+                                <span class="input-clear-button"></span>
+                            </div>
+                        </div>
+                    </li>
+                    <li class="item-content item-input">
+                        <div class="item-inner">
+                            <div class="item-title item-label">About</div>
+                            <div class="item-input-wrap">
+                                <textarea id="bio" placeholder="Tell people about yourself" class="resizable"></textarea>
+                                <span class="input-clear-button"></span>
+                            </div>
+                        </div>
+                    </li>
+                </ul>
+            </div>
+
+        </div>
+
+    </div>
+
+    <script src="js/updateprofile.js"></script>
+
+</div>

www/routes.js

@@ -48,6 +48,16 @@ var routes = [
         templateUrl: './pages/moneysent.html',
         name: 'moneysent'
     },
+    {
+        path: '/updateprofile',
+        templateUrl: './pages/updateprofile.html',
+        name: 'updateprofile',
+        on: {
+            pageAfterIn: function () {
+                loadProfilePage();
+            }
+        }
+    },
     {
         path: '/settings',
         name: 'prefs',
@@ -70,6 +80,12 @@ var routes = [
                             text: '',
                             onclick: ""
                         },
+                        {
+                            setting: "updateprofile",
+                            title: "Update profile",
+                            text: "Set a name and tell people about you.",
+                            onclick: "router.navigate('/updateprofile')"
+                        },
                         {
                             setting: "account",
                             title: "Sign out",