diff --git a/src/js/controllers/coinbase.js b/src/js/controllers/coinbase.js index a038e6546..357cb4cab 100644 --- a/src/js/controllers/coinbase.js +++ b/src/js/controllers/coinbase.js @@ -1,6 +1,6 @@ 'use strict'; -angular.module('copayApp.controllers').controller('coinbaseController', function($scope, $timeout, $ionicModal, $ionicHistory, $log, coinbaseService, lodash, platformInfo, ongoingProcess, popupService, externalLinkService) { +angular.module('copayApp.controllers').controller('coinbaseController', function($scope, $timeout, $ionicModal, $ionicHistory, $log, coinbaseService, lodash, platformInfo, ongoingProcess, popupService, externalLinkService, gettextCatalog) { var isNW = platformInfo.isNW; var isCordova = platformInfo.isCordova; @@ -9,7 +9,7 @@ angular.module('copayApp.controllers').controller('coinbaseController', function $scope.currency = coinbaseService.getAvailableCurrency(); coinbaseService.getStoredToken(function(at) { $scope.accessToken = at; - + // Update Access Token if necessary $scope.loading = true; coinbaseService.init(function(err, data) { @@ -79,11 +79,35 @@ angular.module('copayApp.controllers').controller('coinbaseController', function } } + this.openSignupWindow = function() { + var url = coinbaseService.getSignupUrl(); + var optIn = true; + var title = gettextCatalog.getString('Create Account'); + var message = gettextCatalog.getString('This will open Coinbase.com, where you can create an account.'); + var okText = gettextCatalog.getString('Go to Coinbase'); + var cancelText = gettextCatalog.getString('Back'); + externalLinkService.open(url, optIn, title, message, okText, cancelText); + } + + this.openSupportWindow = function() { + var url = coinbaseService.getSupportUrl(); + var optIn = true; + var title = gettextCatalog.getString('Coinbase Support'); + var message = gettextCatalog.getString('Help and support for the Coinbase service is available on their website.'); + var okText = gettextCatalog.getString('Open Help Center'); + var cancelText = gettextCatalog.getString('Go Back'); + externalLinkService.open(url, optIn, title, message, okText, cancelText); + } + this.getAuthenticateUrl = function() { $scope.showOauthForm = isCordova || isNW ? false : true; return coinbaseService.getOauthCodeUrl(); }; + this.toggleOauthForm = function() { + $scope.showOauthForm = !$scope.showOauthForm; + } + this.submitOauthCode = function(code) { var self = this; ongoingProcess.set('connectingCoinbase', true); @@ -112,6 +136,7 @@ angular.module('copayApp.controllers').controller('coinbaseController', function var self = this; $scope.$on("$ionicView.beforeEnter", function(event, data) { + $scope.showOauthForm = false; coinbaseService.setCredentials(); if (data.stateParams && data.stateParams.code) { coinbaseService.getStoredToken(function(at) { diff --git a/src/js/services/coinbaseService.js b/src/js/services/coinbaseService.js index 9057ae729..7ab78909f 100644 --- a/src/js/services/coinbaseService.js +++ b/src/js/services/coinbaseService.js @@ -28,7 +28,7 @@ angular.module('copayApp.services').factory('coinbaseService', function($http, $ name: '10%' } ]; - + root.selectedPriceSensitivity = root.priceSensitivity[1]; root.setCredentials = function() { @@ -117,7 +117,7 @@ angular.module('copayApp.services').factory('coinbaseService', function($http, $ var satToBtc = 1 / 100000000; var unitToSatoshi = config.unitToSatoshi; var amountUnitStr; - + // IF 'USD' if (currency) { amountUnitStr = $filter('formatFiatAmount')(amount) + ' ' + currency; @@ -128,10 +128,18 @@ angular.module('copayApp.services').factory('coinbaseService', function($http, $ amount = (amountSat * satToBtc).toFixed(8); currency = 'BTC'; } - + return [amount, currency, amountUnitStr]; }; + root.getSignupUrl = function() { + return credentials.HOST + '/signup'; + } + + root.getSupportUrl = function() { + return 'https://support.coinbase.com/'; + } + root.getOauthCodeUrl = function() { return credentials.HOST + '/oauth/authorize?response_type=code&client_id=' @@ -483,7 +491,7 @@ angular.module('copayApp.services').factory('coinbaseService', function($http, $ }; // Pending transactions - + root.savePendingTransaction = function(ctx, opts, cb) { _savePendingTransaction(ctx, opts, cb); }; @@ -516,7 +524,7 @@ angular.module('copayApp.services').factory('coinbaseService', function($http, $ storageService.getCoinbaseTxs(credentials.NETWORK, function(err, txs) { txs = txs ? JSON.parse(txs) : {}; coinbasePendingTransactions.data = lodash.isEmpty(txs) ? null : txs; - + root.init(function(err, data) { if (err || lodash.isEmpty(data)) { if (err) $log.error(err); @@ -529,7 +537,7 @@ angular.module('copayApp.services').factory('coinbaseService', function($http, $ if ((dataFromStorage.type == 'sell' && dataFromStorage.status == 'completed') || (dataFromStorage.type == 'buy' && dataFromStorage.status == 'completed') || dataFromStorage.status == 'error' || - (dataFromStorage.type == 'send' && dataFromStorage.status == 'completed')) + (dataFromStorage.type == 'send' && dataFromStorage.status == 'completed')) return; root.getTransaction(accessToken, accountId, txId, function(err, tx) { if (err || lodash.isEmpty(tx) || (tx.data && tx.data.error)) { @@ -593,7 +601,7 @@ angular.module('copayApp.services').factory('coinbaseService', function($http, $ $log.debug('Updating pending transactions...'); root.setCredentials(); var pendingTransactions = { data: {} }; - root.getPendingTransactions(pendingTransactions); + root.getPendingTransactions(pendingTransactions); }, 20000); var _updateTxs = function(coinbasePendingTransactions) { diff --git a/src/sass/views/integrations/coinbase.scss b/src/sass/views/integrations/coinbase.scss index 08521b72b..d002aef37 100644 --- a/src/sass/views/integrations/coinbase.scss +++ b/src/sass/views/integrations/coinbase.scss @@ -9,7 +9,7 @@ stroke: #0067c8; fill: #0067c8; } - + .add-bottom-for-cta { bottom: 92px; } @@ -73,7 +73,7 @@ color: $item-label-color; margin-bottom: 8px; } - + .capitalized { text-transform: capitalize; } diff --git a/src/sass/views/integrations/integrations.scss b/src/sass/views/integrations/integrations.scss new file mode 100644 index 000000000..307563fda --- /dev/null +++ b/src/sass/views/integrations/integrations.scss @@ -0,0 +1,43 @@ +@import "coinbase"; +@import "glidera"; +@import "amazon"; + +.integration-onboarding { + height: 100%; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + text-align: center; + &-logo { + display: inline-block; + img { + max-width: 170px; + } + } + &-heading { + font-size: 20px; + margin: 1rem; + } + &-description { + margin-top: 0; + margin-left: 2rem; + margin-right: 2rem; + margin-bottom: 100px; + opacity: .6; + max-width: 300px; + } + &-support-link { + cursor: pointer; + } + &-cta, &-oauthform { + position: absolute; + bottom: 5vh; + width: 100%; + } + &-oauthform { + input { + border-bottom: 2px solid $light-gray; + } + } +} diff --git a/src/sass/views/views.scss b/src/sass/views/views.scss index 774029341..2ced0150f 100644 --- a/src/sass/views/views.scss +++ b/src/sass/views/views.scss @@ -42,7 +42,5 @@ @import "includes/tx-status"; @import "includes/itemSelector"; @import "includes/walletSelector"; -@import "integrations/coinbase"; -@import "integrations/glidera"; -@import "integrations/amazon"; +@import "integrations/integrations"; @import "custom-amount"; diff --git a/www/views/coinbase.html b/www/views/coinbase.html index dc85681f9..a40ebbcc8 100644 --- a/www/views/coinbase.html +++ b/www/views/coinbase.html @@ -4,35 +4,32 @@ Coinbase - - - -
-
- + + + + +
+ -
- -

Connect your Coinbase account to get started

- - -
- - Do you already have the Oauth Code? - -
+
Connect a Coinbase Account
+
If you have trouble with the Coinbase service, please contact Coinbase support for direct assistance.
+
+ +
-
+ +
-
-
+ -
+ + +
@@ -52,7 +52,7 @@ {{buyPrice.amount}} {{buyPrice.currency}} - | + | {{sellPrice.amount}} {{sellPrice.currency}}
@@ -77,7 +77,7 @@
Activity -
+