Use Swift Package Manager resource bundling

Author: literalpie

.node/package.json

@@ -5,8 +5,8 @@
     "not dead"
   ],
   "scripts": {
-    "watch": "concurrently \"postcss -w ../Assets/**/*.css -o ../Resources/all.min.css --config ./postcss.config.js\" \"tsc -w\"",
-    "build": "tsc && postcss ../Assets/**/*.css -o ../Resources/all.min.css --config ./postcss.config.js"
+    "watch": "concurrently \"postcss -w ../Assets/**/*.css -o ../Sources/swift-doc/Resources/all.min.css --config ./postcss.config.js\" \"tsc -w\"",
+    "build": "tsc && postcss ../Assets/**/*.css -o ../Sources/swift-doc/Resources/all.min.css --config ./postcss.config.js"
   },
   "devDependencies": {
     "concurrently": "^5.2.0",

Package.resolved

@@ -51,8 +51,8 @@
         "repositoryURL": "https://github.com/SwiftDocOrg/swift-cmark.git",
         "state": {
           "branch": null,
-          "revision": "2a766030bee955b4806044fd7aca1b6884475138",
-          "version": "0.28.3+20200110.2a76603"
+          "revision": "1168665f6b36be747ffe6b7b90bc54cfc17f42b7",
+          "version": "0.28.3+20200207.1168665"
         }
       },
       {

Package.swift

@@ -43,6 +43,10 @@ let package = Package(
                 .product(name: "SwiftSyntaxHighlighter", package: "SwiftSyntaxHighlighter"),
                 .product(name: "Logging", package: "swift-log"),
                 .product(name: "LoggingGitHubActions", package: "LoggingGitHubActions")
+            ],
+            resources: [
+                .copy("Resources/all.js"),
+                .copy("Resources/all.min.css"),
             ]
         ),
         .target(

Sources/swift-doc/Resources/all.js

@@ -0,0 +1,79 @@
+var _a;
+var themeQuery = window.matchMedia('(prefers-color-scheme: dark)');
+var localStorageKey = "picked-theme";
+var autoTheme = false;
+// load initial theme before load event to prevent flashing of background color on navigation
+var initialTheme = (_a = window.localStorage.getItem(localStorageKey)) !== null && _a !== void 0 ? _a : "auto";
+setPickedTheme(initialTheme);
+window.addEventListener("load", function () {
+    var _a;
+    var themeSwitcher = window.document.getElementById("theme-switcher");
+    themeSwitcher.addEventListener("change", function (themePickedEvent) {
+        var newValue = themePickedEvent.target.value;
+        setPickedTheme(newValue);
+    });
+    (_a = themeQuery.addEventListener) === null || _a === void 0 ? void 0 : _a.call(themeQuery, "change", function (systemThemeChangeEvent) {
+        var systemTheme = systemThemeChangeEvent.matches ? "dark" : "light";
+        updateDropdownLabel(systemTheme);
+        if (autoTheme) {
+            applyTheme(systemTheme);
+        }
+    });
+    setInitialTheme(themeSwitcher);
+    checkThemingSupport();
+});
+/**
+ * Sets the correct theme based on what's in storage, and updates the theme switcher dropdown with the correct initial value.
+ */
+function setInitialTheme(themeSwitcher) {
+    var _a;
+    var initialTheme = (_a = window.localStorage.getItem(localStorageKey)) !== null && _a !== void 0 ? _a : "auto";
+    themeSwitcher.value = initialTheme;
+    setPickedTheme(initialTheme);
+    var systemTheme = themeQuery.matches ? "dark" : "light";
+    updateDropdownLabel(systemTheme);
+}
+/**
+ * Updates the styles of the page to reflect a new theme
+ */
+function applyTheme(newTheme) {
+    var otherTheme = newTheme == "light" ? "dark" : "light";
+    window.document.documentElement.classList.remove(otherTheme + "-theme");
+    window.document.documentElement.classList.add(newTheme + "-theme");
+}
+/**
+ * Saves a newly picked theme to storage and applies the theme.
+ * If the new theme is "auto", the correct theme will be applied based on the system settings.
+ */
+function setPickedTheme(newTheme) {
+    window.localStorage.setItem(localStorageKey, newTheme);
+    autoTheme = newTheme === "auto";
+    if (newTheme === "auto") {
+        var systemTheme = themeQuery.matches ? "dark" : "light";
+        applyTheme(systemTheme);
+    }
+    else {
+        applyTheme(newTheme);
+    }
+}
+/**
+ * Updates the "Auto" choice of the theme dropdown to reflect the current system theme - either "Auto (light)" or "Auto (dark)"
+ */
+function updateDropdownLabel(systemTheme) {
+    window.document.getElementById('theme-option-auto').innerText = "Auto (" + systemTheme + ")";
+}
+
+/**
+ * Checks whether color-scheme is a supported feature of the browser.
+ * If it is not, removes the auto option from the dropdown.
+ */
+function checkThemingSupport() {
+    var darkQuery = window.matchMedia('(prefers-color-scheme: dark)');
+    var lightQuery = window.matchMedia('(prefers-color-scheme: light)');
+    // If neither query matches, we know that the browser doesn't support theming
+    if (!darkQuery.matches && !lightQuery.matches) {
+        var themeOptionAuto = window.document.getElementById('theme-option-auto');
+        // IE doesn't support element.remove()
+        themeOptionAuto.parentNode.removeChild(themeOptionAuto);
+    }
+}

Sources/swift-doc/Resources/all.min.css

@@ -133,11 +133,11 @@ extension SwiftDoc {
 }
 
 func fetchRemoteCSS() throws -> Data {
-  let url = URL(string: "https://raw.githubusercontent.com/literalpie/swift-doc/5165f782d33d437f7bccf3c2fa5f89b039134f73/Resources/all.min.css")!
-  return try Data(contentsOf: url)
+  let cssURL = Bundle.module.url(forResource: "all.min", withExtension: "css")!
+  return try Data(contentsOf: cssURL)
 }
 
 func fetchRemoteJS() throws -> Data {
-  let url = URL(string: "https://raw.githubusercontent.com/literalpie/swift-doc/5165f782d33d437f7bccf3c2fa5f89b039134f73/Resources/all.js")!
-  return try Data(contentsOf: url)
+    let jsURL = Bundle.module.url(forResource: "all", withExtension: "js")!
+  return try Data(contentsOf: jsURL)
 }