Tiny Customizable Terminal Simulator For Websites - jQuery zTerminal

zTerminal is a simple, lightweight jQuery plugin that adds a configurable, extendable bash terminal to your web applications. The plugin has a few built in base commands, and allows you to easily extend command array in the JavaScript.

How to use it:

1. Load the stylesheet termStyle.css to style the terminal.

<link rel="stylesheet" href="css/termStyle.css">

2. The HTML structure for the terminal.

<div id="terminal" onclick="document.getElementById('termInput').focus(); return false;">

  <p>Welcome to zTerminal 0.2</p>
  <p>A simple terminal simulator for websites.</p>
  <p>It is very much a work in progress, started on 2017-5-04. Type in help to see basic commands.</p><br>


  <ol id="terminalDisp">
  </ol>

  <p>zTerminal@localhost:~ <input type='text' id='termInput' value=''></p>
  
</div>

3. Load jQuery library and the JavaScript file zterm.js at the bottom of the webpage.

<script src="jquery.min.js"></script>
<script src="js/zterm.js"></script>

4. The default commands.

// basic commands array
var bc = [

// 0
{title:"help",
   termResp:" N/A ",
   helpResp:"This Text"
 },
//1
{title:"thetime",
   termResp: Date() ,
   helpResp:"Displays the Date and Time"
 },
//2
{title:"about",
   termResp:" Just a Terminal, written by a coder ",
   helpResp:"About this terminal"
 },
//3
{title:"contact",
   termResp:"Want to contact me for some reason? [email protected] ",
   helpResp:"y contact info"
 },
//4
{title:"edition",
   termResp:"Version 0.2 ",
   helpResp:"The terminal's Version"
 },
//5
{title:"future",
   termResp:"Unclear atm ",
   helpResp:"What to expect"
 },
//6
{title:"sauce",
   termResp:"I want that Mulan McNugget sauce, Morty! That's my series arc, Morty! If it takes nine seasons, I want my McNugget... dipping sauce Szechuan sauce, Morty! ",
   helpResp:"Dry Nuggets"
 },
//7
{title:"slurms",
   termResp:"Whimmy Wham Wham Wozzel",
   helpResp:"The Original Party Worm!"
 },
//8
{title:"clear",
   termResp:"N/a ",
   helpResp:"Clears the screen"
  }
]; // end of basic commands array

---

This awesome jQuery plugin is developed by DigitalOccult. For more Advanced Usages, please check the demo page or visit the official website.