Remove Bliss dependency

README.md

@@ -4,6 +4,46 @@
 
 ## Getting started
 
+### CDN
+
+```html
+<script src="https://inspirejs.org/inspire.js"></script>
+```
+
+or
+
+```js
+import Inspire from "https://inspirejs.org/inspire.mjs";
+```
+
+### NPM
+
+```sh
+npm install inspirejs
+```
+
+then
+
+
+```html
+<script src="node_modules/inspirejs.org/inspire.js"></script>
+```
+
+or
+
+```js
+import Inspire from "node_modules/inspirejs.org/inspire.mjs";
+```
+
+or if you use a bundler:
+
+```js
+import Inspire from "inspirejs.org";
+```
+
+
+### Quick start
+
 - Copy (and rename) blank.html somewhere
 - Also copy talk.css, theme.css
 - Add Your Own Content
@@ -13,7 +53,9 @@
 
 If you were using CSSS and would rather stay at it, run `git checkout v1.0.0` and stay there.
 
-## Migrating from CSSS
+<details>
+
+<summary>Migrating from CSSS</summary>
 
 - Almost all HTML syntax is the same! The same JS events are still fired. So, very little should break.
 - `slideshow.css` is now `inspire.css`
@@ -28,6 +70,8 @@ If you were using CSSS and would rather stay at it, run `git checkout v1.0.0` an
 - `reusable.css` has now been merged into the default theme, `theme.css`.
 - `data-import` is now `data-insert`
 
+</details>
+
 ## API FAQ
 
 ### Running code after any imports have loaded

_redirects

@@ -1 +1,3 @@
-/bliss/src/* https://v2.blissfuljs.com/src/:splat 200
+
+# Catch all NPM fallback
+node_modules/:modulename/* https://cdn.jsdelivr.net/npm/:modulename@latest/:splat 200

package.json

@@ -20,5 +20,8 @@
   "bugs": {
     "url": "https://github.com/LeaVerou/inspire.js/issues"
   },
-  "homepage": "https://inspirejs.org"
+  "homepage": "https://inspirejs.org",
+  "dependencies": {
+    "blissful-hooks": "^0.0"
+  }
 }

plugins/details-notes/plugin.js

@@ -1,9 +1,9 @@
 import Inspire from "../../src/../inspire.mjs";
-import { create, $, $$ } from "../../src/util.js";
+import create from "../../src/util/create.js";
 
 export const hasCSS = true;
 
-$$("details.notes").forEach(details => {
+for (let details of document.querySelectorAll("details.notes")) {
 	let div = document.createElement("div");
 	div.append(...details.childNodes);
 	details.append(div);
@@ -13,7 +13,7 @@ $$("details.notes").forEach(details => {
 		details.classList.add("top-right");
 	}
 
-	let summary = $("summary", details);
+	let summary = details.querySelector("summary");
 
 	if (!summary) {
 		create.start(details, `<summary>Notes</summary>`);
@@ -23,4 +23,4 @@ $$("details.notes").forEach(details => {
 		// Speaker view, let's have the notes open by default
 		details.open = true;
 	}
-});
+}

plugins/docs/plugin.js

@@ -1,12 +1,11 @@
 // Links to documentation
 import Inspire from "../../src/../inspire.mjs";
-import { create, $$ } from "../../src/util.js";
+import create from "../../src/util/create.js";
 
 export const hasCSS = true;
 
 let processDocsLinks = (root = document) => {
-
-	$$(Inspire.plugins.registry.docs, root).forEach(code => {
+	for (let code of document.querySelectorAll(Inspire.plugins.registry.docs)) {
 		let text = code.dataset.mdn && !/\/$/.test(code.dataset.mdn)? "" : code.textContent;
 		let id = text;
 		let path;
@@ -49,7 +48,7 @@ let processDocsLinks = (root = document) => {
 		}
 
 		create.around(code, `<a class="docs-link" href="https://developer.mozilla.org/en-US/docs/Web/${path}/${id}" target="_blank"></a>`);
-	});
+	}
 };
 
 Inspire.plugins.loaded.docs.loaded.then(() => {

plugins/visible-keys/plugin.js

@@ -1,7 +1,5 @@
 // Display certain keys pressed
-import Inspire from "../../src/../inspire.mjs";
-import transition from "../../bliss/src/dom/transition.js";
-import { timeout } from "../../src/util.js";
+import Inspire from "../../inspire.mjs";
 
 export const symbols = {
 	Tab: "⇥",
@@ -43,8 +41,7 @@ Inspire.hooks.add("slidechange", env => {
 
 				env.slide.insertAdjacentHTML("beforeend", `<kbd class="visible-key">${ label }</kbd>`);
 
-				await timeout(delay);
-				await transition(key, {opacity: 0});
+				await key.animate([{opacity: 0}], {duration: 400, delay}).finished;
 				key.remove();
 			}
 		});

src/inspire.js

@@ -1,10 +1,3 @@
-	/**
-	 * Inspire.js
-	 * https://inspirejs.org
-	 * MIT Licensed
-	 * Copyright (C) 2010-2018 Lea Verou, http://lea.verou.me
-	 */
-
 import * as plugins from "./plugins.js";
 import * as util from "./util.js";
 import * as imports from "./imports.js"

src/plugins.js

@@ -33,6 +33,7 @@ export function load (id, def = {}) {
 		return module;
 	});
 	// Resolves to the JS module, but only after CSS has also loaded
+	plugin.loaded = util.defer(plugin.loaded);
 	plugin.module = plugin.loaded;
 	plugin.done = plugin.loaded.finally(_ => {
 		plugin.loading = "";
@@ -55,6 +56,7 @@ export function loadAll (plugins = registry) {
 			let plugin = load(id, def);
 			// plugin.loaded.then(_ => ret.push(plugin));
 			plugin.loaded.catch(e => console.error(`Plugin ${id} error:`, e));
+			setTimeout(_ => plugin.loaded.reject("Timed out"), TIMEOUT);
 			ret.push(plugin.loaded);
 		}
 	}

src/util.js

@@ -1,7 +1,9 @@
+import Hooks from "../node_modules/blissful-hooks/src/Hooks.js";
+
 export function defer (source) {
-	var res, rej;
+	let res, rej;
 
-	var promise = new Promise((resolve, reject) => {
+	let promise = new Promise((resolve, reject) => {
 		res = resolve;
 		rej = reject;
 
@@ -77,9 +79,19 @@ export function bind (element, events) {
 	}
 }
 
+export function $$ (selector, root = document) {
+	return Array.from(root.querySelectorAll(selector));
+}
+
+export function $ (selector, root = document) {
+	if (typeof selector != "string") {
+		return selector;
+	}
+
+	return root.querySelector(selector);
+}
+
 export { default as inView } from "./util/inview.js";
 export { default as create } from "./util/create.js";
 
-export { default as $ } from "../../bliss/src/$.js";
-export { default as $$ } from "../../bliss/src/$$.js";
-export { default as Hooks } from "../../bliss/src/Hooks.js";
+export { Hooks };