Skip to content

Instantly share code, notes, and snippets.

@InsilicoSoft
Created August 3, 2017 08:16
Show Gist options
  • Select an option

  • Save InsilicoSoft/be364f24344c82182f9c553db76acf6a to your computer and use it in GitHub Desktop.

Select an option

Save InsilicoSoft/be364f24344c82182f9c553db76acf6a to your computer and use it in GitHub Desktop.
Allows to figure out the client screen size and use it within the logic.
import { Injectable } from '@angular/core';
import { Observable, Subscription } from 'rxjs';
import { InputMask } from 'primeng/primeng';
@Injectable()
export class ClientScreenService {
inputMaskStream: Subscription;
isAndroid = typeof navigator !== 'undefined' && /Android/i.test(navigator.userAgent);
isDesktop: boolean = false;
isLargeDesktop: boolean = false;
isMobile: boolean = false;
isTablet: boolean = false;
constructor() {
this.isMobile = window.matchMedia('screen and (max-width: 767px)').matches;
this.isTablet = window.matchMedia('screen and (min-width: 768px) and (max-width: 991px)').matches;
this.isDesktop = window.matchMedia('screen and (min-width: 992px)').matches;
this.isLargeDesktop = window.matchMedia('screen and (min-width: 1200px)').matches;
}
inputMaskAndroidCursorSet(birthdateMask: InputMask) {
if(this.isAndroid && birthdateMask) {
this.inputMaskStream = Observable.merge(
Observable.fromEvent(birthdateMask.el.nativeElement, 'keyup'),
Observable.fromEvent(birthdateMask.el.nativeElement, 'click'),
).subscribe((data) => {
let rangeSize,
inputValSize = birthdateMask.getUnmaskedValue().length,
target: HTMLInputElement = data['target'] || data['srcElement'];
rangeSize = (inputValSize > 1 && inputValSize <= 3) ? inputValSize + 1 :
inputValSize > 3 ? inputValSize + 2 : inputValSize;
target.setSelectionRange(rangeSize, rangeSize);
});
}
}
unsubscribeFromInputMaskStream() {
if(this.inputMaskStream) this.inputMaskStream.unsubscribe();
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment