Better look and feel
This commit is contained in:
parent
1a0a7eb5ad
commit
49cd19bd1b
9 changed files with 239 additions and 69 deletions
BIN
public/img/glidera-logo.png
Normal file
BIN
public/img/glidera-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.5 KiB |
|
|
@ -6,43 +6,105 @@
|
|||
</div>
|
||||
|
||||
|
||||
<div class="content glidera" ng-controller="glideraController as glidera">
|
||||
<div class="row">
|
||||
<div class="large-12 columns">
|
||||
<div class="content glidera p20v" ng-controller="glideraController as glidera">
|
||||
|
||||
<a href ng-if="!index.glideraToken" ng-click="$root.go('preferencesGlidera')">
|
||||
Connect to Glidera
|
||||
<div class="onGoingProcess" ng-show="glidera.loading">
|
||||
<div class="onGoingProcess-content" ng-style="{'background-color':index.backgroundColor}">
|
||||
<div class="spinner">
|
||||
<div class="rect1"></div>
|
||||
<div class="rect2"></div>
|
||||
<div class="rect3"></div>
|
||||
<div class="rect4"></div>
|
||||
<div class="rect5"></div>
|
||||
</div>
|
||||
<span translate>Connecting to Glidera...</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="text-center m10b">
|
||||
<img src="img/glidera-logo.png" ng-click="glidera.update(index.glideraToken)">
|
||||
</div>
|
||||
<div ng-if="!index.glideraToken" class="row">
|
||||
<div class="columns" ng-init="showOauthForm = false">
|
||||
<div class="text-center" ng-show="!showOauthForm">
|
||||
<p translate>You can buy and sell Bitcoin with a US bank account directly in Copay</p>
|
||||
<p class="text-gray size-12">Connect your Glidera account to get started</p>
|
||||
<button
|
||||
class="dark-gray outline round tiny"
|
||||
ng-click="$root.openExternalLink(glidera.authenticateUrl); showOauthForm = true" translate>
|
||||
Connect to Glidera
|
||||
</button>
|
||||
<a href ng-click="showOauthForm = true" class="db text-gray size-12">
|
||||
Do you already have the Oauth Code?
|
||||
</a>
|
||||
</div>
|
||||
<div class="text-center" ng-show="showOauthForm">
|
||||
<p class="text-gray size-12">Paste the authorization code here</p>
|
||||
<form name="oauthCode" ng-submit="glidera.submitOauthCode(code)" novalidate>
|
||||
<label>OAuth Code<label>
|
||||
<input type="text" ng-model="code" ng-disabled="glidera.loading">
|
||||
<input
|
||||
class="button dark-gray outline round"
|
||||
type="submit" value="Get started" ng-disabled="glidera.loading">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div ng-if="index.glideraToken" ng-init="glidera.init(index.glideraToken)">
|
||||
|
||||
<div class="text-center m10b">
|
||||
{{index.glideraEmail}} <br>
|
||||
<a href class="text-gray" ng-click="$root.go('preferencesGlidera')">
|
||||
Preferences
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div ng-if="index.glideraToken" ng-init="glidera.init(index.glideraToken)">
|
||||
Connected to Glidera - <a href ng-click="$root.go('preferencesGlidera')">Preferences</a>
|
||||
|
||||
<div>
|
||||
<button class="" ng-click="$root.go('buyGlidera')">Buy</button>
|
||||
<button class="" ng-click="$root.go('sellGlidera')">Sell</button>
|
||||
</div>
|
||||
|
||||
<h2>Transactions</h2>
|
||||
<ul>
|
||||
<li ng-repeat="tx in glidera.txs">
|
||||
transactionUuid: {{tx.transactionUuid}} <br>
|
||||
transactionDate: {{tx.transactionDate}} <br>
|
||||
type: {{tx.type}} <br>
|
||||
price: {{tx.price}} <br>
|
||||
subtotal: {{tx.subtotal}} <br>
|
||||
fees: {{tx.fees}} <br>
|
||||
total: {{tx.total}} <br>
|
||||
currency: {{tx.currency}} <br>
|
||||
estimatedDeliveryDate: {{tx.estimatedDeliveryDate}} <br>
|
||||
transactionHash: {{tx.transactionHash}} <br>
|
||||
status: {{tx.status}}<br>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="title m0" translate>Connected</h4>
|
||||
<ul class="no-bullet m0 size-14">
|
||||
<li class="line-b p20 pointer" ng-click="$root.go('buyGlidera')">
|
||||
<span translate>Buy</span>
|
||||
<span class="right text-gray">
|
||||
<i class="icon-arrow-right3 size-24 right"></i>
|
||||
</span>
|
||||
</li>
|
||||
<li class="line-b p20 pointer" ng-click="$root.go('sellGlidera')">
|
||||
<span translate>Sell</span>
|
||||
<span class="right text-gray">
|
||||
<i class="icon-arrow-right3 size-24 right"></i>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="title m0" translate>Activity</h4>
|
||||
<div ng-repeat="tx in index.glideraTxs"
|
||||
ng-click="glidera.openTxModal(index.glideraToken, tx)"
|
||||
class="row collapse last-transactions-content">
|
||||
<div class="large-3 medium-3 small-3 columns">
|
||||
<span class="label tu radius" ng-show="tx.type == 'BUY'"
|
||||
ng-style="{'background-color':index.backgroundColor}" translate>Bought</span>
|
||||
<span class="label tu gray radius" ng-show="tx.type == 'SELL'" translate>Sold</span>
|
||||
</div>
|
||||
|
||||
<div class="large-4 medium-4 small-4 columns">
|
||||
<span class="size-16">
|
||||
{{tx.subtotal}} {{tx.currency}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="large-4 medium-4 small-4 columns text-right">
|
||||
<div class="m5t size-12 text-gray">
|
||||
<time ng-if="tx.transactionDate">{{tx.transactionDate | amTimeAgo}}</time>
|
||||
</div>
|
||||
</div>
|
||||
<div class="large-1 medium-1 small-1 columns text-right">
|
||||
<i class="icon-arrow-right3 size-18"></i>
|
||||
</div>
|
||||
<div class="size-12 text-gray columns m5t">
|
||||
<span class="text-success" ng-if="tx.status == 'COMPLETE'">Completed</span>
|
||||
<span class="text-info" ng-if="tx.status == 'PENDING'">Pending</span>
|
||||
<span class="text-warning" ng-if="tx.status == 'ERROR'">Error</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="extra-margin-bottom"></div>
|
||||
|
|
|
|||
60
public/views/modals/glidera-tx-details.html
Normal file
60
public/views/modals/glidera-tx-details.html
Normal file
|
|
@ -0,0 +1,60 @@
|
|||
<nav class="tab-bar">
|
||||
<section class="left-small">
|
||||
<a ng-click="cancel()">
|
||||
<i class="icon-arrow-left3 icon-back"></i>
|
||||
<span class="text-back" translate>Back</span>
|
||||
</a>
|
||||
</section>
|
||||
<section class="middle tab-bar-section">
|
||||
<h1 class="title ellipsis" ng-style="{'color':color}" translate>
|
||||
Transaction
|
||||
</h1>
|
||||
</section>
|
||||
</nav>
|
||||
|
||||
<div class="modal-content fix-modals-touch">
|
||||
<div class="header-modal text-center">
|
||||
<span class="label tu radius" ng-show="tx.type == 'BUY'"
|
||||
ng-style="{'background-color':color}" translate>Bought</span>
|
||||
<span class="label tu gray radius" ng-show="tx.type == 'SELL'" translate>Sold</span>
|
||||
<div class="size-42">
|
||||
{{tx.subtotal}} {{tx.currency}}
|
||||
</div>
|
||||
<div>
|
||||
<span class="text-success" ng-if="tx.status == 'COMPLETE'">Completed</span>
|
||||
<span class="text-info" ng-if="tx.status == 'PENDING'">Pending</span>
|
||||
<span class="text-warning" ng-if="tx.status == 'ERROR'">Error</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h4 class="title m0" translate>Details</h4>
|
||||
|
||||
<ul class="no-bullet size-14 m0">
|
||||
|
||||
<li ng-show="tx.transactionDate" class="line-b p10 oh">
|
||||
<span class="text-gray" translate>Date</span>:
|
||||
<span class="right">{{tx.transactionDate | amCalendar}}</span>
|
||||
</li>
|
||||
|
||||
<li ng-show="tx.price" class="line-b p10 oh">
|
||||
<span class="text-gray" translate>Price</span>:
|
||||
<span class="right">{{tx.price}}</span>
|
||||
</li>
|
||||
|
||||
<li ng-show="tx.subtotal" class="line-b p10 oh">
|
||||
<span class="text-gray" translate>Subtotal</span>:
|
||||
<span class="right">{{tx.subtotal}}</span>
|
||||
</li>
|
||||
|
||||
<li ng-show="tx.fees" class="line-b p10 oh">
|
||||
<span class="text-gray" translate>Fees</span>:
|
||||
<span class="right">{{tx.fees}}</span>
|
||||
</li>
|
||||
|
||||
<li ng-show="tx.total" class="line-b p10 oh">
|
||||
<span class="text-gray" translate>Total</span>:
|
||||
<span class="right">{{tx.total}}</span>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="extra-margin-bottom"></div>
|
||||
</div>
|
||||
|
|
@ -9,21 +9,6 @@
|
|||
<div class="row" ng-init="glidera.init(index.glideraToken)">
|
||||
<div class="large-12 columns">
|
||||
|
||||
<div ng-show="!index.glideraToken">
|
||||
<a
|
||||
class="button outline dark-gray"
|
||||
ng-click="$root.openExternalLink(glidera.authenticateUrl)">
|
||||
Get OAuth Code
|
||||
</a>
|
||||
|
||||
<form name="form" ng-submit="glidera.submit(code)" novalidate>
|
||||
<label>OAuth Code
|
||||
<input type="text" ng-model="code">
|
||||
</label>
|
||||
<input type="submit" value="Get Access Token">
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div ng-show="index.glideraToken">
|
||||
<a
|
||||
class="button warning"
|
||||
|
|
|
|||
|
|
@ -113,9 +113,10 @@
|
|||
</div>
|
||||
<div class="right">
|
||||
|
||||
<a class="button outline round light-gray tiny m0"
|
||||
<a ng-show="!index.isShared" class="button outline round light-gray tiny preferences-icon m0"
|
||||
ng-click="$root.go('glidera')">
|
||||
Glidera
|
||||
<i class="fi-credit-card size-18 vm"></i>
|
||||
<span class="show-for-medium-up">Glidera</span>
|
||||
</a>
|
||||
|
||||
<a ng-click="$root.go('preferences')" class="button outline round light-gray tiny preferences-icon m0">
|
||||
|
|
|
|||
|
|
@ -1,13 +1,68 @@
|
|||
'use strict';
|
||||
|
||||
angular.module('copayApp.controllers').controller('glideraController',
|
||||
function(glideraService) {
|
||||
function($scope, $timeout, $modal, profileService, configService, storageService, glideraService) {
|
||||
|
||||
var config = configService.getSync().wallet.settings;
|
||||
this.authenticateUrl = glideraService.getOauthCodeUrl();
|
||||
|
||||
this.init = function(token) {
|
||||
this.update = function(token) {
|
||||
var self = this;
|
||||
glideraService.getTransactions(token, function(error, txs) {
|
||||
self.txs = txs;
|
||||
});
|
||||
glideraService.getEmail(token, function(error, data) {
|
||||
self.email = data.email;
|
||||
});
|
||||
};
|
||||
|
||||
this.submitOauthCode = function(code) {
|
||||
var fc = profileService.focusedClient;
|
||||
var self = this;
|
||||
this.loading = true;
|
||||
$timeout(function() {
|
||||
glideraService.getToken(code, function(error, data) {
|
||||
if (data && data.access_token) {
|
||||
storageService.setGlideraToken(fc.credentials.network, data.access_token, function() {
|
||||
$scope.$emit('Local/GlideraTokenUpdated');
|
||||
$timeout(function() {
|
||||
self.loading = false;
|
||||
$scope.$apply();
|
||||
}, 100);
|
||||
});
|
||||
}
|
||||
});
|
||||
}, 100);
|
||||
};
|
||||
|
||||
this.openTxModal = function(token, tx) {
|
||||
var self = this;
|
||||
var fc = profileService.focusedClient;
|
||||
var ModalInstanceCtrl = function($scope, $modalInstance) {
|
||||
$scope.tx = tx;
|
||||
$scope.settings = config;
|
||||
$scope.color = fc.backgroundColor;
|
||||
|
||||
glideraService.getTransaction(token, tx.transactionUuid, function(error, tx) {
|
||||
$scope.tx = tx;
|
||||
});
|
||||
|
||||
$scope.cancel = function() {
|
||||
$modalInstance.dismiss('cancel');
|
||||
};
|
||||
|
||||
};
|
||||
|
||||
var modalInstance = $modal.open({
|
||||
templateUrl: 'views/modals/glidera-tx-details.html',
|
||||
windowClass: 'full animated slideInRight',
|
||||
controller: ModalInstanceCtrl,
|
||||
});
|
||||
|
||||
modalInstance.result.finally(function() {
|
||||
var m = angular.element(document.getElementsByClassName('reveal-modal'));
|
||||
m.addClass('slideOutRight');
|
||||
});
|
||||
};
|
||||
|
||||
});
|
||||
|
|
|
|||
|
|
@ -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, addonManager, feeService, isChromeApp, bwsError, utilService, $state) {
|
||||
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, feeService, isChromeApp, bwsError, utilService, $state, glideraService) {
|
||||
var self = this;
|
||||
self.isCordova = isCordova;
|
||||
self.onGoingProcess = {};
|
||||
|
|
@ -114,6 +114,8 @@ angular.module('copayApp.controllers').controller('indexController', function($r
|
|||
self.setSpendUnconfirmed();
|
||||
|
||||
self.glideraToken = null;
|
||||
self.glideraTxs = null;
|
||||
self.glideraEmail = null;
|
||||
|
||||
$timeout(function() {
|
||||
self.hasProfile = true;
|
||||
|
|
@ -847,9 +849,18 @@ angular.module('copayApp.controllers').controller('indexController', function($r
|
|||
};
|
||||
|
||||
self.initGlidera = function() {
|
||||
if (self.isShared) return;
|
||||
storageService.getGlideraToken(self.network, function(err, val) {
|
||||
if (err) return;
|
||||
self.glideraToken = val;
|
||||
else {
|
||||
self.glideraToken = val;
|
||||
glideraService.getTransactions(val, function(error, txs) {
|
||||
self.glideraTxs = txs;
|
||||
});
|
||||
glideraService.getEmail(val, function(error, data) {
|
||||
self.glideraEmail = data.email;
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -3,8 +3,6 @@
|
|||
angular.module('copayApp.controllers').controller('preferencesGlideraController',
|
||||
function($scope, $timeout, profileService, go, glideraService, storageService) {
|
||||
|
||||
this.authenticateUrl = glideraService.getOauthCodeUrl();
|
||||
|
||||
this.init = function(token) {
|
||||
var self = this;
|
||||
glideraService.getPermissions(token, function(error, permission) {
|
||||
|
|
@ -26,21 +24,7 @@ angular.module('copayApp.controllers').controller('preferencesGlideraController'
|
|||
glideraService.getLimits(token, function(error, limits) {
|
||||
self.limits = limits;
|
||||
});
|
||||
};
|
||||
|
||||
this.submit = function(code) {
|
||||
var fc = profileService.focusedClient;
|
||||
glideraService.getToken(code, function(error, data) {
|
||||
if (data && data.status == 200) {
|
||||
storageService.setGlideraToken(fc.credentials.network, data.data.access_token, function() {
|
||||
$scope.$emit('Local/GlideraTokenUpdated');
|
||||
$timeout(function() {
|
||||
go.walletHome();
|
||||
}, 100);
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
};
|
||||
|
||||
this.revokeToken = function() {
|
||||
var fc = profileService.focusedClient;
|
||||
|
|
|
|||
|
|
@ -34,7 +34,7 @@ angular.module('copayApp.services').factory('glideraService', function($http, $l
|
|||
|
||||
$http(req).then(function(data) {
|
||||
$log.info('Glidera Authorization Access Token: SUCCESS');
|
||||
return cb(null, data);
|
||||
return cb(null, data.data);
|
||||
}, function(data) {
|
||||
$log.error('Glidera Authorization Access Token: ERROR ' + data.statusText);
|
||||
return cb(data.statusText);
|
||||
|
|
@ -111,8 +111,20 @@ angular.module('copayApp.services').factory('glideraService', function($http, $l
|
|||
root.getTransactions = function(token, cb) {
|
||||
if (!token) return cb('Invalid Token');
|
||||
$http(_get('/transaction', token)).then(function(data) {
|
||||
$log.info('Glidera Transaction: SUCCESS');
|
||||
$log.info('Glidera Transactions: SUCCESS');
|
||||
return cb(null, data.data.transactions);
|
||||
}, function(data) {
|
||||
$log.error('Glidera Transactions: ERROR ' + data.statusText);
|
||||
return cb(data.statusText);
|
||||
});
|
||||
};
|
||||
|
||||
root.getTransaction = function(token, txid, cb) {
|
||||
if (!token) return cb('Invalid Token');
|
||||
if (!txid) return cb('TxId required');
|
||||
$http(_get('/transaction/' + txid, token)).then(function(data) {
|
||||
$log.info('Glidera Transaction: SUCCESS');
|
||||
return cb(null, data.data);
|
||||
}, function(data) {
|
||||
$log.error('Glidera Transaction: ERROR ' + data.statusText);
|
||||
return cb(data.statusText);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue