Moved apiPrefix into api provider; put transaction list into ion-grid

This commit is contained in:
Darren Nelsen 2017-08-03 15:43:47 -04:00
parent 9f3a5d2bc8
commit 440a007915
10 changed files with 99 additions and 68 deletions

View File

@ -7,6 +7,7 @@ import { SplashScreen } from '@ionic-native/splash-screen';
import { InsightApp } from './app.component';
import { PagesModule, BlocksPage, BroadcastTxPage, NodeStatusPage, VerifyMessagePage } from '../pages';
import { BlocksService, StorageService } from '../services';
import { ApiProvider } from '../providers/api/api';
@NgModule({
declarations: [
@ -31,7 +32,8 @@ import { BlocksService, StorageService } from '../services';
SplashScreen,
StorageService,
BlocksService,
{provide: ErrorHandler, useClass: IonicErrorHandler}
{provide: ErrorHandler, useClass: IonicErrorHandler},
ApiProvider
]
})

View File

@ -1,5 +1,7 @@
<div>
<div *ngFor="let tx of transactions.txs" style="border: 1px solid purple">
<transaction [tx]="tx"></transaction>
</div>
</div>
<ion-grid>
<ion-row *ngFor="let tx of transactions.txs">
<ion-col col-12>
<transaction [tx]="tx"></transaction>
</ion-col>
</ion-row>
</ion-grid>

View File

@ -1,6 +1,7 @@
import { Component } from '@angular/core';
import { Input } from '@angular/core';
import { Http } from '@angular/http';
import { ApiProvider } from '../../providers/api/api';
/**
* Generated class for the TransactionListComponent component.
@ -19,13 +20,11 @@ export class TransactionListComponent {
@Input() public queryValue: string;
public transactions: any = [];
constructor(private http: Http) {
constructor(private http: Http, private api: ApiProvider) {
}
private ngOnInit(): void {
let apiPrefix: string = 'http://localhost:3001/insight-api/';
let url: string = apiPrefix + 'txs?' + this.queryType + '=' + this.queryValue;
let url: string = this.api.apiPrefix + 'txs?' + this.queryType + '=' + this.queryValue;
this.http.get(url).subscribe(
(data) => {

View File

@ -1,46 +1,57 @@
<div>
<p><a (click)="goToTx(tx.txid)">{{ tx.txid }}</a></p>
<div [hidden]="!tx.firstSeenTs">
<span translate>first seen at</span>
<time>{{tx.firstSeenTs * 1000 | date:'medium'}}</time>
</div>
<div [hidden]="!tx.blocktime && tx.firstSeenTs">
<span translate>mined</span>
<time>{{tx.time * 1000 | date:'medium'}}</time>
</div>
<div [hidden]="!tx.isCoinBase">
<div *ngFor="let vin of tx.vin">
<div>
<span translate>No Inputs (Newly Generated Coins)</span>
<ion-grid>
<ion-row>
<ion-col col-8>
<span><a (click)="goToTx(tx.txid)">{{ tx.txid }}</a></span>
</ion-col>
<ion-col col-4 text-right>
<div [hidden]="!tx.firstSeenTs">
<span translate>first seen at</span>
<time>{{tx.firstSeenTs * 1000 | date:'medium'}}</time>
</div>
</div>
<div>
&gt;
</div>
<div *ngFor="let vout of tx.vout">
<div>
<p><a (click)="goToAddress(getAddress(vout))">{{ getAddress(vout) }}</a> {{ vout.value + ' BTC' }} <span [hidden]="!vout.spentTxId">(S)</span><span [hidden]="vout.spentTxId">(U)</span></p>
<div [hidden]="!tx.blocktime && tx.firstSeenTs">
<span translate>mined</span>
<time>{{tx.time * 1000 | date:'medium'}}</time>
</div>
</div>
</div>
</ion-col>
</ion-row>
<div [hidden]="tx.isCoinBase">
<div *ngFor="let vin of tx.vin">
<div><a (click)="goToAddress(vin.addr)">{{ vin.addr }}</a></div>
<p>{{ vin.value + ' BTC' }}</p>
</div>
<div>
&gt;
</div>
<div *ngFor="let vout of tx.vout">
<div>
<p><a (click)="goToAddress(getAddress(vout))">{{ getAddress(vout) }}</a> {{ vout.value + ' BTC' }} <span [hidden]="!vout.spentTxId">(S)</span><span [hidden]="vout.spentTxId">(U)</span></p>
<ion-row>
<ion-col col-5>
<div [hidden]="!tx.isCoinBase">
<div *ngFor="let vin of tx.vin">
<div>
<span translate>No Inputs (Newly Generated Coins)</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div [hidden]="tx.isCoinBase">
<div *ngFor="let vin of tx.vin">
<div><a (click)="goToAddress(vin.addr)">{{ vin.addr }}</a></div>
<p>{{ vin.value + ' BTC' }}</p>
</div>
</div>
</ion-col>
<ion-col col-2>
<div>
&gt;
</div>
</ion-col>
<ion-col col-5>
<div *ngFor="let vout of tx.vout">
<div>
<p><a (click)="goToAddress(getAddress(vout))">{{ getAddress(vout) }}</a> {{ vout.value + ' BTC' }} <span [hidden]="!vout.spentTxId">(S)</span><span [hidden]="vout.spentTxId">(U)</span></p>
</div>
</div>
</ion-col>
</ion-row>
<ion-row>
<ion-col col-6>
Fee
</ion-col>
<ion-col col-6>
Confirmations
</ion-col>
</ion-row>
</ion-grid>

View File

@ -49,5 +49,5 @@
</ion-row>
</ion-grid>
<transaction-list [queryType]="'address'" [queryValue]="addrStr"></transaction-list>
<transaction-list [queryType]="'address'" [queryValue]="addrStr"></transaction-list>
</ion-content>

View File

@ -1,6 +1,7 @@
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Http } from '@angular/http';
import { ApiProvider } from '../../providers/api/api';
/**
* Generated class for the AddressPage page.
@ -22,14 +23,12 @@ export class AddressPage {
private addrStr: string;
public address: any = {};
constructor(public navCtrl: NavController, public navParams: NavParams, private http: Http) {
constructor(public navCtrl: NavController, public navParams: NavParams, private http: Http, private api: ApiProvider) {
this.addrStr = navParams.get('addrStr');
}
public ionViewDidLoad(): void {
let apiPrefix: string = 'http://localhost:3001/insight-api/';
this.http.get(apiPrefix + 'addr/' + this.addrStr + '/?noTxList=1').subscribe(
this.http.get(this.api.apiPrefix + 'addr/' + this.addrStr + '/?noTxList=1').subscribe(
(data) => {
this.address = JSON.parse(data['_body']);
this.loading = false;

View File

@ -1,6 +1,7 @@
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Http } from '@angular/http';
import { ApiProvider } from '../../providers/api/api';
/**
* Generated class for the BlockDetailPage page.
@ -24,12 +25,10 @@ export class BlockDetailPage {
tx: []
};
constructor(public navCtrl: NavController, private http: Http, public navParams: NavParams) {
constructor(public navCtrl: NavController, private http: Http, public navParams: NavParams, private api: ApiProvider) {
this.blockHash = navParams.get('blockHash');
let apiPrefix: string = 'http://localhost:3001/insight-api/';
this.http.get(apiPrefix + 'block/' + this.blockHash).subscribe(
this.http.get(this.api.apiPrefix + 'block/' + this.blockHash).subscribe(
(data) => {
this.block = JSON.parse(data['_body']);
this.loading = false;

View File

@ -4,6 +4,7 @@ import { Observable } from 'rxjs';
import { Block } from '../../models';
import { BlocksService } from '../../services';
import { Http } from '@angular/http';
import { ApiProvider } from '../../providers/api/api';
@Component({
templateUrl: './blocksPage.html'
@ -17,7 +18,7 @@ export class BlocksPage {
public q: string;
public badQuery: boolean = false;
constructor(private navCtrl: NavController, private http: Http, private blocksService: BlocksService) {
constructor(private navCtrl: NavController, private http: Http, private blocksService: BlocksService, private api: ApiProvider) {
this.title = 'Blocks';
this.blocks = blocksService.latestBlocks;
// this.blocks.subscribe((blocks) => {
@ -27,8 +28,8 @@ export class BlocksPage {
}
public search(): void {
console.log('q is', this.q);
let apiPrefix: string = 'http://localhost:3001/insight-api/';
let apiPrefix: string = this.api.apiPrefix;
this.http.get(apiPrefix + 'block/' + this.q).subscribe(
(data) => {
this.resetSearch();

View File

@ -1,6 +1,7 @@
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { Http } from '@angular/http';
import { ApiProvider } from '../../providers/api/api';
/**
* Generated class for the TransactionPage page.
@ -22,14 +23,12 @@ export class TransactionPage {
private txId: string;
public tx: any = {};
constructor(public navCtrl: NavController, public navParams: NavParams, private http: Http) {
constructor(public navCtrl: NavController, public navParams: NavParams, private http: Http, private api: ApiProvider) {
this.txId = navParams.get('txId');
}
public ionViewDidLoad(): void {
let apiPrefix: string = 'http://localhost:3001/insight-api/';
this.http.get(apiPrefix + 'tx/' + this.txId).subscribe(
this.http.get(this.api.apiPrefix + 'tx/' + this.txId).subscribe(
(data) => {
this.tx = JSON.parse(data['_body']);
console.log('tx', this.tx);

View File

@ -0,0 +1,19 @@
import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
/*
Generated class for the ApiProvider provider.
See https://angular.io/docs/ts/latest/guide/dependency-injection.html
for more info on providers and Angular DI.
*/
@Injectable()
export class ApiProvider {
public apiPrefix: string = 'http://localhost:3001/insight-api/';
constructor(public http: Http) {
}
}