diff --git a/frontend/src/app/components/mining-dashboard/mining-dashboard.component.ts b/frontend/src/app/components/mining-dashboard/mining-dashboard.component.ts index 22d0e11fe..c7670bc1e 100644 --- a/frontend/src/app/components/mining-dashboard/mining-dashboard.component.ts +++ b/frontend/src/app/components/mining-dashboard/mining-dashboard.component.ts @@ -23,6 +23,6 @@ export class MiningDashboardComponent implements OnInit, AfterViewChecked { } ngAfterViewChecked(): void { - this.stateService.searchFocus$.next(true); + this.stateService.focusSearchInputDesktop(); } } diff --git a/frontend/src/app/dashboard/dashboard.component.ts b/frontend/src/app/dashboard/dashboard.component.ts index a9c0bb31c..6d61953cf 100644 --- a/frontend/src/app/dashboard/dashboard.component.ts +++ b/frontend/src/app/dashboard/dashboard.component.ts @@ -58,7 +58,7 @@ export class DashboardComponent implements OnInit, OnDestroy, AfterViewChecked { ) { } ngAfterViewChecked(): void { - this.stateService.searchFocus$.next(true); + this.stateService.focusSearchInputDesktop(); } ngOnDestroy(): void { diff --git a/frontend/src/app/services/state.service.ts b/frontend/src/app/services/state.service.ts index 2c4f06b49..bebe751d6 100644 --- a/frontend/src/app/services/state.service.ts +++ b/frontend/src/app/services/state.service.ts @@ -7,6 +7,7 @@ import { Router, NavigationStart } from '@angular/router'; import { isPlatformBrowser } from '@angular/common'; import { filter, map, scan, shareReplay } from 'rxjs/operators'; import { StorageService } from './storage.service'; +import { hasTouchScreen } from '../shared/pipes/bytes-pipe/utils'; export interface MarkBlockState { blockHeight?: number; @@ -357,4 +358,10 @@ export class StateService { this.blocks = this.blocks.slice(0, this.env.KEEP_BLOCKS_AMOUNT); this.blocksSubject$.next(this.blocks); } + + focusSearchInputDesktop() { + if (!hasTouchScreen()) { + this.searchFocus$.next(true); + } + } } diff --git a/frontend/src/app/shared/pipes/bytes-pipe/utils.ts b/frontend/src/app/shared/pipes/bytes-pipe/utils.ts index fc8c2b08f..86a1e1a1d 100644 --- a/frontend/src/app/shared/pipes/bytes-pipe/utils.ts +++ b/frontend/src/app/shared/pipes/bytes-pipe/utils.ts @@ -309,3 +309,29 @@ export function takeWhile(input: any[], predicate: CollectionPredicate) { return takeUntil(input, (item: any, index: number | undefined, collection: any[] | undefined) => !predicate(item, index, collection)); } + +// https://developer.mozilla.org/en-US/docs/Web/HTTP/Browser_detection_using_the_user_agent +export function hasTouchScreen(): boolean { + let hasTouchScreen = false; + if ('maxTouchPoints' in navigator) { + hasTouchScreen = navigator.maxTouchPoints > 0; + } else if ('msMaxTouchPoints' in navigator) { + // @ts-ignore + hasTouchScreen = navigator.msMaxTouchPoints > 0; + } else { + const mQ = matchMedia?.('(pointer:coarse)'); + if (mQ?.media === '(pointer:coarse)') { + hasTouchScreen = !!mQ.matches; + } else if ('orientation' in window) { + hasTouchScreen = true; // deprecated, but good fallback + } else { + // @ts-ignore - Only as a last resort, fall back to user agent sniffing + const UA = navigator.userAgent; + hasTouchScreen = + /\b(BlackBerry|webOS|iPhone|IEMobile)\b/i.test(UA) || + /\b(Android|Windows Phone|iPad|iPod)\b/i.test(UA); + } + } + console.log(hasTouchScreen); + return hasTouchScreen; +} \ No newline at end of file