8000 play button moved to bottom, lint errors fixed · sudhircw/pyscript@9f95485 · GitHub
[go: up one dir, main page]

Skip to content

Commit 9f95485

Browse files
committed
play button moved to bottom, lint errors fixed
1 parent 971b690 commit 9f95485

File tree

2 files changed

+25
-33
lines changed

2 files changed

+25
-33
lines changed

pyscriptjs/src/components/base.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -146,7 +146,6 @@ export class BaseEvalElement extends HTMLElement {
146146
const out = Element(this.errorElement.id);
147147

148148
addClasses(this.errorElement, ['bg-red-200', 'p-2']);
149-
// @ts-ignore
150149
out.write.callKwargs(err, { append : true});
151150
this.errorElement.hidden = false;
152151
this.errorElement.style.display = 'block';

pyscriptjs/src/components/pyrepl.ts

Lines changed: 25 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -66,15 +66,7 @@ export class PyRepl extends BaseEvalElement {
6666
...defaultKeymap,
6767
{ key: "Ctrl-Enter", run: createCmdHandler(this) },
6868
{ key: "Shift-Enter", run: createCmdHandler(this) }
69-
]),
70-
71-
// Event listener function that is called every time an user types something on this editor
72-
// EditorView.updateListener.of((v:ViewUpdate) => {
73-
// if (v.docChanged) {
74-
// console.log(v.changes);
75-
76-
// }
77-
// })
69+
])
7870
];
7971
const customTheme = EditorView.theme({
8072
'&.cm-focused .cm-editor': { outline: '0px' },
@@ -104,29 +96,10 @@ export class PyRepl extends BaseEvalElement {
10496

10597
const mainDiv = document.createElement('div');
10698
addClasses(mainDiv, ["parentBox", "group", "flex", "flex-col", "mt-2", "mx-8", "relative"])
107-
// add Editor to main PyScript div
108-
109-
// Butons DIV
110-
const eDiv = document.createElement('div');
111-
addClasses(eDiv, "buttons-box opacity-0 group-hover:opacity-100 relative right-0 top-4 z-10 flex flex-row-reverse space-x-reverse space-x-4 font-mono text-white text-sm font-bold leading-6 dev-buttons-group".split(" "))
112-
eDiv.setAttribute("role", "group");
113-
114-
// Play Button
115-
this.btnRun = document.createElement('button');
116-
this.btnRun.innerHTML = '<svg id="" class="svelte-fa svelte-ps5qeg" style="height:20px;width:20px;vertical-align:-.125em;transform-origin:center;overflow:visible;color:green" viewBox="0 0 384 512" aria-hidden="true" role="img" xmlns="http://www.w3.org/2000/svg"><g transform="translate(192 256)" transform-origin="96 0"><g transform="translate(0,0) scale(1,1)"><path d="M361 215C375.3 223.8 384 239.3 384 256C384 272.7 375.3 288.2 361 296.1L73.03 472.1C58.21 482 39.66 482.4 24.52 473.9C9.377 465.4 0 449.4 0 432V80C0 62.64 9.377 46.63 24.52 38.13C39.66 29.64 58.21 29.99 73.03 39.04L361 215z" fill="currentColor" transform="translate(-192 -256)"></path></g></g></svg>';
117-
const buttonClasses = ["mr-2", "block"];
118-
addClasses(this.btnRun, buttonClasses);
119-
eDiv.appendChild(this.btnRun);
12099

121-
this.btnRun.onclick = wrap(this);
100+
mainDiv.appendChild(this.editorNode);
101+
// add Editor to main PyScript div
122102

123-
function wrap(el: any){
124-
function evaluatePython() {
125-
el.evaluate();
126-
}
127-
return evaluatePython;
128-
}
129-
130103
// Settings button
131104
// this.btnConfig = document.createElement('button');
132105
// this.btnConfig.innerHTML =
@@ -147,9 +120,29 @@ export class PyRepl extends BaseEvalElement {
147120
// addClasses(this.btnConfig, ['bg-blue-500']);
148121
// eDiv.appendChild(this.btnConfig);
149122

150-
mainDiv.appendChild(eDiv);
151-
mainDiv.appendChild(this.editorNode);
123+
// Butons DIV
124+
const eDiv = document.createElement('div');
125+
addClasses(eDiv, "buttons-box opacity-0 group-hover:opacity-100 relative right-0 -top-4 z-10 flex flex-row-reverse space-x-reverse space-x-4 font-mono text-white text-sm font-bold leading-6 dev-buttons-group".split(" "))
126+
eDiv.setAttribute("role", "group");
127+
128+
// Play Button
129+
this.btnRun = document.createElement('button');
130+
this.btnRun.innerHTML = '<svg id="" class="svelte-fa svelte-ps5qeg" style="height:20px;width:20px;vertical-align:-.125em;transform-origin:center;overflow:visible;color:green" viewBox="0 0 384 512" aria-hidden="true" role="img" xmlns="http://www.w3.org/2000/svg"><g transform="translate(192 256)" transform-origin="96 0"><g transform="translate(0,0) scale(1,1)"><path d="M361 215C375.3 223.8 384 239.3 384 256C384 272.7 375.3 288.2 361 296.1L73.03 472.1C58.21 482 39.66 482.4 24.52 473.9C9.377 465.4 0 449.4 0 432V80C0 62.64 9.377 46.63 24.52 38.13C39.66 29.64 58.21 29.99 73.03 39.04L361 215z" fill="currentColor" transform="translate(-192 -256)"></path></g></g></svg>';
131+
const buttonClasses = ["mr-2", "block"];
132+
addClasses(this.btnRun, buttonClasses);
133+
eDiv.appendChild(this.btnRun);
152134

135+
this.btnRun.onclick = wrap(this);
136+
137+
function wrap(el: any){
138+
function evaluatePython() {
139+
el.evaluate();
140+
}
141+
return evaluatePython;
142+
}
143+
144+
mainDiv.appendChild(eDiv);
145+
153146
if (!this.id) {
154147
console.log(
155148
'WARNING: <pyrepl> define with an id. <pyrepl> should always have an id. More than one <pyrepl> on a page won\'t work otherwise!',

0 commit comments

Comments
 (0)
0