Add setup for personal netsyms.com accounts (close #15)

www/img/accounticons/personal.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="512" height="512" version="1.1" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><rect y="-7.3828e-6" width="512" height="512" rx="70" ry="70" fill="#2196f3"/><path d="m198.56 65.838c-0.61516 0-1.1439-2.09e-4 -1.5723 0.15846-3.4273 1.2964-6.7936 12.993-8.3001 16.335-1.5064 3.3408-8.046 13.593-6.7492 17.021 1.2969 3.4258 12.995 6.7929 16.335 8.3001 3.3406 1.5061 13.615 8.0456 17.042 6.7492 3.4273-1.2964 6.7938-12.996 8.3001-16.335 1.5065-3.3419 8.0461-13.614 6.7492-17.042-1.297-3.4269-12.992-6.794-16.332-8.3001-2.9229-1.318-11.166-6.4753-15.473-6.8833zm-46.614 80.39c-0.61524 0-1.1438-1.9e-4 -1.5723 0.15845-3.4273 1.2964-6.7936 12.991-8.3001 16.332-1.5064 3.3397-8.046 13.594-6.7492 17.021 1.2969 3.428 12.995 6.794 16.335 8.3001 3.3406 1.5061 13.593 8.0486 17.021 6.7522 3.4273-1.2976 6.7938-12.994 8.3001-16.335 1.5065-3.3396 8.0461-13.614 6.7492-17.042-1.2969-3.428-12.995-6.794-16.335-8.3001-2.9229-1.318-11.142-6.4753-15.448-6.8832zm85.213 1.6149c-0.61515 0-1.1409 0.0125-1.5692 0.13713-3.4273 1.2964-6.7936 12.991-8.3001 16.332-1.5064 3.3396-8.049 13.617-6.7522 17.045 1.2969 3.4269 12.995 6.7898 16.335 8.2971 3.3405 1.5061 13.593 8.0486 17.021 6.7522 3.4272-1.2964 6.7937-12.993 8.3001-16.335 1.5065-3.3408 8.0461-13.614 6.7492-17.042-1.2969-3.4269-12.992-6.794-16.332-8.3001-2.9229-1.3191-11.145-6.4866-15.452-6.8832zm184.88 12.858c-0.61527 0-1.1439 0.0125-1.5723 0.13712-3.4273 1.2976-6.7936 12.992-8.3001 16.332-1.5064 3.3408-8.046 13.618-6.7492 17.045 1.2969 3.4269 12.995 6.794 16.335 8.3001 3.3406 1.5072 13.615 8.0456 17.042 6.7492 3.4273-1.2964 6.7937-12.992 8.3001-16.332 1.5065-3.3408 8.0492-13.618 6.7522-17.045-1.2969-3.4269-12.995-6.7929-16.335-8.3001-2.9229-1.318-11.166-6.4753-15.473-6.8832zm-181.29 66.705c-0.61513 0-1.1408 0.01-1.5692 0.13401-3.4273 1.2976-6.7937 12.996-8.3001 16.338-1.5064 3.3397-8.0491 13.614-6.7522 17.042 1.2969 3.4258 12.995 6.794 16.335 8.3001 3.3406 1.5061 13.615 8.0467 17.042 6.7492 3.4273-1.2964 6.7938-12.995 8.3001-16.335 1.5065-3.3408 8.0492-13.616 6.7522-17.042-1.2969-3.428-12.995-6.7929-16.335-8.3001-2.9229-1.318-11.166-6.4753-15.473-6.8832zm-127.35-0.75646c-0.61517 0-1.1652-2e-4 -1.5936 0.15845-3.4273 1.2964-6.7936 12.993-8.3001 16.335-1.5063 3.3408-8.0247 13.594-6.7279 17.021 1.297 3.4269 12.992 6.7918 16.332 8.3001 3.3405 1.5061 13.593 8.0456 17.021 6.7492 3.4273-1.2964 6.7937-12.991 8.3001-16.332 1.5065-3.3408 8.0492-13.596 6.7522-17.024-1.2969-3.4269-12.995-6.7899-16.335-8.2971-2.9229-1.3168-11.142-6.511-15.448-6.9076zm271.67 12.826c-0.61515 0-1.1652-2e-4 -1.5936 0.15845-3.4273 1.2976-6.7936 12.991-8.3001 16.332-1.5064 3.3396-8.0247 13.593-6.7278 17.021 1.297 3.4269 12.995 6.794 16.335 8.3001 3.3406 1.5072 13.593 8.0498 17.021 6.7522 3.4273-1.2976 6.7938-12.994 8.3001-16.335 1.5064-3.3397 8.0461-13.594 6.7492-17.021-1.2969-3.428-12.992-6.794-16.332-8.3001-2.9229-1.3191-11.145-6.5079-15.451-6.9046zm-310.31 72.355c-0.61524 0-1.1439 0.01-1.5723 0.13402-3.4273 1.2976-6.7936 12.994-8.3001 16.335-1.5064 3.3396-8.049 13.614-6.7522 17.042 1.297 3.428 12.995 6.794 16.335 8.3001 3.3406 1.5061 13.618 8.0486 17.045 6.7522 3.4273-1.2976 6.7938-12.994 8.3001-16.335 1.5065-3.3396 8.0248-13.615 6.7279-17.042-1.2969-3.428-12.995-6.794-16.335-8.3001-2.9229-1.3191-11.142-6.4753-15.448-6.8833zm178.46 0c-0.61524 0-1.1439 0.01-1.5723 0.13402-3.4273 1.2976-6.7936 12.994-8.3001 16.335-1.5064 3.3396-8.046 13.614-6.7492 17.042 1.2969 3.428 12.995 6.794 16.335 8.3001 3.3406 1.5061 13.615 8.0486 17.042 6.7522 3.4273-1.2976 6.7938-12.994 8.3001-16.335 1.5064-3.3396 8.0461-13.615 6.7492-17.042-1.2969-3.428-12.992-6.794-16.332-8.3001-2.9229-1.3191-11.166-6.4753-15.473-6.8833zm85.248 5.6469c-0.61526 0-1.1439 0.0125-1.5723 0.13712-3.4273 1.2976-6.7937 12.994-8.3001 16.335-1.5064 3.3408-8.046 13.614-6.7492 17.042 1.297 3.4258 12.995 6.794 16.335 8.3001 3.3406 1.5061 13.615 8.0498 17.042 6.7522 3.4273-1.2964 6.7937-12.996 8.3001-16.335 1.5064-3.3408 8.0461-13.616 6.7492-17.042-1.2969-3.428-12.992-6.7918-16.332-8.3001-2.9229-1.3168-11.166-6.4753-15.473-6.8832zm-39.507 79.948c-0.61519 0-1.1652-2.1e-4 -1.5936 0.15843-3.4273 1.2976-6.7936 12.994-8.3001 16.335-1.5063 3.3408-8.0491 13.594-6.7522 17.021 1.2969 3.4269 12.995 6.794 16.335 8.3001 3.3406 1.5061 13.618 8.0498 17.045 6.7522 3.4272-1.2964 6.7938-12.995 8.3001-16.335 1.5064-3.3408 8.0461-13.594 6.7492-17.021-1.2969-3.428-12.995-6.794-16.335-8.3001-2.9229-1.318-11.142-6.511-15.448-6.9076z" fill="#fff"/><g transform="translate(-2442.8 -889.49)" fill="#78bff8"><rect transform="rotate(23.45)" x="46.829" y="305.29" width="579.88" height="355.5"/><rect transform="rotate(203.45)" x="-671.27" y="41.806" width="579.88" height="355.5"/><rect transform="rotate(-66.55)" x="-429.2" y="509.73" width="579.88" height="355.5"/><rect transform="rotate(-66.55)" x="-427.02" y="-188.84" width="579.88" height="355.5"/></g></svg>

www/js/main.js

@@ -116,7 +116,7 @@ document.addEventListener("deviceready", function () {
             } else {
                 // No account data found, open setup
                 router.navigate({
-                    name: 'setup1'
+                    name: 'setup0'
                 });
             }
         })

www/js/setup1.js

@@ -10,6 +10,8 @@ setuppassword = "";
 setupsynckey = "";
 setupsyncurl = "";
 
+netsymscomurl = "http://skylar-desktop.home/accounthub/mobile/index.php";
+
 if (localStorage.getItem("firstrun") === null) {
     $("#setuptitle").text("Setup");
     $(".firstrun-only").css("display", "");
@@ -74,11 +76,13 @@ function manualshow() {
 }
 
 function checkAndSave(syncurl, username, key) {
+    app.preloader.show();
     $.post(syncurl, {
         username: username,
         key: key,
         action: "check_key"
     }, function (data) {
+        app.preloader.hide();
         if (data.status === 'OK') {
             setupusername = username;
             setupsyncurl = syncurl;
@@ -90,10 +94,41 @@ function checkAndSave(syncurl, username, key) {
             navigator.notification.alert(data.msg, null, "Error", 'Dismiss');
         }
     }, "json").fail(function () {
+        app.preloader.hide();
         navigator.notification.alert("Could not connect to the server.  Try again.", null, "Error", 'Dismiss');
     });
 }
 
+function personalsetup() {
+    app.preloader.show();
+    var username = $("#personal_username").val();
+    var password = $("#personal_password").val();
+
+    $.post(netsymscomurl, {
+        username: username,
+        password: password,
+        key: "NOKEY",
+        desc: device.platform + " " + device.model + " " + device.serial,
+        action: "generatesynccode"
+    }, function (result) {
+        app.preloader.hide();
+        if (result.status == "OK") {
+            var code = result.code;
+            var accid = addaccount(username, password, netsymscomurl, code);
+            switchaccount(accid);
+            localStorage.setItem("firstrun", "1");
+            navigator.notification.alert("Account connected!", null, "Success", 'Continue');
+            restartApplication();
+        } else if (result.status == "ERROR") {
+            navigator.notification.alert(result.message, null, "Error", 'Dismiss');
+        } else {
+            navigator.notification.alert("Something went wrong, please try again.", null, "Error", 'Dismiss');
+        }
+    }, "json").fail(function () {
+        app.preloader.hide();
+        navigator.notification.alert("Something went wrong, please try again.", null, "Error", 'Dismiss');
+    });
+}
 
 function scanCode() {
     try {

www/pages/accounts.html

@@ -28,7 +28,7 @@
                                 <div class="item-title">
                                     <i class="fas fa-user"></i> {{username}}
                                 </div>
-                                
+
                                 {{#if active}}
                                 <div class="item-after">
                                     <span class="badge color-green"><i class="fas fa-check"></i></span>
@@ -60,7 +60,7 @@
     </div>
 
     <div class="fab fab-right-bottom">
-        <a href="/setup/1">
+        <a href="/setup/0">
             <i class="material-icons">add</i>
         </a>
     </div>
@@ -72,7 +72,7 @@
             openAccountSwitcher(true);
         });
 
-        $(".view-main").on("click", ".accountlist-item", function () {
+        $(".view-main").on("click", ".accountlist-item .item-content", function () {
             var id = $(this).data("id");
             switchaccount(id);
         });

www/pages/setup0.html

@@ -0,0 +1,82 @@
+<!-- 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="setup0">
+
+    <div class="navbar">
+        <div class="navbar-inner">
+            <div class="title">Welcome!</div>
+        </div>
+    </div>
+
+
+    <div class="page-content">
+
+        <div class="block">
+            <p>Tap an option to get started.</p>
+        </div>
+
+        <div class="list">
+            <ul>
+                <li>
+                    <a href="#" class="item-link" onclick='router.navigate("/setup/1", {
+                                context: {
+                                    personal: true
+                                }
+                            });'>
+                        <div class="item-content">
+                            <div class="item-media">
+                                <img src="img/accounticons/personal.svg" width="44"/>
+                            </div>
+                            <div class="item-inner">
+                                <div class="item-title">
+                                    Personal
+                                </div>
+                                <div class="item-text">
+                                    Your netsyms.com account
+                                </div>
+                            </div>
+                        </div>
+                    </a>
+                </li>
+                <li>
+                    <a href="/setup/1" class="item-link">
+                        <div class="item-content">
+                            <div class="item-media">
+                                <img src="img/accounticons/business.svg" width="44"/>
+                            </div>
+                            <div class="item-inner">
+                                <div class="item-title">
+                                    Business
+                                </div>
+                                <div class="item-text">
+                                    Your netsyms.biz account
+                                </div>
+                            </div>
+                        </div>
+                    </a>
+                </li>
+                <li>
+                    <a href="/setup/1" class="item-link">
+                        <div class="item-content">
+                            <div class="item-media">
+                                <img src="img/accounticons/selfhosted.svg" width="44"/>
+                            </div>
+                            <div class="item-inner">
+                                <div class="item-title">
+                                    Other
+                                </div>
+                                <div class="item-text">
+                                    Your private or third-party server
+                                </div>
+                            </div>
+                        </div>
+                    </a>
+                </li>
+            </ul>
+        </div>
+
+    </div>
+
+</div>

www/pages/setup1.html

@@ -14,12 +14,46 @@
     <div class="page-content">
 
         <div class="block">
-            <p>Open AccountHub on another device and go to Sync settings.  Generate a mobile sync code, then press the button below to scan it.</p>
+            {{#if personal}}
+            <p>Type your netsyms.com username and password.</p>
+
+            <div class="list no-hairlines">
+                <ul>
+                    <li class="item-content item-input">
+                        <div class="item-inner">
+                            <div class="item-input-wrap">
+                                <input type="text" id="personal_username" placeholder="Username" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" />
+                                <span class="input-clear-button"></span>
+                            </div>
+                        </div>
+                    </li>
+
+                    <li class="item-content item-input">
+                        <div class="item-inner">
+                            <div class="item-input-wrap">
+                                <input type="password" id="personal_password" placeholder="Password" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" />
+                                <span class="input-clear-button"></span>
+                            </div>
+                        </div>
+                    </li>
+                </ul>
+            </div>
 
+            <div class="button button-fill" onclick="personalsetup()">
+                Continue
+            </div>
+
+            <hr />
+
+            <p>Or, scan a QR code with your phone camera.  Open your account dashboard on another device (like a computer) and go to Sync settings.  Generate a mobile sync code, then press the button below to scan it.</p>
+            {{else}}
+            <p>Open AccountHub on another device and go to Sync settings.  Generate a mobile sync code, then press the button below to scan it.</p>
+            {{/if}}
             <div class="row">
                 <button class="col button button-fill" onclick="scanCode()" id="scancodebtn">Scan Code</button>
                 <button class="col button" onclick="manualshow()" id="manualsetupbtn">Manual Setup</button>
             </div>
+
         </div>
 
         <div id="manual_setup" class="block" style="display: none;">

www/routes.js

@@ -11,9 +11,14 @@ var routes = [
         templateUrl: './pages/home.html',
         name: 'home'
     },
+    {
+        path: '/setup/0',
+        url: './pages/setup0.html',
+        name: 'setup0'
+    },
     {
         path: '/setup/1',
-        url: './pages/setup1.html',
+        templateUrl: './pages/setup1.html',
         name: 'setup1'
     },
     {