From 8cb2e0f427644078b3c30cede905015f162407fe Mon Sep 17 00:00:00 2001 From: SuriyaR Date: Thu, 1 Aug 2019 19:29:20 +0530 Subject: [PATCH] UI changes and peers changes --- server/controllers/BlockchainBlock.ts | 3 + server/i18n/en.json | 8 +- src/app/app.module.ts | 2 - src/app/shared/services/chart.service.ts | 14 +- .../block-detail-list.component.html | 8 +- .../block-detail-list.component.ts | 13 +- .../home/graph-list/graph-list.component.ts | 3 +- .../latestblocks/latestblocks.component.html | 265 +++++++++++++----- .../latestblocks/latestblocks.component.ts | 7 +- src/assets/css/responsive.css | 7 + src/assets/css/style.css | 3 +- src/environments/environment.ts | 2 +- 12 files changed, 247 insertions(+), 88 deletions(-) diff --git a/server/controllers/BlockchainBlock.ts b/server/controllers/BlockchainBlock.ts index c078582..cd4fb7e 100644 --- a/server/controllers/BlockchainBlock.ts +++ b/server/controllers/BlockchainBlock.ts @@ -1042,6 +1042,7 @@ export class BlockchainBlockController { next(err_msg); }); let date = [], + blockDate = [], DifficultyCuckaroo = [], DifficultyCuckatoo = [], DifficultyProgpow = [], @@ -1056,6 +1057,7 @@ export class BlockchainBlockController { DifficultyRandomx.push(parseInt(e.total_difficulty_randomx)); }); BlockQuery.forEach(e => { + blockDate.push(moment(e.date).format('YYYY-MM-DD')); blocks.push(parseInt(e.blocks)); }); response.status(200).json({ @@ -1065,6 +1067,7 @@ export class BlockchainBlockController { response: { Date: date, Blocks: blocks, + blockDate:blockDate, DifficultyCuckaroo: DifficultyCuckaroo, DifficultyCuckatoo: DifficultyCuckatoo, DifficultyProgpow: DifficultyProgpow, diff --git a/server/i18n/en.json b/server/i18n/en.json index 91803ea..24961d5 100644 --- a/server/i18n/en.json +++ b/server/i18n/en.json @@ -60,6 +60,12 @@ "SEARCH_RESULT" : "Search Results for", "SEARCH_RESULT1" : "Your search term", "SEARCH_RESULT2" : "is too short", - "SEARCH_RESULT3" : "please enter at least six characters if searching by hash" + "SEARCH_RESULT3" : "please enter at least six characters if searching by hash", + "PEERS" : "Peers", + "CAPABILITIES" : "Capabilities", + "USER_AGENT" : "User Agent", + "VERSION" : "Version", + "ADDR" : "Addr", + "DIRECTION" : "Direction" } } diff --git a/src/app/app.module.ts b/src/app/app.module.ts index f1f2b75..1c39417 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -25,8 +25,6 @@ export class CustomLoader extends ChartService implements TranslateLoader { params = params.append('lang', lang); return this.apiGetRequest(params,'/blockchain_kernel/translator').pipe( map((res: any) => { - console.log("Data got: "); - console.log(res); return res; }) ); diff --git a/src/app/shared/services/chart.service.ts b/src/app/shared/services/chart.service.ts index 8dfc86b..0c16d5c 100644 --- a/src/app/shared/services/chart.service.ts +++ b/src/app/shared/services/chart.service.ts @@ -7,7 +7,7 @@ import { import { environment } from '../../../environments/environment'; import { throwError, Observable, BehaviorSubject } from 'rxjs'; import { map, catchError } from 'rxjs/operators'; -import * as io from 'socket.io-client'; +// import * as io from 'socket.io-client'; @Injectable({ providedIn: 'root', @@ -18,12 +18,12 @@ private server = environment.domain; constructor(public http: HttpClient) {} -public createSocketConnection() { - this.socket = io.connect(this.server); - this.socket.on('connect', function(socket) { - console.log('Connected!'); - }); - } +// public createSocketConnection() { +// this.socket = io.connect(this.server); +// this.socket.on('connect', function(socket) { +// console.log('Connected!'); +// }); +// } public apiGetRequest(request: any, reqUrl): Observable { return this.http diff --git a/src/app/view/home/block-detail-list/block-detail-list.component.html b/src/app/view/home/block-detail-list/block-detail-list.component.html index 6ef4bd7..8a0df4d 100644 --- a/src/app/view/home/block-detail-list/block-detail-list.component.html +++ b/src/app/view/home/block-detail-list/block-detail-list.component.html @@ -26,25 +26,25 @@ -->
-
+

{{ latestblockdetail.block_height | number }}

{{'home.BLOCKCHAIN_HEIGHT' | translate}}

-
+

{{latestblockdetail.letest_block_num}} {{latestblockdetail.letest_block_duration}}

{{'home.LATEST_BLOCK' | translate}}

-
+

Cuckaroo : {{latestblockdetail.targetdifficultycuckaroo | number}}, Cuckatoo : {{latestblockdetail.targetdifficultycuckatoo | number}}, ProgPow : {{latestblockdetail.targetdifficultyprogpow | number}}, RandomX : {{latestblockdetail.targetdifficultyrandomx | number}}

{{'home.LATEST_BLOCK1' | translate}}

-
+

{{latestblockdetail.coin_existence | number}} Epic

{{'home.COIN_IN' | translate}}

diff --git a/src/app/view/home/block-detail-list/block-detail-list.component.ts b/src/app/view/home/block-detail-list/block-detail-list.component.ts index 7aa8982..d4b25fb 100644 --- a/src/app/view/home/block-detail-list/block-detail-list.component.ts +++ b/src/app/view/home/block-detail-list/block-detail-list.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, ViewChild, ElementRef } from '@angular/core'; import { ChartService } from '../../../shared/services/chart.service'; import { HttpParams } from '@angular/common/http'; import * as io from 'socket.io-client'; @@ -17,9 +17,12 @@ export class BlockDetailListComponent implements OnInit { public latestblockdetailObservable: any; private server = environment.domain; private socket; - + @ViewChild('minhgt', {static: false}) elementView: ElementRef; + + minHeight: number; + constructor(private chartService: ChartService,public translate: TransServiceService) { - this.chartService.createSocketConnection(); + // this.chartService.createSocketConnection(); } ngOnInit() { @@ -28,6 +31,10 @@ export class BlockDetailListComponent implements OnInit { } + ngAfterViewInit() { + this.minHeight = this.elementView.nativeElement.offsetHeight; + } + getBlockDetails() { this.latestblockdetailObservable = this.chartService .getLatestblockdetails() diff --git a/src/app/view/home/graph-list/graph-list.component.ts b/src/app/view/home/graph-list/graph-list.component.ts index 3fa44cb..3ea6da9 100644 --- a/src/app/view/home/graph-list/graph-list.component.ts +++ b/src/app/view/home/graph-list/graph-list.component.ts @@ -387,6 +387,7 @@ export class GraphListComponent implements OnInit { res => { if (res['status'] == 200) { let DifficultychartDate = res.response.Date; + let BlocksChartDate = res.response.blockDate; if (fordifficult) { let DifficultyCuckaroo = res.response.DifficultyCuckaroo; let DifficultyCuckatoo = res.response.DifficultyCuckatoo; @@ -405,7 +406,7 @@ export class GraphListComponent implements OnInit { if (forblocks) { let Blockval = res.response.Blocks; this.brg_last = Blockval[Blockval.length - 1]; - this.totalBlocksFunc(DifficultychartDate, Blockval); + this.totalBlocksFunc(BlocksChartDate, Blockval); } resolve(); } diff --git a/src/app/view/home/latestblocks/latestblocks.component.html b/src/app/view/home/latestblocks/latestblocks.component.html index bf32ef5..f0c4f75 100644 --- a/src/app/view/home/latestblocks/latestblocks.component.html +++ b/src/app/view/home/latestblocks/latestblocks.component.html @@ -1,68 +1,103 @@

{{'home.LATEST_BLOCK' | translate}}

- -
-
-
{{'home.HEIGHT' | translate}}
+ +
+
+
+
{{'home.HEIGHT' | translate}}
-
-
{{'home.HASH' | translate}}
+
+
+
+
{{'home.HASH' | translate}}
-
-
{{'home.AGE' | translate}}
+
+
+
+
{{'home.AGE' | translate}}
-
-
{{'home.DIFFICULTY' | translate}}
+
+
+
+
{{'home.DIFFICULTY' | translate}}
-
-
{{'home.POW_ALGO' | translate}}
+
+
+
+
{{'home.POW_ALGO' | translate}}
-
-
#{{'home.INPUTS' | translate}}
+
+
+
+
#{{'home.INPUTS' | translate}}
-
-
#{{'home.OUTPUTS' | translate}}
+
+
+
+
#{{'home.OUTPUTS' | translate}}
-
-
#{{'home.KERNELS' | translate}}
+
+
+
+
#{{'home.KERNELS' | translate}}
-
- +
+
+
-
-
{{'home.HEIGHT' | translate}}
{{ hashvalue.blockchain_block_height }}
+
+ +
{{'home.HEIGHT' | translate}}
{{ hashvalue.blockchain_block_height }} +
-
Hash
{{ hashvalue.hashstart - }}{{ hashvalue.hashend }}
+
+
Hash
{{ hashvalue.hashstart + }}{{ hashvalue.hashend }} +
-
Age
{{ hashvalue.age }}
+
+
Age
{{ hashvalue.age }} +
- -
Difficulty
{{(hashvalue.powalgo == 'Cuckoo') ? ((hashvalue.target_difficulty_cuckatoo + hashvalue.target_difficulty_cuckaroo) | number) : (hashvalue.powalgo == 'RandomX') ? (hashvalue.target_difficulty_randomx | number) : (hashvalue.powalgo == 'ProgPow') ? (hashvalue.target_difficulty_progpow | number) : 0}}
+ +
+
Difficulty
{{(hashvalue.powalgo == 'Cuckoo') ? ((hashvalue.target_difficulty_cuckatoo + hashvalue.target_difficulty_cuckaroo) | number) : (hashvalue.powalgo == 'RandomX') ? (hashvalue.target_difficulty_randomx | number) : (hashvalue.powalgo == 'ProgPow') ? (hashvalue.target_difficulty_progpow | number) : 0}} +
-
Pow Algo
{{ hashvalue.powalgo }}
+
+
Pow Algo
{{ hashvalue.powalgo }} +
-
#{{'home.INPUTS' | translate}}
{{ hashvalue.input_count }}
+
+
#{{'home.INPUTS' | translate}}
{{ hashvalue.input_count }} +
-
#{{'home.OUTPUTS' | translate}}
{{ hashvalue.output_count }}
+
+
#{{'home.OUTPUTS' | translate}}
{{ hashvalue.output_count }} +
-
#{{'home.KERNELS' | translate}}
{{ hashvalue.kernal_count }}
+
+
#{{'home.KERNELS' | translate}}
{{ hashvalue.kernal_count }} +
- - + +
@@ -80,11 +115,8 @@
{{'home.BLOCKS_PER_PAGE' | translate}}:  
- @@ -95,49 +127,150 @@
+ +
+

Peers

+
+ +
+ +
+
+
+
Capabilities
+
+
+
+
+
User Agent
+
+
+
+
+
Version
+
+
+
+
+
Addr
+
+
+
+
+
Direction
+
+
+
+
+
Total Difficulty
+
+
+ +
+
+ + +
+
+ +
+
+
+ {{ peer.capabilities.bits }} bits +
+
+
+
+ {{ peer.user_agent }} +
+
+
+
+ {{ peer.version }} +
+
+
+
+ {{ peer.addr }} +
+
+
+
+ {{ peer.direction }} +
+
+
+
+ {{ peer.total_difficulty.cuckaroo }},{{ peer.total_difficulty.cuckatoo}},{{ peer.total_difficulty.randomx}},{{ peer.total_difficulty.progpow}} +
+
+
+ + +
+ + +
\ No newline at end of file diff --git a/src/app/view/home/latestblocks/latestblocks.component.ts b/src/app/view/home/latestblocks/latestblocks.component.ts index 0caa2b9..66bb647 100644 --- a/src/app/view/home/latestblocks/latestblocks.component.ts +++ b/src/app/view/home/latestblocks/latestblocks.component.ts @@ -17,6 +17,8 @@ export class LatestblocksComponent implements OnInit { public clickValue: any; public beforeClick: boolean = false; public clickonMobile: boolean = true; + public peers: any; + paginationForm = new FormGroup({ pagesize: new FormControl(20), }); @@ -50,12 +52,15 @@ export class LatestblocksComponent implements OnInit { }) }; - console.log('EEE'); this.http .get('http://5.9.174.122:3413/v1/peers/connected',httpOptions) .subscribe((res) => { console.log('reeeee',res); + // this.peers = res; + + console.log('this.peers',this.peers); }); + this.peers = [{"capabilities":{"bits":15},"user_agent":"MW/Epic 1.0.0","version":1,"addr":"54.233.177.64:3414","direction":"Outbound","total_difficulty":{"cuckaroo":1630,"cuckatoo":706,"randomx":138024,"progpow":49792},"height":10},{"capabilities":{"bits":15},"user_agent":"MW/Epic 1.0.0","version":1,"addr":"95.216.102.217:3414","direction":"Outbound","total_difficulty":{"cuckaroo":1630,"cuckatoo":706,"randomx":138024,"progpow":49792},"height":10},{"capabilities":{"bits":15},"user_agent":"MW/Epic 1.0.0","version":1,"addr":"90.190.172.177:3414","direction":"Outbound","total_difficulty":{"cuckaroo":2,"cuckatoo":2,"randomx":1024,"progpow":256},"height":0},{"capabilities":{"bits":15},"user_agent":"MW/Epic 1.0.0","version":1,"addr":"67.189.82.196:3414","direction":"Outbound","total_difficulty":{"cuckaroo":1630,"cuckatoo":706,"randomx":138024,"progpow":49792},"height":10},{"capabilities":{"bits":15},"user_agent":"MW/Epic 1.0.0","version":1,"addr":"167.71.72.2:3414","direction":"Outbound","total_difficulty":{"cuckaroo":1630,"cuckatoo":706,"randomx":138024,"progpow":49792},"height":10}]; } diff --git a/src/assets/css/responsive.css b/src/assets/css/responsive.css index d78c3c5..1a1b72c 100644 --- a/src/assets/css/responsive.css +++ b/src/assets/css/responsive.css @@ -1,5 +1,6 @@ @media(min-width: 992px){ .block_div {min-width: 136px; text-align: center;padding: .75rem; } + .peer_table .block_div{min-width: 180px;} .mobile_table{border-bottom: 1px solid #dee2e6; padding: 0 15px;display: table; width: 100%;} .view_moble_tble{border-bottom: 1px solid #dee2e6;} .mobile_table .row{display: table;} @@ -7,6 +8,12 @@ .mobile_table h6, .view_moble_tble h6{display: none;} .view_moble_tble .block_div{text-align: left;} } +@media (min-width: 768px){ + .peer_table_data .col-md-3 { + flex: 0 0 16%; + max-width: 16%; + } +} @media(max-width: 1199px){ .ftr_links{padding-left: 0px;} .ftr_links::before{content: '|'; } diff --git a/src/assets/css/style.css b/src/assets/css/style.css index 3d439b1..d1530a0 100644 --- a/src/assets/css/style.css +++ b/src/assets/css/style.css @@ -286,7 +286,6 @@ a:focus { padding: 20px; transition: 0.3s linear all; } -.minhgt{ min-height: 139px; } .detail_div .count { font-size: 25px; color: #0091ff; @@ -435,7 +434,7 @@ a:focus { .link_to_detail:hover{color: #0091ff;text-decoration: underline;} .mobile_table{border-bottom: 1px solid #dee2e6;position: relative;} .mobile_table .tble_col{padding: 0;} -.mobile_table:nth-child(even) { +.mobile_table:nth-child(even), .peer_mobile_table:nth-child(even) { background: #eee; } .expnd_blck{display: none;} diff --git a/src/environments/environment.ts b/src/environments/environment.ts index 9c65aab..cea3f9d 100644 --- a/src/environments/environment.ts +++ b/src/environments/environment.ts @@ -5,7 +5,7 @@ export const environment = { production: false, domain: '/', - apiUrl: '/epic_explorer/v1', + apiUrl: 'https://explorer.epic.tech/epic_explorer/v1', }; /*