Userscript: Syntax Highlighting

  • boxmein
    30th Nov 2014 Former Staff 4 Permalink
    Hi!
    I made a userscript (or, content script) for this website that highlights <code> boxes and makes code legible and nice! (instead of boring red, it'll be colorful and sorta reminiscent of GitHub).

    image

    Where to get it


    Either on Github Gist: https://gist.github.com/boxmein/53666432360934db4cd6
    ...or on GreasyFork (userscripts.org is lost forever): https://greasyfork.org/en/scripts/6727-tpt-syntax-highlighted-code-boxes

    How to run it


    1. Download the script file
    2. Install it to your Userscript plugin
    3. Refresh a forum page
    4. ???
    5. Profit

    Download the script file


    Click on one of the links above, and keep the file somewhere where you can find it later.

    Install it to your plugin


    Most browsers will need a plugin to run userscripts (Firefox, Chrome, Opera, Safari/SIMBL).
    Follow the guides inside the plugins or otherwise try clicking around to find an Install button.

    Reload to apply


    Reload now, for example!

    Demos


    Here's a few code snippets to test it out:

    #include <stdio.h>
    #define IABS(x) ((x) < 0 ? -(x) : (x))

    int main(int argc, char *argv[]) {

    /* An annoying "Hello World" example */
    for (auto i = 0; i < 0xFFFF; i++)
    cout << "Hello, World!" << endl;

    char c = '\n';
    unordered_map <string, vector<string> > m;
    m["key"] = "\\\\"; // this is an error

    return -2e3 + 12l;
    }


    --[[
    example useless code to show lua syntax highlighting
    this is multiline comment
    ]]

    function blahblahblah(x)
    local table = {
    "asd" = 123,
    "x" = 0.34,
    }
    if x ~= 3 then
    print( x )
    elseif x == "string"
    my_custom_function( 0x34 )
    else
    unknown_function( "some string" )
    end

    --single line comment

    end

    Hope you'll find it useful!
    ~boxmein
    Edited 4 times by boxmein. Last: 30th Nov 2014
  • ristovski
    30th Nov 2014 Member 1 Permalink

    Now I can read code I don't understand better since I can memorize by color! 10/10

  • Klus
    1st Dec 2014 Member 1 Permalink

    what is this supposed to do again?

  • boxmein
    1st Dec 2014 Former Staff 1 Permalink
    @Lagnadium41 (View Post)
    >I made a userscript (or, content script) for this website that highlights <code> boxes and makes code legible and nice!
  • FeynmanLogomaker
    1st Dec 2014 Member 1 Permalink
    This is nice!

    its a pity it won't work on iPads though

  • boxmein
    1st Dec 2014 Former Staff 1 Permalink
    @FeynmanLogomaker (View Post)
    Either use https://greasepocket.wordpress.com/ ...or I can make it into a Bookmarklet (Javascript in a bookmark, that gets run inside the current window) that you'll have to click every time you want highlighting to apply.

    To make a bookmarklet, add a bookmark with the "link" that it points to set to everything in the code box below:

    javascript:(function(){var HLJS="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/highlight.min.js",LUA="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/languages/lua.min.js",HL_STYLE="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/styles/github.min.css";function d(a){var b=document.createElement("script");b.setAttribute("type","application/javascript");b.src=a;document.body.appendChild(b);return b}d(HLJS).onload=function(){d(LUA).id="luaapi";var a=document.createElement("link");a.type="text/css";a.rel="stylesheet";a.href=HL_STYLE;document.head.appendChild(a);a=function(){function a(){for(var b=document.querySelectorAll("code"),c=0;ca};"function"==typeof a&&(a="("+a+")();");var b=document.createElement("script");b.setAttribute("type","application/javascript");b.textContent=a;document.body.appendChild(b)}})();
  • CeeJayBee
    1st Dec 2014 Member 1 Permalink
    Not bad, looks good. Seems to work perfectly :D
  • boxmein
    1st Dec 2014 Former Staff 1 Permalink
    @CeeJayBee (View Post)
    shh! look at the second-to-last and last lines inside my examples! for some reason, valid code looks grey as if it's commented out! probably HLJS's fault...
  • nucular
    2nd Dec 2014 Member 0 Permalink
    Edit: NO
    Edited 6 times by jacob1, nucular. Last: 2nd Dec 2014
  • ristovski
    2nd Dec 2014 Member 1 Permalink
    Edit: spam
    Edited once by jacob1. Last: 2nd Dec 2014