docusaurus-live-brython 3.0.0-beta.24 → 3.0.0-beta.25
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +5 -0
- package/lib/theme/CodeEditor/Editor/Result/Graphics/index.d.ts.map +1 -1
- package/lib/theme/CodeEditor/Editor/Result/Graphics/index.jsx +2 -1
- package/lib/theme/CodeEditor/Editor/index.jsx +2 -2
- package/lib/theme/CodeEditor/WithScript/Types.d.ts +1 -1
- package/lib/theme/CodeEditor/WithScript/Types.d.ts.map +1 -1
- package/lib/theme/CodeEditor/WithScript/createStore.js +3 -3
- package/package.json +1 -1
- package/src/theme/CodeEditor/Editor/Result/Graphics/index.tsx +2 -1
- package/src/theme/CodeEditor/Editor/index.tsx +2 -2
- package/src/theme/CodeEditor/WithScript/Types.ts +1 -1
- package/src/theme/CodeEditor/WithScript/bryRunner.ts +1 -1
- package/src/theme/CodeEditor/WithScript/createStore.ts +3 -3
package/CHANGELOG.md
ADDED
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
# Changelog
|
|
2
|
+
|
|
3
|
+
## Version 3.0.0beta.25
|
|
4
|
+
- Breaking: Renamed `isGraphicsmodalOpen` to `graphicsModalExecutionNr` and changing it's type from `boolean` to `number`.
|
|
5
|
+
This fixes an issue that caused the Turtle Output to display the first animation instead of the current created one, when the user kept the graphics modal open while changing the code.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/theme/CodeEditor/Editor/Result/Graphics/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,MAAM,WAAW,KAAK;IAClB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACvB,IAAI,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;CACtB;AACD,QAAA,MAAM,QAAQ,UAAW,KAAK,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/theme/CodeEditor/Editor/Result/Graphics/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,MAAM,WAAW,KAAK;IAClB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACvB,IAAI,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;CACtB;AACD,QAAA,MAAM,QAAQ,UAAW,KAAK,sBA4B7B,CAAC;AAEF,eAAe,QAAQ,CAAC"}
|
|
@@ -9,6 +9,7 @@ import clsx from 'clsx';
|
|
|
9
9
|
const Graphics = (props) => {
|
|
10
10
|
const store = useStore();
|
|
11
11
|
const codeId = useScript(store, 'codeId');
|
|
12
|
+
const graphicsModalExecutionNr = useScript(store, 'graphicsModalExecutionNr');
|
|
12
13
|
const nodeRef = React.useRef(null);
|
|
13
14
|
return (<Draggable onStop={checkForButtonClick} positionOffset={{ x: '15%', y: '25%' }} nodeRef={nodeRef}>
|
|
14
15
|
<div className={styles.brythonGraphicsResult} ref={nodeRef}>
|
|
@@ -21,7 +22,7 @@ const Graphics = (props) => {
|
|
|
21
22
|
store.closeGraphicsModal();
|
|
22
23
|
}} iconSize="12px"/>
|
|
23
24
|
</div>
|
|
24
|
-
<div id={DOM_ELEMENT_IDS.graphicsResult(codeId)} className="brython-graphics-result">
|
|
25
|
+
<div id={DOM_ELEMENT_IDS.graphicsResult(codeId)} className="brython-graphics-result" key={`exec-${graphicsModalExecutionNr}`}>
|
|
25
26
|
{props.main}
|
|
26
27
|
</div>
|
|
27
28
|
</div>
|
|
@@ -16,7 +16,7 @@ const Editor = (props) => {
|
|
|
16
16
|
const codeId = useScript(store, 'codeId');
|
|
17
17
|
const hasCanvasOutput = useScript(store, 'hasCanvasOutput');
|
|
18
18
|
const hasTurtleOutput = useScript(store, 'hasTurtleOutput');
|
|
19
|
-
const
|
|
19
|
+
const graphicsModalExecutionNr = useScript(store, 'graphicsModalExecutionNr');
|
|
20
20
|
return (<React.Fragment>
|
|
21
21
|
<Header slim={props.slim} title={props.title} resettable={props.resettable} download={props.download} noCompare={props.noCompare}/>
|
|
22
22
|
<div className={clsx(styles.editorContainer)}>
|
|
@@ -27,7 +27,7 @@ const Editor = (props) => {
|
|
|
27
27
|
{lang === 'python' && (<>
|
|
28
28
|
<Result />
|
|
29
29
|
<div id={DOM_ELEMENT_IDS.outputDiv(codeId)}></div>
|
|
30
|
-
{
|
|
30
|
+
{graphicsModalExecutionNr > 0 && (<>
|
|
31
31
|
{hasTurtleOutput && <Turtle />}
|
|
32
32
|
{hasCanvasOutput && <Canvas />}
|
|
33
33
|
{!hasCanvasOutput && !hasTurtleOutput && <Graphics />}
|
|
@@ -31,7 +31,7 @@ export interface Script extends StoredScript {
|
|
|
31
31
|
postCode: string;
|
|
32
32
|
lang: 'py' | string;
|
|
33
33
|
logs: LogMessage[];
|
|
34
|
-
|
|
34
|
+
graphicsModalExecutionNr: number;
|
|
35
35
|
hasGraphicsOutput: boolean;
|
|
36
36
|
hasTurtleOutput: boolean;
|
|
37
37
|
hasCanvasOutput: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Types.d.ts","sourceRoot":"","sources":["../../../../src/theme/CodeEditor/WithScript/Types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,OAAO;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,IAAI,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,YAAY;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,IAAI,CAAC;IAChB,SAAS,EAAE,IAAI,CAAC;IAChB,QAAQ,EAAE,OAAO,EAAE,CAAC;CACvB;AAED,MAAM,MAAM,QAAQ,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,CAAC;AAC7C,MAAM,WAAW,MAAO,SAAQ,YAAY;IACxC;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;;;;;OAMG;IACH,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,IAAI,GAAG,MAAM,CAAC;IACpB,IAAI,EAAE,UAAU,EAAE,CAAC;IACnB,
|
|
1
|
+
{"version":3,"file":"Types.d.ts","sourceRoot":"","sources":["../../../../src/theme/CodeEditor/WithScript/Types.ts"],"names":[],"mappings":"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"}
|
|
@@ -115,7 +115,7 @@ export const createStore = (props, libDir, syncMaxOnceEvery, router) => {
|
|
|
115
115
|
setState((s) => ({
|
|
116
116
|
...s,
|
|
117
117
|
isExecuting: true,
|
|
118
|
-
|
|
118
|
+
graphicsModalExecutionNr: state.hasGraphicsOutput ? state.graphicsModalExecutionNr + 1 : 0
|
|
119
119
|
}));
|
|
120
120
|
runCode(state.code, state.preCode, state.postCode, codeId, libDir, router);
|
|
121
121
|
};
|
|
@@ -169,7 +169,7 @@ export const createStore = (props, libDir, syncMaxOnceEvery, router) => {
|
|
|
169
169
|
setState((s) => ({ ...s, logs: [] }));
|
|
170
170
|
};
|
|
171
171
|
const closeGraphicsModal = () => {
|
|
172
|
-
setState((s) => ({ ...s,
|
|
172
|
+
setState((s) => ({ ...s, graphicsModalExecutionNr: 0 }));
|
|
173
173
|
};
|
|
174
174
|
const stopScript = () => {
|
|
175
175
|
const code = document.getElementById(DOM_ELEMENT_IDS.communicator(state.codeId));
|
|
@@ -185,7 +185,7 @@ export const createStore = (props, libDir, syncMaxOnceEvery, router) => {
|
|
|
185
185
|
pristineCode: codeData.code,
|
|
186
186
|
isExecuting: false,
|
|
187
187
|
logs: [],
|
|
188
|
-
|
|
188
|
+
graphicsModalExecutionNr: 0,
|
|
189
189
|
hasEdits: false,
|
|
190
190
|
createdAt: createdAt,
|
|
191
191
|
isLoaded: false,
|
package/package.json
CHANGED
|
@@ -13,6 +13,7 @@ export interface Props {
|
|
|
13
13
|
const Graphics = (props: Props) => {
|
|
14
14
|
const store = useStore();
|
|
15
15
|
const codeId = useScript(store, 'codeId');
|
|
16
|
+
const graphicsModalExecutionNr = useScript(store, 'graphicsModalExecutionNr');
|
|
16
17
|
const nodeRef = React.useRef(null);
|
|
17
18
|
return (
|
|
18
19
|
<Draggable onStop={checkForButtonClick} positionOffset={{ x: '15%', y: '25%' }} nodeRef={nodeRef}>
|
|
@@ -31,7 +32,7 @@ const Graphics = (props: Props) => {
|
|
|
31
32
|
iconSize="12px"
|
|
32
33
|
/>
|
|
33
34
|
</div>
|
|
34
|
-
<div id={DOM_ELEMENT_IDS.graphicsResult(codeId)} className="brython-graphics-result">
|
|
35
|
+
<div id={DOM_ELEMENT_IDS.graphicsResult(codeId)} className="brython-graphics-result" key={`exec-${graphicsModalExecutionNr}`}>
|
|
35
36
|
{props.main}
|
|
36
37
|
</div>
|
|
37
38
|
</div>
|
|
@@ -32,7 +32,7 @@ const Editor = (props: Props) => {
|
|
|
32
32
|
const codeId = useScript(store, 'codeId');
|
|
33
33
|
const hasCanvasOutput = useScript(store, 'hasCanvasOutput');
|
|
34
34
|
const hasTurtleOutput = useScript(store, 'hasTurtleOutput');
|
|
35
|
-
const
|
|
35
|
+
const graphicsModalExecutionNr = useScript(store, 'graphicsModalExecutionNr');
|
|
36
36
|
|
|
37
37
|
return (
|
|
38
38
|
<React.Fragment>
|
|
@@ -57,7 +57,7 @@ const Editor = (props: Props) => {
|
|
|
57
57
|
<>
|
|
58
58
|
<Result />
|
|
59
59
|
<div id={DOM_ELEMENT_IDS.outputDiv(codeId)}></div>
|
|
60
|
-
{
|
|
60
|
+
{graphicsModalExecutionNr > 0 && (
|
|
61
61
|
<>
|
|
62
62
|
{hasTurtleOutput && <Turtle />}
|
|
63
63
|
{hasCanvasOutput && <Canvas />}
|
|
@@ -33,7 +33,7 @@ export interface Script extends StoredScript {
|
|
|
33
33
|
postCode: string;
|
|
34
34
|
lang: 'py' | string;
|
|
35
35
|
logs: LogMessage[];
|
|
36
|
-
|
|
36
|
+
graphicsModalExecutionNr: number;
|
|
37
37
|
hasGraphicsOutput: boolean;
|
|
38
38
|
hasTurtleOutput: boolean;
|
|
39
39
|
hasCanvasOutput: boolean;
|
|
@@ -23,7 +23,7 @@ export const runCode = (
|
|
|
23
23
|
return;
|
|
24
24
|
}
|
|
25
25
|
const active = document.getElementById(DOM_ELEMENT_IDS.communicator(codeId));
|
|
26
|
-
active
|
|
26
|
+
active!.setAttribute('data--start-time', `${Date.now()}`);
|
|
27
27
|
/**
|
|
28
28
|
* ensure that the script is executed after the current event loop.
|
|
29
29
|
* Otherwise, the brython script will not be able to access the graphics output.
|
|
@@ -139,7 +139,7 @@ export const createStore = (
|
|
|
139
139
|
setState((s) => ({
|
|
140
140
|
...s,
|
|
141
141
|
isExecuting: true,
|
|
142
|
-
|
|
142
|
+
graphicsModalExecutionNr: state.hasGraphicsOutput ? state.graphicsModalExecutionNr + 1 : 0
|
|
143
143
|
}));
|
|
144
144
|
runCode(state.code, state.preCode, state.postCode, codeId, libDir, router);
|
|
145
145
|
};
|
|
@@ -200,7 +200,7 @@ export const createStore = (
|
|
|
200
200
|
setState((s) => ({ ...s, logs: [] }));
|
|
201
201
|
};
|
|
202
202
|
const closeGraphicsModal = () => {
|
|
203
|
-
setState((s) => ({ ...s,
|
|
203
|
+
setState((s) => ({ ...s, graphicsModalExecutionNr: 0 }));
|
|
204
204
|
};
|
|
205
205
|
const stopScript = () => {
|
|
206
206
|
const code = document.getElementById(DOM_ELEMENT_IDS.communicator(state.codeId));
|
|
@@ -216,7 +216,7 @@ export const createStore = (
|
|
|
216
216
|
pristineCode: codeData.code,
|
|
217
217
|
isExecuting: false,
|
|
218
218
|
logs: [],
|
|
219
|
-
|
|
219
|
+
graphicsModalExecutionNr: 0,
|
|
220
220
|
hasEdits: false,
|
|
221
221
|
createdAt: createdAt,
|
|
222
222
|
isLoaded: false,
|