From e6785335a9c4a1a0025bb0f6d726cc0cc0f97c51 Mon Sep 17 00:00:00 2001 From: Kosta Korenkov <7r0ggy@gmail.com> Date: Sat, 4 Jul 2015 13:02:46 +0300 Subject: [PATCH 1/3] Addon support Addons are simple Angular modules with views, controllers, services etc. Addons can register themselves in Copay using pluginManagerProvider. It allows them to add extra items to the bottom menu and as well as extra tab-views: ```` addonManagerProvider.registerAddon({ menuItem: { 'title': 'Assets', 'icon': 'icon-pricetag', 'link': 'assets' }, view: { id: 'assets', 'class': 'assets', template: 'colored-coins/views/assets.html' } }); ```` Addons can consume core Copay services and listen for events to react on changes. For this very first addon system inplementation Copay emits additional BalanceUpdated event so that interested addons can react on new transactions (see plugin reference implementation below). As bottom menu can accomodate only 6 items without sacrificing usability, so it was reworked to have second layer of items. Now If menu has more than 6 items, toggle button will be added to the menu allowing to reveal extra items in a sliding panel. Bottom menu in this case will show only 5 items, the rest will be rendered on sliding panel. This changes addresses issue #2949 and reference implementation of addon could be found here: https://github.com/troggy/copay-colored-coins-plugin --- public/views/includes/menu-toggle.html | 5 +++++ public/views/includes/menu.html | 28 ++++++++++++++++++++++++-- public/views/walletHome.html | 3 +++ src/css/mobile.css | 14 +++++++++++++ src/js/app.js | 5 ++++- src/js/controllers/index.js | 9 +++++++-- src/js/directives/directives.js | 7 +++++++ src/js/services/addonManager.js | 26 ++++++++++++++++++++++++ src/js/services/pluginManager.js | 10 --------- 9 files changed, 92 insertions(+), 15 deletions(-) create mode 100644 public/views/includes/menu-toggle.html create mode 100644 src/js/services/addonManager.js delete mode 100644 src/js/services/pluginManager.js diff --git a/public/views/includes/menu-toggle.html b/public/views/includes/menu-toggle.html new file mode 100644 index 000000000..dcb1b5cff --- /dev/null +++ b/public/views/includes/menu-toggle.html @@ -0,0 +1,5 @@ +
+ + + +
diff --git a/public/views/includes/menu.html b/public/views/includes/menu.html index 5993029e8..451f67074 100644 --- a/public/views/includes/menu.html +++ b/public/views/includes/menu.html @@ -1,5 +1,21 @@ -
-
+
+
+ + +
+ {{item.title|translate}} +
+ +
+
+ +
+ + +
+ +
+
@@ -10,4 +26,12 @@
+ +
+ +
+ +
+ + diff --git a/public/views/walletHome.html b/public/views/walletHome.html index 406b86608..da8da5591 100644 --- a/public/views/walletHome.html +++ b/public/views/walletHome.html @@ -505,6 +505,9 @@
+
+
+
diff --git a/src/css/mobile.css b/src/css/mobile.css index 8b0538674..9471f4215 100644 --- a/src/css/mobile.css +++ b/src/css/mobile.css @@ -151,6 +151,20 @@ _:-ms-fullscreen, :root .main { background: #2C3E50; } +.second-bottom-bar { + z-index: 6; +} + +.second-bottom-bar.animated.slideInRight, +.second-bottom-bar.animated.slideInLeft { + -webkit-animation-duration: 0.3s; + animation-duration: 0.3s; +} + +.menu-toggle { + padding-top: 1rem !important; +} + .amount { width: 100%; text-align: center; diff --git a/src/js/app.js b/src/js/app.js index cb2e8fb89..748099a7d 100644 --- a/src/js/app.js +++ b/src/js/app.js @@ -12,7 +12,8 @@ var modules = [ 'copayApp.filters', 'copayApp.services', 'copayApp.controllers', - 'copayApp.directives' + 'copayApp.directives', + 'copayApp.plugins' ]; var copayApp = window.copayApp = angular.module('copayApp', modules); @@ -21,3 +22,5 @@ angular.module('copayApp.filters', []); angular.module('copayApp.services', []); angular.module('copayApp.controllers', []); angular.module('copayApp.directives', []); +angular.module('copayApp.plugins', []); + diff --git a/src/js/controllers/index.js b/src/js/controllers/index.js index faf3a335c..857549eb5 100644 --- a/src/js/controllers/index.js +++ b/src/js/controllers/index.js @@ -1,6 +1,6 @@ 'use strict'; -angular.module('copayApp.controllers').controller('indexController', function($rootScope, $scope, $log, $filter, $timeout, lodash, go, profileService, configService, isCordova, rateService, storageService, addressService, gettextCatalog, gettext, amMoment, nodeWebkit) { +angular.module('copayApp.controllers').controller('indexController', function($rootScope, $scope, $log, $filter, $timeout, lodash, go, profileService, configService, isCordova, rateService, storageService, addressService, gettextCatalog, gettext, amMoment, nodeWebkit, addonManager) { var self = this; self.isCordova = isCordova; self.onGoingProcess = {}; @@ -34,6 +34,10 @@ angular.module('copayApp.controllers').controller('indexController', function($r 'link': 'history' }]; + self.addonViews = addonManager.addonViews(); + self.menu = self.menu.concat(addonManager.addonMenuItems()); + self.menuItemSize = self.menu.length > 4 ? 2 : 3; + self.tab = 'walletHome'; self.availableLanguages = [{ @@ -274,6 +278,7 @@ angular.module('copayApp.controllers').controller('indexController', function($r self.walletScanStatus = walletStatus.wallet.scanStatus; self.copayers = walletStatus.wallet.copayers; self.preferences = walletStatus.preferences; + $rootScope.$emit('Local/BalanceUpdated', walletStatus.balance); self.setBalance(walletStatus.balance); self.otherWallets = lodash.filter(profileService.getWallets(self.network), function(w) { return w.id != self.walletId; @@ -548,7 +553,7 @@ angular.module('copayApp.controllers').controller('indexController', function($r } }); }, false); - chooser.click(); + chooser.click(); } function formatDate(date) { diff --git a/src/js/directives/directives.js b/src/js/directives/directives.js index 69433e59b..5696fd116 100644 --- a/src/js/directives/directives.js +++ b/src/js/directives/directives.js @@ -296,4 +296,11 @@ angular.module('copayApp.directives') }); } }; + }) + .directive('menuToggle', function() { + return { + restrict: 'E', + replace: true, + templateUrl: 'views/includes/menu-toggle.html' + } }); diff --git a/src/js/services/addonManager.js b/src/js/services/addonManager.js new file mode 100644 index 000000000..6a3aba52d --- /dev/null +++ b/src/js/services/addonManager.js @@ -0,0 +1,26 @@ +'use strict'; + +angular.module('copayApp.services').provider('addonManager', function () { + var addonMenuItems = []; + var addonViews = []; + + this.registerAddon = function(addonSpec) { + addonMenuItems.push(addonSpec.menuItem); + addonViews.push(addonSpec.view); + }; + + this.$get = function() { + var manager = {}; + + manager.addonMenuItems = function() { + return addonMenuItems; + }; + + manager.addonViews = function() { + return addonViews; + }; + + return manager; + } + +}); diff --git a/src/js/services/pluginManager.js b/src/js/services/pluginManager.js deleted file mode 100644 index 76b6361e2..000000000 --- a/src/js/services/pluginManager.js +++ /dev/null @@ -1,10 +0,0 @@ -'use strict'; - -angular.module('copayApp.services').factory('pluginManager', function() { - var root = {}; - root.getInstance = function(config){ - return new copay.PluginManager(config); - }; - - return root; -}); From 9dfca68354588907965442b451b8f4c3e4afb190 Mon Sep 17 00:00:00 2001 From: Kosta Korenkov <7r0ggy@gmail.com> Date: Fri, 10 Jul 2015 14:59:18 +0300 Subject: [PATCH 2/3] Rename module to copayApp.addons --- src/js/app.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/js/app.js b/src/js/app.js index 748099a7d..7468ccbd9 100644 --- a/src/js/app.js +++ b/src/js/app.js @@ -13,7 +13,7 @@ var modules = [ 'copayApp.services', 'copayApp.controllers', 'copayApp.directives', - 'copayApp.plugins' + 'copayApp.addons' ]; var copayApp = window.copayApp = angular.module('copayApp', modules); @@ -22,5 +22,5 @@ angular.module('copayApp.filters', []); angular.module('copayApp.services', []); angular.module('copayApp.controllers', []); angular.module('copayApp.directives', []); -angular.module('copayApp.plugins', []); +angular.module('copayApp.addons', []); From a8b20d3e7dd90ad964fad4a9a26a7e0a3e59d5b5 Mon Sep 17 00:00:00 2001 From: Kosta Korenkov <7r0ggy@gmail.com> Date: Mon, 13 Jul 2015 22:25:34 +0300 Subject: [PATCH 3/3] Clarify the purpose of BalanceUpdated event emission --- src/js/controllers/index.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/js/controllers/index.js b/src/js/controllers/index.js index 857549eb5..6de662943 100644 --- a/src/js/controllers/index.js +++ b/src/js/controllers/index.js @@ -278,11 +278,14 @@ angular.module('copayApp.controllers').controller('indexController', function($r self.walletScanStatus = walletStatus.wallet.scanStatus; self.copayers = walletStatus.wallet.copayers; self.preferences = walletStatus.preferences; - $rootScope.$emit('Local/BalanceUpdated', walletStatus.balance); self.setBalance(walletStatus.balance); self.otherWallets = lodash.filter(profileService.getWallets(self.network), function(w) { return w.id != self.walletId; });; + + // Notify external addons or plugins + $rootScope.$emit('Local/BalanceUpdated', walletStatus.balance); + $rootScope.$apply(); }); });