-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
114 lines (113 loc) · 6.03 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
107
108
109
110
111
112
113
114
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Copyright © BalaM314, 2025. All Rights Reserved. -->
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="title" content="Soodocode" />
<meta property="og:title" content="Soodocode" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://balam314.github.io/soodocode/" />
<meta name="description" content="Soodocode is a runtime for Cambridge (IGCSE or AS/A) CS pseudocode. Enter your code and see if it works!">
<meta property="og:description" content="Soodocode is a runtime for Cambridge (IGCSE or AS/A) CS pseudocode. Enter your code and see if it works!" />
<meta name="theme-color" content="#008000">
<meta name="keywords" content="pseudocode,pseudocode runtime,CAIE pseudocode,IGCSE pseudocode,AS A pseudocode,Cambridge CS pseudocode,Cambridge pseudocode,Cambridge CS pseudocode runtime,Cambridge pseudocode interpreter,Cambridge pseudocode compiler">
<title>Soodocode Runtime</title>
<link rel="stylesheet" href="index.css">
<base target="_blank">
<script>
if(!Array.prototype.findLastIndex){
Array.prototype.findLastIndex = function(pred, thisArg){
for(let i = this.length - 1; i >= 0; i --){
if(pred.call(thisArg, this[i])) return i;
}
return -1;
}
}
</script>
<script src="ui/build/ui.js" type="module" defer></script>
</head>
<body>
<div id="outer">
<div id="left">
<textarea name="soodocode-input" id="soodocode-input" aria-label="Code input area" autofocus spellcheck="false"></textarea>
</div>
<div id="right">
<div id="header">
<a href="https://github.com/BalaM314/soodocode" target="_blank" id="github-icon" aria-label="Link to source code on GitHub" class="second-focusable-element"></a>
<span id="header-text" title="hey there, something cool happens when you click this, also try holding shift, control, or alt">Soodocode Runtime</span>
<button id="theme-button">
<span class="material-icons"></span>
</button>
</div>
Run and check pseudocode that uses Cambridge AS/A level CS (9618) syntax. (defined <a href="https://www.cambridgeinternational.org/Images/697401-2026-pseudocode-guide-for-teachers.pdf">here</a>)
<div class="horizontal" style="margin-top: 20px;">
<button id="execute-soodocode-button">Execute</button>
<button id="dump-tokens-button">Parse</button>
<span id="settings-dialog-button" class="text-button dialog-button" style="font-size: 25px; color: #CFC;" aria-haspopup="dialog" tabindex="0" role="button">Settings 🛠</span>
<span id="files-dialog-button" class="text-button dialog-button" style="font-size: 25px; color: #FCC;" aria-haspopup="dialog" tabindex="0" role="button">Files 📂</span>
<span id="programs-dialog-button" class="text-button dialog-button" style="font-size: 25px; color: #CCF;" aria-haspopup="dialog" tabindex="0" role="button">Programs 📝</span>
</div>
<h2>Program output</h2>
<div id="output-div" class="output-div"></div>
<dialog id="settings-dialog" class="dialog">
<div id="settings-header" class="dialog-header">
<span id="settings-header-text">Settings</span>
</div>
<span id="settings-dialog-close" class="text-button dialog-close" role="button" aria-label="close" tabindex="0" onclick="document.getElementById('settings-dialog').close()">❌</span>
<div id="settings-dialog-inner">
<!-- Generated in TS -->
</div>
<div id="settings-dialog-footer">
<div>Changes are saved automatically.</div>
<span id="settings-dialog-reset-default" class="text-button" role="button" tabindex="0">Reset to defaults 🗑</span>
</div>
</dialog>
<dialog id="files-dialog" class="dialog">
<div id="files-dialog-inner">
<div id="files-header" class="dialog-header">
<span id="files-header-text">Files</span>
</div>
<span id="files-dialog-close" class="text-button dialog-close" role="button" aria-label="close" tabindex="0" onclick="document.getElementById('files-dialog').close()">❌</span>
<div id="files-dialog-select-line">
<div id="files-dialog-select-line-left">
<label for="files-dialog-select">
Select File
</label>
<select id="files-dialog-select" name="files-dialog-select" autofocus="false">
<option id="files-dialog-select-none" value="none" selected>(no file selected)</option>
</select>
</div>
<div id="files-dialog-select-line-right">
<span id="files-dialog-download" class="text-button" role="button" tabindex="0" style="font-size: 20px; color: #CCF;">Download ⇓</span>
<span id="files-dialog-upload" class="text-button" role="button" tabindex="0" style="font-size: 20px; color: #CCF;">Upload ⇑</span>
<span id="files-dialog-create" class="text-button" role="button" tabindex="0" style="font-size: 20px; color: #CFC;">Create ➕</span>
<span id="files-dialog-delete" class="text-button" role="button" tabindex="0" style="font-size: 20px; color: #F88;">Delete 🗑</span>
</div>
</div>
<textarea id="files-dialog-contents" disabled></textarea>
</div>
</dialog>
<dialog id="sample-programs-dialog" class="dialog">
<div id="sample-programs-inner">
<div id="sample-programs-header" class="dialog-header">
<span id="sample-programs-header-text">Sample Programs</span>
</div>
<span id="sample-programs-close" class="text-button dialog-close" role="button" aria-label="close" tabindex="0" onclick="document.getElementById('sample-programs-dialog').close()">❌</span>
<div id="sample-programs-content">
<!-- Generated in TS -->
</div>
</div>
</dialog>
<footer>
Copyright © <a href="https://github.com/BalaM314">BalaM314</a>, 2025. All Rights Reserved. <a href="https://github.com/BalaM314/soodocode">Open source.</a>
</footer>
</div>
</div>
<div class="hidden">
<input type="file" name="upload-button" id="upload-button">
<input type="file" name="file-dialog-upload-button" id="file-dialog-upload-button">
</div>
</body>
</html>