-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
executable file
·92 lines (81 loc) · 4.04 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>trsh</title>
<link href='http://fonts.googleapis.com/css?family=Ubuntu+Mono' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="animations.css">
<link rel="stylesheet" href="term.css">
<link rel="stylesheet" href="term_fkscss.css">
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
</head>
<body>
<section id="navbar">
<b>~me/</b> <span>: Your Home Directory</span>
</section>
<section id="sidebar">
<h2 class="currendir">~me/</h2>
<ul class="lsout">
</ul>
</section>
<section id="message-buffer">
<section class="message" data-sender="helpbot">
Hello and welcome to the <b>Training Shell</b> (trsh)! <br> I'm helpbot, and I'm here to get you started. Say <code>help</code> at any time for more information.
</section>
</section>
<section id="modal-display">
</section>
<div id="ia-wrapper">
<textarea id="input-area" placeholder="me@localhost" spellcheck="false" autocorrect='off'></textarea>
</div>
<template id="helpTemplate">
To get you started,
<ul>
<li><code>cd</code> or <code>dir</code> moves you around the filesystem</li>
<li><code>mv</code> or <code>move</code> moves or renames files</li>
<li><code>rm</code> or <code>delete</code> removes files</li>
<li><code>undo</code> or <code>undelete</code> restores deleted files, or reverts changes</li>
</ul>
<p>
To find commands for other tasks, type <code>How do I ... ?</code> or <code>? ...</code> for short.
</p>
<p>
If you have other questions you can ask me with <code>help <keyword></code>. Try <code>help interface </code>.
</p>
</template>
<template class="helptext_body interface">
The training shell is divided into two main areas: the working area (to the right), and the sidebar (to the left). The sidebar displays your "Current Working Directory"(cwd). This can be thought of as where you currently "are" in the filesystem. It will update when you move around the filesystem.
<aside>press enter to continue...</aside>
</template>
<template class="helptext_body interface">
<p>This area on the right is a little more complicated. At the top is the navbar: it shows the long version of your current path, as well as a short description of your current directory (If a description has been set, that is!).
</p><p>
The place where these messages are appearing is called the chat buffer. This will show the back and fourth between you and me (helpbot), or between you and the bot that executes commands (shellbot)
</p><p>
Lastly, there's the command prompt, at the bottom of this area. As you type, text will appear down there. you can press enter to send the command to either me or shellbot.
</p>
<aside>press enter to continue...</aside>
</template>
<template class="helptext_body interface">
That's all for now! If you're just getting started, try asking me about moving around the filesystem with <code>help navigation</code>, or <code>help files</code>.
</template>
<template id="help_query">
<section>
<code><b>mv</b> <files> <target></code>
<p class="help_desc">
<b>Move</b>s one or many <b>files</b>. Can also be used to rename a file.<br>
If <code><files></code> is more than one element, <code><target></code> must be a directory.
</p>
</section>
<section>
<code><b>cd</b> <directory></code>
<p class="help_desc">
Changes your current working directory. You can use it to <b>move</b> around the <b>files</b>ystem.
</p>
</section>
</template>
<script src="jquery.min.js"></script>
<script src="dirfaker.js"></script>
<script src="termfaker.js"></script>
</body>
</html>