From dcd84680fc1114d862dd7657218e16b6b17a6d1d Mon Sep 17 00:00:00 2001 From: nymkappa Date: Tue, 22 Feb 2022 16:13:09 +0900 Subject: [PATCH] Remove difficulty component --- frontend/src/app/app-routing.module.ts | 13 -- frontend/src/app/app.module.ts | 2 - .../difficulty-chart.component.html | 53 ----- .../difficulty-chart.component.scss | 27 --- .../difficulty-chart.component.ts | 183 ------------------ .../mining-dashboard.component.html | 12 -- 6 files changed, 290 deletions(-) delete mode 100644 frontend/src/app/components/difficulty-chart/difficulty-chart.component.html delete mode 100644 frontend/src/app/components/difficulty-chart/difficulty-chart.component.scss delete mode 100644 frontend/src/app/components/difficulty-chart/difficulty-chart.component.ts diff --git a/frontend/src/app/app-routing.module.ts b/frontend/src/app/app-routing.module.ts index c8a1d98e6..bd7d2d516 100644 --- a/frontend/src/app/app-routing.module.ts +++ b/frontend/src/app/app-routing.module.ts @@ -28,7 +28,6 @@ import { AssetsFeaturedComponent } from './components/assets/assets-featured/ass import { AssetsComponent } from './components/assets/assets.component'; import { PoolComponent } from './components/pool/pool.component'; import { MiningDashboardComponent } from './components/mining-dashboard/mining-dashboard.component'; -import { DifficultyChartComponent } from './components/difficulty-chart/difficulty-chart.component'; import { HashrateChartComponent } from './components/hashrate-chart/hashrate-chart.component'; import { MiningStartComponent } from './components/mining-start/mining-start.component'; @@ -75,10 +74,6 @@ let routes: Routes = [ path: 'mining', component: MiningStartComponent, children: [ - { - path: 'difficulty', - component: DifficultyChartComponent, - }, { path: 'hashrate', component: HashrateChartComponent, @@ -194,10 +189,6 @@ let routes: Routes = [ path: 'mining', component: MiningStartComponent, children: [ - { - path: 'difficulty', - component: DifficultyChartComponent, - }, { path: 'hashrate', component: HashrateChartComponent, @@ -307,10 +298,6 @@ let routes: Routes = [ path: 'mining', component: MiningStartComponent, children: [ - { - path: 'difficulty', - component: DifficultyChartComponent, - }, { path: 'hashrate', component: HashrateChartComponent, diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts index e7fe30c1d..c161e24dc 100644 --- a/frontend/src/app/app.module.ts +++ b/frontend/src/app/app.module.ts @@ -70,7 +70,6 @@ import { AssetsFeaturedComponent } from './components/assets/assets-featured/ass import { AssetGroupComponent } from './components/assets/asset-group/asset-group.component'; import { AssetCirculationComponent } from './components/asset-circulation/asset-circulation.component'; import { MiningDashboardComponent } from './components/mining-dashboard/mining-dashboard.component'; -import { DifficultyChartComponent } from './components/difficulty-chart/difficulty-chart.component'; import { HashrateChartComponent } from './components/hashrate-chart/hashrate-chart.component'; import { MiningStartComponent } from './components/mining-start/mining-start.component'; import { AmountShortenerPipe } from './shared/pipes/amount-shortener.pipe'; @@ -126,7 +125,6 @@ import { AmountShortenerPipe } from './shared/pipes/amount-shortener.pipe'; AssetGroupComponent, AssetCirculationComponent, MiningDashboardComponent, - DifficultyChartComponent, HashrateChartComponent, MiningStartComponent, AmountShortenerPipe, diff --git a/frontend/src/app/components/difficulty-chart/difficulty-chart.component.html b/frontend/src/app/components/difficulty-chart/difficulty-chart.component.html deleted file mode 100644 index eb34d4075..000000000 --- a/frontend/src/app/components/difficulty-chart/difficulty-chart.component.html +++ /dev/null @@ -1,53 +0,0 @@ -
- -
-
-
- - - - - - -
-
-
- -
-
- -
- - - - - - - - - - - - - - - - - - - -
BlockTimestampDifficultyChange
{{ diffChange.height }}‎{{ diffChange.timestamp * 1000 | date:'yyyy-MM-dd HH:mm' }}{{ formatNumber(diffChange.difficulty, locale, '1.2-2') }}{{ diffChange.difficultyShorten }}{{ formatNumber(diffChange.change, locale, '1.2-2') }}%
- -
diff --git a/frontend/src/app/components/difficulty-chart/difficulty-chart.component.scss b/frontend/src/app/components/difficulty-chart/difficulty-chart.component.scss deleted file mode 100644 index 4205c9db7..000000000 --- a/frontend/src/app/components/difficulty-chart/difficulty-chart.component.scss +++ /dev/null @@ -1,27 +0,0 @@ -.main-title { - position: relative; - color: #ffffff91; - margin-top: -13px; - font-size: 10px; - text-transform: uppercase; - font-weight: 500; - text-align: center; - padding-bottom: 3px; -} - -.formRadioGroup { - margin-top: 6px; - display: flex; - flex-direction: column; - @media (min-width: 830px) { - flex-direction: row; - float: right; - margin-top: 0px; - } - .btn-sm { - font-size: 9px; - @media (min-width: 830px) { - font-size: 14px; - } - } -} diff --git a/frontend/src/app/components/difficulty-chart/difficulty-chart.component.ts b/frontend/src/app/components/difficulty-chart/difficulty-chart.component.ts deleted file mode 100644 index 193805d7a..000000000 --- a/frontend/src/app/components/difficulty-chart/difficulty-chart.component.ts +++ /dev/null @@ -1,183 +0,0 @@ -import { Component, Inject, Input, LOCALE_ID, OnInit } from '@angular/core'; -import { EChartsOption, graphic } from 'echarts'; -import { Observable } from 'rxjs'; -import { map, share, startWith, switchMap, tap } from 'rxjs/operators'; -import { ApiService } from 'src/app/services/api.service'; -import { SeoService } from 'src/app/services/seo.service'; -import { formatNumber } from '@angular/common'; -import { FormBuilder, FormGroup } from '@angular/forms'; -import { selectPowerOfTen } from 'src/app/bitcoin.utils'; - -@Component({ - selector: 'app-difficulty-chart', - templateUrl: './difficulty-chart.component.html', - styleUrls: ['./difficulty-chart.component.scss'], - styles: [` - .loadingGraphs { - position: absolute; - top: 38%; - left: calc(50% - 15px); - z-index: 100; - } - `], -}) -export class DifficultyChartComponent implements OnInit { - @Input() widget: boolean = false; - - radioGroupForm: FormGroup; - - chartOptions: EChartsOption = {}; - chartInitOptions = { - renderer: 'svg' - }; - - difficultyObservable$: Observable; - isLoading = true; - formatNumber = formatNumber; - - constructor( - @Inject(LOCALE_ID) public locale: string, - private seoService: SeoService, - private apiService: ApiService, - private formBuilder: FormBuilder, - ) { - this.seoService.setTitle($localize`:@@mining.difficulty:Difficulty`); - this.radioGroupForm = this.formBuilder.group({ dateSpan: '1y' }); - this.radioGroupForm.controls.dateSpan.setValue('1y'); - } - - ngOnInit(): void { - this.difficultyObservable$ = this.radioGroupForm.get('dateSpan').valueChanges - .pipe( - startWith('1y'), - switchMap((timespan) => { - return this.apiService.getHistoricalDifficulty$(timespan) - .pipe( - tap(data => { - this.prepareChartOptions(data.adjustments.map(val => [val.timestamp * 1000, val.difficulty])); - this.isLoading = false; - }), - map(data => { - const availableTimespanDay = ( - (new Date().getTime() / 1000) - (data.oldestIndexedBlockTimestamp) - ) / 3600 / 24; - - const tableData = []; - for (let i = data.adjustments.length - 1; i > 0; --i) { - const selectedPowerOfTen: any = selectPowerOfTen(data.adjustments[i].difficulty); - const change = (data.adjustments[i].difficulty / data.adjustments[i - 1].difficulty - 1) * 100; - - tableData.push(Object.assign(data.adjustments[i], { - change: change, - difficultyShorten: formatNumber( - data.adjustments[i].difficulty / selectedPowerOfTen.divider, - this.locale, '1.2-2') + selectedPowerOfTen.unit - })); - } - return { - availableTimespanDay: availableTimespanDay, - data: tableData - }; - }), - ); - }), - share() - ); - } - - prepareChartOptions(data) { - this.chartOptions = { - color: new graphic.LinearGradient(0, 0, 0, 0.65, [ - { offset: 0, color: '#D81B60' }, - { offset: 0.25, color: '#8E24AA' }, - { offset: 0.5, color: '#5E35B1' }, - { offset: 0.75, color: '#3949AB' }, - { offset: 1, color: '#1E88E5' } - ]), - title: { - text: this.widget? '' : $localize`:@@mining.difficulty:Difficulty`, - left: 'center', - textStyle: { - color: '#FFF', - }, - }, - tooltip: { - show: true, - trigger: 'axis', - backgroundColor: 'rgba(17, 19, 31, 1)', - borderRadius: 4, - shadowColor: 'rgba(0, 0, 0, 0.5)', - textStyle: { - color: '#b1b1b1', - }, - borderColor: '#000', - formatter: params => { - return `${params[0].axisValueLabel}
- ${params[0].marker} ${formatNumber(params[0].value[1], this.locale, '1.0-0')}` - } - }, - axisPointer: { - type: 'line', - }, - xAxis: { - type: 'time', - splitNumber: this.isMobile() ? 5 : 10, - }, - yAxis: { - type: 'value', - axisLabel: { - formatter: (val) => { - const selectedPowerOfTen: any = selectPowerOfTen(val); - const diff = val / selectedPowerOfTen.divider; - return `${diff} ${selectedPowerOfTen.unit}`; - } - }, - splitLine: { - lineStyle: { - type: 'dotted', - color: '#ffffff66', - opacity: 0.25, - } - } - }, - series: { - showSymbol: false, - data: data, - type: 'line', - smooth: false, - lineStyle: { - width: 2, - }, - }, - dataZoom: this.widget ? null : [{ - type: 'inside', - realtime: true, - zoomLock: true, - zoomOnMouseWheel: true, - moveOnMouseMove: true, - maxSpan: 100, - minSpan: 10, - }, { - showDetail: false, - show: true, - type: 'slider', - brushSelect: false, - realtime: true, - bottom: 0, - selectedDataBackground: { - lineStyle: { - color: '#fff', - opacity: 0.45, - }, - areaStyle: { - opacity: 0, - } - }, - }], - }; - } - - isMobile() { - return (window.innerWidth <= 767.98); - } -} diff --git a/frontend/src/app/components/mining-dashboard/mining-dashboard.component.html b/frontend/src/app/components/mining-dashboard/mining-dashboard.component.html index 43c5c378c..78c8760bf 100644 --- a/frontend/src/app/components/mining-dashboard/mining-dashboard.component.html +++ b/frontend/src/app/components/mining-dashboard/mining-dashboard.component.html @@ -26,17 +26,5 @@ - -
-
-
-
Difficulty (1y)
- -
View more - »
-
-
-
- \ No newline at end of file