machankura/mempool
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #1133 from nymkappa/feature/disable-graph-interaction-mobile

Browse Source 
Disable graph touch interaction in dashboard on mobile so we can scroll properly
This commit is contained in:
wiz 2022-01-13 07:20:58 +00:00 committed by GitHub
commit 573cb8f993
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/src/app/components/incoming-transactions-graph/incoming-transactions-graph.component.ts
View File

@ -67,7 +67,7 @@ export class IncomingTransactionsGraphComponent implements OnInit, OnChanges {
left: this.left, left: this.left,
}, },
animation: false, animation: false,
dataZoom: [{ dataZoom: (this.template === 'widget' && this.isMobile()) ? null : [{
type: 'inside', type: 'inside',
realtime: true, realtime: true,
zoomLock: (this.template === 'widget') ? true : false, zoomLock: (this.template === 'widget') ? true : false,
@ -93,6 +93,7 @@ export class IncomingTransactionsGraphComponent implements OnInit, OnChanges {
}, },
}], }],
tooltip: { tooltip: {
show: !this.isMobile(),
trigger: 'axis', trigger: 'axis',
position: (pos, params, el, elRect, size) => { position: (pos, params, el, elRect, size) => {
const obj = { top: -20 }; const obj = { top: -20 };
@ -219,4 +220,8 @@ export class IncomingTransactionsGraphComponent implements OnInit, OnChanges {
}, },
}; };
} }
isMobile() {
return window.innerWidth <= 767.98;
}
} }

8
frontend/src/app/components/mempool-graph/mempool-graph.component.ts
View File

@ -170,7 +170,7 @@ export class MempoolGraphComponent implements OnInit, OnChanges {
hover: true, hover: true,
color: this.inverted ? [...newColors].reverse() : newColors, color: this.inverted ? [...newColors].reverse() : newColors,
tooltip: { tooltip: {
show: (window.innerWidth >= 768) ? true : false, show: !this.isMobile(),
trigger: 'axis', trigger: 'axis',
alwaysShowContent: false, alwaysShowContent: false,
position: (pos, params, el, elRect, size) => { position: (pos, params, el, elRect, size) => {
@ -282,7 +282,7 @@ export class MempoolGraphComponent implements OnInit, OnChanges {
</div>`; </div>`;
} }
}, },
dataZoom: [{ dataZoom: (this.template === 'widget' && this.isMobile()) ? null : [{
type: 'inside', type: 'inside',
realtime: true, realtime: true,
zoomLock: (this.template === 'widget') ? true : false, zoomLock: (this.template === 'widget') ? true : false,
@ -382,5 +382,9 @@ export class MempoolGraphComponent implements OnInit, OnChanges {
} }
this.chartColorsOrdered = chartColors.slice(0, this.feeLevelsOrdered.length); this.chartColorsOrdered = chartColors.slice(0, this.feeLevelsOrdered.length);
} }
isMobile() {
return window.innerWidth <= 767.98;
}
} }