@ng-web-apis/screen-orientation
Version:
A library for declarative use of screen orientation with Angular
53 lines • 8.03 kB
JavaScript
import { inject, Injectable } from '@angular/core';
import { WA_WINDOW } from '@ng-web-apis/common';
import { fromEvent, map, Observable, shareReplay, startWith } from 'rxjs';
import * as i0 from "@angular/core";
class ScreenOrientationService extends Observable {
win = inject(WA_WINDOW);
stream$ = (this.isModern
? fromEvent(this.win.screen.orientation, 'change').pipe(startWith(null), map(() =>
/**
* https://developer.mozilla.org/en-US/docs/Web/API/Screen/orientation
* The type read-only property of the ScreenOrientation interface returns the document's current orientation type,
* one of "portrait-primary", "portrait-secondary", "landscape-primary", or "landscape-secondary".
*
* Browser compatibility:
* Safari 16.4+, Chrome 38+, Firefox 43+
*/
this.win.screen.orientation.type))
: fromEvent(this.win, 'orientationchange').pipe(startWith(null), map(() => {
/**
* https://developer.mozilla.org/en-US/docs/Web/API/Window/orientation
* Its only possible values are -90, 0, 90, and 180.
* Positive values are counterclockwise; negative values are clockwise.
*/
const angle = parseInt(this.win.orientation, 10);
switch (angle) {
case -90:
return 'landscape-secondary';
case 180:
return 'portrait-secondary';
case 90:
return 'landscape-primary';
case 0:
default:
return 'portrait-primary';
}
}))).pipe(shareReplay({ bufferSize: 1, refCount: true }));
constructor() {
super((subscriber) => this.stream$.subscribe(subscriber));
}
get isModern() {
return !!this.win?.screen?.orientation;
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ScreenOrientationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ScreenOrientationService, providedIn: 'root' });
}
export { ScreenOrientationService };
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ScreenOrientationService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root',
}]
}], ctorParameters: function () { return []; } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2NyZWVuLnNlcnZpY2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9saWJzL3NjcmVlbi1vcmllbnRhdGlvbi9zcmMvc2NyZWVuLnNlcnZpY2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLE1BQU0sRUFBRSxVQUFVLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFDakQsT0FBTyxFQUFDLFNBQVMsRUFBQyxNQUFNLHFCQUFxQixDQUFDO0FBQzlDLE9BQU8sRUFBQyxTQUFTLEVBQUUsR0FBRyxFQUFFLFVBQVUsRUFBRSxXQUFXLEVBQUUsU0FBUyxFQUFDLE1BQU0sTUFBTSxDQUFDOztBQUV4RSxNQUdhLHdCQUF5QixTQUFRLFVBQTJCO0lBQ3BELEdBQUcsR0FBVyxNQUFNLENBQUMsU0FBUyxDQUFDLENBQUM7SUFFaEMsT0FBTyxHQUFHLENBQUMsSUFBSSxDQUFDLFFBQVE7UUFDckMsQ0FBQyxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLE1BQU0sQ0FBQyxXQUFXLEVBQUUsUUFBUSxDQUFDLENBQUMsSUFBSSxDQUNqRCxTQUFTLENBQUMsSUFBSSxDQUFDLEVBQ2YsR0FBRyxDQUNDLEdBQW9CLEVBQUU7UUFDbEI7Ozs7Ozs7V0FPRztRQUNILElBQUksQ0FBQyxHQUFHLENBQUMsTUFBTSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQ3ZDLENBQ0o7UUFDSCxDQUFDLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxHQUFHLEVBQUUsbUJBQW1CLENBQUMsQ0FBQyxJQUFJLENBQ3pDLFNBQVMsQ0FBQyxJQUFJLENBQUMsRUFDZixHQUFHLENBQUMsR0FBb0IsRUFBRTtZQUN0Qjs7OztlQUlHO1lBQ0gsTUFBTSxLQUFLLEdBQUcsUUFBUSxDQUNsQixJQUFJLENBQUMsR0FBRyxDQUFDLFdBQWdDLEVBQ3pDLEVBQUUsQ0FDaUIsQ0FBQztZQUV4QixRQUFRLEtBQUssRUFBRTtnQkFDWCxLQUFLLENBQUMsRUFBRTtvQkFDSixPQUFPLHFCQUFxQixDQUFDO2dCQUNqQyxLQUFLLEdBQUc7b0JBQ0osT0FBTyxvQkFBb0IsQ0FBQztnQkFDaEMsS0FBSyxFQUFFO29CQUNILE9BQU8sbUJBQW1CLENBQUM7Z0JBQy9CLEtBQUssQ0FBQyxDQUFDO2dCQUNQO29CQUNJLE9BQU8sa0JBQWtCLENBQUM7YUFDakM7UUFDTCxDQUFDLENBQUMsQ0FDTCxDQUNOLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxFQUFDLFVBQVUsRUFBRSxDQUFDLEVBQUUsUUFBUSxFQUFFLElBQUksRUFBQyxDQUFDLENBQUMsQ0FBQztJQUVyRDtRQUNJLEtBQUssQ0FBQyxDQUFDLFVBQVUsRUFBRSxFQUFFLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxTQUFTLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQztJQUM5RCxDQUFDO0lBRUQsSUFBWSxRQUFRO1FBQ2hCLE9BQU8sQ0FBQyxDQUFDLElBQUksQ0FBQyxHQUFHLEVBQUUsTUFBTSxFQUFFLFdBQVcsQ0FBQztJQUMzQyxDQUFDO3dHQXJEUSx3QkFBd0I7NEdBQXhCLHdCQUF3QixjQUZyQixNQUFNOztTQUVULHdCQUF3Qjs0RkFBeEIsd0JBQXdCO2tCQUhwQyxVQUFVO21CQUFDO29CQUNSLFVBQVUsRUFBRSxNQUFNO2lCQUNyQiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7aW5qZWN0LCBJbmplY3RhYmxlfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7V0FfV0lORE9XfSBmcm9tICdAbmctd2ViLWFwaXMvY29tbW9uJztcbmltcG9ydCB7ZnJvbUV2ZW50LCBtYXAsIE9ic2VydmFibGUsIHNoYXJlUmVwbGF5LCBzdGFydFdpdGh9IGZyb20gJ3J4anMnO1xuXG5ASW5qZWN0YWJsZSh7XG4gICAgcHJvdmlkZWRJbjogJ3Jvb3QnLFxufSlcbmV4cG9ydCBjbGFzcyBTY3JlZW5PcmllbnRhdGlvblNlcnZpY2UgZXh0ZW5kcyBPYnNlcnZhYmxlPE9yaWVudGF0aW9uVHlwZT4ge1xuICAgIHByaXZhdGUgcmVhZG9ubHkgd2luOiBXaW5kb3cgPSBpbmplY3QoV0FfV0lORE9XKTtcblxuICAgIHByaXZhdGUgcmVhZG9ubHkgc3RyZWFtJCA9ICh0aGlzLmlzTW9kZXJuXG4gICAgICAgID8gZnJvbUV2ZW50KHRoaXMud2luLnNjcmVlbi5vcmllbnRhdGlvbiwgJ2NoYW5nZScpLnBpcGUoXG4gICAgICAgICAgICAgIHN0YXJ0V2l0aChudWxsKSxcbiAgICAgICAgICAgICAgbWFwKFxuICAgICAgICAgICAgICAgICAgKCk6IE9yaWVudGF0aW9uVHlwZSA9PlxuICAgICAgICAgICAgICAgICAgICAgIC8qKlxuICAgICAgICAgICAgICAgICAgICAgICAqIGh0dHBzOi8vZGV2ZWxvcGVyLm1vemlsbGEub3JnL2VuLVVTL2RvY3MvV2ViL0FQSS9TY3JlZW4vb3JpZW50YXRpb25cbiAgICAgICAgICAgICAgICAgICAgICAgKiBUaGUgdHlwZSByZWFkLW9ubHkgcHJvcGVydHkgb2YgdGhlIFNjcmVlbk9yaWVudGF0aW9uIGludGVyZmFjZSByZXR1cm5zIHRoZSBkb2N1bWVudCdzIGN1cnJlbnQgb3JpZW50YXRpb24gdHlwZSxcbiAgICAgICAgICAgICAgICAgICAgICAgKiBvbmUgb2YgXCJwb3J0cmFpdC1wcmltYXJ5XCIsIFwicG9ydHJhaXQtc2Vjb25kYXJ5XCIsIFwibGFuZHNjYXBlLXByaW1hcnlcIiwgb3IgXCJsYW5kc2NhcGUtc2Vjb25kYXJ5XCIuXG4gICAgICAgICAgICAgICAgICAgICAgICpcbiAgICAgICAgICAgICAgICAgICAgICAgKiBCcm93c2VyIGNvbXBhdGliaWxpdHk6XG4gICAgICAgICAgICAgICAgICAgICAgICogU2FmYXJpIDE2LjQrLCBDaHJvbWUgMzgrLCBGaXJlZm94IDQzK1xuICAgICAgICAgICAgICAgICAgICAgICAqL1xuICAgICAgICAgICAgICAgICAgICAgIHRoaXMud2luLnNjcmVlbi5vcmllbnRhdGlvbi50eXBlLFxuICAgICAgICAgICAgICApLFxuICAgICAgICAgIClcbiAgICAgICAgOiBmcm9tRXZlbnQodGhpcy53aW4sICdvcmllbnRhdGlvbmNoYW5nZScpLnBpcGUoXG4gICAgICAgICAgICAgIHN0YXJ0V2l0aChudWxsKSxcbiAgICAgICAgICAgICAgbWFwKCgpOiBPcmllbnRhdGlvblR5cGUgPT4ge1xuICAgICAgICAgICAgICAgICAgLyoqXG4gICAgICAgICAgICAgICAgICAgKiBodHRwczovL2RldmVsb3Blci5tb3ppbGxhLm9yZy9lbi1VUy9kb2NzL1dlYi9BUEkvV2luZG93L29yaWVudGF0aW9uXG4gICAgICAgICAgICAgICAgICAgKiBJdHMgb25seSBwb3NzaWJsZSB2YWx1ZXMgYXJlIC05MCwgMCwgOTAsIGFuZCAxODAuXG4gICAgICAgICAgICAgICAgICAgKiBQb3NpdGl2ZSB2YWx1ZXMgYXJlIGNvdW50ZXJjbG9ja3dpc2U7IG5lZ2F0aXZlIHZhbHVlcyBhcmUgY2xvY2t3aXNlLlxuICAgICAgICAgICAgICAgICAgICovXG4gICAgICAgICAgICAgICAgICBjb25zdCBhbmdsZSA9IHBhcnNlSW50KFxuICAgICAgICAgICAgICAgICAgICAgIHRoaXMud2luLm9yaWVudGF0aW9uIGFzIHVua25vd24gYXMgc3RyaW5nLFxuICAgICAgICAgICAgICAgICAgICAgIDEwLFxuICAgICAgICAgICAgICAgICAgKSBhcyAtOTAgfCAwIHwgOTAgfCAxODA7XG5cbiAgICAgICAgICAgICAgICAgIHN3aXRjaCAoYW5nbGUpIHtcbiAgICAgICAgICAgICAgICAgICAgICBjYXNlIC05MDpcbiAgICAgICAgICAgICAgICAgICAgICAgICAgcmV0dXJuICdsYW5kc2NhcGUtc2Vjb25kYXJ5JztcbiAgICAgICAgICAgICAgICAgICAgICBjYXNlIDE4MDpcbiAgICAgICAgICAgICAgICAgICAgICAgICAgcmV0dXJuICdwb3J0cmFpdC1zZWNvbmRhcnknO1xuICAgICAgICAgICAgICAgICAgICAgIGNhc2UgOTA6XG4gICAgICAgICAgICAgICAgICAgICAgICAgIHJldHVybiAnbGFuZHNjYXBlLXByaW1hcnknO1xuICAgICAgICAgICAgICAgICAgICAgIGNhc2UgMDpcbiAgICAgICAgICAgICAgICAgICAgICBkZWZhdWx0OlxuICAgICAgICAgICAgICAgICAgICAgICAgICByZXR1cm4gJ3BvcnRyYWl0LXByaW1hcnknO1xuICAgICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICB9KSxcbiAgICAgICAgICApXG4gICAgKS5waXBlKHNoYXJlUmVwbGF5KHtidWZmZXJTaXplOiAxLCByZWZDb3VudDogdHJ1ZX0pKTtcblxuICAgIGNvbnN0cnVjdG9yKCkge1xuICAgICAgICBzdXBlcigoc3Vic2NyaWJlcikgPT4gdGhpcy5zdHJlYW0kLnN1YnNjcmliZShzdWJzY3JpYmVyKSk7XG4gICAgfVxuXG4gICAgcHJpdmF0ZSBnZXQgaXNNb2Rlcm4oKTogYm9vbGVhbiB7XG4gICAgICAgIHJldHVybiAhIXRoaXMud2luPy5zY3JlZW4/Lm9yaWVudGF0aW9uO1xuICAgIH1cbn1cbiJdfQ==