Skip to content

Make the demo awesome#1999

Merged
Anteru merged 16 commits intopygments:masterfrom
not-my-profile:instant-demo
Dec 28, 2021
Merged

Make the demo awesome#1999
Anteru merged 16 commits intopygments:masterfrom
not-my-profile:instant-demo

Conversation

@not-my-profile
Copy link
Contributor

See my commit messages for the changes I made.

The demo should now be way more fun and useful (not just for users but also for developers).

(please don't squash my commits :)

Previously the form could only be filled out after Pyodide finished
loading (since the <select> options were generated via Pyodide).

This commit changes this, so that the <select> options are already
in the static HTML. The "Loading Python..." form overlay is removed,
instead just the Highlight button is disabled, letting users fill
out the form while Pyodide is loading.

When a ?code query parameter is given a "Loading Python..." message
is displayed below the form, since in that case users probably want
to wait for the highlighted code (instead of filling out the form).
Previously highlighting a large file with a complex lexer just hung the
whole browser tab (meaning you couldn't interact with the page anymore).

This commit outsources the higlighting to another thread by using a web
worker. Depending on web workers shouldn't reduce browser compatability
since the page already depends on WASM (and according to caniuse.com any
browser that supports WASM also supports web workers).
Use the modern navigator.clipboard API instead.
* "Try out Pygments!" is more descriptive than "Try it out!"
* Moved the description of the implementation to the end.
* Added a <noscript> tag suggesting `pip install` and pygmentize.
* Added a <label> for the textarea.
* Disable spell checking for the textarea.
* Reduced the scope of the reset button to the file input.
* Added autofocus for the language select.
For large files it's better to have a viewport because
then you can view both the form as well as the part of
the output you are interested in at the same time.
@Anteru Anteru merged commit d1cfbcc into pygments:master Dec 28, 2021
@Anteru
Copy link
Collaborator

Anteru commented Dec 28, 2021

That's quite a massive change, but I do like the direction. Thanks for putting this together!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants