Switched to addEventListener for media query

This commit is contained in:
squidfunk 2020-09-27 17:13:56 +02:00
parent 063071550c
commit d45c378d60
2 changed files with 7 additions and 8 deletions

View File

@ -99,9 +99,9 @@ export function getElements<T extends HTMLElement>(
* *
* @return Element * @return Element
*/ */
export function createElement< export function createElement<T extends keyof HTMLElementTagNameMap>(
T extends keyof HTMLElementTagNameMap tagName: T
>(tagName: T): HTMLElementTagNameMap[T] { ): HTMLElementTagNameMap[T] {
return document.createElement(tagName) return document.createElement(tagName)
} }

View File

@ -20,8 +20,8 @@
* IN THE SOFTWARE. * IN THE SOFTWARE.
*/ */
import { Observable, fromEventPattern } from "rxjs" import { Observable, fromEvent } from "rxjs"
import { shareReplay, startWith } from "rxjs/operators" import { map, shareReplay, startWith } from "rxjs/operators"
/* ---------------------------------------------------------------------------- /* ----------------------------------------------------------------------------
* Functions * Functions
@ -36,10 +36,9 @@ import { shareReplay, startWith } from "rxjs/operators"
*/ */
export function watchMedia(query: string): Observable<boolean> { export function watchMedia(query: string): Observable<boolean> {
const media = matchMedia(query) const media = matchMedia(query)
return fromEventPattern<boolean>(next => return fromEvent<MediaQueryListEvent>(media, "change")
media.addListener(() => next(media.matches))
)
.pipe( .pipe(
map(ev => ev.matches),
startWith(media.matches), startWith(media.matches),
shareReplay({ bufferSize: 1, refCount: true }) shareReplay({ bufferSize: 1, refCount: true })
) )