@nebularstreams/statify 3.0.0

package/src.website/src/core.cookies/css/nocookies.css

@@ -0,0 +1,48 @@
+.nocookies .unsplash,
+.nocookies .thirdparty {
+    background-image: linear-gradient(45deg, black, transparent) !important;
+}
+
+.nocookies .authorbox {
+    display: none;
+}
+
+.nocookies .with-nocookies {
+    display: block !important;
+}
+
+.nocookies md-yt:before,
+.nocookies .youtube:before {
+    content: "Enable cookies to watch this video";
+    background: linear-gradient(180deg, transparent, black);
+    display: block;
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    text-align: center;
+    padding: 0.5rem 0;
+    color: white;
+    z-index: 100;
+    font-variant: all-small-caps;
+    font-size: 0.8rem;
+}
+
+.nocookies md-yt:after,
+.nocookies .youtube:after {
+    content: "\f563";
+    font-family: "Font Awesome 5 Free";
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    padding: 0.5rem;
+    font-size: 1.5rem;
+    color: red;
+    border-radius: 200rem;
+    z-index: 101;
+}
+
+.nocookies md-yt iframe,
+.nocookies .youtube iframe {
+    display: none !important;
+}

package/src.website/src/core.extra/css/contractable.css

@@ -0,0 +1,12 @@
+.screen .contractable.contracted:hover > div {
+    background: var(--window-background-lo);
+    cursor: pointer;
+}
+
+.screen .contractable.contracted .body {
+    display: none;
+}
+
+.screen .question.expanded > div {
+    background: var(--accent-light);
+}

package/src.website/src/core.extra/css/faq.css

@@ -0,0 +1,42 @@
+.faq h3 {
+    font-size: 1.25rem;
+    place-self: center;
+    text-align: left;
+}
+
+.screen ol li .index {
+    font-size: 3rem;
+    color: var(--text-lo);
+    width: 5.5rem;
+    flex-shrink: 0;
+}
+
+.faq .question .body {
+    text-align: initial;
+    border-top: dashed 1px var(--border-color);
+    padding: 1rem 1rem 1rem 4rem;
+}
+
+.contractable i {
+    line-height: 4rem;
+    flex-shrink: 0;
+    margin: 0 1rem;
+    color: var(--text-lo);
+}
+
+
+.faq.question > div {
+    transition: background-color 0.5s linear;
+}
+
+.faq .markdown:before {
+    height: 100%;
+    content: " ";
+    background: var(--accent);
+    width: 0.25rem;
+    display: block;
+    position: absolute;
+    top: 0;
+    left: 2.5rem;
+}
+

package/src.website/src/core.extra/css/howto.css

@@ -0,0 +1,81 @@
+.howto .howtolist li {
+    align-items: center;
+    padding: 0.5rem 0;
+}
+
+.howto .instructions li i {
+    margin-right: 1rem;
+    place-items: center;
+}
+
+.howto .instructions li {
+    padding: 0.5rem 0;
+    place-items: center;
+    border-top: solid 1px var(--border-color);
+}
+
+.howto .imgstep img {
+    border: solid 1px var(--border-color);
+    border-radius: 0.5rem;
+}
+
+.howto .imgstep {
+    border-top: solid 1px var(--border-color);
+    flex-direction: row;
+    align-items: center;
+    display: flex;
+    justify-content: center;
+    background-repeat: no-repeat;
+    background-size: contain;
+    background-position: center;
+    min-height: 15rem;
+    border-right: solid 1px var(--border-color);
+    padding: 1rem;
+}
+
+.howto .description {
+    padding: 0.5rem 1.5rem;
+    border-top: solid 1px var(--border-color);
+    text-align: left;
+}
+
+.howto .instructions li .instruction {
+    /* border: solid; */
+    text-align: left;
+    padding-right: 1rem;
+}
+
+.howto h3 {
+    font-size: 1.25rem;
+    place-self: center;
+    text-align: left;
+}
+
+.howto ol li .index {
+    font-size: 3rem;
+    color: var(--text-lo);
+    line-height: 4rem;
+}
+
+.howto ol li {
+    position: relative;
+}
+
+.howto h5 {
+    background: var(--window-background-lo);
+    padding: 0.5rem;
+    margin: 0.5rem;
+    border-radius: 100rem;
+}
+
+.fabf:before {
+    font-family: "Font Awesome 5 Free";
+    padding: 0 0.5rem;
+}
+
+.howto li.flexcol.titrow {
+    margin-bottom: 0.5rem;
+    padding-bottom: 1rem;
+    padding-top: 1rem;
+}
+

package/src.website/src/core.extra/extra.document.mjs

@@ -0,0 +1,83 @@
+const
+	window_setTimeout = window.setTimeout,
+	items = [];
+
+let
+	active = -1,
+	activeElement = null,
+	timer = undefined,
+	selector;
+
+function addCoordIndex(arr) {
+	for (const item of arr) if (item.hasAttribute("id")) items.push(item);
+}
+
+function runHash(hash) {
+	if (hash === activeElement) return;
+	const item = document.getElementById(hash);
+	if (item) {
+		item.scrollIntoView({ behavior: "smooth" });
+	}
+}
+
+function setActive(index) {
+
+	active = Math.max(0, index);
+
+	if (activeElement) {
+		document.getElementById("link-" + activeElement)
+			?.classList
+			.remove("accent");
+	}
+
+	activeElement = items[index]?.id;
+	selector.selectedIndex = index;
+
+	if (activeElement) {
+		document.getElementById("link-" + activeElement)
+			?.classList
+			.toggle("accent", true);
+		window.history.replaceState({}, "", "#" + activeElement);
+	}
+}
+
+function findElement(first) {
+	for (let i = 0, l = items.length; i < l; i++) {
+		if (items[i].offsetTop > first + 32) {
+			setActive(i - 1);
+			return;
+		}
+	}
+	setActive(items.length - 1);
+}
+
+function scrollListener(e) {
+	clearTimeout(timer);
+	timer = window_setTimeout(findElement, 100, e.target.scrollTop);
+}
+
+function initIndex() {
+
+	addCoordIndex(document.getElementsByTagName("h1"));
+	addCoordIndex(document.getElementsByTagName("h2"));
+	addCoordIndex(document.getElementsByTagName("h3"));
+
+	selector = document.getElementById("selector");
+	selector.addEventListener(
+		"change",
+		function ({ target }) { runHash(target.value);}
+	);
+
+	if (items.length) {
+		items.sort((a, b) => (a.offsetTop - b.offsetTop));
+	}
+
+	document.getElementsByClassName("content")[0]
+		.addEventListener("scroll", scrollListener, { passive: true });
+
+	const { hash } = window.location;
+	if (hash.length > 1) {
+		window_setTimeout(() => runHash(hash.substring(1)), 250);
+	}
+}
+export default initIndex;

package/src.website/src/core.extra/extra.faq.mjs

@@ -0,0 +1,30 @@
+function initContractable(name) {
+	function FaqSelect(target) {
+		target = target || 0;
+		const questions = document.getElementsByClassName("contractable");
+		let current = 0;
+		for (const question of questions) {
+			question.classList.toggle("contracted", target !== current);
+			question.classList.toggle("expanded", target === current);
+			if (target === current) question.scrollIntoView({ behavior: "smooth" });
+			current++;
+		}
+	}
+
+	const initial = window.location.hash.split(`#${name}-`)[1];
+	const questions = document.getElementsByClassName("contractable");
+
+	for (const question of questions) {
+		question.addEventListener("click", (e) => {
+			const idx = e.target.getAttribute("data-index");
+			if (idx) {
+				FaqSelect(Number.parseInt(idx, 10) - 1);
+				window.history.replaceState({}, "", `#${name}-${idx}`);
+			}
+		});
+	}
+
+	if (initial) FaqSelect(Number.parseInt(initial, 10) - 1);
+}
+
+export default initContractable;

package/src.website/src/core.extra/extra.mjs

@@ -0,0 +1,62 @@
+import TimeUtils from "../support/timeutils"
+import QRCode from "../support/qrcode"
+
+import "./css/howto.css";
+import "./css/faq.css";
+import "./css/contractable.css";
+
+const window_location = window.location;
+
+function updateQr() {
+
+	const
+		qr = document.getElementById("qr");
+
+	if (qr) {
+		const
+			color = "#fff",
+			colorDark = "#fff",
+			url = ("" + window_location.href).split("#")[0];
+
+		qr.appendChild(QRCode.getSvg(url, {colorDark, colorAlt: color}));
+
+	}
+
+}
+
+function updateTimes() {
+	const times = document.getElementsByClassName("diffdate");
+	for (const timelm of times) {
+		const timems = parseInt(timelm.getAttribute("data-timems"), 10);
+		if (timems) {
+			timelm.setAttribute("data-computedtime", "(" + TimeUtils.getTimeInterval(timems) + ")");
+		}
+	}
+}
+
+function updateImages() {
+	const images = document.getElementsByClassName("errorimage");
+	for (const imgelm of images) {
+		imgelm.onerror = (e) => {
+			e.target.parentNode.classList.add("error-loading-image");
+		};
+	}
+}
+
+function Common() {
+	updateQr();
+	updateTimes();
+	updateImages();
+}
+
+const
+	initDoc = require("support/statify-v3/src.website/src/core.extra/extra.document.mjs"),
+	initContractable = require("support/statify-v3/src.website/src/core.extra/extra.faq.mjs"),
+	Inits = {
+		Markdown: initDoc,
+		Faq: () => initContractable("question"),
+		HowTo: () => initContractable("step"),
+		Common
+	};
+
+export default Inits;

package/src.website/src/main.simple.mjs

@@ -0,0 +1,4 @@
+import bootStrap from "./app";
+
+bootStrap();
+

package/src.website/src/main.software.mjs

@@ -0,0 +1,10 @@
+import bootStrap from "./app";
+
+///////////////////////////////////////////////////
+import MarketWidgets from "../src.widgets/widgets.market/index.mjs"
+import SoftwareWidgets from "../src.widgets/widgets.software/index.mjs"
+import WorldWidgets from "../src.widgets/widgets.worlds/index.mjs";
+///////////////////////////////////////////////////
+
+bootStrap(MarketWidgets, SoftwareWidgets, WorldWidgets);
+

package/src.website/src/main.worlds.mjs

@@ -0,0 +1,9 @@
+import bootStrap from "./app";
+
+///////////////////////////////////////////////////
+import MarketWidgets from "../src.widgets/widgets.market/index.mjs"
+import SoftwareWidgets from "../src.widgets/widgets.software/index.mjs"
+///////////////////////////////////////////////////
+
+bootStrap(MarketWidgets, SoftwareWidgets);
+

package/src.website/src/support/ismobile.mjs

@@ -0,0 +1,4 @@
+const 	isMobile = (navigator.userAgent.indexOf("Android") > 0 || navigator.userAgent.indexOf("iPhone") > 0 || navigator.userAgent.indexOf("iPad") > 0);
+
+export default isMobile;
+

package/src.website/src/support/nonce.mjs

@@ -0,0 +1,4 @@
+function nonce(hours = 1) {
+	return Math.floor(Date.now() / (1000 * 3600 * hours));
+}
+export default nonce;

package/src.website/src/support/persistsettings.mjs

@@ -0,0 +1,41 @@
+const
+	{localStorage} = window,
+
+	SETTINGS = {},
+	OS_SETTINGS = "obst.skin";
+
+function refresh() {
+	document.documentElement.classList.toggle("dark", !SETTINGS.skin);
+}
+
+function load() {
+	try {
+		const str = localStorage[OS_SETTINGS];
+		if (str) {
+			const data = JSON.parse(str);
+			Object.assign(SETTINGS, data);
+		}
+	} catch (e) {}
+	refresh();
+}
+
+
+function set(key, value) {
+
+	if (SETTINGS[key] !== value) {
+		SETTINGS[key] = value;
+		try {
+			localStorage[OS_SETTINGS] = JSON.stringify(SETTINGS);
+		} catch (e) {}
+		refresh();
+	}
+}
+
+function get(key, def) {
+	const data = SETTINGS[key];
+	return data === undefined ? def : data;
+}
+
+load();
+
+export {get, set};