diff --git a/src/js/controllers/coinbase.js b/src/js/controllers/coinbase.js index 161b7e380..fda27ad1d 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('Sign Up for Coinbase'); + 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('You can email support@coinbase.com for direct support, or you can view their help center.'); + 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; if (data.stateParams && data.stateParams.code) { coinbaseService.getStoredToken(function(at) { if (!at) self.submitOauthCode(data.stateParams.code); diff --git a/src/js/controllers/glidera.js b/src/js/controllers/glidera.js index bb746274f..d47721c67 100644 --- a/src/js/controllers/glidera.js +++ b/src/js/controllers/glidera.js @@ -114,7 +114,40 @@ angular.module('copayApp.controllers').controller('glideraController', }); }; + $scope.openAuthenticateWindow = function() { + $scope.openExternalLink($scope.getAuthenticateUrl()); + $scope.showOauthForm = true + } + + $scope.openLoginWindow = function() { + var glideraUrl = ($scope.network === 'testnet') ? 'https://sandbox.glidera.io/login' : 'https://glidera.io/login'; + $scope.openExternalLink(glideraUrl); + } + + $scope.openSupportWindow = function() { + var url = glideraService.getSupportUrl(); + var optIn = true; + var title = gettextCatalog.getString('Glidera Support'); + var message = gettextCatalog.getString('You can email glidera at support@glidera.io for direct support, or you can contact Glidera on Twitter.'); + var okText = gettextCatalog.getString('Tweet @GlideraInc'); + var cancelText = gettextCatalog.getString('Go Back'); + externalLinkService.open(url, optIn, title, message, okText, cancelText); + } + + $scope.retry = function() { + $scope.connectingGlidera = true; + $scope.update({'fullUpdate': true}); + $timeout(function(){ + $scope.connectingGlidera = false; + }, 300); + } + + $scope.toggleOauthForm = function() { + $scope.showOauthForm = !$scope.showOauthForm; + } + $scope.$on("$ionicView.beforeEnter", function(event, data) { + $scope.showOauthForm = false; initGlidera(); }); diff --git a/src/js/services/amazonService.js b/src/js/services/amazonService.js index d0c715220..cfd990f1e 100644 --- a/src/js/services/amazonService.js +++ b/src/js/services/amazonService.js @@ -18,14 +18,14 @@ angular.module('copayApp.services').factory('amazonService', function($http, $lo var homeItem = { name: 'amazon', - title: 'Amazon Gift Cards', + title: 'Amazon.com Gift Cards', icon: 'icon-amazon', sref: 'tabs.giftcards.amazon', }; var nextStepItem = { name: 'amazon', - title: 'Buy a gift card', + title: 'Buy Amazon.com Gift Cards', icon: 'icon-amazon', sref: 'tabs.giftcards.amazon', }; diff --git a/src/js/services/bitpayCardService.js b/src/js/services/bitpayCardService.js index a2ce4aa52..4f87bba50 100644 --- a/src/js/services/bitpayCardService.js +++ b/src/js/services/bitpayCardService.js @@ -1295,7 +1295,7 @@ angular.module('copayApp.services').factory('bitpayCardService', function($log, var nextStepItem = { name: 'bitpaycard', - title: 'Add Bitpay VISA Card', + title: 'Add BitPay Visa® Card', icon: 'icon-bitpay-card', sref: 'tabs.bitpayCardIntro', }; diff --git a/src/js/services/buyAndSellService.js b/src/js/services/buyAndSellService.js index bbfbe6632..bffbb7252 100644 --- a/src/js/services/buyAndSellService.js +++ b/src/js/services/buyAndSellService.js @@ -23,7 +23,7 @@ angular.module('copayApp.services').factory('buyAndSellService', function($log, if (linkedServices.length == 0) { nextStepsService.register({ - title: 'Buy and Sell', + title: 'Buy or Sell Bitcoin', name: 'buyandsell', icon: 'icon-buy-bitcoin', sref: 'tabs.buyandsell', diff --git a/src/js/services/coinbaseService.js b/src/js/services/coinbaseService.js index b01bed695..5a53149c6 100644 --- a/src/js/services/coinbaseService.js +++ b/src/js/services/coinbaseService.js @@ -127,6 +127,14 @@ angular.module('copayApp.services').factory('coinbaseService', function($http, $ 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=' + @@ -207,7 +215,7 @@ angular.module('copayApp.services').factory('coinbaseService', function($http, $ root.isActive = function(cb) { - if (isWindowsPhoneApp) + if (isWindowsPhoneApp) return cb(); if (lodash.isEmpty(credentials.CLIENT_ID)) @@ -730,6 +738,7 @@ angular.module('copayApp.services').factory('coinbaseService', function($http, $ buyAndSellService.register({ name: 'coinbase', logo: 'img/coinbase-logo.png', + location: '33 Countries', sref: 'tabs.buyandsell.coinbase', configSref: 'tabs.preferences.coinbase', linked: isActive, diff --git a/src/js/services/glideraService.js b/src/js/services/glideraService.js index 13401ed1c..987ae5845 100644 --- a/src/js/services/glideraService.js +++ b/src/js/services/glideraService.js @@ -49,6 +49,14 @@ angular.module('copayApp.services').factory('glideraService', function($http, $l return credentials.NETWORK; }; + root.getSignupUrl = function() { + return credentials.HOST + '/register'; + } + + root.getSupportUrl = function() { + return 'https://twitter.com/GlideraInc'; + } + root.getOauthCodeUrl = function() { return credentials.HOST + '/oauth2/auth?response_type=code&client_id=' + credentials.CLIENT_ID + '&redirect_uri=' + credentials.REDIRECT_URI; }; @@ -325,6 +333,7 @@ angular.module('copayApp.services').factory('glideraService', function($http, $l buyAndSellService.register({ name: 'glidera', logo: 'img/glidera-logo.png', + location: 'US Only', sref: 'tabs.buyandsell.glidera', configSref: 'tabs.preferences.glidera', linked: !!token, diff --git a/src/sass/variables.scss b/src/sass/variables.scss index fecc7bed2..db0b86431 100644 --- a/src/sass/variables.scss +++ b/src/sass/variables.scss @@ -46,6 +46,7 @@ $item-default-border: $subtle-gray; $item-default-text: $dark-gray; $item-default-active-bg: darken(#ffffff, 7%); $item-default-active-border: darken($subtle-gray, 7%); +$item-divider-bg: $subtle-gray; $bar-default-border: $subtle-gray; diff --git a/src/sass/views/buyandsell.scss b/src/sass/views/buyandsell.scss new file mode 100644 index 000000000..908287f9a --- /dev/null +++ b/src/sass/views/buyandsell.scss @@ -0,0 +1,34 @@ +#buy-and-sell { + .explain { + text-align: center; + margin-top: 1em; + } + .buy-and-sell-icon { + display: inline-block; + width: 50px; + height: 50px; + border-radius: 50%; + box-shadow: $subtle-box-shadow; + background-color: #fa912b; + img { + height: 100%; + width: 100%; + } + } + .explain { + &-heading { + font-size: 20px; + margin: 1rem; + } + &-description { + margin-left: auto; + margin-right: auto; + opacity: .6; + max-width: 300px; + padding: 0 1em; + } + } + .item-note { + color: $light-gray; + } +} 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..338d7f6f1 --- /dev/null +++ b/src/sass/views/integrations/integrations.scss @@ -0,0 +1,51 @@ +@import "coinbase"; +@import "glidera"; +@import "amazon"; + +#coinbase, #glidera { + .button-small { + font-size: 13px; + } +} + +.integration-onboarding { + height: 100%; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + text-align: center; + &-logo { + display: inline-block; + margin-bottom: 1em; + img { + max-width: 170px; + } + } + &-description { + margin-top: 0; + margin-left: 2rem; + margin-right: 2rem; + margin-bottom: 130px; + opacity: .6; + max-width: 300px; + } + &-cta, &-oauthform { + position: absolute; + bottom: 5vh; + width: 100%; + } + &-oauthform { + .item { + border: 0 none; + } + .item-floating-label { + padding-left: 0; + margin-left: 2em; + margin-right: 2em; + } + input { + border-bottom: 2px solid $light-gray; + } + } +} diff --git a/src/sass/views/views.scss b/src/sass/views/views.scss index e26092690..2ced0150f 100644 --- a/src/sass/views/views.scss +++ b/src/sass/views/views.scss @@ -15,6 +15,7 @@ @import "bitpayCard"; @import "bitpayCardIntro"; @import "bitpayCardPreferences"; +@import "buyandsell"; @import "address-book"; @import "addresses"; @import "wallet-backup-phrase"; @@ -41,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/amazon.html b/www/views/amazon.html index 7e058a037..33c3af301 100644 --- a/www/views/amazon.html +++ b/www/views/amazon.html @@ -5,28 +5,29 @@ Amazon.com Gift Cards - - +
- Sandbox version. Only for testing purpose + Sandbox version. Only for testing purpose. +
+
+ +
Gift Cards are only redeemable on Amazon.com (US website). Cards never expire and can be redeemed towards millions of items.
+
+ + +
+
+
+ +
+ Sandbox version. Only for testing purpose.
Amazon.com Gift Card -
Only redeemable on www.amazon.com (USA website)
-
- -
- - - -
- Amazon.com Gift Cards never expire and can be redeemed towards millions of items at - www.amazon.com -
+
Only redeemable on www.amazon.com (US website).
diff --git a/www/views/buyandsell.html b/www/views/buyandsell.html index 18d063a17..7b5b72618 100644 --- a/www/views/buyandsell.html +++ b/www/views/buyandsell.html @@ -1,15 +1,23 @@ - + - Buy and sell + Buy or Sell Bitcoin
+
+ + + +
Connect an Exchange
+
Buy or sell bitcoin directly from your wallet by connecting your exchange accounts.
+
+ {{service.location}}
diff --git a/www/views/coinbase.html b/www/views/coinbase.html index dc85681f9..016ecfaf5 100644 --- a/www/views/coinbase.html +++ b/www/views/coinbase.html @@ -4,45 +4,46 @@ Coinbase - - - -
-
- + + + + +
+ -
- -

Connect your Coinbase account to get started

- - - +
Coinbase's exchange service is available in 33 countries, and can take 3-5 days to buy or sell bitcoin.
+
If you have trouble, contact Coinbase support for direct assistance.
+
+ +
-
+ +
-
-
+ -
+ + +
@@ -52,7 +53,7 @@ {{buyPrice.amount}} {{buyPrice.currency}} - | + | {{sellPrice.amount}} {{sellPrice.currency}}
@@ -77,7 +78,7 @@
Activity -
+
Glidera - - - - -
- Glidera is disabled for this application -
- -
- Testnet wallets only work with Glidera Sandbox Accounts -
- -
- -
-
- + + + + + +
+ The Glidera integration is currently disabled. +
+
+ Testnet wallets only work with Glidera Sandbox Accounts. +
+
+ -
-

You can buy and sell Bitcoin with a US bank account directly in this app.

- -

Connect your Glidera account to get started.

- - -
-
-

Glidera Inc. (Glidera) is providing the service of buying or selling bitcoin to BitPay users. To enable this service, Glidera has registered with US Treasury Department’s FinCEN as a Money Service Business (#31000042625755). Users of BitPay must agree to the service agreement presented by Glidera prior to obtaining Glidera’s service of buying or selling bitcoin.

-

Service is available in the U.S. and Canada.

-
+
Glidera's exchange service is available in the United States, and can take 1-2 weeks to buy or sell bitcoin.
+
If you have trouble, contact Glidera support for direct assistance.
+
+ +
-
-
-
-
-
+ -
-
- + +
+ +
Please complete your account verification on Glidera's website. If you have trouble, contact Glidera's support for direct assistance.
+
+ + +
-
-

Complete Setup

-
Your Glidera account is not ready to transact. Please, verify it at Glidera.io
- - Go to Glidera - + + + +
+