From 523a720196ddfef5b0a5ba7ec71e3b3a0dac5da7 Mon Sep 17 00:00:00 2001
From: DarkWiiPlayer <darkwiiplayer@hotmail.com>
Date: Wed, 23 Jun 2021 16:21:33 +0200
Subject: [PATCH] Add comments documenting what stuff does

---
 better.js   | 35 +++++++++++++++++++++--------------
 listener.js | 10 ++++++++++
 skooma.js   | 12 ++++++++++++
 template.js |  8 ++++++++
 4 files changed, 51 insertions(+), 14 deletions(-)

diff --git a/better.js b/better.js
index 74a0977..1f0f502 100644
--- a/better.js
+++ b/better.js
@@ -1,3 +1,24 @@
+/*
+An improved version of the default HTMLElement that provides a bunch of nice
+things, most significantly:
+- Automatically registering the custom element type
+- Built-in event-emitting mutation observer to more easily listen to changes
+- Split attribute-changed callbacks that automatically register attributes
+
+Example:
+	class FooBar extends Better {
+		constructor() {
+			super();
+			this.attachShadow({mode: "open"});
+			this.shadowRoot.innerHTML = `<h1>Hello, <span part="name"></span>!</h1>`
+			this.userName = "World";
+		}
+
+		userNameChanged(name) { this.shadowRoot.querySelector('[part="name"]').innerHTML = this.userName; }
+	}
+	FooBar.initialize()
+*/
+
 export class Better extends HTMLElement {
 	#observer
 	constructor() {
@@ -67,17 +88,3 @@ export class Better extends HTMLElement {
 		return name
 	}
 }
-
-/* Example:
-	class FooBar extends Better {
-		constructor() {
-			super();
-			this.attachShadow({mode: "open"});
-			this.shadowRoot.innerHTML = `<h1>Hello, <span part="name"></span>!</h1>`
-			this.userName = "World";
-		}
-
-		userNameChanged(name) { this.shadowRoot.querySelector('[part="name"]').innerHTML = this.userName; }
-	}
-	FooBar.initialize()
-*/
diff --git a/listener.js b/listener.js
index b451b01..04a6c84 100644
--- a/listener.js
+++ b/listener.js
@@ -1,3 +1,13 @@
+/*
+A somewhat refined Proxy generator that lets you selectively listen to changed
+properties and react accordingly.
+
+Example:
+	const l = listener()
+	l.listen("contract", contract => speaker.handle(contract))
+	l.contract = new Contract()
+*/
+
 export const listener = (target={}) => {
 	let callbacks = new Map()
 	function listen(prop, callback) {
diff --git a/skooma.js b/skooma.js
index 81332bb..ce3c77d 100644
--- a/skooma.js
+++ b/skooma.js
@@ -1,3 +1,15 @@
+/*
+A functional HTML generation library.
+
+Example:
+	html.label(
+		html.span("Delete everything", {class: ["warning", "important"]}),
+		html.button("Click", {onClick: e => document.body.innerHTML=""}),
+	)
+or
+	html.ul([1, 2, 3, 4, 5].map(x => html.li(x)), {class: "numbers"})
+*/
+
 const parseAttribute = (attribute) => {
 	if (typeof attribute == "string" || typeof attribute == "number")
 		return attribute
diff --git a/template.js b/template.js
index 77813a7..e168b9e 100644
--- a/template.js
+++ b/template.js
@@ -1,3 +1,11 @@
+/*
+A simple function to more easily write HTML in Javascript
+
+Example:
+	const greeting = name => template`<p>Hello, ${name}!</p><br>`
+	document.append(greeting(bob).cloneNode(true))
+*/
+
 export const template = (strings, ...args) => {
 	let buf = []
 	for (let i=0;i<strings.length;i++) {