-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathjs.html
109 lines (94 loc) · 2.96 KB
/
js.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
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<html> <head><title>jsShell</title>
<!-- Thoughts:
* The interpreting code might be seperated from what the user can easily do.
* stuff containing quotes isnt click-selectable
* Some shell like commands to satisfy some of the expectations for the name. (cf unixkcd?)
* focus doesnt work for onload and at the end of process
-->
<script>
var count = 0;//TODO should not be (easily) overwritable
var lineWidth = 80;
var commands = {}
var results = {}
var shell = {}
function help(){
return "You can enter javascript. This is actually it. showElement(x) or showElement4id('y') are sometimes useful, and sometimes you can click on stuff. If you want to define something, there is the object shell that can be enhanced like this: shell.square = function square(x){return x*x} (use like shell.square(5)). Ah, and lineWidth can be set (currently it is "+lineWidth+").";
}
function createInputLine(num){
var li = document.createElement("li");
var span = document.createElement("span");
span.id = "span"+num;
var prompt = document.createTextNode("> ");
var input = document.createElement("input");
input.id = "inp";
var input_size = document.createAttribute("size");
input_size.nodeValue = lineWidth;
input.setAttributeNode(input_size);
span.appendChild(prompt);
span.appendChild(input);
li.appendChild(span);
return li;
}
function addInputLine(){
count++;
document.getElementById("cmd_history_list").appendChild(createInputLine(count));
}
function evaluate(command){
var s = "";
try{
var dummy = eval(command);
// s += "<span onClick='refill(\"showElement(result["+count+"])\")'>"+dummy+"</span>";
s += dummy;
if(!results[count]){//some function may set it specially.
results[count] = dummy;
}
}catch(ex){
s += "<b>Error</b>: ";
for (var fieldName in ex) {
s += fieldName;
s += ": </i>";
s += ex[fieldName];
s += " <i>";
}
}
return s;
}
function refill(command){
var inputField = document.getElementById("inp");
inputField.value=command;
inputField.focus();
}
function process(){
var command = document.getElementById("inp").value;
commands[count] = command;
document.getElementById("span"+count).innerHTML =
// "<b><span onClick='refill(\""+command+"\")'>" + command +
"<b><span onClick='refill(commands["+count+"])'>" + command +
"</span></b><br />--> <i>"+evaluate(command)+"</i>";
addInputLine();
document.getElementById("inp").focus();
}
function showElement(elem){
results[count] = elem;
var s = "";
if(elem){
s += elem;
s += ", with members: ";
for (var fieldName in elem) {
s += " <span onClick='refill(\"results["+count+"]."+fieldName+"\")'>"+fieldName+"</span>";
}
}
return s;
}
function showElement4id(id){
return showElement(document.getElementById(id));
}
</script>
</head>
<body onload="javascript:addInputLine()">
<p><b>jsShell</b></p><p><span onClick="refill('help()')"><tt>help()</tt></span> may help a little bit.</p>
<form action="javascript:process()">
<ol id="cmd_history_list"></ol>
</form>
</body>
</html>