aboutsummaryrefslogtreecommitdiff
path: root/content/sparse_layout_generator
diff options
context:
space:
mode:
authorjahoti <jahoti@tilde.team>2021-08-15 00:00:00 +0000
committerjahoti <jahoti@tilde.team>2021-08-15 00:00:00 +0000
commitd104aaf3ebcddfbda495bdfe3ba3a905f75b936f (patch)
treef617204baeb4919cd1bad2cf3e302acf3ef7116f /content/sparse_layout_generator
parent428c474c4c71ef4c7961070d4246017d15aa0c0c (diff)
downloadhaketilo-fixes-demo-d104aaf3ebcddfbda495bdfe3ba3a905f75b936f.tar.gz
haketilo-fixes-demo-d104aaf3ebcddfbda495bdfe3ba3a905f75b936f.zip
Port existing fixes from hachette_fixes_tmp to Hydrilla format
Diffstat (limited to 'content/sparse_layout_generator')
-rw-r--r--content/sparse_layout_generator/index.json6
-rw-r--r--content/sparse_layout_generator/sparse_layout_generator.js132
2 files changed, 138 insertions, 0 deletions
diff --git a/content/sparse_layout_generator/index.json b/content/sparse_layout_generator/index.json
new file mode 100644
index 0000000..167f06c
--- /dev/null
+++ b/content/sparse_layout_generator/index.json
@@ -0,0 +1,6 @@
+{
+"type" : "script",
+"name" : "SParse layout generator",
+"sha256" : "f7bd9d6446254275f158c0ea6ec53160d4c52542741adbc0b3f34b48521aff65",
+"location" : "sparse_layout_generator.js"
+} \ No newline at end of file
diff --git a/content/sparse_layout_generator/sparse_layout_generator.js b/content/sparse_layout_generator/sparse_layout_generator.js
new file mode 100644
index 0000000..bf82fdd
--- /dev/null
+++ b/content/sparse_layout_generator/sparse_layout_generator.js
@@ -0,0 +1,132 @@
+/*
+ Generate simple yet clean single-page site(oids)
+
+ Copyright © 2021 jahoti (jahoti@tilde.team)
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+*/
+
+function Sparse(navItems, opts) {
+ opts = opts || {};
+ var width = opts.width || 20,
+ text = opts.text || 'black',
+ bg = opts.bgcolor || opts.background || 'yellow',
+ pagebg = opts.tabcolor || 'white';
+ gap = opts.gap || '10px';
+
+ var body = document.createElement('body'),
+ nav = document.createElement('nav'),
+ style = document.createElement('style');
+
+ var link, activeLink, title;
+
+ style.innerText = `
+ body {
+ display: grid;
+ grid-column-gap: ${gap};
+ column-gap: ${gap};
+ grid-template-columns: ${width}%;
+ }
+
+ nav {
+ grid-column: 1;
+ position: sticky;
+ top: 0;
+ }
+
+ nav > a:not([href]) {
+ color: ${text};
+ font-weight: bold;
+ }
+
+ body, nav { background-color: ${bg}; }
+ body > * { grid-row: 1; }
+ body > *:not(nav) { background-color: ${pagebg} }
+ `
+
+ body.append(style);
+ body.append(nav);
+
+ function onLinkClick(e) {
+ var link, section, title;
+ if (activeLink) {
+ link = activeLink.inactive
+ nav.replaceChild(link, activeLink);
+ for (pane of link.panes) body.removeChild(pane.parentNode);
+
+ delete activeLink.inactive;
+ }
+
+ link = e.target;
+ activeLink = document.createElement('span');
+ activeLink.innerText = link.textContent;
+ activeLink.inactive = link;
+ nav.replaceChild(activeLink, link);
+
+ link.panes.forEach((pane, i) => {
+ section = document.createElement('article');
+ title = document.createElement('h1');
+
+ title.innerText = pane.docTitle;
+ section.style.gridColumn = (i + 2).toString();
+
+ if (pane.docTitleLink) {
+ let titleLink = document.createElement('a');
+
+ titleLink.href = pane.docTitleLink;
+ titleLink.append(title);
+ title = titleLink;
+ }
+
+ section.append(title);
+ section.append(pane);
+ body.append(section);
+ });
+ }
+
+ document.title = navItems[0];
+
+ for (var item of navItems) {
+ link = document.createElement('a');
+ if (typeof item === 'string') link.innerText = item;
+ else {
+ link.innerText = item.shift();
+ if (link.textContent.startsWith('* ')) {
+ link.innerText = link.textContent.substr(2);
+ link.style.fontSize = '80%';
+ }
+
+ if (typeof item[0] === 'string' && item.length === 1) link.href = item[0];
+ else {
+ link.onclick = onLinkClick;
+ link.href = '#';
+ if (item.length === 2 && typeof item[1] === 'string') {
+ // Add a title link (if applicable)
+ item[0].docTitleLink = item.pop();
+ }
+
+ link.panes = item;
+
+ // Add the title info
+ if (item.length === 1) item[0].docTitle = link.textContent;
+ }
+ }
+
+ nav.append(link);
+ nav.append(document.createElement('br'));
+ }
+
+ activeLink = null;
+ document.body.parentNode.replaceChild(body, document.body);
+ nav.querySelector('a[href]').click();
+} \ No newline at end of file