jekyll-ham 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 2035183c2d81e23112bbabb5936425cad0a9b5dcc08dc82c2f22840f6af05881
+  data.tar.gz: bed0c2ac6c4a3b8372e4b804b64757bb8678b534f698e59c5153007c2fa1269c
+SHA512:
+  metadata.gz: c35f90a52794c653e06d3f0bad9b03449765d8696cfbd4f64f5c1cd66030f0acffe14804c7aabdaf387c1c504ae65dfbd468c97c198e490557d5bfa4fff4e666
+  data.tar.gz: 4125c51568a0fbc99500ca57862b27d532d3581dcfdab3059c3d64d868db3b670d5ade5b973420c35eb3c229fff1f64ea175a0730af9f9fd020f11c8deb1a05b

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2021 Reinhart Previano Koentjoro
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/README.md

@@ -0,0 +1,57 @@
+---
+layout: page
+title: Main Page
+further_reading:
+  - title: Official Documentation
+    url: https://reinhart1010.github.io/ham-docs/
+    target: _blank
+external_links:
+  - title: GitHub Repository
+    url: https://github.com/reinhart1010/ham/
+    icon: bi bi-github
+    target: _blank
+  - title: Issues List
+    url: https://github.com/reinhart1010/ham/issues/
+    icon: bi bi-bug
+    target: _blank
+  - title: Discussions
+    url: https://github.com/reinhart1010/ham/discussions/
+    icon: bi bi-chat-dots
+    target: _blank
+---
+
+# HAM 🥩
+HAM is a Jekyll-based boilerplate template for generating better, static wiki-style websites. HAM can be instantly used to build static wiki pages. But the best of all, the default theme of HAM can be easily customized to create more personalized wiki pages, unlike those from MediaWiki, for example.
+
+This project is built to replace the current, MediaWiki installation at hackapedia.reinhart1010.id after I found out difficult to create custom styles for it, while other, Git-based alternatives such as GitHub Wiki sucks (no, really) and may not support self-hosting on shared hosting providers.
+
+## What does HAM stand for?
+HAM is short for:
+
++ Hackapedia's Abstraction Machine
++ HAM Ain't MediaWiki
++ [Halfmoon] and Markdown
++ && i++ (can we get more pull requests to add more stuff into this list?)
+
+## Features
+### What HAM is
+- [x] A static-site wiki generator
+- [x] A better alternative than GitHub pages
+- [x] Highly customizable through [Halfmoon] and [Jekyll]
+- [x] Uses GitHub-Flavored Markdown (GFM)
+- [x] Optimized for GitHub Pages and Gitlab Pages
+
+### What HAM isn't
+- [ ] Optimized for large wiki content (this is where advanced alternatives such as [MediaWiki] excels at)
+- [ ] Built-in support for hosting content written in MediaWiki markup syntax (however there are converters to Markdown)
+- [ ] Supported in legacy web browsers (see [Compatibility](#browser-compatibility))
+
+### What HAM would be
+- [ ] Supporting Forem (DEV.to) liquid tags (YouTube embeds, Twitter posts, etc.)
+
+## Browser Compatibility
+HAM heavily uses [Halfmoon] CSS framework on the generated page due to its theming flexibility based on CSS variables. However, that comes with a cost: **CSS variables are not supported in old browsers**. If you're thinking of Internet Explorer 11, well, don't think too far, because this exact feature may not be supported on some smart TV models, too! There are plans to either include a JavaScript-based polyfill or fallback CSS for this, but I might want to do that later.
+
+[Halfmoon]: https://gethalfmoon.com
+[Jekyll]: https://jekyllrb.com
+[MediaWiki]: https://mediawiki.org

data/_config.yml

@@ -0,0 +1,20 @@
+ham:
+  site_name: HAM
+  site_tagline: The truly static, Git-based wiki project
+  site_icon: https://raw.githubusercontent.com/googlefonts/noto-emoji/main/svg/emoji_u1f969.svg
+  contributing:
+    discuss:
+      type: url
+      url: https://github.com/reinhart1010/HAM/discussions/
+    view_source_base_url: https://github.com/reinhart1010/HAM/blob/main/
+    issue_url: https://github.com/reinhart1010/HAM/issues/
+kramdown:
+  input: GFM
+plugins:
+  - jekyll-readme-index
+  - jekyll-seo-tag
+  - jekyll-sitemap
+  - jekyll-titles-from-headings
+theme: jekyll-ham
+readme_index:
+  with_frontmatter: true

data/_includes/external-link.html

@@ -0,0 +1,7 @@
+<a href="{{ link.url }}" class="sidebar-link sidebar-link-with-icon" target="{{ link.target }}">
+  <span class="sidebar-icon">
+    <i class="{{ link.icon | default: 'bi bi-file-text' }}" aria-hidden="true"></i>
+  </span>
+  {{ link.title }}
+  {% if link.target == '_blank' %}<i class="bi bi-arrow-up-right-circle ml-5" aria-hidden="true"></i>{% endif %}
+</a>

data/_includes/navbar.html

@@ -0,0 +1,26 @@
+<nav class="navbar">
+  <div class="navbar-content">
+    <button class="btn btn-action" type="button" onclick="halfmoon.toggleSidebar()">
+      <i class="bi bi-list" aria-hidden="true"></i>
+      <span class="sr-only">Toggle sidebar</span>
+    </button>
+  </div>
+  <a href="/" class="navbar-brand">
+    {% if site.ham.site_icon != null %}
+      <img src="{{ site.ham.site_icon }}" alt="{{ site.ham.site_name }}">
+    {% endif %}{{ site.ham.site_name }}
+  </a>
+  {% if site.ham.site_tagline != null %}
+    <span class="navbar-text d-none d-sm-block">{{ site.ham.site_tagline }}</span> <!-- text-monospace = font-family shifted to monospace -->
+  {% endif %}
+  <div class="ml-auto">
+    <button onClick="halfmoon.toggleDarkMode()" class="btn btn-action bg-dark-lm bg-white-dm text-white-lm text-dark-dm">
+      <i class="bi bi-moon-stars" aria-hidden="true"></i>
+      <span class="sr-only">Toggle Dark Mode</span>
+    </button>
+    <a href="#search" class="btn btn-action btn-primary">
+      <i class="bi bi-search" aria-hidden="true"></i>
+      <span class="sr-only">Search</span>
+    </a>
+  </div>
+</nav>

data/_includes/search-modal.html

@@ -0,0 +1,12 @@
+<div id="search" class="modal" tabindex="-1" role="dialog">
+  <div class="modal-dialog" role="document">
+    <div class="modal-content">
+      <a href="#" class="close" role="button" aria-label="Close">
+        <span aria-hidden="true">&times;</span>
+      </a>
+      <input id="search-input" type="text" class="form-control" placeholder="Keyword">
+      <ul id="results-container" class="my-10"></ul>
+      <span>Tip: Use <kbd>Ctrl+K</kbd> to search</span>
+    </div>
+  </div>
+</div>

data/_includes/sidebar.html

@@ -0,0 +1,36 @@
+<div class="sidebar">
+  <div class="sidebar-menu">
+    <h5 id="on-this-page" class="sidebar-title">On This Page</h5>
+    <div class="sidebar-divider"></div>
+    <div id="_ham_on_this_page_ul"></div>
+    <br>
+    {% if site.ham.contributing != null %}
+      <h5 id="contribute" class="sidebar-title">Contribute to This Page</h5>
+      <div class="sidebar-divider"></div>
+      {% if site.ham.contributing.discuss.type != null %}
+        <a href="{% if site.ham.contributing.discuss.type == 'url' %}{{ site.ham.contributing.discuss.url }}{% else %}#discuss{% endif %}" class="sidebar-link sidebar-link-with-icon">
+          <span class="sidebar-icon">
+            <i class="bi bi-chat-dots" aria-hidden="true"></i>
+          </span>
+          Discuss
+        </a>
+      {% endif %}
+      {% if site.ham.contributing.issue_url != null %}
+        <a href="{{ site.ham.contributing.issue_url }}" class="sidebar-link sidebar-link-with-icon">
+          <span class="sidebar-icon">
+            <i class="bi bi-bug" aria-hidden="true"></i>
+          </span>
+          Report New Issue
+        </a>
+      {% endif %}
+      {% if site.ham.contributing.view_source_base_url != null %}
+        <a href="{{ site.ham.contributing.view_source_base_url }}{{ page.path }}" class="sidebar-link sidebar-link-with-icon">
+          <span class="sidebar-icon">
+            <i class="bi bi-code-slash" aria-hidden="true"></i>
+          </span>
+          View Source
+        </a>
+      {% endif %}
+    {% endif %}
+  </div>
+</div>

data/_layouts/default.html

@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <!-- Meta tags -->
+  <meta charset="utf-8" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
+  <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
+  <meta name="viewport" content="width=device-width" />
+
+  <!-- Favicon and title -->
+  <link rel="icon" href="{{ site.ham.site_favicon | default: site.ham.site_icon }}">
+  <title>{{ page.title }} - {{ site.ham.site_title }}</title>
+
+  <!-- Halfmoon CSS -->
+  <link href="https://cdn.jsdelivr.net/npm/halfmoon@1.1.1/css/halfmoon-variables.min.css" rel="stylesheet" />
+
+  <!-- Bootstrap Icons CSS -->
+  <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.1/font/bootstrap-icons.css" rel="stylesheet" />
+  
+  <!-- Additional CSS -->
+  <link href="/assets/default.css" rel="stylesheet" />
+  <link href="/assets/main.css" rel="stylesheet" />
+
+</head>
+<body class="with-custom-webkit-scrollbars with-custom-css-scrollbars" data-dm-shortcut-enabled="true" data-sidebar-shortcut-enabled="true" data-set-preferred-mode-onload="true">
+  {% include search-modal.html %}
+  <div class="page-wrapper with-navbar with-sidebar">
+    <div class="sticky-alerts"></div>
+    {% include navbar.html %}
+    {% include sidebar.html %}
+    <div class="content-wrapper">
+      <div class="container-fluid">
+        {{ content }}
+      </div>
+    </div>
+    {% include footer.html %}
+  </div>
+
+  <!-- Simple Jekyll Search JS -->
+  <script src="https://unpkg.com/simple-jekyll-search@latest/dest/simple-jekyll-search.min.js"></script>
+  <script>
+    var sjs = SimpleJekyllSearch({
+      searchInput: document.getElementById('search-input'),
+      resultsContainer: document.getElementById('results-container'),
+      json: '/search.json'
+    })
+  </script>
+  <!-- Halfmoon JS -->
+  <script src="https://cdn.jsdelivr.net/npm/halfmoon@1.1.1/js/halfmoon.min.js"></script>
+</body>
+</html>

data/_layouts/page.html

@@ -0,0 +1,41 @@
+---
+layout: default
+---
+<div class="row">
+  <div class="col-xl-8 p-20 collapse-group article-wrapper" id="_ham_content">
+    {{ content }}
+  </div>
+  <div class="col-xl-4 pt-xl-20 pb-20">
+    {% if page.related_topics != null %}
+      <h5 id="related-topics" class="sidebar-title">Related Topics</h5>
+      <div class="sidebar-divider"></div>
+      {% for link in page.related_topics %}
+        {% include external-link.html %}
+      {% endfor %}
+    {% endif %}
+    {% if page.further_reading != null %}
+      <h5 id="further-reading" class="sidebar-title">Further Reading</h5>
+      <div class="sidebar-divider"></div>
+      {% for link in page.further_reading %}
+        {% include external-link.html %}
+      {% endfor %}
+    {% endif %}
+    {% if page.external_links != null %}
+      <h5 id="external-links" class="sidebar-title">External Links</h5>
+      <div class="sidebar-divider"></div>
+      {% for link in page.external_links %}
+        {% include external-link.html %}
+      {% endfor %}
+    {% endif %}
+  </div>
+</div>
+
+<script src="https://unpkg.com/to-uri@1.0.4/lib/toURI.js"></script>
+<script src="/assets/entry-parser.js"></script>
+<script>
+  var siteName = '{{ site.ham.site_name }}';
+  var siteTagline = '{{ site.ham.site_tagline }}';
+  var disableTagline = '{{ page.ham.disable_tagline }}';
+  if (disableTagline.length > 0 && disableTagline == true) siteName = null;
+  parseRawEntry(document.getElementById('_ham_content'), document.getElementById('_ham_on_this_page_ul'), siteName, siteTagline);
+</script>

data/_layouts/post.html

@@ -0,0 +1,5 @@
+---
+layout: page
+---
+
+{{ content }}

data/assets/default.css

@@ -0,0 +1,36 @@
+:root {
+  --font-family-serif: 'Linux Libertine', 'Linux Libertine Display O', Georgia, 'Noto Serif', 'Times New Roman', Times, serif;
+  --heading-font-weight: 700;
+}
+
+/* Use serif font for headings (a-la MediaWiki) */
+.article-wrapper h1, .article-wrapper h2, .content-wrapper .h1, .content-wrapper .h2 {
+  font-family: var(--font-family-serif);
+  font-weight: 400;
+}
+.article-sitesub {
+  font-family: var(--font-family-serif);
+  font-style: italic;
+}
+
+/* Lowers the font size for H3, H4, H5, H6 */
+.article-wrapper h3, .content-wrapper .h3 {
+  font-size: 1.75rem;
+}
+.article-wrapper h4, .content-wrapper .h4 {
+  font-size: 1.5rem;
+}
+.article-wrapper h5, .content-wrapper .h5 {
+  font-size: 1.25rem;
+}
+.article-wrapper h6, .content-wrapper .h6 {
+  font-size: 1rem;
+}
+
+/* Removes list styling for .task-list */
+.task-list {
+  list-style-type: none;
+}
+.task-list-item-checkbox {
+  margin-right: 0.5rem;
+}

data/assets/entry-parser.js

@@ -0,0 +1,118 @@
+/**
+ * Automatically generate ID names based on the heading name
+ * @param {String} name The heading name
+ */
+function createSectionHeadingId(name){
+  var i = 0;
+  var finalName = '';
+  do {
+    finalName = toURI(name);
+    if (i > 0) finalName += '-' + i;
+    i++;
+  } while (document.getElementById(finalName));
+  return finalName;
+}
+
+/**
+ * Scans the first-level attributes of HTML to be included on "On This Page" list
+ * @param {Node} originalContent The HTML element containing the original rendered article
+ * @param {String} tagline The site tagline
+ * @param {Node} onThisPageEntry The HTML element pointing the "On This Page" entry
+ */
+function parseRawEntry(originalContent, onThisPageEntry, siteTitle, siteTagline){
+  var headingTags = ['H2', 'H3', 'H4', 'H5', 'H6'];
+  var i, j;
+  var taglinePlaced = false;
+  var children = originalContent.childNodes;
+  var currentAccordionId = '';
+  for (i = 0; i < children.length; i++){
+    var node = children[i];
+    if (node.nodeName == 'H1' && !taglinePlaced && typeof siteTitle === 'string' && siteTitle.length > 0){
+      var newTagline = document.createElement('span');
+      newTagline.textContent = 'from ' + siteTitle;
+      newTagline.className = 'font-size-18 article-sitesub';
+      if (typeof siteTagline === 'string' && siteTagline.length > 0){
+        newTagline.textContent += ', ' + siteTagline;
+      }
+      originalContent.insertBefore(newTagline, children[i + 1]);
+      taglinePlaced = true;
+    }
+    if (headingTags.indexOf(node.nodeName) >= 0){
+      var currentHeadingLevel = node.nodeName.substring(1,2);
+      isInsideAccordion = true;
+      if (!node.id) node.id = createSectionHeadingId(node.textContent);
+      
+      if (node.nodeName === 'H2'){
+        currentAccordionId = node.id;
+      }
+
+      // Create "On This Page entry"
+      var newA = document.createElement('a');
+      newA.href = '#' + node.id;
+      newA.className = 'sidebar-link text-truncate';
+      newA.setAttribute('onclick', 'expandAccordion(\'' + currentAccordionId + '\')');
+      for (j = 2; j < currentHeadingLevel; j++){
+        var newSpan = document.createElement('span');
+        newSpan.className = 'ml-10 d-inline-block';
+        newSpan.setAttribute('aria-hidden', true);
+        newA.appendChild(newSpan);
+      }
+      newA.appendChild(document.createTextNode(node.textContent));
+      onThisPageEntry.appendChild(newA);
+    }
+  }
+  for (i = 0; i < children.length; i++){
+    var node = children[i];
+    if (node.nodeName === 'H2'){
+      var start = i; end = i;
+      var collapseChildren = [];
+      while (end + 1 < children.length && children[end + 1].nodeName !== 'H2') end++;
+      
+      // Mark children
+      if (start === end) continue;
+      for (j = start + 1; j <= end; end--){
+        collapseChildren.push(children[j].cloneNode(true));
+        // Mark for deletion
+        children[j].remove();
+      }
+      
+      // Create actual collapse
+      var newDetails = document.createElement('details');
+      newDetails.className = 'collapse-panel w-full _ham_accordion_autoexpand';
+      var newSummary = document.createElement('summary');
+      newSummary.className = 'collapse-header font-size-20 h2';
+      newSummary.innerHTML = node.innerHTML;
+      var newDiv = document.createElement('div');
+      newDiv.className = 'collapse-content';
+      for (j = 0; j < collapseChildren.length; j++) newDiv.appendChild(collapseChildren[j]);
+      newDetails.appendChild(newSummary);
+      newDetails.appendChild(newDiv);
+
+      newDetails.id = children[i].id;
+      children[i].outerHTML = newDetails.outerHTML;
+    }
+  }
+}
+
+var _ham_state_is_all_accordion_collapsed = true;
+
+function autoexpandAccordion(){
+  if (window.innerWidth > 768 && _ham_state_is_all_accordion_collapsed === true){
+    document.querySelectorAll('._ham_accordion_autoexpand').forEach(function (el){
+      el.setAttribute('open', 'true');
+    });
+    _ham_state_is_all_accordion_collapsed = false;
+  } else if (_ham_state_is_all_accordion_collapsed === false){
+    document.querySelectorAll('._ham_accordion_autoexpand').forEach(function (el){
+      el.removeAttribute('open');
+    });
+    _ham_state_is_all_accordion_collapsed = true;
+  }
+}
+
+function expandAccordion(id){
+  var el = document.getElementById(id);
+  el.setAttribute('open', 'true');
+}
+
+window.addEventListener("load", autoexpandAccordion);

data/assets/main.css

@@ -0,0 +1 @@
+/* TODO: Add your CSS here (Jekyll will override it) */

metadata

@@ -0,0 +1,71 @@
+--- !ruby/object:Gem::Specification
+name: jekyll-ham
+version: !ruby/object:Gem::Version
+  version: 0.1.0
+platform: ruby
+authors:
+- Reinhart Previano Koentjoro
+autorequire:
+bindir: bin
+cert_chain: []
+date: 2021-11-22 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: jekyll
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '4.2'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '4.2'
+description:
+email:
+- reinhart@reinhart1010.id
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- LICENSE.txt
+- README.md
+- _config.yml
+- _includes/external-link.html
+- _includes/footer.html
+- _includes/navbar.html
+- _includes/search-modal.html
+- _includes/sidebar.html
+- _layouts/default.html
+- _layouts/page.html
+- _layouts/post.html
+- assets/default.css
+- assets/entry-parser.js
+- assets/main.css
+homepage: https://github.com/reinhart1010/ham
+licenses:
+- MIT
+metadata: {}
+post_install_message:
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubygems_version: 3.2.22
+signing_key:
+specification_version: 4
+summary: Hackapedia's Abstraction Machine.
+test_files: []