☰

Lazyfoo Highlight Code

Add code highlight to LazyFoo's code snippets in the tutorials section, updated to HLJS 11.6, no jQuery, switchable theme.

As of 2022-07-21. See the latest version.

// ==UserScript==
// @name        Lazyfoo Highlight Code
// @namespace   lazyfoo
// @match       *://*.lazyfoo.net/tutorials/*
// @version     1.3
// @license MIT
// @require     https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/highlight.min.js
// @require     https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/languages/cpp.min.js
// @resource    THEME_DEFAULT https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/default.min.css
// @resource    THEME_DARK https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/a11y-dark.min.css
// @grant       GM_getResourceText
// @grant       GM_addStyle
// @description Add code highlight to LazyFoo's code snippets in the tutorials section, updated to HLJS 11.6, no jQuery, switchable theme.
// ==/UserScript==

const blocks = document.querySelectorAll('div.tutCode');

// Highlight JS
var hljs = hljs || null;

if (blocks.length) {
    if (typeof GM_getResourceText === 'function') {
        // Change THEME_DARK to THEME_DEFAULT here for light theme.
        const themeCss = GM_getResourceText("THEME_DARK");
        GM_addStyle(themeCss);
    } else {
        document.head.innerHTML += `<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/a11y-dark.min.css' />`;
    }

    blocks.forEach((block) => {
        block.innerHTML = `<pre><code class="cpp">${block.innerHTML}</code></pre>`;
    });

    hljs.highlightAll();
}