|
@@ -0,0 +1,83 @@
|
|
|
|
|
+<terminal>
|
|
|
|
|
+ <history welcome={ opts.welcome } />
|
|
|
|
|
+ <commandline prompt={ opts.prompt }/>
|
|
|
|
|
+
|
|
|
|
|
+ this.on('mount', function() {
|
|
|
|
|
+ this.setshell()
|
|
|
|
|
+ this.tags.commandline.setprompt(this.shell.prompt)
|
|
|
|
|
+ })
|
|
|
|
|
+
|
|
|
|
|
+ setshell() {
|
|
|
|
|
+ var shell = { 'process': function() { return ''; } }
|
|
|
|
|
+ if (opts.shell !== undefined && window[opts.shell] !== undefined) {
|
|
|
|
|
+ shell = window[opts.shell]
|
|
|
|
|
+ }
|
|
|
|
|
+ this.shell = shell
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ process(prompt, input) {
|
|
|
|
|
+ var input = he.encode(input)
|
|
|
|
|
+ var output = prompt + ' ' + input + '\n'
|
|
|
|
|
+ output += this.shell.process(input)
|
|
|
|
|
+ this.tags.history.add(output)
|
|
|
|
|
+ this.tags.commandline.setprompt(this.shell.prompt)
|
|
|
|
|
+ this.tags.commandline.command.value = ''
|
|
|
|
|
+ }
|
|
|
|
|
+</terminal>
|
|
|
|
|
+
|
|
|
|
|
+<commandline>
|
|
|
|
|
+ <form autocomplete='off' onsubmit={ process }>
|
|
|
|
|
+ { prompt } <input type='text' id='command' />
|
|
|
|
|
+ </form>
|
|
|
|
|
+
|
|
|
|
|
+ <style>
|
|
|
|
|
+ #command {
|
|
|
|
|
+ background: transparent;
|
|
|
|
|
+ border: none; outline: none;
|
|
|
|
|
+ padding: 0; margin: 0;
|
|
|
|
|
+ width: 90%;
|
|
|
|
|
+ }
|
|
|
|
|
+ </style>
|
|
|
|
|
+
|
|
|
|
|
+ this.on('mount', function() {
|
|
|
|
|
+ document.getElementById('command').focus()
|
|
|
|
|
+ })
|
|
|
|
|
+
|
|
|
|
|
+ setprompt(value) {
|
|
|
|
|
+ if (value) {
|
|
|
|
|
+ this.prompt = value
|
|
|
|
|
+ this.update()
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ this.prompt = '$'
|
|
|
|
|
+ this.setprompt(opts.prompt)
|
|
|
|
|
+
|
|
|
|
|
+ process(e) {
|
|
|
|
|
+ this.parent.process(this.prompt, this.command.value)
|
|
|
|
|
+ }
|
|
|
|
|
+</commandline>
|
|
|
|
|
+
|
|
|
|
|
+<history>
|
|
|
|
|
+ <div each={ hist }>
|
|
|
|
|
+ <raw content={ content } />
|
|
|
|
|
+ </div>
|
|
|
|
|
+
|
|
|
|
|
+ this.hist = []
|
|
|
|
|
+
|
|
|
|
|
+ add(output) {
|
|
|
|
|
+ output = output.replace(/(?:\r\n|\r|\n)/g, '<br />');
|
|
|
|
|
+ this.hist.push({ 'content': output })
|
|
|
|
|
+ this.update()
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ if ( opts.welcome !== undefined) {
|
|
|
|
|
+ this.add(opts.welcome)
|
|
|
|
|
+ }
|
|
|
|
|
+</history>
|
|
|
|
|
+
|
|
|
|
|
+<raw>
|
|
|
|
|
+ <span></span>
|
|
|
|
|
+
|
|
|
|
|
+ this.root.innerHTML = opts.content
|
|
|
|
|
+</raw>
|