Refactored overrides

material/assets/manifest.json

@@ -1,6 +1,6 @@
 {
-  "assets/javascripts/bundle.js": "assets/javascripts/bundle.3e5f7fbe.min.js",
+  "assets/javascripts/bundle.js": "assets/javascripts/bundle.531fa892.min.js",
-  "assets/javascripts/bundle.js.map": "assets/javascripts/bundle.3e5f7fbe.min.js.map",
+  "assets/javascripts/bundle.js.map": "assets/javascripts/bundle.531fa892.min.js.map",
   "assets/javascripts/vendor.js": "assets/javascripts/vendor.00ecb175.min.js",
   "assets/javascripts/vendor.js.map": "assets/javascripts/vendor.00ecb175.min.js.map",
   "assets/javascripts/worker/search.js": "assets/javascripts/worker/search.b9424174.min.js",
@@ -9,8 +9,8 @@
   "assets/stylesheets/main.css.map": "assets/stylesheets/main.f080134c.min.css.map",
   "assets/stylesheets/palette.css": "assets/stylesheets/palette.e70b70b6.min.css",
   "assets/stylesheets/palette.css.map": "assets/stylesheets/palette.e70b70b6.min.css.map",
-  "overrides/assets/javascripts/bundle.js": "overrides/assets/javascripts/bundle.0ab4dcf7.min.js",
+  "overrides/assets/javascripts/bundle.js": "overrides/assets/javascripts/bundle.c13533fc.min.js",
-  "overrides/assets/javascripts/bundle.js.map": "overrides/assets/javascripts/bundle.0ab4dcf7.min.js.map",
+  "overrides/assets/javascripts/bundle.js.map": "overrides/assets/javascripts/bundle.c13533fc.min.js.map",
   "overrides/assets/stylesheets/main.css": "overrides/assets/stylesheets/main.40bc65d6.min.css",
   "overrides/assets/stylesheets/main.css.map": "overrides/assets/stylesheets/main.40bc65d6.min.css.map"
 }

material/base.html

@@ -217,7 +217,7 @@
     {% endblock %}
     {% block scripts %}
       <script src="{{ 'assets/javascripts/vendor.00ecb175.min.js' | url }}"></script>
-      <script src="{{ 'assets/javascripts/bundle.3e5f7fbe.min.js' | url }}"></script>
+      <script src="{{ 'assets/javascripts/bundle.531fa892.min.js' | url }}"></script>
       {% for path in config["extra_javascript"] %}
         <script src="{{ path | url }}"></script>
       {% endfor %}

material/overrides/main.html

@@ -53,5 +53,5 @@
 {% endblock %}
 {% block scripts %}
   {{ super() }}
-  <script src="{{ 'overrides/assets/javascripts/bundle.0ab4dcf7.min.js' | url }}"></script>
+  <script src="{{ 'overrides/assets/javascripts/bundle.c13533fc.min.js' | url }}"></script>
 {% endblock %}

src/assets/javascripts/index.ts

@@ -143,23 +143,23 @@ const control$ = merge(
 
   /* Dialog */
   ...getComponentElements("dialog")
-    .map(child => mountDialog(child, { alert$ })),
+    .map(el => mountDialog(el, { alert$ })),
 
     /* Header */
   ...getComponentElements("header")
-    .map(child => mountHeader(child, { viewport$, header$, main$ })),
+    .map(el => mountHeader(el, { viewport$, header$, main$ })),
 
   /* Search */
   ...getComponentElements("search")
-    .map(child => mountSearch(child, { keyboard$ })),
+    .map(el => mountSearch(el, { keyboard$ })),
 
   /* Repository information */
   ...getComponentElements("source")
-    .map(child => mountSource(child as HTMLAnchorElement)),
+    .map(el => mountSource(el as HTMLAnchorElement)),
 
   /* Navigation tabs */
   ...getComponentElements("tabs")
-    .map(child => mountTabs(child, { viewport$, header$ })),
+    .map(el => mountTabs(el, { viewport$, header$ })),
 )
 
 /* Set up content component observables */
@@ -167,22 +167,22 @@ const content$ = defer(() => merge(
 
   /* Content */
   ...getComponentElements("content")
-    .map(child => mountContent(child, { target$, viewport$, print$ })),
+    .map(el => mountContent(el, { target$, viewport$, print$ })),
 
   /* Header title */
   ...getComponentElements("header-title")
-    .map(child => mountHeaderTitle(child, { viewport$, header$ })),
+    .map(el => mountHeaderTitle(el, { viewport$, header$ })),
 
   /* Sidebar */
   ...getComponentElements("sidebar")
-    .map(child => child.getAttribute("data-md-type") === "navigation"
+    .map(el => el.getAttribute("data-md-type") === "navigation"
-      ? at(screen$, () => mountSidebar(child, { viewport$, header$, main$ }))
+      ? at(screen$, () => mountSidebar(el, { viewport$, header$, main$ }))
-      : at(tablet$, () => mountSidebar(child, { viewport$, header$, main$ }))
+      : at(tablet$, () => mountSidebar(el, { viewport$, header$, main$ }))
     ),
 
   /* Table of contents */
   ...getComponentElements("toc")
-    .map(child => mountTableOfContents(child, { viewport$, header$ })),
+    .map(el => mountTableOfContents(el, { viewport$, header$ })),
 ))
 
 /* Set up component observables */

src/overrides/assets/javascripts/index.ts

@@ -20,18 +20,22 @@
  * IN THE SOFTWARE.
  */
 
-import { Observable, fromEvent, merge } from "rxjs"
+import { Observable, merge } from "rxjs"
 import { switchMap } from "rxjs/operators"
 
 import {
   getComponentElements,
   mountIconSearch
 } from "./components"
+import { setupAnalytics } from "./integrations"
 
 /* ----------------------------------------------------------------------------
  * Application
  * ------------------------------------------------------------------------- */
 
+/* Set up extra analytics events */
+setupAnalytics()
+
 /* Set up extra component observables */
 declare const document$: Observable<Document>
 document$
@@ -40,18 +44,7 @@ document$
 
       /* Icon search */
       ...getComponentElements("icon-search")
-        .map(child => mountIconSearch(child))
+        .map(el => mountIconSearch(el))
     ))
   )
     .subscribe()
-
-// Track click events
-fromEvent(document.body, "click")
-  .subscribe(ev => {
-    if (ev.target instanceof HTMLElement) {
-      const el2 = ev.target.closest("a[href^=http]")
-      if (el2 instanceof HTMLLinkElement)
-        ga("send", "event", "outbound", "click", el2.href)
-    }
-  })
-

src/overrides/assets/javascripts/integrations/analytics/index.ts

@@ -0,0 +1,41 @@
+/*
+ * Copyright (c) 2016-2020 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 { fromEvent } from "rxjs"
+
+/* ----------------------------------------------------------------------------
+ * Functions
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Set up extra analytics events
+ */
+export function setupAnalytics(): void {
+  fromEvent(document.body, "click")
+    .subscribe(ev => {
+      if (ev.target instanceof HTMLElement) {
+        const el = ev.target.closest("a[href^=http]")
+        if (el instanceof HTMLLinkElement)
+          ga("send", "event", "outbound", "click", el.href)
+      }
+    })
+}