<!DOCTYPE html>
<html>
<head>
<title>WTerminal dropdown sample</title>
<link rel="stylesheet" href="css/main.css" />
<link rel="stylesheet" href="css/wterminal.css" />
<script src="js/wterminal.js"></script>
<script src="js/wterminal-autoextend.js"></script>
<script src="js/theme.js"></script>
</head>
<body>
<header>
<button style="float: right;" title="Dark theme on/off" onclick="toggleTheme();">☀</button>
<a href="index.html">Home</a>
<a href="static-terminal.html">Static</a>
<a href="dropdown.html">Dropdown</a>
<a href="pong.html">Pong</a>
<a href="addon.html">Addon</a>
</header>
<main>
<h1>Dropdown terminal</h1>
<p>WTerminal is installed on this site as a dropdown/quake style terminal.</p>
<h2>How to use the terminal:</h2>
<ul>
<li>Open terminal: press Backquote <b>`</b> AKA tilde, or click the "Open terminal" button below.</li>
<li>Use terminal commands: type "help" or "?" and press enter to get started.</li>
<li>Close terminal: press Escape</li>
</ul>
<button onclick="WTerminal.open()">Open terminal</button>
<h2>How to add the terminal to a site:</h2>
<p>Add the CSS and JavaScript files to your site header:<br>
<code><link rel="stylesheet" href="css/wterminal.css" /><br>
<script src="js/wterminal.js"></script></code>
</p>
<p>Then add a script ellement with:<br>
<code>WTerminal.instalDropdownTerminal();</code>
Or
<code>new WTerminal("dropdown", null, null);</code>
</p>
<script>
WTerminal.instalDropdownTerminal();
// Or
//new WTerminal("dropdown", null, null);
</script>
</main>
<footer>
<p class="float-right">Author: Ward Truyen</p>
</footer>
</body>
</html>