jprdonnelly/pyscript
1
0
Fork 0
mirror of https://github.com/pyscript/pyscript.git synced 2025-12-21 19:25:35 -05:00
Code Issues Projects Releases Wiki Activity

[PROPOSAL] REPL output replacement (#439)

Browse Source 
* fix OutputManager _append setter

* fix OutputManager change parameters

* fix OutputCtxManager __init__ and change methods

* replacing OutputManager pyscript.write with write function

* add optional output-append attribute to py-repl

* add appendOutput(default: true) to base component

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* Update pyscriptjs/src/components/pyrepl.ts

Co-authored-by: woxtu <woxtup@gmail.com>

* change from output-append flag to output-mode attribute

* removed type annotation

* repositioned setOutputMode call for auto-generated REPLs to work

* fixed indentation error for indented input

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* added preEvaluate method

* moved output-mode logic to preEvaluate

* remove static write method from PyScript, add write method to Element

* removed err parameter from OutputCtxManager

* [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci

* add PyScript.write back with a deprecation warning

* fix wrong input name

Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>
Co-authored-by: woxtu <woxtup@gmail.com>
Co-authored-by: Fabio Pliger <fabio.pliger@gmail.com>
This commit is contained in:
marianoweber
2022-05-25 00:58:48 +02:00
committed by GitHub
parent 2f03b18619
commit f712b1369a
3 changed files with 93 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
pyscriptjs/src/components/base.ts
View File

@@ -32,6 +32,7 @@ export class BaseEvalElement extends HTMLElement {
outputElement: HTMLElement;
errorElement: HTMLElement;
theme: string;
appendOutput: boolean;
constructor() {
super();
@@ -40,6 +41,7 @@ export class BaseEvalElement extends HTMLElement {
this.shadow = this.attachShadow({ mode: 'open' });
this.wrapper = document.createElement('slot');
this.shadow.appendChild(this.wrapper);
this.setOutputMode("append");
}
addToOutput(s: string) {
@@ -47,9 +49,30 @@ export class BaseEvalElement extends HTMLElement {
this.outputElement.hidden = false;
}
setOutputMode(defaultMode = "append") {
const mode = this.hasAttribute('output-mode') ? this.getAttribute('output-mode') : defaultMode;
switch (mode) {
case "append":
this.appendOutput = true;
break;
case "replace":
this.appendOutput = false;
break;
default:
console.log(`${this.id}: custom output-modes are currently not implemented`);
}
}
// subclasses should overwrite this method to define custom logic
// before code gets evaluated
preEvaluate(): void {
return null;
}
// subclasses should overwrite this method to define custom logic
// after code has been evaluated
postEvaluate() {
postEvaluate(): void {
return null;
}
@@ -99,6 +122,8 @@ export class BaseEvalElement extends HTMLElement {
async evaluate(): Promise<void> {
console.log('evaluate');
this.preEvaluate();
const pyodide = runtime;
let source: string;
let output;
@@ -110,13 +135,13 @@ export class BaseEvalElement extends HTMLElement {
if (source.includes('asyncio')) {
await pyodide.runPythonAsync(
`output_manager.change("` + this.outputElement.id + `", "` + this.errorElement.id + `")`,
`output_manager.change(out="${this.outputElement.id}", err="${this.errorElement.id}", append=${this.appendOutput ? 'True' : 'False'})`,
);
output = await pyodide.runPythonAsync(source);
await pyodide.runPythonAsync(`output_manager.revert()`);
} else {
output = pyodide.runPython(
`output_manager.change("` + this.outputElement.id + `", "` + this.errorElement.id + `")`,
`output_manager.change(out="${this.outputElement.id}", err="${this.errorElement.id}", append=${this.appendOutput ? 'True' : 'False'})`,
);
output = pyodide.runPython(source);
pyodide.runPython(`output_manager.revert()`);
@@ -143,8 +168,8 @@ export class BaseEvalElement extends HTMLElement {
this.errorElement.style.removeProperty('display');
}
}
removeClasses(this.errorElement, ['bg-red-200', 'p-2']);
}
removeClasses(this.errorElement, ['bg-red-200', 'p-2']);
this.postEvaluate();
} catch (err) {

26
pyscriptjs/src/components/pyrepl.ts
View File

@@ -141,11 +141,6 @@ export class PyRepl extends BaseEvalElement {
if (this.hasAttribute('output')) {
this.errorElement = this.outputElement = document.getElementById(this.getAttribute('output'));
// in this case, the default output-mode is append, if hasn't been specified
if (!this.hasAttribute('output-mode')) {
this.setAttribute('output-mode', 'append');
}
} else {
if (this.hasAttribute('std-out')) {
this.outputElement = document.getElementById(this.getAttribute('std-out'));
@@ -176,6 +171,13 @@ export class PyRepl extends BaseEvalElement {
this.outputElement.hidden = false;
}
preEvaluate(): void {
this.setOutputMode("replace");
if(!this.appendOutput) {
this.outputElement.innerHTML = '';
}
}
postEvaluate(): void {
this.outputElement.hidden = false;
this.outputElement.style.display = 'block';
@@ -189,8 +191,15 @@ export class PyRepl extends BaseEvalElement {
const newPyRepl = document.createElement('py-repl');
newPyRepl.setAttribute('root', this.getAttribute('root'));
newPyRepl.id = this.getAttribute('root') + '-' + nextExecId.toString();
newPyRepl.setAttribute('auto-generate', '');
this.removeAttribute('auto-generate');
if(this.hasAttribute('auto-generate')) {
newPyRepl.setAttribute('auto-generate', '');
this.removeAttribute('auto-generate');
}
if(this.hasAttribute('output-mode')) {
newPyRepl.setAttribute('output-mode', this.getAttribute('output-mode'));
}
const addReplAttribute = (attribute: string) => {
if (this.hasAttribute(attribute)) {
@@ -209,9 +218,10 @@ export class PyRepl extends BaseEvalElement {
getSourceFromElement(): string {
const sourceStrings = [
`output_manager.change("` + this.outputElement.id + `")`,
`output_manager.change(out="${this.outputElement.id}", append=True)`,
...this.editor.state.doc.toString().split('\n'),
];
return sourceStrings.join('\n');
}

80
pyscriptjs/src/pyscript.py
View File

@@ -107,31 +107,22 @@ def format_mime(obj):
class PyScript:
loop = loop
@staticmethod
def write(element_id, value, append=False, exec_id=0):
"""Writes value to the element with id "element_id"""
console.log(f"APPENDING: {append} ==> {element_id} --> {value}")
if append:
child = document.createElement("div")
element = document.querySelector(f"#{element_id}")
if not element:
return
exec_id = exec_id or element.childElementCount + 1
element_id = child.id = f"{element_id}-{exec_id}"
element.appendChild(child)
element = document.getElementById(element_id)
html, mime_type = format_mime(value)
if mime_type in ("application/javascript", "text/html"):
script_element = document.createRange().createContextualFragment(html)
element.appendChild(script_element)
else:
element.innerHTML = html
@staticmethod
def run_until_complete(f):
_ = loop.run_until_complete(f)
@staticmethod
def write(element_id, value, append=False, exec_id=0):
"""Writes value to the element with id "element_id"""
Element(element_id).write(value=value, append=append)
console.warn(
dedent(
"""PyScript Deprecation Warning: PyScript.write is
marked as deprecated and will be removed sometime soon. Please, use
Element(<id>).write instead."""
)
)
class Element:
def __init__(self, element_id, element=None):
@@ -159,9 +150,25 @@ class Element:
def write(self, value, append=False):
console.log(f"Element.write: {value} --> {append}")
# TODO: it should be the opposite... pyscript.write should use the Element.write
# so we can consolidate on how we write depending on the element type
pyscript.write(self._id, value, append=append)
out_element_id = self.id
if append:
child = document.createElement("div")
exec_id = self.element.childElementCount + 1
out_element_id = child.id = f"{self.id}-{exec_id}"
self.element.appendChild(child)
out_element = document.querySelector(f"#{out_element_id}")
html, mime_type = format_mime(value)
if mime_type in ("application/javascript", "text/html"):
script_element = document.createRange().createContextualFragment(html)
out_element.appendChild(script_element)
else:
if html == "\n":
return
out_element.innerHTML = html
def clear(self):
if hasattr(self.element, "value"):
@@ -374,7 +381,7 @@ class OutputCtxManager:
self.output_to_console = output_to_console
self._append = append
def change(self, out=None, err=None, output_to_console=True, append=True):
def change(self, out=None, output_to_console=True, append=True):
self._prev = self._out
self._out = out
self.output_to_console = output_to_console
@@ -385,32 +392,37 @@ class OutputCtxManager:
console.log("----> reverted")
self._out = self._prev
def write(self, txt):
console.log("writing to", self._out, txt, self._append)
def write(self, value):
console.log("writing to", self._out, value, self._append)
if self._out:
pyscript.write(self._out, txt, append=self._append)
Element(self._out).write(value, self._append)
if self.output_to_console:
console.log(self._out, txt)
console.log(self._out, value)
class OutputManager:
def __init__(self, out=None, err=None, output_to_console=True, append=True):
sys.stdout = self._out_manager = OutputCtxManager(
out, output_to_console, append
out=out, output_to_console=output_to_console, append=append
)
sys.stderr = self._err_manager = OutputCtxManager(
err, output_to_console, append
out=err, output_to_console=output_to_console, append=append
)
self.output_to_console = output_to_console
self._append = append
def change(self, out=None, err=None, output_to_console=True, append=True):
self._out_manager.change(out, output_to_console, append)
self._out_manager.change(
out=out, output_to_console=output_to_console, append=append
)
sys.stdout = self._out_manager
self._err_manager.change(err, output_to_console, append)
self._err_manager.change(
out=err, output_to_console=output_to_console, append=append
)
sys.stderr = self._err_manager
self.output_to_console = output_to_console
self.append = append
self._append = append
def revert(self):
self._out_manager.revert()