aaronliu0130 / asciinema-player-for-github

🎬✨ Browser extension to automatically detect asciinema links in a project's README and embed the asciinema player in its place

asciinema Player for GitHub

Automatically detect instances of asciinema links in a README on GitHub and embed the player in its place.

This is a lightweight Chrome extension. Instead of being directed to the asciinema website to watch the "asciicast", watch it directly in the README (or any .md, .rst, .textile, etc. file), thanks to the embedded player widget. 🎉

Install

• Chrome extension
• Firefox add-on
• Opera extension: Use this Opera extension to install the Chrome version.

Development

1. Clone this repository by running

   git clone https://github.com/plibither8/asciinema-player-for-github.git
   

2. Ensure you are running an up-to-date version of Node.js on your machine, and that you have npm installed.
3. Open a terminal in the asciinema-player-for-github directory. Type

   npm install
   

   into the terminal to install the dependencies. To build the extension, type

   npm run watch
   

4. The extension files including the manifest.json file are in the dist/ directory.

Content Security Policy Modification

Just FYI: to allow third-party iframes (in this case, from asciinema.org) to be rendered on github.com, the Content-Security-Policy (CSP) in the response headers of github.com are modified by this extension. The following modification takes place:

Before: frame-src render.githubusercontent.com;

After: frame-src asciinema.org render.githubusercontent.com;

For more details: Content Security Policy (CSP) - Google Chrome

Code: background.js

Donate

asciinema Player for GitHub was made by me during my study-breaks and free time. If you like and have enjoyed it, please consider donating a small amount (any amount will be really appreciated!) to support and sustain its development. Thank you!

---

License

Copyright (c) Mihir Chaturvedi. All rights reserved.

Licensed under the MIT License.