Simple, Extensible, Hackable and Lightweight Javascript Browser Terminal Simulator!
Want to showcase your new shiny CLI Tool you just released?
Want to write HowTos on how some commands behaves?
Want to create a simulated sandbox of linux-like commands to help people learn?
You want to have fun (as I had) making your personal website readable from a fake terminal?
Doit interactively!
Get the zip Package directly or better:
npm install termly.js
# OR
yarn add termly.js
# OR
bower install termly.js
You can choose to use one of the two bundle coming with Termly.js, the main package have the shell only and all it's utilities you can use it as you wish, the prompt bundle is a simple DOM Wrapper that handles inputs and outputs and DOM manipulation, for the sake of simplicity with this you only have to attach a container and Style your terminal
<!-- Get the Shell only package -->
<script src="node_modules/termly.js/dist/termly.min.js"></script>
<!-- OR Get the Shell + a Prompt I/O wrapper -->
<script src="node_modules/termly.js/dist/termly-prompt.min.js"></script>
Or get directly from the sources (Babel+Bundler workflow)
// With a bundler
// @NB ES6 Classes are exported
const Shell = require('termly.js'); // Shell only
// OR
const Prompt = require('termly.js/bin/classes/Prompt'); // Init with a Prompt IO Wrapper
Read the docs to know the differences
Both the Shell and the Prompt wrapper can get parameters at instantiation whose most important are a custom Filesystem and a set of custom commands, both fall back to defaults if not provided.
Using the Prompt Wrapper
You can attach Termly.js to a DOM container and have it do the work of creating and setting up input/output field and handlers and only care of styling it:
<script src="dist/termly-prompt.min.js"></script>
<script>
// Documentation for options in the next section
var shell = new TermlyPrompt('#container', {
/* options object */
});
</script>
Read the docs at website for all the options
Using the Shell Class
A more advanced approach to build something custom that suites your needs would be to use Termly.js Shell Class, thus extending it with a wrapper and handle yourself all the DOM Input/Output in the way you desire it to behave.
<script src="dist/termly.min.js"></script>
<script>
// Documentation for options in the next section
var shell = new Termly({
/* options object */
});
shell.run('help');
//> 'Commands available: help, whoami, about, arguments, cd, ls, cat, man, http'
</script>
Read the docs at website for all the options
2.6.0 - stable
history
command, and clear flag history -c
to reset it.
2.5.6
2.5.5
2.5.4
2.5.3
2.5.2
2.5.1
2.5.0
printenv
and export
env
object in shell class
env: {}
with all the variables you want set in shell.env
at instantiationprintenv
export VAR=value
or export var='long value'
Actually this fits my needs and it works as expected, but as someone pointed to my this can be useful so if you have nice ideas and you want to contribute get your copy and fiddle with!
If you have to open a PR if possible squash your commits before sending, so I can give it a look more easily.
If there are any issue let me know, I'll give it a look when I can.
minimist Got inspiration to write my command parser
Some CSS I got here and there for the demo because I get bored styling, I really don't remember from who sorry :( Thank you anyway
This project is licensed under the GNU GPL v3 License - see the LICENSE.md file for details