jQuery Terminal is Open Source JavaScript library for creating command line interpreters in your applications.
You can use this JavaScript Terminal library to create interactive web-based terminal application
on your website. Where commands are defined by you. You can define them on the server or
in browser's JavaScript.
It can automatically call JSON-RPC service,
when the user types commands. Alternatively, you can provide an object with methods; each method will be
invoked on the user's command (python command can create python interpreter).
An object can have nested objects which will create a nested interpreter (you can create interactive menu
of advanture game with this).
You can also use a function in which you can parse user commands
by yourself (you have full control of what user type into terminal).
It's ideal if you want to provide additional functionality for power users.
It can also be used as debugging tool or you can use it to create
cool looking
interactive portfolio website, that look like
GNU/Linux, MacOSX or Windows WSL terminal.
You can use it to very create fast, debugger for your REST API, before you start writing your Front-End code.
Or you can add eval on Back-End of your application and debug the app while it's running, this in this
R/shiny shell.
Your interactive web based terminal application, will work the same as native terminal emulator,
but the code for commands is provided by you and it will work in a browser and on mobile.
I've never charged anything for this project, even did a lot of support for free. I'm still willing
to help even if I offer paid support. Not everyone can afford paying me money. You can help
by leaving meaningful comment or by
starting a discussion,
even negative feedback is valuable. I will know that people like this web based terminal.
Visitor statistics don't tell everthing.
I want to thanks a few services that provided free accounts for this Open Source project:
- BrowserStack — it's a service that provide automated as well as manual testing using real browsers.
- Coveralls — service that track code coverage.
Here are statuses of those services on master branch:
-
GH Action:
-
Coveralls:
And devel branch:
-
GH Action:
-
Coveralls:
- You can create an interpreter for your JSON-RPC service with one line of code.
- Support for authentication
(you can provide a function to be called when the user enters a login and password.
If you use JSON-RPC, it can automatically call a login function
on the server and pass a token to all functions.)
- Stack of interpreters - you can create commands that trigger additional interpreters
(eg. you can use a couple of JSON-RPC services and run them when user types a command).
- Command Tree - you can use nested objects.
Each command will invoke a function;
if the value is an object, it will create a new interpreter
and use functions from that object as commands.
You can use as many nested commands as you like.
If the value is a string, it will create a JSON-RPC service request.
- Tab completion with TAB key.
- Support for command line history (it use Local Storage if possible or cookies).
- Includes keyboard shortcuts from bash,
such as CTRL+A, CTRL+D, and CTRL+E.
- Multiple terminals on one page
(every terminal can have a different command, its own authentication function,
and its own command history) - you can switch between them with CTRL+TAB.
- It catches all exceptions and displays error messages in the terminal
(you can see errors in your JavaScript and PHP code in the terminal
if they are in an interpreter function).
- Support for basic text formatting (color, background, underline,
bold, italic) inside the echo function.
- You can create and overwrite existing keyboard shortcuts.
- Formatters that can render emoji or allow the addition of syntax highlighters.
- Support for ANSI escape codes (Linux/unix formatting) with additional file. From version 2.0.0 it should show correctly ANSI artwork (but because of Unicode bugs in Operating Systems they work correctly only on Windows 10 and Linux).
This is a simple demo, using a JavaScript interpreter.
(If the cursor is not blinking, click on the terminal to activate it.)
You can type any JavaScript expression, there is debug function dir
(like in Python).
You can use jQuery's "$" method to manipulate the page.
You also have access to this terminal in the "term" variable.
Try dir(term)
or demo()
for demo typing animation.
NOTE: for unknow reason this demo doesn't work on Mobile, but I assure you that the library do works on mobile. Check full screen version. The issue with the demo is tracked on GitHub issue.
JavaScript code:
// ref: https://stackoverflow.com/q/67322922/387194
var __EVAL = (s) => eval(`void (__EVAL = ${__EVAL}); ${s}`);
jQuery(function($, undefined) {
$('#term_demo').terminal(function(command) {
if (command !== '') {
try {
var result = __EVAL(command);
if (result !== undefined) {
this.echo(new String(result));
}
} catch(e) {
this.error(new String(e));
}
}
}, {
greetings: 'JavaScript Interpreter',
name: 'js_demo',
height: 200,
prompt: 'js> '
});
});
You can also try JavaScript REPL Online, with Book about JavaScript and Terminal on 404 Error page (with a lot of features like chat and games).
Complete source with few examples from github
Or just the files:
-
jquery.terminal-2.44.1.js — unminified version [0.0KB] [Gzip: ]
-
jquery.terminal-2.44.1.min.js — minified version [0.0KB] [Gzip: ]
-
jquery.terminal-2.44.1.css — stylesheet [0.0KB] [Gzip: ]
-
jquery.terminal-2.44.1.min.css — minified stylesheet - [0.0KB] [Gzip: ]
-
prism.js — formatter to be used with PrismJS that hightlights different programming languages - [8.8KB]
-
less.js — very basic reimplementation of less *nix command in jQuery Terminal - [22.2KB] [Gzip: 5.0KB]
-
emoji.js — formatter that can be used to render Emoji - [6.3KB]
-
emoji.css — CSS file that need to be used with emoji.js - [643.3KB] [Gzip: 38.9KB]
-
dterm.js — jQuery UI Dialog - [4.2KB]
-
ascii_table.js — helper that create ASCII table like the one in MySQL CLI - [4.6KB]
-
pipe.js — helper function that wrapps interpreter and create Unix Pipe operator - [19.0KB]
-
unix_formatting.js — formatter that convert UNIX ANSI escapes to terminal and display them as html - [54.7KB]
-
xml_formatting.js — simple formatter that allow to use xml like syntax with colors as tags - [7.0KB]
-
Starting in version 1.0.0, if you want to support
browsers (such as old versions of Safari) that don't support the key KeyboardEvent property,
you'll need to include the
polyfill code.
You can check browser support on can I use.
-
If you want to support wider characters, such as Chinese or Japanese,
you can include wcwidth library and terminal will use it.
You can download files locally or use:
Bower:
bower install jquery.terminal
NPM:
npm install --save jquery.terminal
Then you can include the scripts in your HTML
:
<script src="https://cdn.jsdelivr.net/npm/jquery"></script>
<script src="js/jquery.terminal-2.44.1.min.js"></script>
<!-- With modern browsers, jQuery mousewheel is not actually needed; scrolling will still work -->
<script src="js/jquery.mousewheel-min.js"></script>
<link href="css/jquery.terminal-2.44.1.min.css" rel="stylesheet"/>
You can also grab the files using a CDN (Content Distribution Network):
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.terminal/2.44.1/js/jquery.terminal.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery.terminal/2.44.1/css/jquery.terminal.min.css" rel="stylesheet"/>
or
<script src="https://cdn.jsdelivr.net/npm/jquery.terminal/js/jquery.terminal.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/jquery.terminal/css/jquery.terminal.min.css" rel="stylesheet"/>
And optional but recomended:
<script src="https://unpkg.com/js-polyfills/keyboard.js"></script>
<script src="https://cdn.jsdelivr.net/gh/jcubic/static/js/wcwidth.js"></script>
If you always want the latest version, you can grab the files from unpkg without specifying version number
<script src="https://unpkg.com/jquery.terminal/js/jquery.terminal.js"></script>
<link href="https://unpkg.com/jquery.terminal/css/jquery.terminal.css" rel="stylesheet"/>
The jQuery Terminal Emulator plugin is released under the
MIT license.
It contains:
You can use the terminal below to leave a comment. Click to activate.
If you have a question, you can create an
issue on github,
ask on stackoverflow
(you can use the "jquery-terminal" tag).
You can also send email with SO question or jump to
the chat.
If you have a feature request, you can also add a
GitHub issue.
If you've found an issue with this website, you can add issue to the
jquery.terminal-www repo.
If you'll ask question in Comments, you can subscribe to comments RSS to see reply, when it's added.