From d611a0317e422944435c896a29fc7aa2b33d5aa3 Mon Sep 17 00:00:00 2001 From: Gunther Brunner Date: Thu, 25 Sep 2014 23:23:05 +0900 Subject: [PATCH] Add ADB Keys UI. --- .../nothing-to-show-directive.js | 1 + .../nothing-to-show/nothing-to-show.html | 3 +- .../settings/adb-keys/adb-keys-controller.js | 56 ++++++++++++++++++- res/app/settings/adb-keys/adb-keys.css | 33 ++++++++++- res/app/settings/adb-keys/adb-keys.jade | 54 ++++++++++++++++-- res/app/settings/adb-keys/index.js | 3 +- res/app/settings/settings-controller.js | 15 +++-- 7 files changed, 151 insertions(+), 14 deletions(-) diff --git a/res/app/components/stf/common-ui/nothing-to-show/nothing-to-show-directive.js b/res/app/components/stf/common-ui/nothing-to-show/nothing-to-show-directive.js index 085e914b..6418c2c9 100644 --- a/res/app/components/stf/common-ui/nothing-to-show/nothing-to-show-directive.js +++ b/res/app/components/stf/common-ui/nothing-to-show/nothing-to-show-directive.js @@ -1,6 +1,7 @@ module.exports = function () { return { restrict: 'EA', + transclude: true, scope: { icon: '@', message: '@' diff --git a/res/app/components/stf/common-ui/nothing-to-show/nothing-to-show.html b/res/app/components/stf/common-ui/nothing-to-show/nothing-to-show.html index e9d10964..2b5b579c 100644 --- a/res/app/components/stf/common-ui/nothing-to-show/nothing-to-show.html +++ b/res/app/components/stf/common-ui/nothing-to-show/nothing-to-show.html @@ -1,4 +1,5 @@
+

-
\ No newline at end of file + diff --git a/res/app/settings/adb-keys/adb-keys-controller.js b/res/app/settings/adb-keys/adb-keys-controller.js index 0209e33f..167c239f 100644 --- a/res/app/settings/adb-keys/adb-keys-controller.js +++ b/res/app/settings/adb-keys/adb-keys-controller.js @@ -1,3 +1,57 @@ -module.exports = function AdbKeysCtrl($scope) { +module.exports = function AdbKeysCtrl($scope, BrowserInfo) { + + $scope.adbKeys = [ + { + title: 'PC1264', + key: 'bb:86:60:39:d7:a2:e3:09:93:09:cc:f6:e8:37:99:3f' + }, + { + title: 'Mobile mac', + key: '97:ca:ae:fa:09:0b:c4:fe:22:94:7d:b2:be:77:66:a1' + } + ] + + $scope.removeKey = function (key) { + console.log('Remove key', key) + $scope.adbKeys.splice($scope.adbKeys.indexOf(key), 1) + } + + $scope.addKey = function () { + if ($scope.title && $scope.key) { + + $scope.adbKeys.push({ + title: $scope.title, + key: $scope.key + }) + + $scope.closeAddKey() + } + } + + var clientOS = 'PC' + if (BrowserInfo.ua.match(/Mac/i)) { + clientOS = 'Mac' + } + + var addKeyDefaults = { + title: 'My ' + clientOS, + key: '' + } + + $scope.title = addKeyDefaults.title + $scope.key = addKeyDefaults.key + + $scope.closeAddKey = function () { + $scope.title = addKeyDefaults.title + $scope.key = addKeyDefaults.key + $scope.adbkeyform.$setPristine() + $scope.showAdd = false + } + + $scope.toggleAddKey = function () { + $scope.showAdd = !$scope.showAdd + $scope.focusAddTitle = true + } + } diff --git a/res/app/settings/adb-keys/adb-keys.css b/res/app/settings/adb-keys/adb-keys.css index 6ee7c465..5c119c4d 100644 --- a/res/app/settings/adb-keys/adb-keys.css +++ b/res/app/settings/adb-keys/adb-keys.css @@ -1,3 +1,32 @@ -.stf-adb-keys { +.stf-adb-keys .key-list-icon { + +} + +.stf-adb-keys .key-list a { + padding: 10px; + border-bottom: 1px solid #dddddd; +} + +.stf-adb-keys .key-list-details { + display: inline-block; +} + +.stf-adb-keys .key-list-title { + color: #007aff; + font-size: 14px; + font-weight: 300; + margin: 2px 0 6px; +} + +.stf-adb-keys .key-list-key { + font-family: Monaco, Menlo, Consolas, "Courier New", monospace; + font-size: 10px; + margin-bottom: 2px; + color: #999999; + font-weight: 300; +} + +.stf-adb-keys .key-list-remove { + display: inline-block; +} -} \ No newline at end of file diff --git a/res/app/settings/adb-keys/adb-keys.jade b/res/app/settings/adb-keys/adb-keys.jade index 76f914f8..3b25e1d7 100644 --- a/res/app/settings/adb-keys/adb-keys.jade +++ b/res/app/settings/adb-keys/adb-keys.jade @@ -1,10 +1,56 @@ -.row - .col-md-12 +.row(ng-controller='AdbKeysCtrl') + .col-md-6 .widget-container.fluid-height.stf-adb-keys .heading - i.fa.fa-key + i.fa.fa-android span(translate) ADB Keys + + button.btn.btn-primary-outline.pull-right.btn-sm( + ng-click='toggleAddKey()', + ng-class='') + //(tooltip='{{ "Add ADB Key" | translate }}') + i.fa.fa-plus.fa-fw + //span(translate) Add + .widget-content.padded - div + nothing-to-show(icon='fa-key', message='{{"No ADB keys" | translate}}', + ng-if='!adbKeys.length && !showAdd') + + + .panel.panel-default(ng-show='showAdd') + .panel-heading + h3.panel-title(translate) Add ADB Key + .panel-body + form.form-horizontal(name='adbkeyform', ng-submit='addKey(key)') + + .form-group + label.control-label.col-md-1(translate) Title + .col-md-11 + input(type='text', ng-model='title', ng-required='true', + text-focus-select, focus-element='focusAddTitle').form-control + .form-group + label.control-label.col-md-1(translate) Key + .col-md-11 + textarea(rows='4', ng-model='key', ng-required='true').form-control + + .alert.alert-warning.selectable This key can be obtained by doing: ... + + br + + button.btn.btn-primary-outline.btn-sm.pull-right(type='submit') + i.fa.fa-plus.fa-fw + span(translate) Add Key + + ul.list-group.key-list + li.list-group-item(ng-repeat='key in adbKeys') + a + i.fa.fa-key.fa-2x.fa-fw.key-list-icon + .key-list-details.selectable + .key-list-title(ng-bind='key.title') + .key-list-key(ng-bind='key.key') + + button.btn.btn-xs.btn-danger-outline.pull-right.key-list-remove(ng-click='removeKey(key)') + i.fa.fa-trash-o + span(translate) Remove diff --git a/res/app/settings/adb-keys/index.js b/res/app/settings/adb-keys/index.js index 467ab020..8a90b8b3 100644 --- a/res/app/settings/adb-keys/index.js +++ b/res/app/settings/adb-keys/index.js @@ -1,7 +1,8 @@ require('./adb-keys.css') module.exports = angular.module('stf.settings.adb-keys', [ - + require('stf/common-ui/nothing-to-show').name, + require('stf/browser-info').name ]) .run(["$templateCache", function ($templateCache) { $templateCache.put( diff --git a/res/app/settings/settings-controller.js b/res/app/settings/settings-controller.js index 6bb0645f..f0e1fc56 100644 --- a/res/app/settings/settings-controller.js +++ b/res/app/settings/settings-controller.js @@ -1,15 +1,20 @@ module.exports = function SettingsCtrl($scope, gettext) { $scope.settingTabs = [ + { + title: gettext('Keys'), + icon: 'fa-key fa-fw', + templateUrl: 'settings/adb-keys/adb-keys.jade' + }, { title: gettext('General'), icon: 'fa-gears fa-fw', templateUrl: 'settings/general/general.jade' }, - { - title: gettext('ADB Keys'), - icon: 'fa-key fa-fw', - templateUrl: 'settings/adb-keys/adb-keys.jade' - } + //{ + // title: gettext('Keys'), + // icon: 'fa-key fa-fw', + // templateUrl: 'settings/adb-keys/adb-keys.jade' + //} ] }