PrismJS AviSynth Support

[Zinfidel]

Preview of the highlighter in action: https://zinfidel.github.io/

Unfortunately, getting this support on the site might pose maintainability problems. I'll try to outline them with solutions on this issue so they can be discussed. The files you customize and download from https://prismjs.com/download.html are not the files that are created when building the node project locally. To get the files needed for the site, you have to build prismjs, then actually run the website locally (the repo you download is actually their entire website/app) and customize your prismjs with your new stuff, and download.

Actual build steps:

1. Have node.js and npm installed
2. Clone zinfidel/prismjs
3. npm ci
4. npm run build
5. npm run start // starts a local http server hosting the website
6. Customize and download files (prism.js and prism.css)

The primary maintainability problem

I could just hand over the customized prism.js and prism.css files for the site, but I will be customizing that file based on our current desires for languages/themes. In the future if we want to add new language/themes or update prismjs, the avisynth customization is lost. If I'm around and willing to help with new additions, great, otherwise someone needs to be willing to do the above process. There is actually only one new file (prism-avisynth.js) that creates the language, and a modification to one file (components.js) to add it to the customization list.

Possible other solutions

1. The end result of clicking that download button is that the whole avisynth thing gets minified and somehow inserted into prism.js. It might be a simple and controllable enough addition that a simple script in a build step copies the minified avisynth into prism.js. Then there's no maintenance.
2. Someone with the repo could modify the build process to automatically produce the end-user files somehow and make that part of the site build. This is way outside of my skillset though.
3. I perfect the lang definition, write tests and a wiki, submit an official PR, it gets accepted by the prismjs team, and avisynth support is added to their website, thus eliminating all maintenance problems. This however kills the birb.

Theme/Style-Related Stuff

1. The special last variable is currently set as a token.variable which gives a kind of color vomit problem with the default theme. @vadosnaprimer suggested a more pleasant navy blue, but this requires modifying the theme to achieve. If I change token.variable to navy there, all languages are affected. If I add a new category for the color, then only that theme supports it. What's worth doing here?
2. What do we think of themes in general? The default is meh IMO.
3. I made built-in functions and filters categorized one way, and user/external functions get another color. Does this make sense? avisynth is really weird and I'm not sure which distinctions make sense.

[Zinfidel]

Requesting input from @TiKevin83 and @vadosnaprimer (even if just for posterity)

[vadosnaprimer]

From what we've tried so far, this highlighter in general is insanely limited. It assigns the same color to PILES of unrelated things, like internal function names and strings. Are there any worthy alternatives to prismjs, like something github uses maybe?

Until then, this PR is a good addition.

[Zinfidel]

On the topic of prismjs themes: theres a web interface for making entirely new ones here if that's something people would like to try: http://k88hudson.github.io/syntax-highlighting-theme-generator/www/

Also here's a bunch more premade ones that may be better: https://github.com/PrismJS/prism-themes

[nattthebear]

From what we've tried so far, this highlighter in general is insanely limited. It assigns the same color to PILES of unrelated things, like internal function names and strings.

Please report this, including examples.

[vadosnaprimer]

Please report this, including examples.

Nevermind, it looks like with good themes, there will be no problems.

[Zinfidel]

I've learned via a short discussion that there isn't an "oficially" supported way to automate the building of PrismJS, but that the author of the program did write a CLI bundler in an unmerged PR.

[nattthebear]

@Zinfidel Any chance of getting avs support merged into upstream?

[Zinfidel]

@nattthebear Because the other options are not great, I've started working on a full PR. So, there's a chance it will get an upstream merge, though it might end up drastically simplified due to performance problems.

I'll keep this issue updated.

[Zinfidel]

Here goes nothing: PrismJS/prism#3071

[Zinfidel]

🎉

[vadosnaprimer]

WOW YOU ROCK

[TiKevin83]

@Zinfidel is this fixed now by #432 ?

[Zinfidel]

@TiKevin83 Yes it is!