Commit 2022fae5 authored by Pieterjan Vanhoof's avatar Pieterjan Vanhoof Committed by GitHub

Merge pull request #271 from stratisproject/ui

Various UI additions
parents 6d626805 bd1111f6
......@@ -144,7 +144,7 @@ function startBitcoinApi() {
apiPath = path.join(__dirname, '".\\assets\\daemon\\Stratis.BreezeD.exe"');
}
bitcoinProcess = execBitcoin('"' + apiPath + '" light -testnet', {
bitcoinProcess = execBitcoin('"' + apiPath + '" -testnet', {
detached: true
}, (error, stdout, stderr) => {
if (error) {
......@@ -168,7 +168,7 @@ function startStratisApi() {
apiPath = path.join(__dirname, '".\\assets\\daemon\\Stratis.BreezeD.exe"');
}
stratisProcess = execStratis('"' + apiPath + '" stratis light -testnet', {
stratisProcess = execStratis('"' + apiPath + '" stratis -testnet', {
detached: true
}, (error, stdout, stderr) => {
if (error) {
......
......@@ -28,7 +28,6 @@ export class RecoverComponent implements OnInit {
ngOnInit() {
this.bsConfig = Object.assign({}, {showWeekNumbers: false, containerClass: 'theme-blue'});
console.log(new Date());
}
private buildRecoverForm(): void {
......@@ -170,7 +169,7 @@ export class RecoverComponent implements OnInit {
}
}
this.AlertIfNeeded(bitcoinErrorMessage, stratisErrorMessage);
}
}
)
;
}
......
......@@ -5,11 +5,17 @@
<div class="jumbotron jumbotron-fluid">
<div class="container">
<div class="row d-flex align-items-center">
<div class="col-xs-12 col-md-4 text-left">
<div class="col-xs-12 col-md-3 text-left">
<h5>Active Wallet</h5>
<p class="lead">
<strong>{{ walletName }}</strong>
</p>
</div>
<div class="col-xs-12 col-md-3 text-left">
<h5>Active balance</h5>
<p class="lead">
<!--<strong><span class="h2">29</span>.76500293</strong>-->
<strong>{{ confirmedBalance | coinNotation }}</strong>
<strong>{{ (confirmedBalance | coinNotation) || (0 | coinNotation) }}</strong>
<small class="text-uppercase"> {{ coinUnit }}</small>
</p>
</div>
......@@ -22,15 +28,15 @@
<small class="text-uppercase">usd</small>
</p>
</div>-->
<div class="col-xs-12 col-md-4 text-left">
<div class="col-xs-12 col-md-3 text-left">
<h5>Unconfirmed balance</h5>
<p class="lead">
<strong>{{ unconfirmedBalance | coinNotation }}</strong>
<strong>{{ (unconfirmedBalance | coinNotation) || (0 | coinNotation) }}</strong>
<small class="text-uppercase"> {{ coinUnit }}</small>
</p>
</div>
<!-- /col-->
<div class="col-xs-12 col-md-4 text-right">
<div class="col-xs-12 col-md-3 text-right">
<p>
<a class="btn btn-secondary" data-toggle="modal" data-target="#modalReceive" role="button" (click)="openReceiveDialog()">Receive</a>
<a class="btn btn-primary ml-2" data-toggle="modal" data-target="#modalSend" role="button" (click)="openSendDialog()">Send</a>
......@@ -56,7 +62,7 @@
<li class="list-inline-item col-4 amount text-left align-baseline">
<span *ngIf="transaction.transactionType == 'received'" class="text-success">+</span>
<span *ngIf="transaction.transactionType == 'sent'" class="text-danger">-</span>
{{ transaction.transactionAmount | coinNotation }}
{{ transaction.transactionAmount + transaction.transactionFee | coinNotation }}
<small class="text-uppercase">{{ coinUnit }}</small>
<span *ngIf="transaction.transactionConfirmedInBlock" class="badge badge-success text-capitalize">Confirmed</span>
<span *ngIf="!transaction.transactionConfirmedInBlock" class="badge badge-warning text-capitalize">Pending</span>
......
......@@ -22,15 +22,17 @@ import { Subscription } from 'rxjs/Subscription';
export class DashboardComponent implements OnInit {
constructor(private apiService: ApiService, private globalService: GlobalService, private modalService: NgbModal) {}
public walletName: string;
public coinUnit: string;
public confirmedBalance: number;
public unconfirmedBalance: number;
public transactionArray: TransactionInfo[];
public coinUnit: string;
private walletBalanceSubscription: Subscription;
private walletHistorySubscription: Subscription;
ngOnInit() {
this.startSubscriptions();
this.walletName = this.globalService.getWalletName();
this.coinUnit = this.globalService.getCoinUnit();
};
......@@ -65,6 +67,7 @@ export class DashboardComponent implements OnInit {
error => {
console.log(error);
if (error.status === 0) {
this.cancelSubscriptions();
alert("Something went wrong while connecting to the API. Please restart the application.");
} else if (error.status >= 400) {
if (!error.json().errors[0]) {
......@@ -101,6 +104,7 @@ export class DashboardComponent implements OnInit {
error => {
console.log(error);
if (error.status === 0) {
this.cancelSubscriptions();
alert("Something went wrong while connecting to the API. Please restart the application.");
} else if (error.status >= 400) {
if (!error.json().errors[0]) {
......@@ -132,7 +136,12 @@ export class DashboardComponent implements OnInit {
}
let transactionId = transaction.id;
let transactionAmount = transaction.amount;
let transactionFee = transaction.fee;
let transactionFee;
if (transaction.fee) {
transactionFee = transaction.fee;
} else {
transactionFee = 0;
}
let transactionConfirmedInBlock = transaction.confirmedInBlock;
let transactionTimestamp = transaction.timestamp;
let transactionConfirmed;
......
......@@ -30,7 +30,7 @@
<li class="list-inline-item col-4 amount text-left align-baseline">
<span *ngIf="transaction.transactionType == 'received'" class="text-success">+</span>
<span *ngIf="transaction.transactionType == 'sent'" class="text-danger">-</span>
{{ transaction.transactionAmount | coinNotation }}
{{ transaction.transactionAmount + transaction.transactionFee | coinNotation }}
<small class="text-uppercase"> {{ coinUnit }} </small>
<span *ngIf="transaction.transactionConfirmedInBlock" class="badge badge-success text-capitalize">Confirmed</span>
<span *ngIf="!transaction.transactionConfirmedInBlock" class="badge badge-warning text-capitalize">Pending</span>
......
......@@ -57,6 +57,7 @@ export class HistoryComponent {
error => {
console.log(error);
if (error.status === 0) {
this.cancelSubscriptions();
alert("Something went wrong while connecting to the API. Please restart the application.");
} else if (error.status >= 400) {
if (!error.json().errors[0]) {
......@@ -88,7 +89,12 @@ export class HistoryComponent {
}
let transactionId = transaction.id;
let transactionAmount = transaction.amount;
let transactionFee = transaction.fee;
let transactionFee;
if (transaction.fee) {
transactionFee = transaction.fee;
} else {
transactionFee = 0;
}
let transactionConfirmedInBlock = transaction.confirmedInBlock;
let transactionTimestamp = transaction.timestamp;
let transactionConfirmed;
......
......@@ -116,7 +116,7 @@ export class SendComponent implements OnInit {
console.log(error);
}
else {
alert(error.json().errors[0].message);
alert(error.json().errors[0].description);
}
}
},
......@@ -158,7 +158,7 @@ export class SendComponent implements OnInit {
console.log(error);
}
else {
alert(error.json().errors[0].message);
alert(error.json().errors[0].description);
}
}
},
......
......@@ -60,6 +60,7 @@ export class StatusBarComponent implements OnInit {
error => {
console.log(error);
if (error.status === 0) {
this.cancelSubscriptions();
alert("Something went wrong while connecting to the API. Please restart the application.");
} else if (error.status >= 400) {
if (!error.json().errors[0]) {
......
......@@ -13,8 +13,12 @@
<ul class="list-inline row">
<li class="list-inline-item col blockLabel">Amount</li>
<li *ngIf="transaction.transactionType == 'received'" class="list-inline-item col-9 blockText text-success">{{ transaction.transactionAmount | coinNotation }} {{ coinUnit }}</li>
<li *ngIf="transaction.transactionType == 'sent'" class="list-inline-item col-9 blockText text-danger">-{{ transaction.transactionAmount | coinNotation }} {{ coinUnit }}</li>
<li *ngIf="transaction.transactionType == 'sent'" class="list-inline-item col-9 blockText text-danger">-{{ transaction.transactionAmount + transaction.transactionFee | coinNotation }} {{ coinUnit }}</li>
</ul>
<!-- <ul class="list-inline row" *ngIf="transaction.transactionType == 'sent'">
<li class="list-inline-item col blockLabel">Fee</li>
<li *ngIf="transaction.transactionType == 'sent'" class="list-inline-item col-9 blockText text-danger">{{ transaction.transactionFee | coinNotation }} {{ coinUnit }}</li>
</ul> -->
<ul class="list-inline row">
<li class="list-inline-item col blockLabel">Date</li>
<li class="list-inline-item col-9 blockText">{{ transaction.transactionTimestamp * 1000 | date:'medium' }}</li>
......
......@@ -44,16 +44,14 @@ code {color: $spacegray !important;}
display:inline-block;
fill: $darkgray !important;
}
@-webkit-keyframes blink-caret { 50% { border-color: transparent; } }
em {
&.display-4 {
font-size: 1.6em;
color: $darkgray;
font-weight: 400;
padding-right: 5px;
border-right: .1em solid $blue;
white-space: nowrap;
-webkit-animation: blink-caret .5s step-end infinite alternate;
}
}
......@@ -174,7 +172,7 @@ em {
}
}
// bagdes
// badges
.badge {
&.badge-danger {color: $pink;}
&.badge-warning {color: $yellow;}
......
......@@ -61,20 +61,12 @@ code {
fill: #1B354B !important;
}
@-webkit-keyframes blink-caret {
50% {
border-color: transparent;
}
}
em.display-4 {
font-size: 1.6em;
color: #1B354B;
font-weight: 400;
padding-right: 5px;
border-right: 0.1em solid #7385A0;
white-space: nowrap;
-webkit-animation: blink-caret .5s step-end infinite alternate;
}
.datepicker__input {
......
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment