jekyll-theme-centos 2.52.0.beta.4 → 2.52.0.beta.5

data/assets/js/base/copyvalue.js

@@ -0,0 +1,251 @@
+// Copy Value Component
+// Provides copy-to-clipboard functionality with visual feedback
+// Safely handles escaped and unescaped values, HTML entities, and special characters
+// ARMORED IMPLEMENTATION: Handles any value passed via data-copy-value attribute
+
+class CopyButtonHandler {
+  constructor(button, config = {}) {
+    this.button = button;
+    this.originalTitle = this.button.getAttribute('data-bs-title') || this.button.getAttribute('aria-label') || this.button.getAttribute('title');
+    this.originalSvgHTML = this.button.innerHTML;
+    this.resetDelay = config.resetDelay || 2000;
+    this.checkmarkPath = config.checkmarkPath || 'M434.8 70.1c14.3 10.4 17.5 30.4 7.1 44.7l-256 352c-5.5 7.6-14 12.3-23.4 13.1s-18.5-2.7-25.1-9.3l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l101.5 101.5 234-321.7c10.4-14.3 30.4-17.5 44.7-7.1z';
+    this.checkmarkViewbox = config.checkmarkViewbox || '0 0 448 512';
+    this.successMessage = config.successMessage || 'Copied!';
+
+    this.button.addEventListener('click', (e) => this.handleClick(e));
+  }
+
+  handleClick(e) {
+    e.preventDefault();
+
+    // ARMOR: Retrieve the attribute value (may be escaped or unescaped)
+    let rawValue = this.button.getAttribute('data-copy-value');
+
+    // ARMOR: If attribute appears truncated or incomplete, try HTML extraction fallback
+    const appearsTruncated = !rawValue ||
+      rawValue.endsWith('=') ||
+      rawValue.match(/^[a-zA-Z-]+$/) ||
+      (rawValue.length < 5 && rawValue.includes(' '));
+
+    if (appearsTruncated) {
+      const extractedValue = this.extractDataCopyValueFromHTML();
+      if (extractedValue && extractedValue.length > (rawValue?.length || 0)) {
+        rawValue = extractedValue;
+      }
+    }
+
+    // Defensive check: ensure we have a value to copy
+    if (!rawValue) {
+      console.warn('No copy value found in data-copy-value attribute', this.button);
+      return;
+    }
+
+    // ARMOR: Auto-detect and handle both escaped and unescaped values
+    const finalValue = this.normalizeAttributeValue(rawValue);
+
+    const svg = this.button.querySelector('svg');
+
+    if (!svg) {
+      console.error('Icon SVG not found in button', this.button);
+      return;
+    }
+
+    // ARMOR: Use trim() to remove accidental whitespace
+    navigator.clipboard.writeText(finalValue.trim())
+      .then(() => this.showSuccess(svg))
+      .catch((err) => {
+        console.error('Failed to copy value:', finalValue, 'Error:', err);
+      });
+  }
+
+  extractDataCopyValueFromHTML() {
+    // ARMOR: Extract data-copy-value from raw HTML string
+    try {
+      const outerHTML = this.button.outerHTML;
+
+      const patterns = [
+        /data-copy-value="([^"]*)"/,
+        /data-copy-value='([^']*)'/,
+        /data-copy-value="((?:[^"\\]|\\.*)*)"/,
+        /data-copy-value="([^"]*(?:&quot;[^"]*)*?)"/,
+        /data-copy-value=["']?([^"\s>]+?)["'\s>]/,
+        /data-copy-value="([^"]*(?:[^"]*?)?)"/,
+      ];
+
+      for (const pattern of patterns) {
+        const match = outerHTML.match(pattern);
+        if (match && match[1] && match[1].length > 0) {
+          if (!match[1].startsWith('data-') && !match[1].startsWith('class') && !match[1].startsWith('id')) {
+            return match[1];
+          }
+        }
+      }
+
+      const attrIndex = outerHTML.indexOf('data-copy-value');
+      if (attrIndex !== -1) {
+        const afterAttr = outerHTML.substring(attrIndex + 15).trim();
+
+        if (afterAttr.startsWith('=')) {
+          const afterEquals = afterAttr.substring(1).trim();
+          const quoteChar = afterEquals[0];
+
+          if (quoteChar === '"' || quoteChar === "'") {
+            let endIndex = 1;
+            let escaped = false;
+
+            for (; endIndex < afterEquals.length; endIndex++) {
+              const char = afterEquals[endIndex];
+
+              if (escaped) {
+                escaped = false;
+                continue;
+              }
+
+              if (char === '\\') {
+                escaped = true;
+                continue;
+              }
+
+              if (char === quoteChar) {
+                return afterEquals.substring(1, endIndex);
+              }
+            }
+          }
+        }
+      }
+
+      return null;
+    } catch (err) {
+      console.warn('Failed to extract data-copy-value from HTML:', err);
+      return null;
+    }
+  }
+
+  normalizeAttributeValue(text) {
+    // ARMOR: Smart normalization for escaped and unescaped values
+    if (!text) {
+      return text;
+    }
+
+    const hasHTMLEntities = /&(?:quot|apos|amp|lt|gt|#34|#39|#47|#60|#62|#x22|#x27|#x2[Ff]|#x3[Cc]|#x3[Ee]);/.test(text);
+
+    if (hasHTMLEntities) {
+      return this.decodeHTMLEntities(text);
+    }
+
+    const hasUnescapedQuotes = /"(?![>\s])|'(?![>\s])/.test(text.trim());
+    const hasUnescapedSpecialChars = /[<>]/.test(text);
+
+    if (hasUnescapedQuotes || hasUnescapedSpecialChars) {
+      return text;
+    }
+
+    return text;
+  }
+
+  decodeHTMLEntities(text) {
+    // ARMOR: Comprehensively decode HTML entities
+    const textarea = document.createElement('textarea');
+    textarea.innerHTML = text;
+    let decoded = textarea.value;
+
+    decoded = decoded
+      .replace(/&quot;/gi, '"')
+      .replace(/&#34;/gi, '"')
+      .replace(/&#x22;/gi, '"')
+      .replace(/&#39;/gi, "'")
+      .replace(/&apos;/gi, "'")
+      .replace(/&#x27;/gi, "'")
+      .replace(/&#x2[Ff];/g, '/')
+      .replace(/&#47;/g, '/')
+      .replace(/&lt;/gi, '<')
+      .replace(/&#60;/gi, '<')
+      .replace(/&#x3[Cc];/g, '<')
+      .replace(/&gt;/gi, '>')
+      .replace(/&#62;/gi, '>')
+      .replace(/&#x3[Ee];/g, '>')
+      .replace(/&amp;/gi, '&');
+
+    return decoded;
+  }
+
+  showSuccess(svg) {
+    this.changeToCheckmark(svg);
+    this.updateTooltip(this.successMessage);
+    setTimeout(() => this.reset(svg), this.resetDelay);
+  }
+
+  changeToCheckmark(svg) {
+    const path = svg.querySelector('path');
+    if (path) {
+      svg.setAttribute('viewBox', this.checkmarkViewbox);
+      path.setAttribute('d', this.checkmarkPath);
+    }
+  }
+
+  updateTooltip(message) {
+    if (!message || typeof message !== 'string') {
+      console.warn('Invalid tooltip message:', message);
+      return;
+    }
+
+    this.button.setAttribute('data-bs-title', message);
+
+    try {
+      const tooltip = bootstrap.Tooltip.getInstance(this.button);
+      if (tooltip) {
+        tooltip._config.title = message;
+        tooltip.update();
+        tooltip.show();
+      }
+    } catch (err) {
+      console.warn('Bootstrap Tooltip unavailable or error updating tooltip:', err);
+    }
+  }
+
+  reset(svg) {
+    this.button.innerHTML = this.originalSvgHTML;
+    this.updateTooltip(this.originalTitle);
+
+    try {
+      const tooltip = bootstrap.Tooltip.getInstance(this.button);
+      if (tooltip) {
+        tooltip.hide();
+      }
+    } catch (err) {
+      console.warn('Bootstrap Tooltip unavailable or error hiding tooltip:', err);
+    }
+  }
+}
+
+// Initialize all copy buttons when DOM is ready
+document.addEventListener('DOMContentLoaded', function() {
+  // Get configuration from script's data attributes
+  const scriptElement = document.getElementById('centos-copyvalue');
+  const config = {};
+
+  if (scriptElement) {
+    if (scriptElement.dataset.resetDelay) {
+      config.resetDelay = parseInt(scriptElement.dataset.resetDelay, 10);
+    }
+    if (scriptElement.dataset.checkmarkPath) {
+      config.checkmarkPath = scriptElement.dataset.checkmarkPath;
+    }
+    if (scriptElement.dataset.checkmarkViewbox) {
+      config.checkmarkViewbox = scriptElement.dataset.checkmarkViewbox;
+    }
+    if (scriptElement.dataset.successMessage) {
+      config.successMessage = scriptElement.dataset.successMessage;
+    }
+  }
+
+  const copyButtons = document.querySelectorAll('.copy-btn');
+  copyButtons.forEach(button => {
+    try {
+      new CopyButtonHandler(button, config);
+    } catch (err) {
+      console.error('Failed to initialize copy button:', button, 'Error:', err);
+    }
+  });
+});

data/assets/js/base/datatable.js

@@ -0,0 +1,55 @@
+// DataTables Initialization
+// Reads configuration from data attributes on this script tag
+// Applied via datatable.html.liquid template with data attributes
+
+(function() {
+  // Find this script tag and extract its configuration
+  const scriptTag = document.getElementById('centos-datatable');
+
+  if (!scriptTag) {
+    console.warn('DataTables: script tag with id "centos-datatable" not found');
+    return;
+  }
+
+  // Read configuration from data attributes
+  const pageLength = parseInt(scriptTag.dataset.pageLength || 10);
+  const lengthMenuStr = scriptTag.dataset.lengthMenu || '[10,25,50,100]';
+
+  // Parse length menu array (stored as JSON string in data attribute)
+  let lengthMenu = [10, 25, 50, 100];
+  try {
+    lengthMenu = JSON.parse(lengthMenuStr);
+  } catch (e) {
+    console.warn('DataTables: Invalid lengthMenu format, using default:', e);
+  }
+
+  // Initialize on document ready
+  $(document).ready(function() {
+    // Target ALL tables that have the 'dataTable' class
+    const dataTableElements = $('table.dataTable');
+
+    if (dataTableElements.length > 0) {
+      // Initialize DataTables for ALL targeted tables found on the page
+      dataTableElements.each(function() {
+        const tableElement = $(this);
+
+        // Get the number of rows in the table body
+        const rowCount = tableElement.find('tbody tr').length;
+
+        // Determine if searching should be enabled (only if > 10 rows)
+        const enabledCondition = (rowCount > 10);
+
+        // Initialize DataTable with configuration
+        tableElement.DataTable({
+          responsive: true,
+          paging: enabledCondition,
+          info: enabledCondition,
+          order: [[0, 'asc']], // Order by first column
+          searching: enabledCondition,
+          pageLength: pageLength,
+          lengthMenu: lengthMenu
+        });
+      });
+    }
+  });
+})();

data/assets/js/base/highlight.js

@@ -0,0 +1,6 @@
+// Highlight.js Initialization
+// Initializes syntax highlighting on all code blocks with 'hljs' class
+// Enables copy-to-clipboard functionality via highlightjs-copy plugin
+document.querySelectorAll('.content code').forEach(el => el.classList.add('hljs'));
+hljs.addPlugin(new CopyButtonPlugin());
+hljs.highlightAll();

data/assets/js/base/init-tooltips.js

@@ -0,0 +1,5 @@
+// Bootstrap Tooltip Initialization
+// Initializes all Bootstrap tooltips on the page
+// Data attributes are NOT needed - this is a global initialization
+const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]');
+const tooltipList = [...tooltipTriggerList].map((tooltipTriggerEl) => new bootstrap.Tooltip(tooltipTriggerEl));