An almost functional zsh terminal in any div

You can install via npm

$ npm install zsh.js

Include the script and style:

<link href="path/to/zsh.min.css" rel="stylesheet" />
<script src="path/to/zsh.js"></script>

You can either access it though a global variable ZSH or via a client side require:

var ZSH = require('zsh.js');
var FileSystem = require('zsh.js/lib/fs');
var CommandManager = require('zsh.js/lib/command-manager');

In order to display the terminal, call ZSH.create with the target div's ID:

ZSH.create('container');

You can also include zsh.js as a web component:

<link rel="import" href="path/to/zsh.js/zsh-terminal.html"/>

<zsh-terminal></zsh-terminal>

An example is also available

The commands, such as cd and mv, are written in javascript and hosted at /usr/bin. You can ls directory to see which commands are currently implemented, cat a command to see its implementation, check the contents of lib/fs/usr/bin or simply run help, which will show you all the aliases and commands available.

Some other functionalities include:

• Autocomplete for commands
• Syntax Highlight
• Commands History

Executable files are stored inside the actual file system folder and can be viewed within the terminal. The path is not customizable yet, so all the commands are in src/lib/fs/usr/bin/*.js

Notice that: It is still possible to add commands through the CommandManager, but they are not automatically required, but could work if you are writing a plugin (example: tadeuzagallo.com/src/js/site-helpers.js)

The most complex command so far is mv.js, check it out if you want to implement a custom command.

Terminal.js is available under MIT licence. See the LICENCE file for more info.