8000 add support for std-out and std-err attributes in py-repl and py-script · Positive-Conative/pyscript@b38d2e5 · GitHub
[go: up one dir, main page]
Skip to content

Commit b38d2e5

Browse files
fpligerfpliger
committed
add support for std-out and std-err attributes in py-repl and py-script
1 parent 57d6ae9 commit b38d2e5

File tree

4 files changed

+70
-25
lines changed

4 files changed

+70
-25
lines changed

‎pyscriptjs/examples/repl2.html

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,9 +20,12 @@
2020
</py-env>
2121

2222
<body>
23+
<h1 class="font-semibold text-2xl ml-5">Custom REPL</h1>
2324
<py-box widths="2/3;1/3">
24-
<py-repl id="my-repl" auto-generate="true" output="output"> </py-repl>
25+
<py-repl id="my-repl" auto-generate="true" std-out="output" std-err="err-div"> </py-repl>
2526
<div id="output"></div>
2627
</py-box>
28+
<footer id="err-div" class="bg-red-700 text-white text-center border-t-4 border-gree-500 fixed inset-x-0 bottom-0 p-4 hidden">
29+
</footer>
2730
</body>
2831
</html>

‎pyscriptjs/src/components/base.ts

Lines changed: 14 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,8 @@ export class BaseEvalElement extends HTMLElement {
3535
source: string;
3636
btnConfig: HTMLElement;
3737
btnRun: HTMLElement;
38-
outputElement: HTMLElement; //HTMLTextAreaElement;
38+
outputElement: HTMLElement;
39+
errorElement: HTMLElement;
3940
theme: string;
4041

4142
constructor() {
@@ -115,32 +116,38 @@ export class BaseEvalElement extends HTMLElement {
115116
await this._register_esm(pyodide);
116117

117118
if (source.includes("asyncio")){
118-
await pyodide.runPythonAsync(`output_manager.change("`+this.outputElement.id+`")`);
119+
await pyodide.runPythonAsync(`output_manager.change("`+this.outputElement.id+`", "`+this.errorElement.id+`")`);
119120
output = await pyodide.runPythonAsync(source);
120121
await pyodide.runPythonAsync(`output_manager.revert()`)
121122
}else{
122-
output = pyodide.runPython(`output_manager.change("`+this.outputElement.id+`")`);
123+
output = pyodide.runPython(`output_manager.change("`+this.outputElement.id+`", "`+this.errorElement.id+`")`);
123124
output = pyodide.runPython(source);
124125
pyodide.runPython(`output_manager.revert()`)
125126
}
126127

127128
if (output !== undefined){
128129
if (Element === undefined){
129-
Element = pyodide.globals.get('Element');
130+
Element = pyodide.globals.get('Element');
130131
}
131132
const out = Element(this.outputElement.id);
132133
// @ts-ignore
133134
out.write.callKwargs(output, { append : true});
134135

135-
if (!this.hasAttribute('output')) {
136136
this.outputElement.hidden = false;
137+
this.outputElement.style.display = 'block';
137138
}
138-
}
139139

140140
this.postEvaluate()
141141

142142
} catch (err) {
143-
this.addToOutput(err);
143+
if (Element === undefined){
144+
Element = pyodide.globals.get('Element');
145+
}
146+
const out = Element(this.errorElement.id 67F4 );
147+
// @ts-ignore
148+
out.write.callKwargs(err, { append : true});
149+
this.errorElement.hidden = false;
150+
this.errorElement.style.display = 'block';
144151
}
145152
}
146153
}

‎pyscriptjs/src/components/pyrepl.ts

Lines changed: 28 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,7 @@ export class PyRepl extends BaseEvalElement {
100100
})
101101

102102
let mainDiv = document.createElement('div');
103-
addClasses(mainDiv, ["parentBox", "group", "flex", "flex-col", "mt-10", "border-2", "border-gray-200", "rounded-lg"])
103+
addClasses(mainDiv, ["parentBox", "group", "flex", "flex-col", "mt-2", "border-2", "border-gray-200", "rounded-lg"])
104104
// add Editor to main PyScript div
105105

106106
// Butons DIV
@@ -161,22 +161,34 @@ export class PyRepl extends BaseEvalElement {
161161
}
162162

163163
if (this.hasAttribute('output')) {
164-
this.outputElement = document.getElementById(this.getAttribute('output'));
164+
this.errorElement = this.outputElement = document.getElementById(this.getAttribute('output'));
165165

166166
// in this case, the default output-mode is append, if hasn't been specified
167167
if (!this.hasAttribute('output-mode')) {
168168
this.setAttribute('output-mode', 'append');
169169
}
170170
}else{
171-
// Editor Output Div
172-
this.outputElement = document.createElement('div');
173-
this.outputElement.classList.add("output");
174-
this.outputElement.hidden = true;
175-
this.outputElement.id = this.id + "-" + this.getAttribute("exec-id");
176-
177-
// add the output div id if there's not output pre-defined
178-
mainDiv.appendChild(this.outputElement);
171+
if (this.hasAttribute('std-out')){
172+
this.outputElement = document.getElementById(this.getAttribute('std-out'));
173+
}else{
174+
// In this case neither output or std-out have been provided so we need
175+
// to create a new output div to output to
176+
this.outputElement = document.createElement('div');
177+
this.outputElement.classList.add("output");
178+
this.outputElement.hidden = true;
179+
this.outputElement.id = this.id + "-" + this.getAttribute("exec-id");
180+
181+
// add the output div id if there's not output pre-defined
182+
mainDiv.appendChild(this.outputElement);
183+
}
184+
185+
if (this.hasAttribute('std-err')){
186+
this.errorElement = document.getElementById(this.getAttribute('std-err'));
187+
}else{
188+
this.errorElement = this.outputElement;
189+
}
179190
}
191+
180192

181193
this.appendChild(mainDiv);
182194
this.editor.focus();
@@ -198,6 +210,12 @@ export class PyRepl extends BaseEvalElement {
198210
if (this.hasAttribute('output')){
199211
newPyRepl.setAttribute('output', this.getAttribute('output'));
200212
}
213+
if (this.hasAttribute('std-out')){
214+
newPyRepl.setAttribute('std-out', this.getAttribute('std-out'));
215+
}
216+
if (this.hasAttribute('std-err')){
217+
newPyRepl.setAttribute('std-err', this.getAttribute('std-err'));
218+
}
201219

202220
newPyRepl.setAttribute('exec-id', nextExecId.toString());
203221
this.parentElement.appendChild(newPyRepl);

‎pyscriptjs/src/components/pyscript.ts

Lines changed: 24 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -173,15 +173,32 @@ export class PyScript extends BaseEvalElement {
173173
mainDiv.appendChild(eDiv);
174174

175175
if (this.hasAttribute('output')) {
176-
this.outputElement = document.getElementById(this.getAttribute('output'));
176+
this.errorElement = this.outputElement = document.getElementById(this.getAttribute('output'));
177+
178+
// in this case, the default output-mode is append, if hasn't been specified
179+
if (!this.hasAttribute('output-mode')) {
180+
this.setAttribute('output-mode', 'append');
181+
}
177182
}else{
178-
// Editor Output Div
179-
this.outputElement = document.createElement('div');
180-
this.outputElement.classList.add("output");
181-
this.outputElement.hidden = true;
183+
if (this.hasAttribute('std-out')){
184+
this.outputElement = document.getElementById(this.getAttribute('std-out'));
185+
}else{
186+
// In this case neither output or std-out have been provided so we need
187+
// to create a new output div to output to
188+
this.outputElement = document.createElement('div');
189+
this.outputElement.classList.add("output");
190+
this.outputElement.hidden = true;
191+
this.outputElement.id = this.id + "-" + this.getAttribute("exec-id");
192+
193+
// add the output div id if there's not output pre-defined
194+
mainDiv.appendChild(this.outputElement);
195+
}
182196

183-
// add the output div id there's no output element
184-
mainDiv.appendChild(this.outputElement);
197+
if (this.hasAttribute('std-err')){
198+
this.outputElement = document.getElementById(this.getAttribute('std-err'));
199+
}else{
200+
this.errorElement = this.outputElement;
201+
}
185202
}
186203

187204
if (currentMode=="edit"){

0 commit comments

Comments
 (0)
0