Add files via upload
This commit is contained in:
parent
cba2fc177d
commit
68137c3ca3
|
@ -19,4 +19,4 @@ $(function() {
|
|||
r("hour", 30*(d.getHours()%12) + d.getMinutes()/2)
|
||||
}, 1000);
|
||||
|
||||
});
|
||||
});
|
204
js/terminal.js
204
js/terminal.js
|
@ -2,208 +2,6 @@ var util = util || {};
|
|||
util.toArray = function(list) {
|
||||
return Array.prototype.slice.call(list || [], 0);
|
||||
};
|
||||
function show_image(src, width, height, alt) {
|
||||
var img = document.createElement("img");
|
||||
img.src = src;
|
||||
img.width = width;
|
||||
img.height = height;
|
||||
img.alt = alt;
|
||||
|
||||
// This next line will just add it to the <body> tag
|
||||
document.body.appendChild(img);
|
||||
}
|
||||
var Terminal = Terminal || function(cmdLineContainer, outputContainer) {
|
||||
window.URL = window.URL || window.webkitURL;
|
||||
window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem;
|
||||
|
||||
var cmdLine_ = document.querySelector(cmdLineContainer);
|
||||
var output_ = document.querySelector(outputContainer);
|
||||
|
||||
const CMDS_ = [
|
||||
'cat', 'clear', 'clock', 'date', 'echo', 'help', 'uname', 'whoami', 'spin'
|
||||
];
|
||||
|
||||
var fs_ = null;
|
||||
var cwd_ = null;
|
||||
var history_ = [];
|
||||
var histpos_ = 0;
|
||||
var histtemp_ = 0;
|
||||
|
||||
window.addEventListener('click', function(e) {
|
||||
cmdLine_.focus();
|
||||
}, false);
|
||||
|
||||
cmdLine_.addEventListener('click', inputTextClick_, false);
|
||||
cmdLine_.addEventListener('keydown', historyHandler_, false);
|
||||
cmdLine_.addEventListener('keydown', processNewCommand_, false);
|
||||
|
||||
//
|
||||
function inputTextClick_(e) {
|
||||
this.value = this.value;
|
||||
}
|
||||
|
||||
//
|
||||
function historyHandler_(e) {
|
||||
if (history_.length) {
|
||||
if (e.keyCode == 38 || e.keyCode == 40) {
|
||||
if (history_[histpos_]) {
|
||||
history_[histpos_] = this.value;
|
||||
} else {
|
||||
histtemp_ = this.value;
|
||||
}
|
||||
}
|
||||
|
||||
if (e.keyCode == 38) { // up
|
||||
histpos_--;
|
||||
if (histpos_ < 0) {
|
||||
histpos_ = 0;
|
||||
}
|
||||
} else if (e.keyCode == 40) { // down
|
||||
histpos_++;
|
||||
if (histpos_ > history_.length) {
|
||||
histpos_ = history_.length;
|
||||
}
|
||||
}
|
||||
|
||||
if (e.keyCode == 38 || e.keyCode == 40) {
|
||||
this.value = history_[histpos_] ? history_[histpos_] : histtemp_;
|
||||
this.value = this.value; // Sets cursor to end of input.
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
function processNewCommand_(e) {
|
||||
|
||||
if (e.keyCode == 9) { // tab
|
||||
e.preventDefault();
|
||||
// Implement tab suggest.
|
||||
} else if (e.keyCode == 13) { // enter
|
||||
// Save shell history.
|
||||
if (this.value) {
|
||||
history_[history_.length] = this.value;
|
||||
histpos_ = history_.length;
|
||||
}
|
||||
|
||||
// Duplicate current input and append to output section.
|
||||
var line = this.parentNode.parentNode.cloneNode(true);
|
||||
line.removeAttribute('id')
|
||||
line.classList.add('line');
|
||||
var input = line.querySelector('input.cmdline');
|
||||
input.autofocus = false;
|
||||
input.readOnly = true;
|
||||
output_.appendChild(line);
|
||||
|
||||
if (this.value && this.value.trim()) {
|
||||
var args = this.value.split(' ').filter(function(val, i) {
|
||||
return val;
|
||||
});
|
||||
var cmd = args[0].toLowerCase();
|
||||
args = args.splice(1); // Remove cmd from arg list.
|
||||
}
|
||||
|
||||
switch (cmd) {
|
||||
case 'cat':
|
||||
var url = args.join(' ');
|
||||
if (!url) {
|
||||
output('Usage: ' + cmd + ' https://s.codepen.io/...');
|
||||
output('Example: ' + cmd + ' https://s.codepen.io/AndrewBarfield/pen/LEbPJx.js');
|
||||
break;
|
||||
}
|
||||
$.get( url, function(data) {
|
||||
var encodedStr = data.replace(/[\u00A0-\u9999<>\&]/gim, function(i) {
|
||||
return '&#'+i.charCodeAt(0)+';';
|
||||
});
|
||||
output('<pre>' + encodedStr + '</pre>');
|
||||
});
|
||||
break;
|
||||
case 'clear':
|
||||
output_.innerHTML = '';
|
||||
this.value = '';
|
||||
return;
|
||||
case 'clock':
|
||||
var appendDiv = jQuery($('.clock-container')[0].outerHTML);
|
||||
appendDiv.attr('style', 'display:inline-block');
|
||||
output_.appendChild(appendDiv[0]);
|
||||
break;
|
||||
case 'date':
|
||||
output( new Date() );
|
||||
break;
|
||||
case 'echo':
|
||||
output( args.join(' ') );
|
||||
break;
|
||||
case 'help':
|
||||
output('<div class="ls-files">' + CMDS_.join('<br>') + '</div>');
|
||||
break;
|
||||
case 'uname':
|
||||
output(navigator.appVersion);
|
||||
break;
|
||||
case 'whoami':
|
||||
var result = "<img src=\"" + codehelper_ip["Flag"]+ "\"><br><br>";
|
||||
for (var prop in codehelper_ip)
|
||||
result += prop + ": " + codehelper_ip[prop] + "<br>";
|
||||
output(result);
|
||||
break;
|
||||
case 'spin':
|
||||
show_image('spin.gif', 100px, 100px, 'spinny');
|
||||
break;
|
||||
default:
|
||||
if (cmd) {
|
||||
output(cmd + ': command not found');
|
||||
}
|
||||
};
|
||||
|
||||
window.scrollTo(0, getDocHeight_());
|
||||
this.value = ''; // Clear/setup line for next input.
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
function formatColumns_(entries) {
|
||||
var maxName = entries[0].name;
|
||||
util.toArray(entries).forEach(function(entry, i) {
|
||||
if (entry.name.length > maxName.length) {
|
||||
maxName = entry.name;
|
||||
}
|
||||
});
|
||||
|
||||
var height = entries.length <= 3 ?
|
||||
'height: ' + (entries.length * 15) + 'px;' : '';
|
||||
|
||||
// 12px monospace font yields ~7px screen width.
|
||||
var colWidth = maxName.length * 7;
|
||||
|
||||
return ['<div class="ls-files" style="-webkit-column-width:',
|
||||
colWidth, 'px;', height, '">'];
|
||||
}
|
||||
|
||||
//
|
||||
function output(html) {
|
||||
output_.insertAdjacentHTML('beforeEnd', '<p>' + html + '</p>');
|
||||
}
|
||||
|
||||
// Cross-browser impl to get document's height.
|
||||
function getDocHeight_() {
|
||||
var d = document;
|
||||
return Math.max(
|
||||
Math.max(d.body.scrollHeight, d.documentElement.scrollHeight),
|
||||
Math.max(d.body.offsetHeight, d.documentElement.offsetHeight),
|
||||
Math.max(d.body.clientHeight, d.documentElement.clientHeight)
|
||||
);
|
||||
}
|
||||
|
||||
//
|
||||
return {
|
||||
init: function() {
|
||||
output('<img align="left" src="http://www.w3.org/html/logo/downloads/HTML5_Badge_128.png" width="100" height="100" style="padding: 0px 10px 20px 0px"><h2 style="letter-spacing: 4px">HTML5 Web Terminal</h2><p>' + new Date() + '</p><p>Enter "help" for more information.</p>');
|
||||
},
|
||||
output: output
|
||||
}
|
||||
};
|
||||
var util = util || {};
|
||||
util.toArray = function(list) {
|
||||
return Array.prototype.slice.call(list || [], 0);
|
||||
};
|
||||
|
||||
function show_image(src, width, height, alt) {
|
||||
var img = document.createElement("img");
|
||||
|
@ -403,4 +201,4 @@ var Terminal = Terminal || function(cmdLineContainer, outputContainer) {
|
|||
},
|
||||
output: output
|
||||
}
|
||||
};
|
||||
};
|
Loading…
Reference in a new issue