restart scene

package.json

@@ -76,6 +76,7 @@
     "identity-obj-proxy": "^3.0.0",
     "jest-resolve": "^27.4.2",
     "jest-watch-typeahead": "^2.2.2",
+    "js-interpreter": "^5.1.2",
     "makensis": "^2.0.8",
     "mini-css-extract-plugin": "^2.4.5",
     "pilas-bloques-exercises": "^1.4.31",
@@ -262,4 +263,4 @@
       "react-app"
     ]
   }
-}
+}

src/components/blockly/blockly.ts

@@ -1485,4 +1485,6 @@ export const setupBlockly = (container: Element, workspaceConfiguration: Blockly
   container.replaceChildren() //Removes previous injection, otherwise it might keep inserting below the current workspace
   container.ariaValueText = 'child-blockly'
   Blockly.inject(container, workspaceConfiguration)
-}
+}
+
+export const workspaceToCode = () => javascriptGenerator.workspaceToCode(Blockly.getMainWorkspace())

src/components/challengeView/scene.ts → src/components/challengeView/Scene/scene.ts

@@ -1,5 +1,5 @@
-import { adaptURL } from "../../scriptLoader";
-import { Challenge } from "../../staticData/challenges";
+import { adaptURL } from "../../../scriptLoader";
+import { Challenge } from "../../../staticData/challenges";
 
 class Scene {
     iframe(): HTMLIFrameElement {
@@ -76,6 +76,11 @@ class Scene {
         const name = sceneDescriptor.match(/new\s+(\w+)\s*\(/)
         return name ? name[1] : sceneDescriptor
     }
+
+    async restartScene(descriptor: Challenge["sceneDescriptor"]) {
+        this.eval('pilas.reiniciar()')
+        await this.setChallenge(descriptor)
+    }
 }
 
 export const scene = new Scene()

src/components/challengeView/SceneButtons/Execute.tsx

@@ -0,0 +1,25 @@
+import { Button } from "@mui/material"
+import { workspaceToCode } from "../../blockly/blockly"
+//@ts-ignore
+import Interpreter from 'js-interpreter'
+import { scene } from "../Scene/scene"
+
+export const ExecuteButton = () => {
+
+    const handleExcecute = async () => {
+        await scene.restartScene('new EscenaLita(["[[A,-,-],[-,-,-],[-,-,-]]"])') //TODO context para el challenge? de donde lo saco? esta en muchos lugares como parametro???? vale la pena?
+        const interpreter = new Interpreter(workspaceToCode())
+
+        //create interpreter new Interpreter
+        //execute until end
+    }
+
+    return <Button variant="contained" color="success" onClick={handleExcecute}>{"Ejecutar"}</Button>
+
+}
+
+class InterpreterFactory {
+    createInterpreter() : void {
+
+    } 
+}

src/components/challengeView/SceneButtons/SceneButtons.tsx

@@ -1,22 +1,23 @@
-import { Button, IconButton, Stack } from "@mui/material"
+import { IconButton, Stack } from "@mui/material"
 import { PBCard } from "../../PBCard"
 import { Circle, Info, PlayArrow, SkipNext } from "@mui/icons-material"
 import { PBSwitch, pbIconStyle } from "../../PBSwitch"
 import styles from './sceneButtons.module.css'
 import BoltIcon from '@mui/icons-material/Bolt';
 import { useThemeContext } from "../../../theme/ThemeContext";
+import { ExecuteButton } from "./Execute"
 
 export const SceneButtons = () => {
     return <PBCard>
-        <Button variant="contained" color="success" >{"Ejecutar"}</Button>
+        <ExecuteButton/>
     </PBCard>
 }
 
 export const SceneButtonsVertical = () => {
     return <Stack gap={2} alignItems='center'>
         <TurboModeSwitch />
         <NextStepButton />
-        <ExecuteButton />
+        <ExcecuteButtonVertical />
     </Stack>
 }
 
@@ -29,7 +30,7 @@ const NextStepButton = () => {
     </IconButton>
 }
 
-const ExecuteButton = () => {
+const ExcecuteButtonVertical = () => {
     return <IconButton className={styles['icon-button']}>
         <Stack>
             <Circle color='success' className={styles['circle-icon']} />

src/components/challengeView/SceneView.tsx

@@ -1,6 +1,6 @@
 import { Challenge } from "../../staticData/challenges"
 import { PBCard } from "../PBCard"
-import { scene } from "./scene"
+import { scene } from "./Scene/scene"
 import { useMediaQuery } from "@mui/material"
 import { useThemeContext } from "../../theme/ThemeContext"
 import { useState } from "react"