Refactored instant loading and some other components

src/assets/javascripts/browser/index.ts

@@ -22,10 +22,10 @@
 
 export * from "./document"
 export * from "./element"
-export * from "./fetch"
 export * from "./keyboard"
 export * from "./location"
 export * from "./media"
+export * from "./request"
 export * from "./toggle"
 export * from "./viewport"
 export * from "./worker"

src/assets/javascripts/browser/media/index.ts

@@ -20,8 +20,14 @@
  * IN THE SOFTWARE.
  */
 
-import { Observable, fromEvent, merge } from "rxjs"
-import { filter, map, mapTo, startWith } from "rxjs/operators"
+import { NEVER, Observable, fromEvent, merge } from "rxjs"
+import {
+  filter,
+  map,
+  mapTo,
+  startWith,
+  switchMap
+} from "rxjs/operators"
 
 /* ----------------------------------------------------------------------------
  * Functions
@@ -57,3 +63,24 @@ export function watchPrint(): Observable<void> {
       mapTo(undefined)
     )
 }
+
+/* ------------------------------------------------------------------------- */
+
+/**
+ * Toggle an observable with another one
+ *
+ * @template T - Data type
+ *
+ * @param toggle$ - Toggle observable
+ * @param factory - Observable factory
+ *
+ * @returns Toggled observable
+ */
+export function at<T>(
+  toggle$: Observable<boolean>, factory: () => Observable<T>
+): Observable<T> {
+  return toggle$
+    .pipe(
+      switchMap(active => active ? factory() : NEVER)
+    )
+}

src/assets/javascripts/browser/request/index.ts

@@ -28,21 +28,29 @@ import {
   switchMap
 } from "rxjs/operators"
 
-/* ----------------------------------------------------------------------------
- * Data
- * ------------------------------------------------------------------------- */
-
-/**
- * XML parser
- */
-const dom = new DOMParser()
-
 /* ----------------------------------------------------------------------------
  * Functions
  * ------------------------------------------------------------------------- */
 
 /**
- * Fetch given URL as JSON
+ * Fetch the given URL
+ *
+ * @param url - Request URL
+ * @param options - Request options
+ *
+ * @returns Response observable
+ */
+export function request(
+  url: string, options: RequestInit = { credentials: "same-origin" }
+): Observable<Response> {
+  return from(fetch(url, options))
+    .pipe(
+      filter(res => res.status === 200),
+    )
+}
+
+/**
+ * Fetch JSON from the given URL
  *
  * @template T - Data type
  *
@@ -51,32 +59,31 @@ const dom = new DOMParser()
  *
  * @returns Data observable
  */
-export function fetchJSON<T>(
-  url: string, options: RequestInit = { credentials: "same-origin" }
+export function requestJSON<T>(
+  url: string, options?: RequestInit
 ): Observable<T> {
-  return from(fetch(url, options))
+  return request(url, options)
     .pipe(
-      filter(res => res.status === 200),
       switchMap(res => res.json()),
       shareReplay(1)
     )
 }
 
 /**
- * Fetch given URL as XML
+ * Fetch XML from the given URL
  *
  * @param url - Request URL
  * @param options - Request options
  *
  * @returns Data observable
  */
-export function fetchXML(
-  url: string, options: RequestInit = { credentials: "same-origin" }
+export function requestXML(
+  url: string, options?: RequestInit
 ): Observable<Document> {
-  return from(fetch(url, options))
+  const dom = new DOMParser()
+  return request(url, options)
     .pipe(
-      filter(res => res.status === 200),
-      switchMap(res => res.json()),
+      switchMap(res => res.text()),
       map(res => dom.parseFromString(res, "text/xml")),
       shareReplay(1)
     )