Added sync ID validation to login form and scan panel.

Fixed active css styles for Android. Removed add bookmark ids implementation for Android. Updated localised strings.
xbrowsersync · Jan 7, 2020 · 89abcf7 · 89abcf7
1 parent 00be3f9
commit 89abcf7
Show file tree

Hide file tree

Showing 14 changed files with 345 additions and 140 deletions.
diff --git a/css/styles.scss b/css/styles.scss
@@ -34,12 +34,15 @@ body {
 
   a {
     color: inherit;
+    border-bottom: 1px dotted $colour-text1;
     transition: all ease-in-out 0.2s;
     cursor: pointer;
-    border-bottom: 1px dotted #fff;
 
-    &.active,
-    &:active,
+    &:active {
+      color: $colour-link-highlight !important;
+      border-bottom-color: $colour-link-highlight !important;
+    }
+
     &:focus,
     &:hover {
       color: $colour-link-highlight;
@@ -67,7 +70,12 @@ body {
         padding: 0 1.2rem;
         line-height: 2.5rem;
 
-        &:not([disabled]):active,
+        &:not([disabled]):active {
+          background-color: $colour-text1 !important;
+          color: $colour-link-highlight !important;
+          border-color: $colour-text1 !important;
+        }
+
         &:not([disabled]):hover {
           background-color: $colour-text1;
           color: $colour-link-highlight;
@@ -114,8 +122,8 @@ body {
         z-index: 10;
 
         &:active {
-          background-color: $colour-link-highlight;
-          color: $colour-text1;
+          background-color: $colour-link-highlight !important;
+          color: $colour-text1 !important;
         }
 
         &.fixed {
@@ -132,7 +140,12 @@ body {
         transition: all ease-in-out 0.2s;
         border-radius: 0;
 
-        &:active,
+        &:active {
+          i {
+            opacity: 1 !important;
+          }
+        }
+
         &:hover,
         &:focus {
           i {
@@ -146,8 +159,6 @@ body {
         }
       }
 
-      &.active,
-      &.active:focus,
       &:active,
       &:active:focus,
       &:focus,
@@ -197,7 +208,6 @@ body {
     }
 
     a {
-      &.active,
       &:active,
       &:focus,
       &:hover {
@@ -365,6 +375,14 @@ body {
         background-color: #7db2be;
         z-index: 55;
 
+        &:active {
+          background: $colour-bg2 !important;
+        }
+
+        &:hover {
+          background: $colour-bg2;
+        }
+
         &:focus {
           border: 1px solid darken(#7db2be, 15%);
 
@@ -373,11 +391,6 @@ body {
           }
         }
 
-        &:active,
-        &:hover {
-          background: $colour-bg2;
-        }
-
         i {
           position: absolute;
           top: 50%;
@@ -576,7 +589,6 @@ body {
       a {
         border-bottom-color: $colour-text1;
 
-        &.active,
         &:active,
         &:focus,
         &:hover {
@@ -586,13 +598,15 @@ body {
     }
 
     a {
-      border-bottom-color: $colour-text2;
+      &:active {
+        color: $colour-link-highlight !important;
+        border-bottom-color: $colour-link-highlight !important;
+      }
 
-      &.active,
-      &:active,
       &:focus,
       &:hover {
-        border-bottom-color: inherit;
+        color: $colour-link-highlight;
+        border-bottom-color: $colour-link-highlight;
       }
     }
 
@@ -608,7 +622,12 @@ body {
       margin-top: 0.5rem;
       margin-bottom: 0.5rem;
 
-      &:not([disabled]):active,
+      &:not([disabled]):active {
+        background-color: $colour-text2 !important;
+        color: $colour-link-highlight !important;
+        border-color: $colour-text2 !important;
+      }
+
       &:not([disabled]):hover {
         background-color: $colour-text2;
         color: $colour-link-highlight;
@@ -666,6 +685,7 @@ body {
 
   input[type="text"] {
     width: 100%;
+    text-overflow: ellipsis;
   }
 
   #bookmarkForm {
@@ -714,7 +734,12 @@ body {
       line-height: 1.2rem;
       max-width: 99%;
 
-      &:active,
+      &:active {
+        i {
+          color: $colour-link-highlight !important;
+        }
+      }
+
       &:hover,
       &:focus {
         cursor: pointer;
@@ -815,6 +840,7 @@ body {
       font-family: $font-stack-code;
       line-height: 1.45rem;
       padding: 0.5rem 0.8rem;
+      border: 1px solid $colour-text1;
       @include placeholder {
         font-family: $font-stack-regular;
         font-size: 1.2rem;
@@ -831,7 +857,6 @@ body {
     max-width: 22rem;
 
     a {
-      &.active,
       &:active,
       &:focus,
       &:hover {
@@ -1122,7 +1147,6 @@ body {
   a {
     border-bottom-color: $colour-text2;
 
-    &.active,
     &:active,
     &:focus,
     &:hover {
@@ -1192,7 +1216,6 @@ body {
       a {
         border-bottom-color: $colour-link;
 
-        &.active,
         &:active,
         &:focus,
         &:hover {
@@ -1528,6 +1551,18 @@ body {
     width: 14rem;
     height: 14rem;
     opacity: 0.5;
+
+    &.error {
+      background-image: url("../img/scan_error.svg");
+    }
+  }
+
+  .validation {
+    position: absolute;
+    top: 50%;
+    margin-top: -2.5em;
+    font-size: 1rem;
+    padding: 0.25em 1em;
   }
 
   .view-content {

diff --git a/img/scan_error.svg b/img/scan_error.svg
diff --git a/js/app.js b/js/app.js
@@ -129,6 +129,7 @@ xBrowserSync.App.Controller = function ($q, $timeout, platform, globals, api, ut
     vm.platformName = undefined;
 
     vm.scanner = {
+      invalidSyncId: false,
       lightEnabled: false
     };
 
@@ -999,7 +1000,7 @@ xBrowserSync.App.Controller = function ($q, $timeout, platform, globals, api, ut
         // Display alert
         var errMessage = utility.GetErrorMessageFromException(err);
         vm.alert.display(errMessage.title, errMessage.message, 'danger');
-      })
+      });
   };
 
   var init_infoView = function () {
@@ -1032,6 +1033,7 @@ xBrowserSync.App.Controller = function ($q, $timeout, platform, globals, api, ut
     vm.sync.showPassword = false;
     vm.sync.upgradeConfirmed = false;
     if (vm.syncForm) {
+      vm.syncForm.txtId.$setValidity('InvalidSyncId', true);
       vm.syncForm.$setPristine();
       vm.syncForm.$setUntouched();
     }
@@ -2092,7 +2094,13 @@ xBrowserSync.App.Controller = function ($q, $timeout, platform, globals, api, ut
   };
 
   var syncForm_SyncId_Change = function () {
-    platform.LocalStorage.Set(globals.CacheKeys.SyncId, vm.sync.id);
+    if (!vm.sync.id || utility.SyncIdIsValid(vm.sync.id)) {
+      vm.syncForm.txtId.$setValidity('InvalidSyncId', true);
+      platform.LocalStorage.Set(globals.CacheKeys.SyncId, vm.sync.id);
+    }
+    else {
+      vm.syncForm.txtId.$setValidity('InvalidSyncId', false);
+    }
   };
 
   var syncForm_SyncUpdates_Click = function () {

diff --git a/js/bookmarks.js b/js/bookmarks.js
@@ -263,31 +263,6 @@ xBrowserSync.App.Bookmarks = function ($q, $timeout, platform, globals, api, uti
     return bookmark;
   };
 
-  var findBookmarkInTree = function (id, tree, index) {
-    if (Array.isArray(tree)) {
-      tree = {
-        id: -1,
-        children: tree
-      };
-    }
-
-    if (tree.id === id) {
-      var path = [{ bookmark: tree, index: index }];
-      return { result: tree, path: path };
-    } else {
-      var children = tree.children || [];
-      for (var i = 0; i < children.length; i++) {
-        var child = children[i];
-        var tmp = findBookmarkInTree(id, child, i);
-        if (!_.isEmpty(tmp)) {
-          tmp.path.unshift({ bookmark: tree, index: index });
-          return tmp;
-        }
-      }
-      return {};
-    }
-  };
-
   var findCurrentUrlInBookmarks = function () {
     var currentUrl;
 
@@ -417,23 +392,6 @@ xBrowserSync.App.Bookmarks = function ($q, $timeout, platform, globals, api, uti
     return deferred.promise;
   };
 
-  var getNewBookmarkId = function (bookmarks, takenIds) {
-    var highestId = 0;
-    takenIds = takenIds || [0];
-
-    // Check existing bookmarks for highest id
-    eachBookmark(bookmarks, function (bookmark) {
-      if (!_.isUndefined(bookmark.id) && bookmark.id > highestId) {
-        highestId = bookmark.id;
-      }
-    });
-
-    // Compare highest id with supplied taken ids
-    highestId = _.max(takenIds) > highestId ? _.max(takenIds) : highestId;
-
-    return highestId + 1;
-  };
-
   var getSyncBookmarksToolbar = function () {
     // Get setting from local storage
     return platform.LocalStorage.Get(globals.CacheKeys.SyncBookmarksToolbar)
@@ -710,6 +668,31 @@ xBrowserSync.App.Bookmarks = function ($q, $timeout, platform, globals, api, uti
     ]);
   };
 
+  var findBookmarkInTree = function (id, tree, index) {
+    if (Array.isArray(tree)) {
+      tree = {
+        id: -1,
+        children: tree
+      };
+    }
+
+    if (tree.id === id) {
+      var path = [{ bookmark: tree, index: index }];
+      return { result: tree, path: path };
+    } else {
+      var children = tree.children || [];
+      for (var i = 0; i < children.length; i++) {
+        var child = children[i];
+        var tmp = findBookmarkInTree(id, child, i);
+        if (!_.isEmpty(tmp)) {
+          tmp.path.unshift({ bookmark: tree, index: index });
+          return tmp;
+        }
+      }
+      return {};
+    }
+  };
+
   var getCachedBookmarks = function () {
     // Get cached encrypted bookmarks from local storage
     return platform.LocalStorage.Get(globals.CacheKeys.Bookmarks)
@@ -741,6 +724,23 @@ xBrowserSync.App.Bookmarks = function ($q, $timeout, platform, globals, api, uti
       });
   };
 
+  var getNewBookmarkId = function (bookmarks, takenIds) {
+    var highestId = 0;
+    takenIds = takenIds || [0];
+
+    // Check existing bookmarks for highest id
+    eachBookmark(bookmarks, function (bookmark) {
+      if (!_.isUndefined(bookmark.id) && bookmark.id > highestId) {
+        highestId = bookmark.id;
+      }
+    });
+
+    // Compare highest id with supplied taken ids
+    highestId = _.max(takenIds) > highestId ? _.max(takenIds) : highestId;
+
+    return parseInt(highestId) + 1;
+  };
+
   var handleFailedSync = function (failedSync, err) {
     var clearCachedData;
 
@@ -1508,14 +1508,12 @@ xBrowserSync.App.Bookmarks = function ($q, $timeout, platform, globals, api, uti
     Each: eachBookmark,
     Export: exportBookmarks,
     FindBookmarkById: findBookmarkById,
-    FindBookmarkInTree: findBookmarkInTree,
     FindCurrentUrlInBookmarks: findCurrentUrlInBookmarks,
     GetBookmarks: getCachedBookmarks,
     GetContainer: getContainer,
     GetCurrentSync: getCurrentSync,
     GetExistingInXBookmarks: getExistingInXBookmarks,
     GetLookahead: getLookahead,
-    GetNewBookmarkId: getNewBookmarkId,
     GetSyncBookmarksToolbar: getSyncBookmarksToolbar,
     IsSeparator: isSeparator,
     QueueSync: queueSync,

diff --git a/js/global.js b/js/global.js
@@ -90,6 +90,7 @@ xBrowserSync.App.Global = function (platform) {
       Login_PasswordField_New_Description: 'login_PasswordField_New_Description',
       Login_IdField_Label: 'login_IdField_Label',
       Login_IdField_Description: 'login_IdField_Description',
+      Login_IdField_InvalidSyncId_Label: 'login_IdField_InvalidSyncId_Label',
       Login_ConfirmSync_Title: 'login_ConfirmSync_Title',
       Login_ConfirmSync_Message: 'login_ConfirmSync_Message',
       Login_DisableOtherSyncs_Title: 'login_DisableOtherSyncs_Title',