Create Custom Terminals With Pure JavaScript And CSS

A JavaScript library to create HTML terminals in web pages.

Install

$ yarn add shell.js # recommended
$ npm i shell.js
$ bower install shell.js --save

Options

For each Shell instance you can set the following options:

Options	Allowed values	Description	Defaut value
user	string	The user	“user”
host	string	The host	“host”
path	string	The working directory	“~”
style	“default”	“ubuntu”	“osx”
theme	“dark”	“light”	The theme
responsive	boolean	Responsiveness	true
typed	Typed callable	Typed.js integration to make shell alive	null
commands	array	The commands list	[]

Usage

Create a HTML element with a specified ID…

<div id="awesome-shell"></div>

…and pass the CSS selector to the Shell.js constructor:

document.addEventListener('DOMContentLoaded', function() {
    let shell = new Shell('#awesome-shell', {
        user: 'foobar',
        host: 'MacMini',
        path: '/etc/',
        style: 'osx',
        theme: 'dark',
        responsive: false,
        commands: ['First command', 'Second command', '...']
    });
});

Visit the documentation page

Author

Davide Caruso

Download Details:

Author: davidecaruso

Demo: https://shelljs.io/

Source Code: https://github.com/davidecaruso/shell.js

#javascript #css