-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
106 lines (88 loc) · 3.67 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
93
94
95
96
97
98
99
100
101
102
103
104
105
106
<!DOCTYPE html><html manifest="edueditor.manifest">
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>EduEditor</title>
<script src="main.js"></script>
<link rel="stylesheet" type="text/css" href="main.css">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
<meta name="keywords" content="Educational Editor Javascript Python Ruby Typescript"/>
<meta name="description" content="Simple on-line editor for teaching programming."/>
<meta name="apple-mobile-web-app-title" content="EduEditor"/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
</head>
<body>
<div id="editorcontainer">
<div id="menu">
<button onclick="executeCode();"
title="Executes your code (shortcut: ALT+R)">
Run
</button>
<div id="selectLanguageContainer">
<label>Language</label><br />
<select id="selectLanguage"
title="Choose a Programming Language to use."
onchange="languageSelectChanged(this);">
<option value="javascript">JavaScript (ECMAScript)</option>
<option value="python">Python</option>
<option value="ruby">Ruby</option>
</select>
</div>
<div id="selectThemeContainer">
<label>Theme</label><br />
<select id="selectTheme"
title="Choose a Theme to use."
onchange="themeSelectChanged(this);"
style="min-width:8em;">
<option value="bright">Bright</option>
<option value="dark">Dark</option>
</select>
</div>
<div id="editorOptions">
<label title="Auto closes/pairs parentheses, brackets, quotes, etc.">
<input type="checkbox"
id="enableAutoPairing"
value="false"
onchange="autoPairingChanged(this);"/>Auto-pairing
</label>
<br />
<label title="Auto completes code when hitting CTRL+SPACE.">
<input type="checkbox"
id="enableAutoComplete"
value="false"
onchange="autoCompleteChanged(this);"/>Auto-complete
</label>
</div>
</div>
<pre id="usercode"></pre>
<textarea id="executionresult"
readonly>Type your code on the editor above and click "Run".
The result of the execution will be displayed here.
EduEditor, the Educational Editor. V0.2.3 - CopyLeft 2017-2019.</textarea>
</div>
<!-- Ace editor -->
<script src="libs/ace/ace.js" type="text/javascript" charset="utf-8"></script>
<script src="libs/ace/ext-language_tools.js" type="text/javascript" charset="utf-8"></script>
<script async src="libs/ace/mode-ruby.js" type="text/javascript" charset="utf-8"></script>
<script async src="libs/ace/mode-python.js" type="text/javascript" charset="utf-8"></script>
<!-- Opan (Ruby) -->
<script src="libs/opal/opal.min.js" type="text/javascript" charset="utf-8"></script>
<script src="libs/opal/opal-parser.min.js" type="text/javascript" charset="utf-8"></script>
<!-- Brython (Python) -->
<script src="libs/brython/brython.js" type="text/javascript" charset="utf-8"></script>
<script src="libs/brython/brython_stdlib.js" type="text/javascript" charset="utf-8"></script>
<script>
// Loads and configure Ace editor.
ace.require("ace/ext/language_tools");
let editor = ace.edit("usercode");
editor.setTheme("ace/theme/tomorrow");
editor.session.setMode("ace/mode/javascript");
editor.setFontSize(15);
editor.focus();
// Loads Opal (ruby).
Opal.load('opal-parser');
// Loads Brython (python).
brython(1);
</script>
</body>
</html>