Restructured project

src/assets/javascripts/components/Material/Source/Adapter/GitHub.js

@@ -1,95 +0,0 @@
-/*
- * 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 Abstract from "./Abstract"
-
-/* ----------------------------------------------------------------------------
- * Class
- * ------------------------------------------------------------------------- */
-
-export default class GitHub extends Abstract {
-
-  /**
-   * Retrieve repository information from GitHub
-   *
-   * @constructor
-   *
-   * @property {string} name_ - Name of the repository
-   *
-   * @param {(string|HTMLAnchorElement)} el - Selector or HTML element
-   */
-  constructor(el) {
-    super(el)
-
-    /* Extract user (and repository name) from URL, as we have to query for all
-       repositories, to omit 404 errors for private repositories */
-    const matches = /^.+github\.com\/([^/]+)\/?([^/]+)?.*$/
-      .exec(this.base_)
-    if (matches && matches.length === 3) {
-      const [, user, name] = matches
-
-      /* Initialize base URL and repository name */
-      this.base_ = `https://api.github.com/users/${user}/repos`
-      this.name_ = name
-    }
-  }
-
-  /**
-   * Fetch relevant repository information from GitHub
-   *
-   * @return {Promise<Array<string>>} Promise returning an array of facts
-   */
-  fetch_() {
-    const paginate = (page = 0) => (
-      fetch(`${this.base_}?per_page=100&sort=updated&page=${page}`)
-        .then(response => response.json())
-        .then(data => {
-          if (!(data instanceof Array))
-            return []
-
-          /* Display number of stars and forks, if repository is given */
-          if (this.name_) {
-            const repo = data.find(item => item.name === this.name_)
-            if (!repo && data.length === 30)
-              return paginate(page + 1)
-
-            /* If we found a repo, extract the facts */
-            return repo
-              ? [
-                `${this.format_(repo.stargazers_count)} Stars`,
-                `${this.format_(repo.forks_count)} Forks`
-              ]
-              : []
-
-          /* Display number of repositories, otherwise */
-          } else {
-            return [
-              `${data.length} Repositories`
-            ]
-          }
-        })
-    )
-
-    /* Paginate through repos */
-    return paginate()
-  }
-}

src/assets/javascripts/components/_/index.ts

@@ -0,0 +1,149 @@
+/*
+ * 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 { keys } from "ramda"
+import { NEVER, Observable, OperatorFunction, of, pipe } from "rxjs"
+import { map, scan, shareReplay, switchMap } from "rxjs/operators"
+
+import { getElement } from "../../utilities"
+
+/* ----------------------------------------------------------------------------
+ * Types
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Component names
+ */
+export type Component =
+  | "header"                           /* Header */
+  | "title"                            /* Header title */
+  | "search"                           /* Search */
+  | "query"                            /* Search input */
+  | "reset"                            /* Search reset */
+  | "result"                           /* Search results */
+  | "container"                        /* Container */
+  | "main"                             /* Main area */
+  | "hero"                             /* Hero */
+  | "tabs"                             /* Tabs */
+  | "navigation"                       /* Navigation */
+  | "toc"                              /* Table of contents */
+
+/**
+ * Component map
+ */
+export type ComponentMap = {
+  [P in Component]?: HTMLElement
+}
+
+/* ----------------------------------------------------------------------------
+ * Function types
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Options
+ */
+interface Options {
+  document$: Observable<Document>      /* Document observable */
+}
+
+/* ----------------------------------------------------------------------------
+ * Functions
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Watch component map
+ *
+ * This function returns an observable that will maintain bindings to the given
+ * components in-between document switches and update the document in-place.
+ *
+ * @param names - Component names
+ * @param options - Options
+ *
+ * @return Component map observable
+ */
+export function watchComponentMap(
+  names: Component[], { document$ }: Options
+): Observable<ComponentMap> {
+  const components$ = document$
+    .pipe(
+
+      /* Build component map */
+      map(document => names.reduce<ComponentMap>((components, name) => {
+        const el = getElement(`[data-md-component=${name}]`, document)
+        return {
+          ...components,
+          ...typeof el !== "undefined" ? { [name]: el } : {}
+        }
+      }, {})),
+
+      /* Re-compute component map on document switch */
+      scan((prev, next) => {
+        for (const name of keys(prev)) {
+          switch (name) {
+
+            /* Top-level components: update */
+            case "title":
+            case "container":
+              if (name in prev && typeof prev[name] !== "undefined") {
+                prev[name]!.replaceWith(next[name]!)
+                prev[name] = next[name]
+              }
+              break
+
+            /* All other components: rebind */
+            default:
+              prev[name] = getElement(`[data-md-component=${name}]`)
+          }
+        }
+        return prev
+      })
+    )
+
+  /* Return component map as hot observable */
+  return components$
+    .pipe(
+      shareReplay(1)
+    )
+}
+
+/* ------------------------------------------------------------------------- */
+
+/**
+ * Switch to component
+ *
+ * @template T - Element type
+ *
+ * @param name - Component name
+ *
+ * @return Operator function
+ */
+export function switchComponent<T extends HTMLElement>(
+  name: Component
+): OperatorFunction<ComponentMap, T> {
+  return pipe(
+    switchMap(components => {
+      return typeof components[name] !== "undefined"
+        ? of(components[name] as T)
+        : NEVER
+    })
+  )
+}

src/assets/javascripts/components/header/_/index.ts

@@ -0,0 +1,64 @@
+/*
+ * 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, defer, of } from "rxjs"
+
+/* ----------------------------------------------------------------------------
+ * Types
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Header
+ */
+export interface Header {
+  sticky: boolean                      /* Header stickyness */
+  height: number                       /* Header visible height */
+}
+
+/* ----------------------------------------------------------------------------
+ * Functions
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Watch header
+ *
+ * The header is wrapped in an observable to pave the way for auto-hiding or
+ * other dynamic behaviors that may be implemented later on.
+ *
+ * @param el - Header element
+ *
+ * @return Header observable
+ */
+export function watchHeader(
+  el: HTMLElement
+): Observable<Header> {
+  return defer(() => {
+    const sticky = getComputedStyle(el)
+      .getPropertyValue("position") === "fixed"
+
+    /* Return header as hot observable */
+    return of({
+      sticky,
+      height: sticky ? el.offsetHeight : 0
+    })
+  })
+}

src/assets/javascripts/components/header/index.ts

@@ -0,0 +1,25 @@
+/*
+ * 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 "./_"
+export * from "./offset"
+export * from "./shadow"

src/assets/javascripts/components/header/offset/index.ts

@@ -0,0 +1,111 @@
+/*
+ * 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, combineLatest } from "rxjs"
+import {
+  distinctUntilChanged,
+  map,
+  shareReplay,
+  switchMapTo
+} from "rxjs/operators"
+
+import { ViewportOffset, ViewportSize } from "../../../utilities"
+import { Header } from "../_"
+
+/* ----------------------------------------------------------------------------
+ * Function types
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Options
+ */
+interface Options {
+  size$: Observable<ViewportSize>      /* Viewport size observable */
+  offset$: Observable<ViewportOffset>  /* Viewport offset observable */
+  header$: Observable<Header>          /* Header observable */
+}
+
+/* ----------------------------------------------------------------------------
+ * Functions
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Watch viewport offset relative to an element's top
+ *
+ * This function returns an observable that computes the relative offset to the
+ * top of the given element based on the current viewport offset.
+ *
+ * @param el - Element
+ * @param options - Options
+ *
+ * @return Viewport offset observable
+ */
+export function watchTopOffset(
+  el: HTMLElement, { size$, offset$, header$ }: Options
+): Observable<ViewportOffset> {
+
+  /* Compute necessary adjustment for offset */
+  const adjust$ = size$
+    .pipe(
+      switchMapTo(header$),
+      map(({ height }) => el.offsetTop - height),
+      distinctUntilChanged()
+    )
+
+  /* Compute relative offset and return as hot observable */
+  return combineLatest([offset$, adjust$])
+    .pipe(
+      map(([{ x, y }, adjust]) => ({ x, y: y - adjust })),
+      shareReplay(1)
+    )
+}
+
+/**
+ * Watch viewport offset relative to an element's bottom
+ *
+ * This function returns an observable that computes the relative offset to the
+ * bottom of the given element based on the current viewport offset.
+ *
+ * @param el - Element
+ * @param options - Options
+ *
+ * @return Viewport offset observable
+ */
+export function watchBottomOffset(
+  el: HTMLElement, { size$, offset$, header$ }: Options
+): Observable<ViewportOffset> {
+
+  /* Compute necessary adjustment for offset */
+  const adjust$ = size$
+    .pipe(
+      switchMapTo(header$),
+      map(({ height }) => el.offsetTop + el.offsetHeight - height),
+      distinctUntilChanged()
+    )
+
+  /* Compute relative offset and return as hot observable */
+  return combineLatest([offset$, adjust$])
+    .pipe(
+      map(([{ x, y }, adjust]) => ({ x, y: y - adjust })),
+      shareReplay(1)
+    )
+}

src/assets/javascripts/components/header/shadow/index.ts

@@ -0,0 +1,66 @@
+/*
+ * 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 {
+  MonoTypeOperatorFunction,
+  animationFrameScheduler,
+  pipe
+} from "rxjs"
+import {
+  distinctUntilKeyChanged,
+  finalize,
+  observeOn,
+  tap
+} from "rxjs/operators"
+
+import { resetHeaderShadow, setHeaderShadow } from "../../../actions"
+import { Main } from "../../main"
+
+/* ----------------------------------------------------------------------------
+ * Functions
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Paint header shadow from source observable
+ *
+ * @param el - Header element
+ *
+ * @return Operator function
+ */
+export function paintHeaderShadow(
+  el: HTMLElement
+): MonoTypeOperatorFunction<Main> {
+  return pipe(
+    distinctUntilKeyChanged("active"),
+
+    /* Defer repaint to next animation frame */
+    observeOn(animationFrameScheduler),
+    tap(({ active }) => {
+      setHeaderShadow(el, active)
+    }),
+
+    /* Reset on complete or error */
+    finalize(() => {
+      resetHeaderShadow(el)
+    })
+  )
+}

src/assets/javascripts/components/hidden/index.ts

@@ -0,0 +1,65 @@
+/*
+ * 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 { OperatorFunction, animationFrameScheduler, pipe } from "rxjs"
+import {
+  distinctUntilChanged,
+  finalize,
+  map,
+  observeOn,
+  tap
+} from "rxjs/operators"
+
+import { resetHidden, setHidden } from "../../actions"
+import { ViewportOffset } from "../../utilities"
+
+/* ----------------------------------------------------------------------------
+ * Functions
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Paint hideable from source observable
+ *
+ * @param el - Hideable element
+ * @param offset - Additional offset
+ *
+ * @return Operator function
+ */
+export function paintHidden(
+  el: HTMLElement, offset: number = 0
+): OperatorFunction<ViewportOffset, boolean> {
+  return pipe(
+    map(({ y }) => y >= offset),
+    distinctUntilChanged(),
+
+    /* Defer repaint to next animation frame */
+    observeOn(animationFrameScheduler),
+    tap(value => {
+      setHidden(el, value)
+    }),
+
+    /* Reset on complete or error */
+    finalize(() => {
+      resetHidden(el)
+    })
+  )
+}

src/assets/javascripts/components/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 "./_"
+export * from "./header"
+export * from "./hidden"
+export * from "./main"
+export * from "./search"
+export * from "./sidebar"

src/assets/javascripts/components/main/index.ts

@@ -0,0 +1,117 @@
+/*
+ * 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, combineLatest } from "rxjs"
+import {
+  distinctUntilChanged,
+  map,
+  pluck,
+  shareReplay
+} from "rxjs/operators"
+
+import { ViewportOffset, ViewportSize } from "../../utilities"
+import { Header } from "../header"
+
+/* ----------------------------------------------------------------------------
+ * Types
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Main area
+ */
+export interface Main {
+  offset: number                       /* Main area top offset */
+  height: number                       /* Main area visible height */
+  active: boolean                      /* Scrolled past top offset */
+}
+
+/* ----------------------------------------------------------------------------
+ * Function types
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Options
+ */
+interface Options {
+  size$: Observable<ViewportSize>      /* Viewport size observable */
+  offset$: Observable<ViewportOffset>  /* Viewport offset observable */
+  header$: Observable<Header>          /* Header observable */
+}
+
+/* ----------------------------------------------------------------------------
+ * Functions
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Watch main area
+ *
+ * This function returns an observable that computes the visual parameters of
+ * the main area from the viewport height and vertical offset, as well as the
+ * height of the header element. The height of the main area is corrected by
+ * the height of the header (if fixed) and footer element.
+ *
+ * @param el - Main area element
+ * @param options - Options
+ *
+ * @return Main area observable
+ */
+export function watchMain(
+  el: HTMLElement, { size$, offset$, header$ }: Options
+): Observable<Main> {
+
+  /* Compute necessary adjustment for header */
+  const adjust$ = header$
+    .pipe(
+      pluck("height")
+    )
+
+  /* Compute the main area's visible height */
+  const height$ = combineLatest([offset$, size$, adjust$])
+    .pipe(
+      map(([{ y }, { height }, adjust]) => {
+        const top    = el.offsetTop
+        const bottom = el.offsetHeight + top
+        return height
+          - Math.max(0, top    - y,  adjust)
+          - Math.max(0, height + y - bottom)
+      }),
+      distinctUntilChanged()
+    )
+
+  /* Compute whether the viewport offset is past the main area's top */
+  const active$ = combineLatest([offset$, adjust$])
+    .pipe(
+      map(([{ y }, adjust]) => y >= el.offsetTop - adjust),
+      distinctUntilChanged()
+    )
+
+  /* Combine into a single hot observable */
+  return combineLatest([height$, adjust$, active$])
+    .pipe(
+      map(([height, adjust, active]) => ({
+        offset: el.offsetTop - adjust,
+        height,
+        active
+      })),
+      shareReplay(1)
+    )
+}

src/assets/javascripts/components/search/index.ts

@@ -0,0 +1,24 @@
+/*
+ * 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 "./query"
+export * from "./reset"

src/assets/javascripts/components/search/query/index.ts

@@ -0,0 +1,22 @@
+/*
+ * 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.
+ */
+

src/assets/javascripts/components/search/reset/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 { mapTo } from "rxjs/operators"
+
+/* ----------------------------------------------------------------------------
+ * Functions
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Watch search reset
+ *
+ * @param el - Search reset element
+ *
+ * @return Search reset observable
+ */
+export function watchSearchReset(
+  el: HTMLElement
+): Observable<boolean> {
+  return fromEvent(el, "click")
+    .pipe(
+      mapTo(true)
+    )
+}

src/assets/javascripts/components/sidebar/index.ts

@@ -0,0 +1,150 @@
+/*
+ * 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 { equals } from "ramda"
+import {
+  MonoTypeOperatorFunction,
+  Observable,
+  animationFrameScheduler,
+  combineLatest,
+  pipe
+} from "rxjs"
+import {
+  distinctUntilChanged,
+  finalize,
+  map,
+  observeOn,
+  shareReplay,
+  tap
+} from "rxjs/operators"
+
+import {
+  resetSidebarHeight,
+  resetSidebarLock,
+  setSidebarHeight,
+  setSidebarLock
+} from "../../actions"
+import { ViewportOffset } from "../../utilities"
+import { Main } from "../main"
+
+/* ----------------------------------------------------------------------------
+ * Types
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Sidebar
+ */
+export interface Sidebar {
+  height: number                       /* Sidebar height */
+  lock: boolean                        /* Sidebar lock */
+}
+
+/* ----------------------------------------------------------------------------
+ * Function types
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Options
+ */
+interface Options {
+  offset$: Observable<ViewportOffset>  /* Viewport offset observable */
+  main$: Observable<Main>              /* Main area observable */
+}
+
+/* ----------------------------------------------------------------------------
+ * Functions
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Watch sidebar
+ *
+ * This function returns an observable that computes the visual parameters of
+ * the given element (a sidebar) from the vertical viewport offset, as well as
+ * the height of the main area. When the page is scrolled beyond the header,
+ * the sidebar is locked and fills the remaining space.
+ *
+ * @param el - Sidebar element
+ * @param options - Options
+ *
+ * @return Sidebar observable
+ */
+export function watchSidebar(
+  el: HTMLElement, { offset$, main$ }: Options
+): Observable<Sidebar> {
+
+  /* Adjust for internal main area offset */
+  const adjust = parseFloat(
+    getComputedStyle(el.parentElement!)
+      .getPropertyValue("padding-top")
+  )
+
+  /* Compute the sidebar's available height */
+  const height$ = combineLatest([offset$, main$])
+    .pipe(
+      map(([{ y }, { offset, height }]) => {
+        return height - adjust + Math.min(adjust, Math.max(0, y - offset))
+      })
+    )
+
+  /* Compute whether the sidebar should be locked */
+  const lock$ = combineLatest([offset$, main$])
+    .pipe(
+      map(([{ y }, { offset }]) => y >= offset + adjust)
+    )
+
+  /* Combine into single hot observable */
+  return combineLatest([height$, lock$])
+    .pipe(
+      map(([height, lock]) => ({ height, lock })),
+      distinctUntilChanged<Sidebar>(equals),
+      shareReplay(1)
+    )
+}
+
+/* ------------------------------------------------------------------------- */
+
+/**
+ * Paint sidebar from source observable
+ *
+ * @param el - Sidebar element
+ *
+ * @return Operator function
+ */
+export function paintSidebar(
+  el: HTMLElement
+): MonoTypeOperatorFunction<Sidebar> {
+  return pipe(
+
+    /* Defer repaint to next animation frame */
+    observeOn(animationFrameScheduler),
+    tap(({ height, lock }) => {
+      setSidebarHeight(el, height)
+      setSidebarLock(el, lock)
+    }),
+
+    /* Reset on complete or error */
+    finalize(() => {
+      resetSidebarHeight(el)
+      resetSidebarLock(el)
+    })
+  )
+}