Restructured project

src/assets/javascripts/utilities/agent/document/index.ts

@@ -0,0 +1,107 @@
+/*
+ * Copyright (c) 2016-2019 Martin Donath <martin.donath@squidfunk.com>
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to
+ * deal in the Software without restriction, including without limitation the
+ * rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
+ * sell copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+ * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+ * IN THE SOFTWARE.
+ */
+
+import { Observable, fromEvent } from "rxjs"
+import { ajax } from "rxjs/ajax"
+import {
+  distinctUntilChanged,
+  map,
+  mapTo,
+  pluck,
+  shareReplay,
+  skip,
+  startWith,
+  switchMap
+} from "rxjs/operators"
+
+/* ----------------------------------------------------------------------------
+ * Function types
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Switch options
+ */
+interface SwitchOptions {
+  location$: Observable<string>        /* Location observable */
+}
+
+/* ----------------------------------------------------------------------------
+ * Data
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Observable for document load events
+ */
+const load$ = fromEvent(document, "DOMContentLoaded")
+
+/* ----------------------------------------------------------------------------
+ * Functions
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Watch document
+ *
+ * @return Document observable
+ */
+export function watchDocument(): Observable<Document> {
+  return load$
+    .pipe(
+      mapTo(document),
+      shareReplay(1)
+    )
+}
+
+/**
+ * Watch document switch
+ *
+ * This function returns an observables that fetches a document if the provided
+ * location observable emits a new value (i.e. URL). If the emitted URL points
+ * to the same page, the request is effectively ignored (e.g. when only the
+ * fragment identifier changes)
+ *
+ * @param options - Options
+ *
+ * @return Document switch observable
+ */
+export function watchDocumentSwitch(
+  { location$ }: SwitchOptions
+): Observable<Document> {
+  return location$
+    .pipe(
+      startWith(location.href),
+      map(url => url.replace(/#[^#]+$/, "")),
+      distinctUntilChanged(),
+      skip(1),
+
+      /* Fetch document */
+      switchMap(url => ajax({
+        url,
+        responseType: "document",
+        withCredentials: true
+      })
+        .pipe<Document>(
+          pluck("response")
+        )
+      ),
+      shareReplay(1)
+    )
+}

src/assets/javascripts/utilities/agent/index.ts

@@ -0,0 +1,28 @@
+/*
+ * Copyright (c) 2016-2019 Martin Donath <martin.donath@squidfunk.com>
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to
+ * deal in the Software without restriction, including without limitation the
+ * rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
+ * sell copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+ * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+ * IN THE SOFTWARE.
+ */
+
+export * from "./document"
+export * from "./element"
+export * from "./location"
+export * from "./media"
+export * from "./viewport"
+export * from "./worker"

src/assets/javascripts/utilities/agent/location/index.ts

@@ -20,67 +20,55 @@
  * IN THE SOFTWARE.
  */
 
-import {
-  EMPTY,
-  Observable,
-  OperatorFunction,
-  combineLatest,
-  of,
-  pipe
-} from "rxjs"
-import {
-  filter,
-  map,
-  switchMap,
-  takeUntil
-} from "rxjs/operators"
+import { Observable, Subject, fromEvent } from "rxjs"
+import { filter, map, share } from "rxjs/operators"
+
+/* ----------------------------------------------------------------------------
+ * Data
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Observable for window hash change events
+ */
+const hashchange$ = fromEvent<HashChangeEvent>(window, "hashchange")
+
+/**
+ * Observable for window pop state events
+ */
+const popstate$ = fromEvent<PopStateEvent>(window, "popstate")
 
 /* ----------------------------------------------------------------------------
  * Functions
  * ------------------------------------------------------------------------- */
 
 /**
- * Invert boolean value of source observable
+ * Watch location
  *
- * @param toggle$ - Toggle observable
- *
- * @return Inverted toggle observable
+ * @return Location subject
  */
-export function not(
-  toggle$: Observable<boolean>
-): Observable<boolean> {
-  return toggle$
+export function watchLocation(): Subject<string> {
+  const location$ = new Subject<string>()
+  popstate$
     .pipe(
-      map(active => !active)
+      map(() => location.href),
+      share()
     )
-}
+      .subscribe(location$)
 
-/* ------------------------------------------------------------------------- */
+  /* Return subject */
+  return location$
+}
 
 /**
- * Toggle switch map with another observable
+ * Watch location fragment
  *
- * @template T - Source value type
- * @template U - Target value type
- *
- * @param toggle$ - Toggle observable
- * @param project - Projection
- *
- * @return Operator function
+ * @return Location fragment observable
  */
-export function switchMapIf<T, U>(
-  toggle$: Observable<boolean>, project: (value: T) => Observable<U>
-): OperatorFunction<T, U> {
-  const begin$ = toggle$.pipe(filter(value =>  value))
-  const end$   = toggle$.pipe(filter(value => !value))
-  return pipe(
-    switchMap(value => combineLatest([of(value), begin$])),
-    switchMap(([value, active]) => active
-      ? project(value)
-          .pipe(
-            takeUntil(end$)
-          )
-      : EMPTY
+export function watchLocationFragment(): Observable<string> {
+  return hashchange$
+    .pipe(
+      map(() => location.hash),
+      filter(hash => hash.length > 0),
+      share()
     )
-  )
 }

src/assets/javascripts/utilities/agent/media/index.ts

@@ -0,0 +1,46 @@
+/*
+ * Copyright (c) 2016-2019 Martin Donath <martin.donath@squidfunk.com>
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to
+ * deal in the Software without restriction, including without limitation the
+ * rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
+ * sell copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+ * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+ * IN THE SOFTWARE.
+ */
+
+import { Observable, fromEventPattern } from "rxjs"
+import { shareReplay, startWith } from "rxjs/operators"
+
+/* ----------------------------------------------------------------------------
+ * Functions
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Watch media query
+ *
+ * @param query - Media query
+ *
+ * @return Media observable
+ */
+export function watchMedia(query: string): Observable<boolean> {
+  const media = matchMedia(query)
+  return fromEventPattern<boolean>(next =>
+    media.addListener(() => next(media.matches))
+  )
+    .pipe(
+      startWith(media.matches),
+      shareReplay(1)
+    )
+}

src/assets/javascripts/utilities/agent/viewport/index.ts

@@ -0,0 +1,116 @@
+/*
+ * Copyright (c) 2016-2019 Martin Donath <martin.donath@squidfunk.com>
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to
+ * deal in the Software without restriction, including without limitation the
+ * rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
+ * sell copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+ * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+ * IN THE SOFTWARE.
+ */
+
+import { Observable, fromEvent, merge } from "rxjs"
+import { map, shareReplay, startWith } from "rxjs/operators"
+
+/* ----------------------------------------------------------------------------
+ * Data
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Observable for window scroll events
+ */
+const scroll$ = fromEvent<UIEvent>(window, "scroll")
+
+/**
+ * Observable for window resize events
+ */
+const resize$ = fromEvent<UIEvent>(window, "resize")
+
+/* ----------------------------------------------------------------------------
+ * Types
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Viewport offset
+ */
+export interface ViewportOffset {
+  x: number                            /* Horizontal offset */
+  y: number                            /* Vertical offset */
+}
+
+/**
+ * Viewport size
+ */
+export interface ViewportSize {
+  width: number                        /* Viewport width */
+  height: number                       /* Viewport height */
+}
+
+/* ----------------------------------------------------------------------------
+ * Functions
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Retrieve viewport offset
+ *
+ * @return Viewport offset
+ */
+export function getViewportOffset(): ViewportOffset {
+  return {
+    x: pageXOffset,
+    y: pageYOffset
+  }
+}
+
+/**
+ * Retrieve viewport size
+ *
+ * @return Viewport size
+ */
+export function getViewportSize(): ViewportSize {
+  return {
+    width:  innerWidth,
+    height: innerHeight
+  }
+}
+
+/* ------------------------------------------------------------------------- */
+
+/**
+ * Watch viewport offset
+ *
+ * @return Viewport offset observable
+ */
+export function watchViewportOffset(): Observable<ViewportOffset> {
+  return merge(scroll$, resize$)
+    .pipe(
+      map(getViewportOffset),
+      startWith(getViewportOffset()),
+      shareReplay(1)
+    )
+}
+
+/**
+ * Watch viewport size
+ *
+ * @return Viewport size observable
+ */
+export function watchViewportSize(): Observable<ViewportSize> {
+  return resize$
+    .pipe(
+      map(getViewportSize),
+      startWith(getViewportSize()),
+      shareReplay(1)
+    )
+}

src/assets/javascripts/utilities/agent/worker/index.ts

@@ -0,0 +1,86 @@
+/*
+ * Copyright (c) 2016-2019 Martin Donath <martin.donath@squidfunk.com>
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to
+ * deal in the Software without restriction, including without limitation the
+ * rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
+ * sell copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+ * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+ * IN THE SOFTWARE.
+ */
+
+import { Observable, fromEvent } from "rxjs"
+import { pluck, share, switchMapTo, tap, throttle } from "rxjs/operators"
+
+/* ----------------------------------------------------------------------------
+ * Types
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Worker message
+ */
+export interface WorkerMessage {
+  type: unknown                        /* Message type */
+  data: unknown                        /* Message data */
+}
+
+/* ----------------------------------------------------------------------------
+ * Function types
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Options
+ *
+ * @template T - Worker message type
+ */
+interface Options<T extends WorkerMessage> {
+  message$: Observable<T>              /* Message observable */
+}
+
+/* ----------------------------------------------------------------------------
+ * Functions
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Watch a web worker
+ *
+ * This function returns an observable that will send all values emitted by the
+ * message observable to the web worker. Web worker communication is expected
+ * to be bidirectional (request-response) and synchronous. Messages that are
+ * emitted during a pending request are throttled, the last one is emitted.
+ *
+ * @param worker - Web worker
+ *
+ * @return Worker message observable
+ */
+export function watchWorker<T extends WorkerMessage>(
+  worker: Worker, { message$ }: Options<T>
+): Observable<T> {
+
+  /* Observable for messages from web worker */
+  const worker$ = fromEvent(worker, "message")
+    .pipe(
+      pluck<Event, T>("data"),
+      share()
+    )
+
+  /* Send and receive messages, return hot observable */
+  return message$
+    .pipe(
+      throttle(() => worker$, { leading: true, trailing: true }),
+      tap(message => worker.postMessage(message)),
+      switchMapTo(worker$),
+      share()
+    )
+}

src/assets/javascripts/utilities/index.ts

@@ -20,5 +20,5 @@
  * IN THE SOFTWARE.
  */
 
-export * from "./element"
-export * from "./operator"
+export * from "./agent"
+export * from "./toggle"

src/assets/javascripts/utilities/toggle/index.ts

@@ -0,0 +1,44 @@
+/*
+ * Copyright (c) 2016-2019 Martin Donath <martin.donath@squidfunk.com>
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to
+ * deal in the Software without restriction, including without limitation the
+ * rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
+ * sell copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+ * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+ * IN THE SOFTWARE.
+ */
+
+import { Observable, fromEvent } from "rxjs"
+import { pluck } from "rxjs/operators"
+
+/* ----------------------------------------------------------------------------
+ * Functions
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Watch toggle
+ *
+ * @param el - Toggle element
+ *
+ * @return Toggle observable
+ */
+export function watchToggle(
+  el: HTMLInputElement
+): Observable<boolean> {
+  return fromEvent(el, "change")
+    .pipe(
+      pluck("checked")
+    )
+}