Commit 896fcfa5 authored by Pieterjan Vanhoof's avatar Pieterjan Vanhoof Committed by GitHub

Merge pull request #118 from stratisproject/ui

Add server polling
parents b48c9e77 7ba58952
......@@ -33,6 +33,9 @@ npm install -g @angular/cli
## To build for development
- **in a terminal window** -> npm start
If you want to seperate the build process from the Electron process you can use:
- **in a terminal window** -> npm start:webpack
- **in another terminal window** -> npm run electron:serve
## To build for production
......
......@@ -20,7 +20,8 @@
"scripts": {
"ng": "ng",
"lint": "ng lint",
"start": "webpack --watch",
"start": "concurrently \"npm run start:webpack\" \"npm run electron:serve\"",
"start:webpack": "webpack --watch",
"start:web": "webpack-dev-server --content-base . --port 4200 --inline",
"build:electron:main": "tsc main.ts --outDir dist && copyfiles package.json dist && cd dist && npm install --prod && cd ..",
"build": "webpack --display-error-details && npm run build:electron:main",
......
......@@ -22,7 +22,7 @@
<select name="network" formControlName="selectNetwork">
<!--<option value="main">Main</option>-->
<option value="test">Testnet</option>
<option value="stratistest">StratisTest</option>
<!--<option value="stratistest">StratisTest</option>-->
</select>
</div>
<div class="form-group">
......
......@@ -32,7 +32,7 @@
<select name="network" formControlName="selectNetwork">
<!--<option value="main">Main</option>-->
<option value="test">Testnet</option>
<option value="stratistest">StratisTest</option>
<!--<option value="stratistest">StratisTest</option>-->
</select>
</div>
<div class="form-group">
......
......@@ -2,7 +2,10 @@ import { Injectable } from '@angular/core';
import { Http, Headers, Response, RequestOptions, URLSearchParams} from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/switchMap';
import 'rxjs/add/operator/catch';
import "rxjs/add/observable/interval";
import 'rxjs/add/operator/startWith';
import { WalletCreation } from '../classes/wallet-creation';
import { WalletRecovery } from '../classes/wallet-recovery';
......@@ -22,6 +25,7 @@ export class ApiService {
private mockApiUrl = 'http://localhost:3000/api';
private webApiUrl = 'http://localhost:5000/api';
private headers = new Headers({'Content-Type': 'application/json'});
private pollingInterval = 3000;
/**
* Gets available wallets at the default path
......@@ -74,11 +78,16 @@ export class ApiService {
getWalletBalance(data: WalletInfo): Observable<any> {
let params: URLSearchParams = new URLSearchParams();
params.set('walletName', data.walletName);
params.set('coinType', data.coinType.toString());
return this.http
.get(this.webApiUrl + '/wallet/balance', new RequestOptions({headers: this.headers, search: params}))
return Observable
.interval(this.pollingInterval)
.startWith(0)
.switchMap(() => this.http.get(this.webApiUrl + '/wallet/balance', new RequestOptions({headers: this.headers, search: params})))
.map((response: Response) => response);
// return this.http
// .get(this.webApiUrl + '/wallet/balance', new RequestOptions({headers: this.headers, search: params}))
// .map((response: Response) => response);
}
/**
......@@ -87,11 +96,16 @@ export class ApiService {
getWalletHistory(data: WalletInfo): Observable<any> {
let params: URLSearchParams = new URLSearchParams();
params.set('walletName', data.walletName);
params.set('coinType', data.coinType.toString());
return this.http
.get(this.webApiUrl + '/wallet/history', new RequestOptions({headers: this.headers, search: params}))
return Observable
.interval(this.pollingInterval)
.startWith(0)
.switchMap(() => this.http.get(this.webApiUrl + '/wallet/history', new RequestOptions({headers: this.headers, search: params})))
.map((response: Response) => response);
// return this.http
// .get(this.webApiUrl + '/wallet/history', new RequestOptions({headers: this.headers, search: params}))
// .map((response: Response) => response);
}
/**
......@@ -100,7 +114,6 @@ export class ApiService {
getUnusedReceiveAddress(data: WalletInfo): Observable<any> {
let params: URLSearchParams = new URLSearchParams();
params.set('walletName', data.walletName);
params.set('coinType', data.coinType.toString());
params.set('accountName', "account 0"); //temporary
return this.http
......
import { Component, OnInit, Input } from '@angular/core';
import {NgbModal, NgbActiveModal} from '@ng-bootstrap/ng-bootstrap';
import { Component, OnInit, OnDestroy, Input } from '@angular/core';
import { NgbModal, NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { ApiService } from '../../shared/services/api.service';
import { GlobalService } from '../../shared/services/global.service';
......@@ -8,6 +8,10 @@ import { WalletInfo } from '../../shared/classes/wallet-info';
import { SendComponent } from '../send/send.component';
import { ReceiveComponent } from '../receive/receive.component';
import { Observable } from 'rxjs/Rx';
import { Subscription } from 'rxjs/Subscription';
import 'rxjs/add/operator/first';
@Component({
selector: 'dashboard-component',
templateUrl: './dashboard.component.html',
......@@ -20,10 +24,17 @@ export class DashboardComponent {
private confirmedBalance: number;
private unconfirmedBalance: number;
private transactions: any;
private walletBalanceSubscription: Subscription;
private walletHistorySubscription: Subscription;
ngOnInit() {
this.getWalletBalance();
this.getHistory();
this.getWalletBalance();
this.getHistory();
};
ngOnDestroy() {
this.walletBalanceSubscription.unsubscribe();
this.walletHistorySubscription.unsubscribe();
};
private openSendDialog() {
......@@ -36,8 +47,8 @@ export class DashboardComponent {
private getWalletBalance() {
let walletInfo = new WalletInfo(this.globalService.getWalletName(), this.globalService.getCoinType())
this.apiService.getWalletBalance(walletInfo)
.subscribe(
this.walletBalanceSubscription = this.apiService.getWalletBalance(walletInfo)
.subscribe(
response => {
if (response.status >= 200 && response.status < 400) {
let balanceResponse = response.json();
......@@ -56,7 +67,7 @@ export class DashboardComponent {
private getHistory() {
let walletInfo = new WalletInfo(this.globalService.getWalletName(), this.globalService.getCoinType())
this.apiService.getWalletHistory(walletInfo)
this.walletHistorySubscription = this.apiService.getWalletHistory(walletInfo)
.subscribe(
response => {
if (response.status >= 200 && response.status < 400) {
......
import { Component, OnInit } from '@angular/core';
import { Component, OnInit, OnDestroy } from '@angular/core';
import { ApiService } from '../../shared/services/api.service';
import { GlobalService } from '../../shared/services/global.service';
import { WalletInfo } from '../../shared/classes/wallet-info';
import { Observable } from 'rxjs/Rx';
import { Subscription } from 'rxjs/Subscription';
@Component({
selector: 'history-component',
templateUrl: './history.component.html',
......@@ -16,14 +19,19 @@ export class HistoryComponent {
private transactions: any;
private errorMessage: string;
private walletHistorySubscription: Subscription;
ngOnInit() {
this.getHistory();
}
ngOnDestroy() {
this.walletHistorySubscription.unsubscribe();
}
private getHistory() {
let walletInfo = new WalletInfo(this.globalService.getWalletName(), this.globalService.getCoinType())
this.apiService.getWalletHistory(walletInfo)
this.walletHistorySubscription = this.apiService.getWalletHistory(walletInfo)
.subscribe(
response => {
if (response.status >= 200 && response.status < 400) {
......
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