diff options
Diffstat (limited to 'content/sparse_layout_generator/sparse_layout_generator.js')
| -rw-r--r-- | content/sparse_layout_generator/sparse_layout_generator.js | 132 |
1 files changed, 0 insertions, 132 deletions
diff --git a/content/sparse_layout_generator/sparse_layout_generator.js b/content/sparse_layout_generator/sparse_layout_generator.js deleted file mode 100644 index bf82fdd..0000000 --- a/content/sparse_layout_generator/sparse_layout_generator.js +++ /dev/null @@ -1,132 +0,0 @@ -/* - 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 |