From 7bdd0fa1875cc3db54daba5d4602b79657bc5e82 Mon Sep 17 00:00:00 2001 From: Ash Bhimasani <16abhimasani@gmail.com> Date: Thu, 31 May 2018 14:35:37 -0400 Subject: [PATCH] Index Highlighting --- .../components/transaction/transaction.html | 26 ++++++-- .../components/transaction/transaction.scss | 33 ++++++++++ app/src/components/transaction/transaction.ts | 22 +++++++ app/src/pages/input/input.html | 64 +++++++++++++++++++ app/src/pages/input/input.module.ts | 20 ++++++ app/src/pages/input/input.scss | 3 + app/src/pages/input/input.ts | 56 ++++++++++++++++ app/src/pages/output/output.html | 63 ++++++++++++++++++ app/src/pages/output/output.module.ts | 20 ++++++ app/src/pages/output/output.scss | 3 + app/src/pages/output/output.ts | 52 +++++++++++++++ 11 files changed, 357 insertions(+), 5 deletions(-) create mode 100644 app/src/pages/input/input.html create mode 100644 app/src/pages/input/input.module.ts create mode 100644 app/src/pages/input/input.scss create mode 100644 app/src/pages/input/input.ts create mode 100644 app/src/pages/output/output.html create mode 100644 app/src/pages/output/output.module.ts create mode 100644 app/src/pages/output/output.scss create mode 100644 app/src/pages/output/output.ts diff --git a/app/src/components/transaction/transaction.html b/app/src/components/transaction/transaction.html index 7a678c0..e660ea9 100644 --- a/app/src/components/transaction/transaction.html +++ b/app/src/components/transaction/transaction.html @@ -32,16 +32,25 @@ - +
+ + + + + + + {{ printer(vin) }} +

{{ vin.addr }}

- Confirmations {{vin.confirmations}}

+ Confirmations {{vin.confirmations}} +

Unlocking Script

@@ -66,7 +75,7 @@ - + @@ -94,7 +103,14 @@
{{ currency.getConvertedNumber(vout.value) | number:'1.0-8' }} {{ currency.currencySymbol }} - (S) + + + + (S) + + + + (U)
@@ -128,4 +144,4 @@ - \ No newline at end of file + diff --git a/app/src/components/transaction/transaction.scss b/app/src/components/transaction/transaction.scss index eb8f8a0..78d2821 100644 --- a/app/src/components/transaction/transaction.scss +++ b/app/src/components/transaction/transaction.scss @@ -9,6 +9,8 @@ transaction { ion-row { border: 1px solid #f3f3f3; + margin-top: 10px; + margin-bottom: 10px; &.small { font-size: 1.1rem; @@ -24,11 +26,35 @@ transaction { ion-icon { color: rgba(0, 0, 0, 0.25); + margin-right: 5px; } +// New Stuff + +.shiftDown { + padding-top: 1.2em; +} + +.ellipsis { + margin-bottom: .7rem; + margin-top: 8px; +} + +.unlocking-script { + padding-top: .7rem; + max-width: 90%; +} + +.locking-script { + padding-top: .7rem; +} + +//end + .item, .item p { font-size: 1.4rem; + font-weight: bold; } $transaction-item-boarder-radius: 3px; @@ -41,6 +67,13 @@ transaction { border-bottom-right-radius: $transaction-item-boarder-radius; } + .itemHighlight { + background-color: #8dc429; + } + .itemNoLight { + background-color: default; + } + .list { margin-bottom: 5px; } diff --git a/app/src/components/transaction/transaction.ts b/app/src/components/transaction/transaction.ts index 8d5cc19..0218813 100644 --- a/app/src/components/transaction/transaction.ts +++ b/app/src/components/transaction/transaction.ts @@ -19,6 +19,7 @@ export class TransactionComponent { public expanded: boolean = false; @Input() public tx: any = {}; + @Input() public dx?: number; constructor(private navCtrl: NavController, public currency: CurrencyProvider) { } @@ -37,6 +38,24 @@ export class TransactionComponent { }); } + public goToInput(txId: string, dxNm: number): void { + this.navCtrl.push('input', { + 'txId': txId, + 'dxNm': dxNm + }); + } + + public goToOutput(txId: string, dxNm: number): void { + this.navCtrl.push('output', { + 'txId': txId, + 'dxNm': dxNm + }); + } + + public printer(obj: any): void { + console.log(obj); + } + public goToAddress(addrStr: string): void { this.navCtrl.push('address', { 'addrStr': addrStr @@ -48,6 +67,9 @@ export class TransactionComponent { } public aggregateItems(items: Array): Array { + + console.log(this.dx); + if (!items) return []; let l: number = items.length; diff --git a/app/src/pages/input/input.html b/app/src/pages/input/input.html new file mode 100644 index 0000000..d5bede7 --- /dev/null +++ b/app/src/pages/input/input.html @@ -0,0 +1,64 @@ + + + + + + + + +
+ +
+ +
+

Input Transaction | Index #{{ dxNm }}

+

+ Transaction Hash {{ tx.txid }} +

+

+

Summary

+ + + + Size + + {{ tx.size }} (bytes) + + + + Fee Rate + + {{ (tx.fees / tx.size) * 1E8 | number:'1.0-8' }} sats/byte + + + + Received Time + + {{ tx.time * 1000 | date:'medium' }} + + + + Mined Time + + {{ tx.blocktime * 1000 | date:'medium' }} + + + + Included in Block + + {{ tx.blockhash }} + + + +
+

Details

+ + +
+ + diff --git a/app/src/pages/input/input.module.ts b/app/src/pages/input/input.module.ts new file mode 100644 index 0000000..9729a23 --- /dev/null +++ b/app/src/pages/input/input.module.ts @@ -0,0 +1,20 @@ +import { NgModule } from '@angular/core'; +import { IonicPageModule } from 'ionic-angular'; +import { InputPage } from './input'; +import { TransactionComponentModule } from '../../components/transaction/transaction.module'; +import { HeadNavComponentModule } from '../../components/head-nav/head-nav.module'; + +@NgModule({ + declarations: [ + InputPage + ], + imports: [ + IonicPageModule.forChild(InputPage), + TransactionComponentModule, + HeadNavComponentModule + ], + exports: [ + InputPage + ] +}) +export class InputPageModule {} diff --git a/app/src/pages/input/input.scss b/app/src/pages/input/input.scss new file mode 100644 index 0000000..019e5fd --- /dev/null +++ b/app/src/pages/input/input.scss @@ -0,0 +1,3 @@ +page-input { + +} diff --git a/app/src/pages/input/input.ts b/app/src/pages/input/input.ts new file mode 100644 index 0000000..8abd2b0 --- /dev/null +++ b/app/src/pages/input/input.ts @@ -0,0 +1,56 @@ +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 InputPage page. + * + * See http://ionicframework.com/docs/components/#navigation for more info + * on Ionic pages and navigation. + */ + @IonicPage({ + name: 'input', + segment: 'tx/:txId/:dxNm' + }) +@Component({ + selector: 'page-input', + templateUrl: 'input.html' +}) +export class InputPage { + + public loading: boolean = true; + private txId: string; + public dxNm: number; + public tx: any = {}; + + constructor(public navCtrl: NavController, public navParams: NavParams, private http: Http, private api: ApiProvider) { + this.txId = navParams.get('txId'); + this.dxNm = Number(navParams.get('dxNm')); + console.log(this.dxNm); + } + + // ionViewDidLoad() { + // console.log('ionViewDidLoad InputPage'); + // } + + public ionViewDidLoad(): void { + this.http.get(this.api.apiPrefix + 'tx/' + this.txId).subscribe( + (data) => { + this.tx = JSON.parse(data['_body']); + this.loading = false; + }, + (err) => { + console.log('err is', err); + this.loading = false; + } + ); + } + + public goToBlock(blockHash: string): void { + this.navCtrl.push('block-detail', { + 'blockHash': blockHash + }); + } + +} diff --git a/app/src/pages/output/output.html b/app/src/pages/output/output.html new file mode 100644 index 0000000..0a62959 --- /dev/null +++ b/app/src/pages/output/output.html @@ -0,0 +1,63 @@ + + + + + + + +
+ +
+ +
+

Output Transaction | Index #{{ dxNm }}

+

+ Transaction Hash {{ tx.txid }} +

+

+

Summary

+ + + + Size + + {{ tx.size }} (bytes) + + + + Fee Rate + + {{ (tx.fees / tx.size) * 1E8 | number:'1.0-8' }} sats/byte + + + + Received Time + + {{ tx.time * 1000 | date:'medium' }} + + + + Mined Time + + {{ tx.blocktime * 1000 | date:'medium' }} + + + + Included in Block + + {{ tx.blockhash }} + + + +
+

Details

+ + +
+ + diff --git a/app/src/pages/output/output.module.ts b/app/src/pages/output/output.module.ts new file mode 100644 index 0000000..298d9c7 --- /dev/null +++ b/app/src/pages/output/output.module.ts @@ -0,0 +1,20 @@ +import { NgModule } from '@angular/core'; +import { IonicPageModule } from 'ionic-angular'; +import { OutputPage } from './output'; +import { TransactionComponentModule } from '../../components/transaction/transaction.module'; +import { HeadNavComponentModule } from '../../components/head-nav/head-nav.module'; + +@NgModule({ + declarations: [ + OutputPage + ], + imports: [ + IonicPageModule.forChild(OutputPage), + TransactionComponentModule, + HeadNavComponentModule + ], + exports: [ + OutputPage + ] +}) +export class OutputPageModule {} diff --git a/app/src/pages/output/output.scss b/app/src/pages/output/output.scss new file mode 100644 index 0000000..eba3892 --- /dev/null +++ b/app/src/pages/output/output.scss @@ -0,0 +1,3 @@ +page-output { + +} diff --git a/app/src/pages/output/output.ts b/app/src/pages/output/output.ts new file mode 100644 index 0000000..eba3c6a --- /dev/null +++ b/app/src/pages/output/output.ts @@ -0,0 +1,52 @@ +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 OutputPage page. + * + * See http://ionicframework.com/docs/components/#navigation for more info + * on Ionic pages and navigation. + */ + @IonicPage({ + name: 'output', + segment: 'tx/:txId/:dxNm' + }) +@Component({ + selector: 'page-output', + templateUrl: 'output.html' +}) +export class OutputPage { + + public loading: boolean = true; + private txId: string; + public dxNm: number; + public tx: any = {}; + + constructor(public navCtrl: NavController, public navParams: NavParams, private http: Http, private api: ApiProvider) { + this.txId = navParams.get('txId'); + this.dxNm = Number(navParams.get('dxNm')); + console.log(this.dxNm); + } + + public ionViewDidLoad(): void { + this.http.get(this.api.apiPrefix + 'tx/' + this.txId).subscribe( + (data) => { + this.tx = JSON.parse(data['_body']); + this.loading = false; + }, + (err) => { + console.log('err is', err); + this.loading = false; + } + ); + } + + public goToBlock(blockHash: string): void { + this.navCtrl.push('block-detail', { + 'blockHash': blockHash + }); + } + +}