├── README.md ├── images ├── duck.png ├── chicken.png ├── deadDuck.png ├── deadChicken.png ├── arrowDown.svg ├── arrowUp.svg ├── arrowLeft.svg ├── arrowRight.svg ├── deadDuck.svg ├── duck.svg ├── chicken.svg └── deadChicken.svg ├── index.html ├── LICENSE ├── assets ├── favicon.17e50649.svg ├── index.fbbce77b.css ├── index.24cac176.css ├── index.243b1286.js ├── index.153eed94.js └── index.994285b4.js └── .gitignore /README.md: -------------------------------------------------------------------------------- 1 | # blockly-player 2 | A blockly player site for the Munich coding club 3 | -------------------------------------------------------------------------------- /images/duck.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/drFabio/blockly-player/main/images/duck.png -------------------------------------------------------------------------------- /images/chicken.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/drFabio/blockly-player/main/images/chicken.png -------------------------------------------------------------------------------- /images/deadDuck.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/drFabio/blockly-player/main/images/deadDuck.png -------------------------------------------------------------------------------- /images/deadChicken.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/drFabio/blockly-player/main/images/deadChicken.png -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Vite App 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | This is free and unencumbered software released into the public domain. 2 | 3 | Anyone is free to copy, modify, publish, use, compile, sell, or 4 | distribute this software, either in source code form or as a compiled 5 | binary, for any purpose, commercial or non-commercial, and by any 6 | means. 7 | 8 | In jurisdictions that recognize copyright laws, the author or authors 9 | of this software dedicate any and all copyright interest in the 10 | software to the public domain. We make this dedication for the benefit 11 | of the public at large and to the detriment of our heirs and 12 | successors. We intend this dedication to be an overt act of 13 | relinquishment in perpetuity of all present and future rights to this 14 | software under copyright law. 15 | 16 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 17 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF 18 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. 19 | IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR 20 | OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, 21 | ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR 22 | OTHER DEALINGS IN THE SOFTWARE. 23 | 24 | For more information, please refer to 25 | -------------------------------------------------------------------------------- /assets/favicon.17e50649.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /assets/index.fbbce77b.css: -------------------------------------------------------------------------------- 1 | body,html{margin:0;height:100%}#root{width:100%;height:100%;min-height:100vh}.wrapper{width:100%;height:100%;position:relative;display:flex;flex-direction:column}.navigator{display:flex;justify-content:space-evenly}.menu-item{flex-grow:1;text-align:center}.menu-item[data-is-current=true]{font-weight:bold}.menu-item:hover{cursor:pointer}.content-wrapper{flex-grow:1;display:grid;grid-template-rows:1fr 1fr 1fr 1fr;grid-template-columns:1fr 1fr 1fr 1fr}.blockly-container{height:100%;width:100%;grid-area:blockly;position:relative}#blocklyDiv{position:absolute;width:100%;height:100%}.game-area{height:100%;width:100%;grid-area:game;background-color:#f5f5f5}.settings{height:100%;width:100%;grid-area:settings;background-color:#f5f5f5}.content-wrapper.is-code{grid-template-areas:"blockly blockly blockly blockly" "blockly blockly blockly blockly" "blockly blockly blockly blockly" "blockly blockly blockly blockly"}.content-wrapper.is-settings{grid-template-areas:"settings settings settings settings" "settings settings settings settings" "settings settings settings settings" "settings settings settings settings"}.content-wrapper.is-app{grid-template-areas:"game game game game" "game game game game" "game game game game" "game game game game"}.content-wrapper.is-mix{grid-template-areas:"blockly blockly game game" "blockly blockly game game" "blockly blockly game game" "blockly blockly game game"}*{box-sizing:border-box}canvas{background-color:#000}label{min-width:10rem;padding-right:.5rem;text-align:right;font-weight:bold}.innerWrapper{width:100%;margin:0 auto;display:flex;flex-direction:column;max-width:20rem}.settings{position:relative} 2 | -------------------------------------------------------------------------------- /assets/index.24cac176.css: -------------------------------------------------------------------------------- 1 | body,html{margin:0;height:100%}#root{width:100%;height:100%;min-height:100vh}.wrapper{width:100%;height:100%;position:relative;display:flex;flex-direction:column}.navigator{display:flex;justify-content:space-evenly}.menu-item{flex-grow:1;text-align:center}.menu-item[data-is-current=true]{font-weight:bold}.menu-item:hover{cursor:pointer}.content-wrapper{flex-grow:1;display:grid;grid-template-rows:1fr 1fr 1fr 1fr;grid-template-columns:1fr 1fr 1fr 1fr}.blockly-container{height:100%;width:100%;grid-area:blockly;position:relative}#blocklyDiv{position:absolute;width:100%;height:100%}.game-area{height:100%;width:100%;grid-area:game;display:grid;background-color:#f5f5f5;grid-template-columns:1fr;grid-template-rows:min-content 1fr}.settings{height:100%;width:100%;grid-area:settings;background-color:#f5f5f5}.content-wrapper.is-code{grid-template-areas:"blockly blockly blockly blockly" "blockly blockly blockly blockly" "blockly blockly blockly blockly" "blockly blockly blockly blockly"}.content-wrapper.is-settings{grid-template-areas:"settings settings settings settings" "settings settings settings settings" "settings settings settings settings" "settings settings settings settings"}.content-wrapper.is-app{grid-template-areas:"game game game game" "game game game game" "game game game game" "game game game game"}.content-wrapper.is-mix{grid-template-areas:"blockly blockly game game" "blockly blockly game game" "blockly blockly game game" "blockly blockly game game"}*{box-sizing:border-box}canvas{background-color:#000}label{min-width:10rem;padding-right:.5rem;text-align:right;font-weight:bold}.innerWrapper{width:100%;margin:0 auto;display:flex;flex-direction:column;max-width:20rem}.settings{position:relative} 2 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | lerna-debug.log* 8 | 9 | # Diagnostic reports (https://nodejs.org/api/report.html) 10 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json 11 | 12 | # Runtime data 13 | pids 14 | *.pid 15 | *.seed 16 | *.pid.lock 17 | 18 | # Directory for instrumented libs generated by jscoverage/JSCover 19 | lib-cov 20 | 21 | # Coverage directory used by tools like istanbul 22 | coverage 23 | *.lcov 24 | 25 | # nyc test coverage 26 | .nyc_output 27 | 28 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) 29 | .grunt 30 | 31 | # Bower dependency directory (https://bower.io/) 32 | bower_components 33 | 34 | # node-waf configuration 35 | .lock-wscript 36 | 37 | # Compiled binary addons (https://nodejs.org/api/addons.html) 38 | build/Release 39 | 40 | # Dependency directories 41 | node_modules/ 42 | jspm_packages/ 43 | 44 | # TypeScript v1 declaration files 45 | typings/ 46 | 47 | # TypeScript cache 48 | *.tsbuildinfo 49 | 50 | # Optional npm cache directory 51 | .npm 52 | 53 | # Optional eslint cache 54 | .eslintcache 55 | 56 | # Microbundle cache 57 | .rpt2_cache/ 58 | .rts2_cache_cjs/ 59 | .rts2_cache_es/ 60 | .rts2_cache_umd/ 61 | 62 | # Optional REPL history 63 | .node_repl_history 64 | 65 | # Output of 'npm pack' 66 | *.tgz 67 | 68 | # Yarn Integrity file 69 | .yarn-integrity 70 | 71 | # dotenv environment variables file 72 | .env 73 | .env.test 74 | 75 | # parcel-bundler cache (https://parceljs.org/) 76 | .cache 77 | 78 | # Next.js build output 79 | .next 80 | 81 | # Nuxt.js build / generate output 82 | .nuxt 83 | dist 84 | 85 | # Gatsby files 86 | .cache/ 87 | # Comment in the public line in if your project uses Gatsby and *not* Next.js 88 | # https://nextjs.org/blog/next-9-1#public-directory-support 89 | # public 90 | 91 | # vuepress build output 92 | .vuepress/dist 93 | 94 | # Serverless directories 95 | .serverless/ 96 | 97 | # FuseBox cache 98 | .fusebox/ 99 | 100 | # DynamoDB Local files 101 | .dynamodb/ 102 | 103 | # TernJS port file 104 | .tern-port 105 | -------------------------------------------------------------------------------- /images/arrowDown.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 12 | 13 | 14 | 15 | 17 | 18 | 19 | 20 | 21 | 22 | image/svg+xml 23 | 24 | 25 | 26 | 27 | Openclipart 28 | 29 | 30 | Straight arrow set 3 31 | 2006-12-26T00:00:00 32 | 33 | https://openclipart.org/detail/24164/-by--24164 34 | 35 | 36 | Anonymous 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | -------------------------------------------------------------------------------- /images/arrowUp.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 26 | 28 | 46 | 52 | 54 | 62 | 72 | 73 | 74 | 76 | 77 | 78 | image/svg+xml 79 | 81 | 83 | 84 | 86 | Openclipart 87 | 88 | 89 | 2006-12-26T00:00:00 90 | 91 | https://openclipart.org/detail/24164/-by--24164 92 | 93 | 94 | Anonymous 95 | 96 | 97 | 98 | 100 | 102 | 104 | 106 | 107 | 108 | 109 | 110 | -------------------------------------------------------------------------------- /images/arrowLeft.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 26 | 28 | 46 | 52 | 54 | 62 | 72 | 73 | 74 | 76 | 77 | 78 | image/svg+xml 79 | 81 | 83 | 84 | 86 | Openclipart 87 | 88 | 89 | 2006-12-26T00:00:00 90 | 91 | https://openclipart.org/detail/24164/-by--24164 92 | 93 | 94 | Anonymous 95 | 96 | 97 | 98 | 100 | 102 | 104 | 106 | 107 | 108 | 109 | 110 | -------------------------------------------------------------------------------- /images/arrowRight.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 26 | 28 | 46 | 52 | 54 | 62 | 72 | 73 | 74 | 76 | 77 | 78 | image/svg+xml 79 | 81 | 83 | 84 | 86 | Openclipart 87 | 88 | 89 | Straight arrow set 3 90 | 2006-12-26T00:00:00 91 | 92 | https://openclipart.org/detail/24164/-by--24164 93 | 94 | 95 | Anonymous 96 | 97 | 98 | 99 | 101 | 103 | 105 | 107 | 108 | 109 | 110 | 111 | -------------------------------------------------------------------------------- /images/deadDuck.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 17 | 19 | 38 | 43 | 46 | 50 | 55 | 59 | 63 | 64 | 65 | 67 | 68 | 69 | image/svg+xml 70 | 72 | 74 | 75 | 77 | Openclipart 78 | 79 | 80 | 2010-08-01T19:10:36 81 | 82 | https://openclipart.org/detail/75889/duck-outline-by-gammillian 83 | 84 | 85 | gammillian 86 | 87 | 88 | 89 | 90 | animal 91 | black and white 92 | coloring page 93 | duck 94 | outline 95 | 96 | 97 | 98 | 100 | 102 | 104 | 106 | 107 | 108 | 109 | 110 | -------------------------------------------------------------------------------- /images/duck.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 19 | 38 | 44 | 48 | 53 | 59 | 70 | 72 | 74 | 76 | 78 | 80 | image/svg+xml 83 | 86 | 89 | 91 | 94 | Openclipart 97 | 99 | 101 | Duck Outline 104 | 2010-08-01T19:10:36 107 | 109 | https://openclipart.org/detail/75889/duck-outline-by-gammillian 112 | 114 | 116 | gammillian 119 | 121 | 123 | 125 | 127 | animal 130 | black and white 133 | coloring page 136 | duck 139 | outline 142 | 144 | 146 | 148 | 151 | 154 | 157 | 160 | 162 | 164 | 166 | 168 | -------------------------------------------------------------------------------- /images/chicken.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 41 | 44 | 46 | 48 | 52 | 56 | 60 | 64 | 68 | 72 | 76 | 80 | 84 | 88 | 92 | 96 | 100 | 101 | 107 | 110 | 113 | 116 | 119 | 122 | 125 | 128 | 131 | 134 | 137 | 140 | 143 | 146 | 149 | 152 | 155 | 158 | 161 | 164 | 167 | 170 | 173 | 176 | 179 | 180 | 181 | 182 | image/svg+xmlOpenclipart 191 | -------------------------------------------------------------------------------- /images/deadChicken.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 41 | 47 | 49 | 51 | 55 | 59 | 63 | 67 | 71 | 75 | 79 | 83 | 87 | 91 | 95 | 99 | 103 | 104 | 110 | 113 | 116 | 119 | 120 | 123 | 126 | 129 | 132 | 135 | 138 | 141 | 144 | 147 | 150 | 153 | 156 | 159 | 162 | 165 | 168 | 171 | 174 | 177 | 180 | 181 | 196 | 197 | image/svg+xmlOpenclipart 206 | -------------------------------------------------------------------------------- /assets/index.243b1286.js: -------------------------------------------------------------------------------- 1 | var S=Object.defineProperty;var v=Object.getOwnPropertySymbols;var y=Object.prototype.hasOwnProperty,x=Object.prototype.propertyIsEnumerable;var k=(e,t,n)=>t in e?S(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,_=(e,t)=>{for(var n in t||(t={}))y.call(t,n)&&k(e,n,t[n]);if(v)for(var n of v(t))x.call(t,n)&&k(e,n,t[n]);return e};var b=(e,t)=>{var n={};for(var a in e)y.call(e,a)&&t.indexOf(a)<0&&(n[a]=e[a]);if(e!=null&&v)for(var a of v(e))t.indexOf(a)<0&&x.call(e,a)&&(n[a]=e[a]);return n};var r=(e,t,n)=>(k(e,typeof t!="symbol"?t+"":t,n),n);import{j as jsxRuntime,r as react,B as Blockly,l as locale,R as ReactDOM,a as React}from"./vendor.4895ae15.js";const p=function(){const t=document.createElement("link").relList;if(t&&t.supports&&t.supports("modulepreload"))return;for(const o of document.querySelectorAll('link[rel="modulepreload"]'))a(o);new MutationObserver(o=>{for(const i of o)if(i.type==="childList")for(const s of i.addedNodes)s.tagName==="LINK"&&s.rel==="modulepreload"&&a(s)}).observe(document,{childList:!0,subtree:!0});function n(o){const i={};return o.integrity&&(i.integrity=o.integrity),o.referrerpolicy&&(i.referrerPolicy=o.referrerpolicy),o.crossorigin==="use-credentials"?i.credentials="include":o.crossorigin==="anonymous"?i.credentials="omit":i.credentials="same-origin",i}function a(o){if(o.ep)return;o.ep=!0;const i=n(o);fetch(o.href,i)}};p();var index="";const jsx=jsxRuntime.exports.jsx,jsxs=jsxRuntime.exports.jsxs,Wrapper=({children:e})=>jsx("div",{className:"wrapper",children:e}),PAGE_CODE=0,PAGE_MIX=1,PAGE_APP=2,PAGE_SETTINGS=3,Navigator=({onCode:e,onMix:t,onApp:n,onSettings:a,currentPage:o})=>jsxs("nav",{className:"navigator",children:[jsx("div",{className:"menu-item",onClick:a,"data-is-current":o===PAGE_SETTINGS,children:"Settings"}),jsx("div",{className:"menu-item",onClick:e,"data-is-current":o===PAGE_CODE,children:"Code"}),jsx("div",{className:"menu-item",onClick:t,"data-is-current":o===PAGE_MIX,children:"Mix"}),jsx("div",{className:"menu-item",onClick:n,"data-is-current":o===PAGE_APP,children:"App"})]}),WorkspaceContext=react.exports.createContext();var duckImage$2="/blockly-player/images/duck.png",src$1="/blockly-player/images/chicken.png",deadDuckImage="/blockly-player/images/deadDuck.png",deadChickenImage="/blockly-player/images/deadChicken.png";const PLAYER_DUCK=Symbol("PLAYER_DUCK"),PLAYER_CHICKEN=Symbol("PLAYER_CHICKEN"),PLAYER_DEAD_DUCK=Symbol("PLAYER_DEAD_DUCK"),PLAYER_DEAD_CHICKEN=Symbol("PLAYER_DEAD_CHICKEN"),imageMap={[PLAYER_DUCK]:duckImage$2,[PLAYER_CHICKEN]:src$1,[PLAYER_DEAD_DUCK]:deadDuckImage,[PLAYER_DEAD_CHICKEN]:deadChickenImage};class Engine{constructor(e,t,n){r(this,"canvas");r(this,"ctx");r(this,"textSizeInPercentage",5);r(this,"textCursor",[0,0]);r(this,"textColor","black");r(this,"textAlign","left");r(this,"customCursor",!1);r(this,"scenario",{});r(this,"currentScenario",{});r(this,"currentCode");r(this,"isGameRunning",!1);r(this,"playerPosition",[10,10]);r(this,"playerSize",10);r(this,"withinObstacleGuard",!1);r(this,"obstacles",[]);r(this,"gameHud",[]);r(this,"gameInterval");r(this,"enemyInterval");r(this,"onGameStart",()=>{});r(this,"onGameEnd",()=>{});this.canvas=e,this.onGameStart=t,this.onGameEnd=n,this.ctx=e.getContext("2d"),this.ctx.font="20px arial",document.addEventListener("keydown",this.listenToKeys.bind(this))}handleStart(){console.log("Will start interactions"),this.proccessBlocks(this.currentCode)}startGame(){if(console.log("Should start the game with ",this.currentScenario),this.scenario=_({},this.currentScenario),!(!this.scenario||this.isGameRunning)){this.onGameStart(),console.log("Starting game"),this.isGameRunning=!0,this.obstacles=[],this.gameHud=[];try{console.log("Calling onStart",this.scenario.onStart),this.intepretCode(this.scenario.onStart()),this.renderFrame(),this.gameInterval=setInterval(()=>{this.gameHud=[],this.intepretCode(this.scenario.onUpdate())},this.scenario.initialSpeed||500),this.renderInterval=setInterval(()=>{this.renderFrame()},this.scenario.initialSpeed||100),this.enemyInterval=setInterval(()=>{this.intepretCode(this.scenario.onEnemyGeneration())},this.scenario.enemyGenerationSpeed||500)}catch(e){console.error(e)}}}listenToKeys(e){e.code==="Enter"&&this.startGame();const{scenario:t}=this;if(!!this.isGameRunning)try{e.code==="ArrowUp"&&this.intepretCode(t.onUpKey()),e.code==="ArrowDown"&&this.intepretCode(t.onDownKey()),e.code==="ArrowRight"&&this.intepretCode(t.onForwardKey()),e.code==="ArrowLeft"&&this.intepretCode(t.onBackwardKey())}catch(n){console.error(n)}}resize(e,t){if(!e&&!t)return;const n=100*Math.floor(Math.min(t,e)/100);n!==this.size&&(this.size=n,console.log(`Resizing canvas to ${n}`),this.canvas.setAttribute("width",`${n}px`),this.canvas.setAttribute("height",`${n}px`),this.proccessBlocks(this.currentCode))}tearDown(){console.log("Tearing game down"),this.clearGameLoop(),document.removeEventListener("keydown",this.listenToKeys.bind(this))}clearGameLoop(){window.clearInterval(this.renderInterval),window.clearInterval(this.gameInterval),window.clearInterval(this.enemyInterval),this.isGameRunning=!1}drawImage(e,t,n,a=void 0,o=void 0){const i=new Image;i.src=e,i.onload=()=>{this.ctx.drawImage(i,0,0,i.width,i.height,t,n,a,o)}}proccessBlocks(e){this.canvas,this.currentCode=e,console.log(`Interpreting code 2 | ${e}`),this.textSizeInPercentage=5,this.textCursor=[0,0],this.textColor="black",this.textAlign="left",this.customCursor=!1,this.playerPosition=[10,10],this.playerSize=10,this.intepretCode(e)}intepretCode(code){const engine=this,canvas=this.canvas;if(engine&&canvas)try{eval(code)}catch(e){console.error(e)}}drawBackground(e){if(e||(e=this.backgroundColor),!e)return;const{ctx:t,size:n}=this;t.fillStyle=e,this.backgroundColor=e,t.fillRect(0,0,n,n)}writeText(e,t){if(this.isGameRunning&&!t){this.gameHud.push(()=>this.writeText(e,!0));return}const{ctx:n,canvas:a}=this,o=a.height*this.textSizeInPercentage/100;n.font=`${o}px Arial`,n.fillStyle=this.textColor,n.textAlign=this.textAlign;const[i,s]=this.textCursor;let l=i;if(!this.customCursor)switch(this.textAlign){case"left":l=0;break;case"center":l=a.width/2;break;case"right":l=a.width;break}n.fillText(e,l,s+o),this.textCursor[1]=s+o,this.customCursor=!1}setTextSize(e,t){if(this.isGameRunning&&!t){this.gameHud.push(()=>this.setTextSize(e,!0));return}this.textSizeInPercentage=e}setTextAlign(e,t){if(this.isGameRunning&&!t){this.gameHud.push(()=>this.setTextAlign(e,!0));return}this.textAlign=e}setCursor(e=0,t=0,n){if(this.isGameRunning&&!n){this.gameHud.push(()=>this.setCursor(e,t,!0));return}this.textCursor=[e,t]}setTextColor(e,t){if(this.isGameRunning&&!t){this.gameHud.push(()=>this.setTextColor(e,!0));return}this.textColor=e}setPlayer(e){this.player=e}setScenario(e){console.log("settign scenario",e),this.currentScenario=_({},e);const{player:t}=e;console.log({player:t}),this.renderGame(this.currentScenario)}renderGame(e){try{const{player:t}=e;if(console.log("rendering the game",e),!t){console.log("No game without a player");return}this.renderFrame(e)}catch(t){console.error(t)}}getPlayerX(){return this.playerPosition[0]}getPlayerY(){return this.playerPosition[1]}setPlayerPosition(e,t){typeof e=="undefined"&&(e=this.getPlayerX()),typeof t=="undefined"&&(t=this.getPlayerY()),this.playerPosition=[e,t],console.log(`Setting player to ${t}`),this.renderFrame()}renderPlayer(e){const{player:t}=e||this.scenario,{canvas:n,ctx:a}=this,o=n.height*this.playerSize/100,[i,s]=this.playerPosition,l=Math.min(n.width,Math.max(0,n.width*i/100-o/2)),c=Math.min(n.height,Math.max(0,n.height*s/100-o/2));console.log(`SHOULD DEAW ${imageMap[t]}`,t),this.drawImage(imageMap[t],l,c,o,o)}setAvatar(e){console.log("SET AVATAR ,",e),this.scenario.player=e}renderFrame(e){console.log("Render frame"),this.clearFrame(),this.drawBackground(),this.renderPlayer(e),this.obstacles.forEach(({x:t,y:n,recWidth:a,recHeight:o,color:i})=>{this.drawRectangle(t,n,a,o,i,!0)}),this.gameHud.forEach((t,n)=>{console.log("INVOKING HUD",n),t()})}clearFrame(){const{ctx:e,canvas:t}=this;e.clearRect(0,0,t.width,t.height),e.beginPath(),e.moveTo(0,0),e.lineTo(t.width,t.height),e.stroke()}drawRectangle(e,t,n,a,o,i){const{ctx:s,canvas:l}=this,{height:c,width:d}=l,m=i||this.withinObstacleGuard;s.fillStyle=o,this.withinObstacleGuard&&this.obstacles.push({x:e,y:t,recWidth:n,recHeight:a,color:o});const u=e*d/100,h=t*c/100,f=n*d/100,g=a*c/100;s.fillRect(u,h,f,g),m&&this.checkColision(u,h,f,g)}checkColision(e,t,n,a){if(!this.isGameRunning)return;const{canvas:o}=this,i=o.height*this.playerSize/100,[s,l]=this.playerPosition,c=Math.min(o.width,Math.max(0,o.width*s/100-i/2)),d=Math.min(o.height,Math.max(0,o.height*l/100-i/2));ce&&dt?(this.intepretCode(this.scenario.onColision()),console.log("Colisao!")):console.log("SEM COLISAO",{x:c,y:d,size:i,obstacleX:e,obstacleY:t,obstacleWidth:n,obstacleHeight:a})}setObstacles(e){!e||(this.withinObstacleGuard=!0,e(),this.withinObstacleGuard=!1)}moveObstacleX(e){const{width:t}=this.canvas,n=[];this.obstacles.forEach((l,s)=>{var c=l,{x:a,recWidth:o}=c,i=b(c,["x","recWidth"]);var h;const d=_({x:a+e,recWidth:o},i),m=a*t/100,u=o*t/100;m+u>0?n.push(d):((h=this.scenario)==null||h.onObstacleOutside(),console.log("removing obstacle"))}),this.obstacles=n}moveObstacleY(e){const{height:t}=this.canvas,n=[];this.obstacles.forEach((l,s)=>{var c=l,{y:a,recHeight:o}=c,i=b(c,["y","recHeight"]);const d=_({y:a+e,recHeight:o},i),m=a*t/100,u=o*t/100;m+u>0?n.push(d):console.log("removing obstacle")}),this.obstacles=n}endGame(){this.clearGameLoop(),window.setTimeout(()=>{this.intepretCode(this.scenario.onEnd()),this.renderFrame()},100),this.onGameEnd()}}const GameArea=({currentPage:e})=>{const t=react.exports.useRef(),n=react.exports.useRef(),a=react.exports.useRef(),[o,i]=react.exports.useState("Game stopped"),{getJsCode:s}=react.exports.useContext(WorkspaceContext);react.exports.useEffect(()=>{!a.current||a.current.proccessBlocks(s)},[s]);function l(){const{height:c,width:d}=t.current.getBoundingClientRect();!d&&!c||a.current.resize(d,c)}return react.exports.useEffect(()=>{if(!a.current)return a.current=new Engine(n.current,()=>i("Game Running"),()=>i("Game stopped!")),l(),a.current.proccessBlocks(s),()=>{a.current.tearDown()}},[s]),react.exports.useEffect(()=>(window.addEventListener("resize",l),()=>window.removeEventListener("resize",l)),[]),react.exports.useEffect(()=>{!t.current||l()},[e]),jsxs("div",{className:"game-area",ref:t,children:[jsx("p",{children:o}),jsx("canvas",{ref:n,onBlur:()=>console.log("blur")})]})},Settings=()=>{const{getWorkspaceXml:e}=react.exports.useContext(WorkspaceContext);return jsxs("div",{className:"settings",children:[jsx("h2",{children:"Settings"}),jsxs("div",{className:"innerWrapper",children:[jsxs("fieldset",{children:[jsx("legend",{children:"Import"}),jsx("p",{children:"Select a file that was previously exported"}),jsxs("div",{children:[jsx("label",{htmlFor:"importCode",children:"Import code"}),jsx("input",{type:"file",id:"importCode",name:"importCode",onChange:async a=>{a.preventDefault();const o=new FileReader;o.onload=async i=>{const s=i.target.result;localStorage.setItem("blockly_saved_workspace",s)},o.readAsText(a.target.files[0])}})]})]}),jsxs("fieldset",{children:[jsx("legend",{children:"Export"}),jsx("p",{children:"Click here to export your current code and use it later"}),jsx("button",{onClick:()=>{const a=new Blob([e],{type:"application/xml"}),o=document.createElement("a");o.download="munich_coding_club.xml",o.href=window.URL.createObjectURL(a),o.onclick=function(i){const s=this;setTimeout(function(){window.URL.revokeObjectURL(s.href)},1500)},o.click(),o.remove()},children:"Export code"})]})]})]})},ContentWrapper=({children:e,currentPage:t})=>{let a=`content-wrapper ${{[PAGE_APP]:"is-app",[PAGE_CODE]:"is-code",[PAGE_MIX]:"is-mix",[PAGE_SETTINGS]:"is-settings"}[t]}`;return jsx("div",{className:a,children:e})},definition$m={type:"game_setup",colour:"#FFAABB",hat:"cap",message0:"Game setup %1 initial speed %2 %3 enemy_generation_speed %4 %5 player %6 on start %7 on update %8 onEnemyGeneration %9 on end %10 on colision %11 on up key %12 on down key %13 on forward key %14 on back key %15 on obstacle otuside %16",args0:[{type:"input_dummy"},{type:"input_value",name:"initialSpeedDefault"},{type:"input_dummy"},{type:"input_value",name:"enemyGenerationSpeed",check:"Number"},{type:"input_dummy"},{type:"input_statement",name:"player",check:["game_duck","game_chicken","game_dead_duck","game_dead_chicken"]},{type:"input_statement",name:"onStart"},{type:"input_statement",name:"onUpdate"},{type:"input_statement",name:"onEnemyGeneration"},{type:"input_statement",name:"onEnd"},{type:"input_statement",name:"onColision"},{type:"input_statement",name:"onUp"},{type:"input_statement",name:"onDown"},{type:"input_statement",name:"onForward"},{type:"input_statement",name:"onBackward"},{type:"input_statement",name:"onObstacleOutside"}],inputsInline:!1,previousStatement:null,nextStatement:null,tooltip:"Configures the game settings",helpUrl:""},gameSetup=e=>{e.Blocks.game_setup={init:function(){this.jsonInit(definition$m)}},e.JavaScript.game_setup=function(t){const n=e.JavaScript.valueToCode(t,"initialSpeedDefault",e.JavaScript.ORDER_ATOMIC),a=e.JavaScript.valueToCode(t,"enemyGenerationSpeed",e.JavaScript.ORDER_ATOMIC),o=e.JavaScript.statementToCode(t,"player");var i=e.JavaScript.statementToCode(t,"onStart"),s=e.JavaScript.statementToCode(t,"onUpdate"),l=e.JavaScript.statementToCode(t,"onEnd");const c=e.JavaScript.statementToCode(t,"onUp"),d=e.JavaScript.statementToCode(t,"onDown"),m=e.JavaScript.statementToCode(t,"onForward"),u=e.JavaScript.statementToCode(t,"onBackward"),h=e.JavaScript.statementToCode(t,"onColision"),f=e.JavaScript.statementToCode(t,"onEnemyGeneration"),g=e.JavaScript.statementToCode(t,"onObstacleOutside");return`engine.setScenario( 3 | { 4 | initialSpeed: ${n}, 5 | enemyGenerationSpeed: ${a}, 6 | player: ${o||"null"}, 7 | onStart: () => { 8 | ${i} 9 | }, 10 | onUpdate: () => { 11 | ${s} 12 | }, 13 | onEnd: () => { 14 | ${l} 15 | }, 16 | onEnemyGeneration: () => { 17 | ${f} 18 | }, 19 | onUpKey: () => { 20 | ${c} 21 | }, 22 | onDownKey: () => { 23 | ${d} 24 | }, 25 | onForwardKey: () => { 26 | ${m} 27 | }, 28 | onBackwardKey: () => { 29 | ${u} 30 | }, 31 | onColision: () => { 32 | ${h} 33 | }, 34 | onObstacleOutside: () => { 35 | ${g} 36 | } 37 | }); 38 | `}};var duckImage$1="/blockly-player/images/duck.svg";const definition$l={type:"game_duck",message0:"Duck %1",args0:[{type:"field_image",src:duckImage$1,width:40,height:40,alt:"duck",flipRtl:!1}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null},playerDuck=e=>{e.Blocks.game_duck={init:function(){this.jsonInit(definition$l)}},e.JavaScript.game_duck=function(t){var n="PLAYER_DUCK";return n}};var duckImage="/blockly-player/images/deadDuck.svg";const definition$k={type:"game_dead_duck",message0:"Dead Duck %1",args0:[{type:"field_image",src:duckImage,width:40,height:40,alt:"dead duck",flipRtl:!1}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null},playerDeadDuck=e=>{e.Blocks.game_dead_duck={init:function(){this.jsonInit(definition$k)}},e.JavaScript.game_dead_duck=function(t){return"PLAYER_DEAD_DUCK"}};var src="/blockly-player/images/deadChicken.svg";const definition$j={type:"game_dead_chicken",message0:"Dead Chicken %1",args0:[{type:"field_image",src,width:40,height:40,alt:"dead chicken",flipRtl:!1}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null},playerDeadChicken=e=>{e.Blocks.game_dead_chicken={init:function(){this.jsonInit(definition$j)}},e.JavaScript.game_dead_chicken=function(t){var n="PLAYER_DEAD_CHICKEN";return n}},definition$i={type:"game_chicken",message0:"Chicken %1",args0:[{type:"field_image",src:src$1,width:40,height:40,alt:"chicken",flipRtl:!1}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null},playerChicken=e=>{e.Blocks.game_chicken={init:function(){this.jsonInit(definition$i)}},e.JavaScript.game_chicken=function(t){var n="PLAYER_CHICKEN";return n}};function overWrite(e){e.JavaScript.text_print=function(t){return`engine.writeText(${e.JavaScript.valueToCode(t,"TEXT",e.JavaScript.ORDER_NONE)||"''"}); 39 | `}}const definition$h={type:"canvas_background_color",message0:"background color %1",args0:[{type:"input_value",name:"backgroundColor",check:"Colour"}],previousStatement:null,nextStatement:null,colour:"#6600cc",tooltip:"",helpUrl:""},backgroundColor=e=>{e.Blocks.canvas_background_color={init:function(){this.jsonInit(definition$h)}},e.JavaScript.canvas_background_color=function(t){var a=`engine.drawBackground(${e.JavaScript.valueToCode(t,"backgroundColor",e.JavaScript.ORDER_NONE)||"''"}); 40 | `;return a}},definition$g={type:"canvas_text_size",message0:"Text size %1",args0:[{type:"input_value",name:"textSize",check:"Number"}],previousStatement:null,nextStatement:null,colour:"#6600cc",tooltip:"",helpUrl:""},textSize=e=>{e.Blocks.canvas_text_size={init:function(){this.jsonInit(definition$g)}},e.JavaScript.canvas_text_size=function(t){var a=`engine.setTextSize(${e.JavaScript.valueToCode(t,"textSize",e.JavaScript.ORDER_NONE)||"''"}); 41 | `;return a}},definition$f={type:"canvas_width",message0:"CANVAS_WIDTH",output:null,colour:"#6600cc",tooltip:"",helpUrl:""},canvasWidth=e=>{e.Blocks.canvas_width={init:function(){this.jsonInit(definition$f)}},e.JavaScript.canvas_width=function(t){return["canvas.width",e.JavaScript.ORDER_NONE]}},definition$e={type:"canvas_height",message0:"CANVAS_HEIGHT",output:null,colour:"#6600cc",tooltip:"",helpUrl:""},canvasHeight=e=>{e.Blocks.canvas_height={init:function(){this.jsonInit(definition$e)}},e.JavaScript.canvas_height=function(t){return["canvas.width",e.JavaScript.ORDER_NONE]}},definition$d={type:"canvas_set_text_color",message0:"text color %1",args0:[{type:"input_value",name:"textColor",check:"Colour"}],previousStatement:null,nextStatement:null,colour:"#6600cc",tooltip:"",helpUrl:""},canvasSetTextColor=e=>{e.Blocks.canvas_set_text_color={init:function(){this.jsonInit(definition$d)}},e.JavaScript.canvas_set_text_color=function(t){var a=`engine.setTextColor(${e.JavaScript.valueToCode(t,"textColor",e.JavaScript.ORDER_NONE)||"''"}); 42 | `;return a}},definition$c={type:"canvas_set_cursor",message0:"Set Text Cursor %1 X %2 Y %3",args0:[{type:"input_dummy"},{type:"input_value",name:"x",check:"Number"},{type:"input_value",name:"y",check:"Number"}],colour:"#6600cc",tooltip:"",helpUrl:"",previousStatement:null,nextStatement:null},canvasSetCursor=e=>{e.Blocks.canvas_set_cursor={init:function(){this.jsonInit(definition$c)}},e.JavaScript.canvas_set_cursor=function(t){const n=e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC)||0,a=e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC)||0;return`engine.setCursor(${n}, ${a}); 43 | `}},definition$b={type:"canvas_draw_rectangle",message0:"drawRectangle %1 x %2 y %3 width %4 height %5 Colour %6",args0:[{type:"input_dummy"},{type:"input_value",name:"x",check:"Number"},{type:"input_value",name:"y",check:"Number"},{type:"input_value",name:"width",check:"Number"},{type:"input_value",name:"height",check:"Number"},{type:"input_value",name:"color",check:"Colour"}],colour:"#6600cc",tooltip:"",helpUrl:"",previousStatement:null,nextStatement:null},canvasDrawRectangle=e=>{e.Blocks.canvas_draw_rectangle={init:function(){this.jsonInit(definition$b)}},e.JavaScript.canvas_draw_rectangle=function(t){const n=e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC),a=e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC),o=e.JavaScript.valueToCode(t,"width",e.JavaScript.ORDER_ATOMIC),i=e.JavaScript.valueToCode(t,"height",e.JavaScript.ORDER_ATOMIC),s=e.JavaScript.valueToCode(t,"color",e.JavaScript.ORDER_ATOMIC);return`engine.drawRectangle(${n||0}, ${a||0}, ${o||0}, ${i||0}, ${s})`}},definition$a={type:"canvas_set_text_align",message0:"setTextAlign %1",args0:[{type:"field_dropdown",name:"align",options:[["left","left"],["right","right"],["center","center"]]}],previousStatement:null,nextStatement:null,colour:"#6600cc",tooltip:"",helpUrl:""},canvasSetTextAlign=e=>{e.Blocks.canvas_set_text_align={init:function(){this.jsonInit(definition$a)}},e.JavaScript.canvas_set_text_align=function(t){return`engine.setTextAlign('${t.getFieldValue("align")}'); 44 | `}},definition$9={type:"player_x",message0:"PLAYER_X",output:null,colour:"#FFAABB",tooltip:"",helpUrl:""},playerX=e=>{e.Blocks.player_x={init:function(){this.jsonInit(definition$9)}},e.JavaScript.player_x=function(t){return["engine.getPlayerX()",e.JavaScript.ORDER_NONE]}},definition$8={type:"player_y",message0:"PLAYER_Y",output:null,colour:"#FFAABB",tooltip:"",helpUrl:""},playerY=e=>{e.Blocks.player_y={init:function(){this.jsonInit(definition$8)}},e.JavaScript.player_y=function(t){return["engine.getPlayerY()",e.JavaScript.ORDER_NONE]}},definition$7={type:"game_obstacle",message0:"Obstacle %1",args0:[{type:"input_statement",name:"obstacle"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameObstacle=e=>{e.Blocks.game_obstacle={init:function(){this.jsonInit(definition$7)}},e.JavaScript.game_obstacle=function(t){return` 45 | engine.setObstacles(() => { 46 | ${e.JavaScript.statementToCode(t,"obstacle")} 47 | }) 48 | ; 49 | `}},definition$6={type:"game_set_player_position",message0:"Set Player position %1 X %2 Y %3",args0:[{type:"input_dummy"},{type:"input_value",name:"x",check:"Number"},{type:"input_value",name:"y",check:"Number"}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null,nextStatement:null},gameSetPlayerPosition=e=>{e.Blocks.game_set_player_position={init:function(){this.jsonInit(definition$6)}},e.JavaScript.game_set_player_position=function(t){const n=e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC)||0,a=e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC)||0;return`engine.setPlayerPosition(${n}, ${a}); 50 | `}},definition$5={type:"game_set_player_position_x",message0:"Set Player position X %1",args0:[{type:"input_value",name:"x",check:"Number"}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null,nextStatement:null},gameSetPlayerPositionX=e=>{e.Blocks.game_set_player_position_x={init:function(){this.jsonInit(definition$5)}},e.JavaScript.game_set_player_position_x=function(t){return`engine.setPlayerPosition(${e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC)||0}); 51 | `}},definition$4={type:"game_set_player_position_y",message0:"Set Player position Y %1",args0:[{type:"input_value",name:"y",check:"Number"}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null,nextStatement:null},gameSetPlayerPositionY=e=>{e.Blocks.game_set_player_position_y={init:function(){this.jsonInit(definition$4)}},e.JavaScript.game_set_player_position_y=function(t){return`engine.setPlayerPosition(undefined,${e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC)||0}); 52 | `}},definition$3={type:"game_move_obstacle_x",message0:"move obstacle x %1",args0:[{type:"input_value",name:"x",check:"Number"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameMoveObstacleX=e=>{e.Blocks.game_move_obstacle_x={init:function(){this.jsonInit(definition$3)}},e.JavaScript.game_move_obstacle_x=function(t){return`engine.moveObstacleX(${e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC)});`}},definition$2={type:"game_move_obstacle_y",message0:"move obstacle y %1",args0:[{type:"input_value",name:"y",check:"Number"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameMoveObstacleY=e=>{e.Blocks.game_move_obstacle_y={init:function(){this.jsonInit(definition$2)}},e.JavaScript.game_move_obstacle_y=function(t){return`engine.moveObstacleY(${e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC)})`}},definition$1={type:"game_end_game",message0:"end game",previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameEndGame=e=>{e.Blocks.game_end_game={init:function(){this.jsonInit(definition$1)}},e.JavaScript.game_end_game=function(t){return`engine.endGame(); 53 | `}},definition={type:"game_set_player_icon",message0:"set player icon %1",args0:[{type:"input_statement",name:"playerIcon"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},setPlayerIcon=e=>{e.Blocks.game_set_player_icon={init:function(){this.jsonInit(definition)}},e.JavaScript.game_set_player_icon=function(t){return`engine.setAvatar(${e.JavaScript.statementToCode(t,"playerIcon")}); 54 | `}};function initializeCustomBlocks(e){gameSetup(e),playerDuck(e),playerChicken(e),overWrite(e),backgroundColor(e),textSize(e),canvasWidth(e),canvasHeight(e),canvasSetCursor(e),canvasSetTextAlign(e),canvasSetTextColor(e),canvasDrawRectangle(e),playerY(e),playerX(e),gameSetPlayerPosition(e),gameSetPlayerPositionX(e),gameSetPlayerPositionY(e),gameObstacle(e),gameMoveObstacleX(e),gameMoveObstacleY(e),gameEndGame(e),playerDeadDuck(e),playerDeadChicken(e),setPlayerIcon(e)}const toolbox={kind:"categoryToolbox",contents:[{kind:"category",name:"Loops",colour:"#5ba55b",contents:[{kind:"block",blockxml:` 55 | 56 | 57 | 10 58 | 59 | 60 | `},{kind:"block",blockxml:` 61 | WHILE 62 | `},{kind:"block",blockxml:` 63 | i 64 | 65 | 66 | 1 67 | 68 | 69 | 70 | 71 | 10 72 | 73 | 74 | 75 | 76 | 1 77 | 78 | 79 | `},{kind:"block",blockxml:` 80 | j 81 | `},{kind:"block",blockxml:` 82 | 83 | BREAK 84 | `}]},{kind:"category",name:"logic",colour:"210",contents:[{kind:"block",type:"controls_if"},{kind:"block",type:"controls_whileUntil"},{kind:"block",blockxml:` 85 | EQ 86 | `},{kind:"block",blockxml:` 87 | AND 88 | `},{kind:"block",blockxml:` 89 | TRUE 90 | `},{kind:"block",type:"logic_negate"},{kind:"block",type:"logic_null"},{kind:"block",type:"logic_ternary"}]},{kind:"category",name:"Math",colour:"#5b67a5",contents:[{kind:"block",blockxml:` 91 | 0 92 | `},{kind:"block",blockxml:` 93 | ADD 94 | 95 | 96 | 1 97 | 98 | 99 | 100 | 101 | 1 102 | 103 | 104 | `},{kind:"block",blockxml:` 105 | ROOT 106 | 107 | 108 | 9 109 | 110 | 111 | `},{kind:"block",blockxml:` 112 | SIN 113 | 114 | 115 | 45 116 | 117 | 118 | `},{kind:"block",blockxml:` 119 | PI 120 | `},{kind:"block",blockxml:` 121 | 122 | EVEN 123 | 124 | 125 | 0 126 | 127 | 128 | `},{kind:"block",blockxml:` 129 | ROUND 130 | 131 | 132 | 3.1 133 | 134 | 135 | `},{kind:"block",blockxml:` 136 | 137 | SUM 138 | `},{kind:"block",blockxml:` 139 | 140 | 141 | 64 142 | 143 | 144 | 145 | 146 | 10 147 | 148 | 149 | `},{kind:"block",blockxml:` 150 | 151 | 152 | 50 153 | 154 | 155 | 156 | 157 | 1 158 | 159 | 160 | 161 | 162 | 100 163 | 164 | 165 | `},{kind:"block",blockxml:` 166 | 167 | 168 | 1 169 | 170 | 171 | 172 | 173 | 100 174 | 175 | 176 | `},{kind:"block",type:"math_random_float"}]},{kind:"category",name:"text",colour:"#5ba58c",contents:[{kind:"block",blockxml:` 177 | 178 | `},{kind:"block",blockxml:` 179 | 180 | 181 | `},{kind:"block",blockxml:` 182 | item 183 | 184 | 185 | 186 | 187 | 188 | `},{kind:"block",blockxml:` 189 | 190 | 191 | 192 | abc 193 | 194 | 195 | `},{kind:"block",blockxml:` 196 | 197 | 198 | 199 | 200 | 201 | 202 | `},{kind:"block",blockxml:` 203 | FIRST 204 | 205 | 206 | text 207 | 208 | 209 | 210 | 211 | abc 212 | 213 | 214 | `},{kind:"block",blockxml:` 215 | 216 | FROM_START 217 | 218 | 219 | text 220 | 221 | 222 | `},{kind:"block",blockxml:` 223 | 224 | FROM_START 225 | FROM_START 226 | 227 | 228 | text 229 | 230 | 231 | `},{kind:"block",blockxml:` 232 | UPPERCASE 233 | 234 | 235 | abc 236 | 237 | 238 | `},{kind:"block",blockxml:` 239 | BOTH 240 | 241 | 242 | abc 243 | 244 | 245 | `},{kind:"block",blockxml:` 246 | 247 | 248 | abc 249 | 250 | 251 | `}]},{kind:"category",name:"Lists",colour:"#745ba5",contents:[{kind:"block",blockxml:` 252 | 253 | `},{kind:"block",blockxml:` 254 | 255 | `},{kind:"block",blockxml:` 256 | 257 | 258 | 5 259 | 260 | 261 | `},{kind:"block",type:"lists_length"},{kind:"block",blockxml:` 262 | FIRST 263 | 264 | 265 | list 266 | 267 | 268 | `},{kind:"block",blockxml:` 269 | 270 | GET 271 | FROM_START 272 | 273 | 274 | list 275 | 276 | 277 | `},{kind:"block",blockxml:` 278 | 279 | SET 280 | FROM_START 281 | 282 | 283 | list 284 | 285 | 286 | `},{kind:"block",blockxml:` 287 | 288 | FROM_START 289 | FROM_START 290 | 291 | 292 | list 293 | 294 | 295 | `},{kind:"block",blockxml:` 296 | 297 | SPLIT 298 | 299 | 300 | , 301 | 302 | 303 | `},{kind:"block",blockxml:` 304 | NUMERIC 305 | 1 306 | `}]},{kind:"category",name:"Colour",colour:"#a5745b",contents:[{kind:"block",blockxml:` 307 | #ff0000 308 | `},{kind:"block",type:"colour_random"},{kind:"block",blockxml:` 309 | 310 | 311 | 100 312 | 313 | 314 | 315 | 316 | 50 317 | 318 | 319 | 320 | 321 | 0 322 | 323 | 324 | `},{kind:"block",blockxml:` 325 | 326 | 327 | #ff0000 328 | 329 | 330 | 331 | 332 | #3333ff 333 | 334 | 335 | 336 | 337 | 0.5 338 | 339 | 340 | `}]},{kind:"sep"},{kind:"category",name:"Variables",colour:"#a55b80",custom:"VARIABLE"},{kind:"category",name:"Procedures",colour:"#995ba5",custom:"PROCEDURE"},{kind:"sep"},{kind:"category",name:"canvas",colour:"#6600cc",contents:[{kind:"block",blockxml:` 341 | 342 | 343 | #33ccff 344 | 345 | 346 | `},{kind:"block",blockxml:` 347 | 348 | 349 | #000000 350 | 351 | 352 | `},{kind:"block",type:"canvas_set_text_align"},{kind:"block",blockxml:` 353 | 354 | 355 | 3 356 | 357 | 358 | 359 | `},{kind:"block",blockxml:` 360 | 361 | 362 | #00FF00 363 | 364 | 365 | 366 | 367 | 368 | 0 369 | 370 | 371 | 372 | 373 | 0 374 | 375 | 376 | 377 | 378 | 5 379 | 380 | 381 | 382 | 383 | 35 384 | 385 | 386 | `},{kind:"block",type:"canvas_width"},{kind:"block",type:"canvas_height"},{kind:"block",blockxml:` 387 | 388 | 389 | 0 390 | 391 | 392 | 393 | 394 | 395 | 0 396 | 397 | 398 | 399 | `}]},{kind:"category",name:"game",colour:"#FFAABB",contents:[{kind:"block",blockxml:` 400 | 401 | 402 | 500 403 | 404 | 405 | 406 | 407 | 900 408 | 409 | 410 | 411 | `},{kind:"block",type:"game_duck"},{kind:"block",type:"game_dead_duck"},{kind:"block",type:"game_chicken"},{kind:"block",type:"game_dead_chicken"},{kind:"block",type:"player_x"},{kind:"block",type:"player_y"},{kind:"block",type:"game_set_player_position"},{kind:"block",type:"game_set_player_position_x"},{kind:"block",type:"game_set_player_position_y"},{kind:"block",type:"game_set_player_icon"},{kind:"block",type:"game_obstacle"},{kind:"block",type:"game_move_obstacle_x"},{kind:"block",type:"game_move_obstacle_y"},{kind:"block",type:"game_end_game"}]}]};function debounce(e,t=300){let n;return(...a)=>{clearTimeout(n),n=setTimeout(()=>{e.apply(this,a)},t)}}function initialize(e,t,n,i){var s=i,{initialXml:a}=s,o=b(s,["initialXml"]);initializeCustomBlocks(Blockly),console.log("initializing blockly"),Blockly.setLocale(locale);const l=Blockly.inject(e,_({toolbox},o)),c="blockly_saved_workspace",d=u=>{const h=Blockly.Xml.workspaceToDom(l),f=Blockly.Xml.domToText(h);n(f),localStorage.setItem(c,f),t(Blockly.JavaScript.workspaceToCode(l))},m=localStorage.getItem(c);return n(m),l.addChangeListener(debounce(d,500)),Blockly.Xml.domToWorkspace(Blockly.Xml.textToDom(m||a),l),t(Blockly.JavaScript.workspaceToCode(l)),l}const BlocklyEditor=a=>{var o=a,{currentPage:e,children:t}=o,n=b(o,["currentPage","children"]);const i=react.exports.useRef(),s=react.exports.useRef();let l=react.exports.useRef();const{setGetJsCode:c,setWorkspaceXml:d}=react.exports.useContext(WorkspaceContext);function m(){if(!l.current||!s.current)return;Blockly.svgResize(l.current);const{height:u,width:h}=s.current.getBoundingClientRect();console.info(`Resizing blockly to ${u}`),!!u&&(i.current.querySelector(".blocklySvg").setAttribute("height",`${u}px`),i.current.querySelector(".blocklySvg").setAttribute("width",`${h}px`))}return react.exports.useEffect(()=>{l.current||(l.current=initialize(i.current,c,d,n),new ResizeObserver(m).observe(s.current))}),react.exports.useEffect(()=>{},[e]),jsx("div",{className:"blockly-container",ref:s,children:jsx("div",{ref:i,id:"blocklyDiv"})})};function App(){const[e,t]=react.exports.useState(PAGE_MIX),[n,a]=react.exports.useState(()=>""),[o,i]=react.exports.useState(()=>"");return jsx(WorkspaceContext.Provider,{value:{getJsCode:n,setGetJsCode:a,getWorkspaceXml:o,setWorkspaceXml:i},children:jsxs(Wrapper,{children:[jsx(Navigator,{onApp:()=>t(PAGE_APP),onCode:()=>t(PAGE_CODE),onMix:()=>t(PAGE_MIX),onSettings:()=>t(PAGE_SETTINGS),currentPage:e}),jsxs(ContentWrapper,{currentPage:e,children:[(e===PAGE_MIX||e===PAGE_CODE)&&jsx(BlocklyEditor,{readOnly:!1,trashcan:!0,currentPage:e,move:{scrollbars:!0,drag:!0,wheel:!0},zoom:{controls:!0,wheel:!0},initialXml:` 412 | 413 | 414 | 415 | `}),(e===PAGE_MIX||e===PAGE_APP)&&jsx(GameArea,{currentPage:e}),e===PAGE_SETTINGS&&jsx(Settings,{})]})]})})}ReactDOM.render(jsx(React.StrictMode,{children:jsx(App,{})}),document.getElementById("root")); 416 | -------------------------------------------------------------------------------- /assets/index.153eed94.js: -------------------------------------------------------------------------------- 1 | var A=Object.defineProperty;var S=Object.getOwnPropertySymbols;var T=Object.prototype.hasOwnProperty,R=Object.prototype.propertyIsEnumerable;var w=(e,t,n)=>t in e?A(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,g=(e,t)=>{for(var n in t||(t={}))T.call(t,n)&&w(e,n,t[n]);if(S)for(var n of S(t))R.call(t,n)&&w(e,n,t[n]);return e};var f=(e,t)=>{var n={};for(var a in e)T.call(e,a)&&t.indexOf(a)<0&&(n[a]=e[a]);if(e!=null&&S)for(var a of S(e))t.indexOf(a)<0&&R.call(e,a)&&(n[a]=e[a]);return n};var d=(e,t,n)=>(w(e,typeof t!="symbol"?t+"":t,n),n);import{j as jsxRuntime,r as react,B as Blockly,l as locale,R as ReactDOM,a as React}from"./vendor.4895ae15.js";const p=function(){const t=document.createElement("link").relList;if(t&&t.supports&&t.supports("modulepreload"))return;for(const o of document.querySelectorAll('link[rel="modulepreload"]'))a(o);new MutationObserver(o=>{for(const i of o)if(i.type==="childList")for(const s of i.addedNodes)s.tagName==="LINK"&&s.rel==="modulepreload"&&a(s)}).observe(document,{childList:!0,subtree:!0});function n(o){const i={};return o.integrity&&(i.integrity=o.integrity),o.referrerpolicy&&(i.referrerPolicy=o.referrerpolicy),o.crossorigin==="use-credentials"?i.credentials="include":o.crossorigin==="anonymous"?i.credentials="omit":i.credentials="same-origin",i}function a(o){if(o.ep)return;o.ep=!0;const i=n(o);fetch(o.href,i)}};p();var index="";const jsx=jsxRuntime.exports.jsx,jsxs=jsxRuntime.exports.jsxs,Wrapper=({children:e})=>jsx("div",{className:"wrapper",children:e}),PAGE_CODE=0,PAGE_MIX=1,PAGE_APP=2,PAGE_SETTINGS=3,Navigator=({onCode:e,onMix:t,onApp:n,onSettings:a,currentPage:o})=>jsxs("nav",{className:"navigator",children:[jsx("div",{className:"menu-item",onClick:a,"data-is-current":o===PAGE_SETTINGS,children:"Settings"}),jsx("div",{className:"menu-item",onClick:e,"data-is-current":o===PAGE_CODE,children:"Code"}),jsx("div",{className:"menu-item",onClick:t,"data-is-current":o===PAGE_MIX,children:"Mix"}),jsx("div",{className:"menu-item",onClick:n,"data-is-current":o===PAGE_APP,children:"App"})]}),WorkspaceContext=react.exports.createContext();var duckImage$2="/blockly-player/images/duck.png",src$1="/blockly-player/images/chicken.png",deadDuckImage="/blockly-player/images/deadDuck.png",deadChickenImage="/blockly-player/images/deadChicken.png";const PLAYER_DUCK=Symbol("PLAYER_DUCK"),PLAYER_CHICKEN=Symbol("PLAYER_CHICKEN"),PLAYER_DEAD_DUCK=Symbol("PLAYER_DEAD_DUCK"),PLAYER_DEAD_CHICKEN=Symbol("PLAYER_DEAD_CHICKEN"),imageMap={[PLAYER_DUCK]:duckImage$2,[PLAYER_CHICKEN]:src$1,[PLAYER_DEAD_DUCK]:deadDuckImage,[PLAYER_DEAD_CHICKEN]:deadChickenImage};class Engine{constructor(e,t,n){d(this,"canvas");d(this,"ctx");d(this,"textSizeInPercentage",5);d(this,"textCursor",[0,0]);d(this,"textColor","black");d(this,"textAlign","left");d(this,"customCursor",!1);d(this,"scenario",{});d(this,"currentScenario",{});d(this,"currentCode");d(this,"isGameRunning",!1);d(this,"playerPosition",[10,10]);d(this,"playerSize",10);d(this,"withinObstacleGuard",!1);d(this,"withinTargetGuard",!1);d(this,"obstacles",[]);d(this,"targets",[]);d(this,"gameHud",[]);d(this,"gameInterval");d(this,"enemyInterval");d(this,"onGameStart",()=>{});d(this,"onGameEnd",()=>{});this.canvas=e,this.onGameStart=t,this.onGameEnd=n,this.ctx=e.getContext("2d"),this.ctx.font="20px arial",document.addEventListener("keydown",this.listenToKeys.bind(this))}handleStart(){console.log("Will start interactions"),this.proccessBlocks(this.currentCode)}startGame(){if(console.log("Should start the game with ",this.currentScenario),this.scenario=g({},this.currentScenario),!(!this.scenario||this.isGameRunning)){this.onGameStart(),console.log("Starting game"),this.isGameRunning=!0,this.obstacles=[],this.targets=[],this.gameHud=[];try{console.log("Calling onStart",this.scenario.onStart),this.intepretCode(this.scenario.onStart()),this.renderFrame(),this.gameInterval=setInterval(()=>{this.gameHud=[],this.intepretCode(this.scenario.onUpdate())},this.scenario.initialSpeed||500),this.renderInterval=setInterval(()=>{this.renderFrame()},this.scenario.initialSpeed||100),this.enemyInterval=setInterval(()=>{var e;this.intepretCode((e=this.scenario)==null?void 0:e.onEnemyGeneration())},this.scenario.enemyGenerationSpeed||500),this.targetGenerationInterval=setInterval(()=>{var e;this.intepretCode((e=this.scenario)==null?void 0:e.onTargetGenerated())},this.scenario.targetGenerationSpeed||500)}catch(e){console.error(e)}}}listenToKeys(e){e.code==="Enter"&&this.startGame();const{scenario:t}=this;if(!!this.isGameRunning)try{e.code==="ArrowUp"&&this.intepretCode(t.onUpKey()),e.code==="ArrowDown"&&this.intepretCode(t.onDownKey()),e.code==="ArrowRight"&&this.intepretCode(t.onForwardKey()),e.code==="ArrowLeft"&&this.intepretCode(t.onBackwardKey())}catch(n){console.error(n)}}resize(e,t){if(!e&&!t)return;const n=100*Math.floor(Math.min(t,e)/100);n!==this.size&&(this.size=n,console.log(`Resizing canvas to ${n}`),this.canvas.setAttribute("width",`${n}px`),this.canvas.setAttribute("height",`${n}px`),this.proccessBlocks(this.currentCode))}tearDown(){console.log("Tearing game down"),this.clearGameLoop(),document.removeEventListener("keydown",this.listenToKeys.bind(this))}clearGameLoop(){window.clearInterval(this.renderInterval),window.clearInterval(this.gameInterval),window.clearInterval(this.targetGenerationInterval),window.clearInterval(this.enemyInterval),this.isGameRunning=!1}drawImage(e,t,n,a=void 0,o=void 0){const i=new Image;i.src=e,i.onload=()=>{this.ctx.drawImage(i,0,0,i.width,i.height,t,n,a,o)}}proccessBlocks(e){this.canvas,this.currentCode=e,console.log(`Interpreting code 2 | ${e}`),this.textSizeInPercentage=5,this.textCursor=[0,0],this.textColor="black",this.textAlign="left",this.customCursor=!1,this.playerPosition=[10,10],this.playerSize=10,this.intepretCode(e)}intepretCode(code){if(!code)return;const engine=this,canvas=this.canvas;if(engine&&canvas)try{eval(code)}catch(e){console.error(e)}}drawBackground(e){if(e||(e=this.backgroundColor),!e)return;const{ctx:t,size:n}=this;t.fillStyle=e,this.backgroundColor=e,t.fillRect(0,0,n,n)}writeText(e,t){if(this.isGameRunning&&!t){this.gameHud.push(()=>this.writeText(e,!0));return}const{ctx:n,canvas:a}=this,o=a.height*this.textSizeInPercentage/100;n.font=`${o}px Arial`,n.fillStyle=this.textColor,n.textAlign=this.textAlign;const[i,s]=this.textCursor;let r=i;if(!this.customCursor)switch(this.textAlign){case"left":r=0;break;case"center":r=a.width/2;break;case"right":r=a.width;break}n.fillText(e,r,s+o),this.textCursor[1]=s+o,this.customCursor=!1}setTextSize(e,t){if(this.isGameRunning&&!t){this.gameHud.push(()=>this.setTextSize(e,!0));return}this.textSizeInPercentage=e}setTextAlign(e,t){if(this.isGameRunning&&!t){this.gameHud.push(()=>this.setTextAlign(e,!0));return}this.textAlign=e}setCursor(e=0,t=0,n){if(this.isGameRunning&&!n){this.gameHud.push(()=>this.setCursor(e,t,!0));return}this.textCursor=[e,t]}setTextColor(e,t){if(this.isGameRunning&&!t){this.gameHud.push(()=>this.setTextColor(e,!0));return}this.textColor=e}setPlayer(e){this.player=e}setScenario(e){console.log("settign scenario",e),this.currentScenario=g({},e);const{player:t}=e;console.log({player:t}),this.renderGame(this.currentScenario)}renderGame(e){try{const{player:t}=e;if(console.log("rendering the game",e),!t){console.log("No game without a player");return}this.renderFrame(e)}catch(t){console.error(t)}}getPlayerX(){return this.playerPosition[0]}getPlayerY(){return this.playerPosition[1]}setPlayerPosition(e,t){typeof e=="undefined"&&(e=this.getPlayerX()),typeof t=="undefined"&&(t=this.getPlayerY()),this.playerPosition=[e,t],console.log(`Setting player to ${t}`),this.renderFrame()}renderPlayer(e){const{player:t}=e||this.scenario,{canvas:n,ctx:a}=this,o=n.height*this.playerSize/100,[i,s]=this.playerPosition,r=Math.min(n.width,Math.max(0,n.width*i/100-o/2)),l=Math.min(n.height,Math.max(0,n.height*s/100-o/2));this.drawImage(imageMap[t],r,l,o,o)}setAvatar(e){this.scenario.player=e}renderFrame(e,t){this.clearFrame(),this.drawBackground(),this.renderPlayer(e),this.obstacles.forEach(({x:n,y:a,recWidth:o,recHeight:i,color:s})=>{this.drawRectangle(n,a,o,i,s,!0,!1,t)}),this.targets=this.targets.filter(({x:n,y:a,recWidth:o,recHeight:i,color:s})=>!this.drawRectangle(n,a,o,i,s,!1,!0,t)),this.gameHud.forEach((n,a)=>{n()})}clearFrame(){const{ctx:e,canvas:t}=this;e.clearRect(0,0,t.width,t.height),e.beginPath(),e.moveTo(0,0),e.lineTo(t.width,t.height),e.stroke()}drawRectangle(e,t,n,a,o,i,s,r){var C,E;const{ctx:l,canvas:c}=this,{height:u,width:m}=c,h=i||this.withinObstacleGuard,_=s||this.withinObstacleGuard;l.fillStyle=o,this.withinObstacleGuard&&this.obstacles.push({x:e,y:t,recWidth:n,recHeight:a,color:o}),this.withinTargetGuard&&this.targets.push({x:e,y:t,recWidth:n,recHeight:a,color:o});const v=e*m/100,b=t*u/100,k=n*m/100,y=a*u/100;l.fillRect(v,b,k,y);let x=!1;return r||(x=this.checkColision(v,b,k,y)),x&&(h?this.intepretCode((C=this.scenario)==null?void 0:C.onColision()):_&&(this.intepretCode((E=this.scenario)==null?void 0:E.onTargetGrabbed()),this.renderFrame(this.scenario,!0))),x}checkColision(e,t,n,a){if(!this.isGameRunning)return!1;const{canvas:o}=this,i=o.height*this.playerSize/100,[s,r]=this.playerPosition,l=Math.min(o.width,Math.max(0,o.width*s/100-i/2)),c=Math.min(o.height,Math.max(0,o.height*r/100-i/2));return le&&ct}setObstacles(e){!e||(this.withinObstacleGuard=!0,e(),this.withinObstacleGuard=!1)}setTarget(e){!e||(this.withinTargetGuard=!0,e(),this.withinTargetGuard=!1)}moveObstacleX(e){const{width:t}=this.canvas,n=[];this.obstacles.forEach((r,s)=>{var l=r,{x:a,recWidth:o}=l,i=f(l,["x","recWidth"]);var h;const c=g({x:a+e,recWidth:o},i),u=a*t/100,m=o*t/100;u+m>0?n.push(c):((h=this.scenario)==null||h.onObstacleOutside(),console.log("removing obstacle"))}),this.obstacles=n}moveObstacleY(e){const{height:t}=this.canvas,n=[];this.obstacles.forEach((r,s)=>{var l=r,{y:a,recHeight:o}=l,i=f(l,["y","recHeight"]);const c=g({y:a+e,recHeight:o},i),u=a*t/100,m=o*t/100;u+m>0?n.push(c):console.log("removing obstacle")}),this.obstacles=n}moveTargetX(e){const{width:t}=this.canvas,n=[];this.targets.forEach((a,o)=>{const m=a,{x:i,recWidth:s}=m,r=f(m,["x","recWidth"]),l=g({x:i+e,recWidth:s},r),c=i*t/100,u=s*t/100;console.log({absoluteX:c,absoluteWidth:u,deltaX:e,x:i,recWidth:s}),c+u>0?n.push(l):console.log(`removing target, ${c+u}`,{absoluteX:c,absoluteWidth:u,deltaX:e,x:i,recWidth:s,originalTarget:a})}),this.targets=n}moveTargetY(e){const{height:t}=this.canvas;console.log(`Move target y ${e}`);const n=[];this.targets.forEach((r,s)=>{var l=r,{y:a,recHeight:o}=l,i=f(l,["y","recHeight"]);const c=g({y:a+e,recHeight:o},i),u=a*t/100,m=o*t/100;u+m>0?n.push(c):console.log("removing target")}),this.targets=n}endGame(){this.clearGameLoop(),window.setTimeout(()=>{this.intepretCode(this.scenario.onEnd()),this.renderFrame(this.scenario,!0)},100),this.onGameEnd()}}const GameArea=({currentPage:e})=>{const t=react.exports.useRef(),n=react.exports.useRef(),a=react.exports.useRef(),[o,i]=react.exports.useState("Game stopped! click and press enter to play"),{getJsCode:s}=react.exports.useContext(WorkspaceContext);react.exports.useEffect(()=>{!a.current||a.current.proccessBlocks(s)},[s]);function r(){const{height:l,width:c}=t.current.getBoundingClientRect();!c&&!l||a.current.resize(c,l)}return react.exports.useEffect(()=>{if(!a.current)return a.current=new Engine(n.current,()=>i("Game Running"),()=>i("Game stopped! click and press enter to play")),r(),a.current.proccessBlocks(s),()=>{a.current.tearDown()}},[s]),react.exports.useEffect(()=>(window.addEventListener("resize",r),()=>window.removeEventListener("resize",r)),[]),react.exports.useEffect(()=>{!t.current||r()},[e]),jsxs("div",{className:"game-area",children:[jsx("p",{className:"info",children:o}),jsx("div",{className:"container",ref:t,children:jsx("canvas",{ref:n,onBlur:()=>console.log("blur")})})]})},Settings=()=>{const{getWorkspaceXml:e}=react.exports.useContext(WorkspaceContext);return jsxs("div",{className:"settings",children:[jsx("h2",{children:"Settings"}),jsxs("div",{className:"innerWrapper",children:[jsxs("fieldset",{children:[jsx("legend",{children:"Import"}),jsx("p",{children:"Select a file that was previously exported"}),jsxs("div",{children:[jsx("label",{htmlFor:"importCode",children:"Import code"}),jsx("input",{type:"file",id:"importCode",name:"importCode",onChange:async a=>{a.preventDefault();const o=new FileReader;o.onload=async i=>{const s=i.target.result;localStorage.setItem("blockly_saved_workspace",s)},o.readAsText(a.target.files[0])}})]})]}),jsxs("fieldset",{children:[jsx("legend",{children:"Export"}),jsx("p",{children:"Click here to export your current code and use it later"}),jsx("button",{onClick:()=>{const a=new Blob([e],{type:"application/xml"}),o=document.createElement("a");o.download="munich_coding_club.xml",o.href=window.URL.createObjectURL(a),o.onclick=function(i){const s=this;setTimeout(function(){window.URL.revokeObjectURL(s.href)},1500)},o.click(),o.remove()},children:"Export code"})]})]})]})},ContentWrapper=({children:e,currentPage:t})=>{let a=`content-wrapper ${{[PAGE_APP]:"is-app",[PAGE_CODE]:"is-code",[PAGE_MIX]:"is-mix",[PAGE_SETTINGS]:"is-settings"}[t]}`;return jsx("div",{className:a,children:e})},definition$p={type:"game_setup",colour:"#FFAABB",hat:"cap",message0:"Game setup %1 initial speed %2 Enemy generation speed %3 target generation speed %4 %5 player %6 on start %7 on update %8 onEnemyGeneration %9 on end %10 on colision %11 on up key %12 on down key %13 on forward key %14 on back key %15 on obstacle outside %16 on target generation %17 on target grabbed %18",args0:[{type:"input_dummy"},{type:"input_value",name:"initialSpeedDefault"},{type:"input_value",name:"enemyGenerationSpeed",check:"Number"},{type:"input_value",name:"targetGenerationSpeed",check:"Number"},{type:"input_dummy"},{type:"input_statement",name:"player",check:["game_duck","game_chicken","game_dead_duck","game_dead_chicken"]},{type:"input_statement",name:"onStart"},{type:"input_statement",name:"onUpdate"},{type:"input_statement",name:"onEnemyGeneration"},{type:"input_statement",name:"onEnd"},{type:"input_statement",name:"onColision"},{type:"input_statement",name:"onUp"},{type:"input_statement",name:"onDown"},{type:"input_statement",name:"onForward"},{type:"input_statement",name:"onBackward"},{type:"input_statement",name:"onObstacleOutside"},{type:"input_statement",name:"onTargetGenerated"},{type:"input_statement",name:"onTargetGrabbed"}],inputsInline:!1,previousStatement:null,nextStatement:null,tooltip:"Configures the game settings",helpUrl:""},gameSetup=e=>{e.Blocks.game_setup={init:function(){this.jsonInit(definition$p)}},e.JavaScript.game_setup=function(t){const n=e.JavaScript.valueToCode(t,"initialSpeedDefault",e.JavaScript.ORDER_ATOMIC),a=e.JavaScript.valueToCode(t,"enemyGenerationSpeed",e.JavaScript.ORDER_ATOMIC),o=e.JavaScript.valueToCode(t,"targetGenerationSpeed",e.JavaScript.ORDER_ATOMIC),i=e.JavaScript.statementToCode(t,"player");var s=e.JavaScript.statementToCode(t,"onStart"),r=e.JavaScript.statementToCode(t,"onUpdate"),l=e.JavaScript.statementToCode(t,"onEnd");const c=e.JavaScript.statementToCode(t,"onUp"),u=e.JavaScript.statementToCode(t,"onDown"),m=e.JavaScript.statementToCode(t,"onForward"),h=e.JavaScript.statementToCode(t,"onBackward"),_=e.JavaScript.statementToCode(t,"onColision"),v=e.JavaScript.statementToCode(t,"onEnemyGeneration"),b=e.JavaScript.statementToCode(t,"onObstacleOutside"),k=e.JavaScript.statementToCode(t,"onTargetGrabbed"),y=e.JavaScript.statementToCode(t,"onTargetGenerated");return`engine.setScenario( 3 | { 4 | initialSpeed: ${n||500}, 5 | enemyGenerationSpeed: ${a||500}, 6 | targetGenerationSpeed: ${o||500}, 7 | player: ${i||"null"}, 8 | onStart: () => { 9 | ${s} 10 | }, 11 | onUpdate: () => { 12 | ${r} 13 | }, 14 | onEnd: () => { 15 | ${l} 16 | }, 17 | onEnemyGeneration: () => { 18 | ${v} 19 | }, 20 | onUpKey: () => { 21 | ${c} 22 | }, 23 | onDownKey: () => { 24 | ${u} 25 | }, 26 | onForwardKey: () => { 27 | ${m} 28 | }, 29 | onBackwardKey: () => { 30 | ${h} 31 | }, 32 | onColision: () => { 33 | ${_} 34 | }, 35 | onObstacleOutside: () => { 36 | ${b} 37 | }, 38 | onTargetGrabbed: () => { 39 | ${k} 40 | }, 41 | onTargetGenerated: () => { 42 | ${y} 43 | } 44 | }); 45 | `}};var duckImage$1="/blockly-player/images/duck.svg";const definition$o={type:"game_duck",message0:"Duck %1",args0:[{type:"field_image",src:duckImage$1,width:40,height:40,alt:"duck",flipRtl:!1}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null},playerDuck=e=>{e.Blocks.game_duck={init:function(){this.jsonInit(definition$o)}},e.JavaScript.game_duck=function(t){var n="PLAYER_DUCK";return n}};var duckImage="/blockly-player/images/deadDuck.svg";const definition$n={type:"game_dead_duck",message0:"Dead Duck %1",args0:[{type:"field_image",src:duckImage,width:40,height:40,alt:"dead duck",flipRtl:!1}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null},playerDeadDuck=e=>{e.Blocks.game_dead_duck={init:function(){this.jsonInit(definition$n)}},e.JavaScript.game_dead_duck=function(t){return"PLAYER_DEAD_DUCK"}};var src="/blockly-player/images/deadChicken.svg";const definition$m={type:"game_dead_chicken",message0:"Dead Chicken %1",args0:[{type:"field_image",src,width:40,height:40,alt:"dead chicken",flipRtl:!1}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null},playerDeadChicken=e=>{e.Blocks.game_dead_chicken={init:function(){this.jsonInit(definition$m)}},e.JavaScript.game_dead_chicken=function(t){var n="PLAYER_DEAD_CHICKEN";return n}},definition$l={type:"game_chicken",message0:"Chicken %1",args0:[{type:"field_image",src:src$1,width:40,height:40,alt:"chicken",flipRtl:!1}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null},playerChicken=e=>{e.Blocks.game_chicken={init:function(){this.jsonInit(definition$l)}},e.JavaScript.game_chicken=function(t){var n="PLAYER_CHICKEN";return n}};function overWrite(e){e.JavaScript.text_print=function(t){return`engine.writeText(${e.JavaScript.valueToCode(t,"TEXT",e.JavaScript.ORDER_NONE)||"''"}); 46 | `}}const definition$k={type:"canvas_background_color",message0:"background color %1",args0:[{type:"input_value",name:"backgroundColor",check:"Colour"}],previousStatement:null,nextStatement:null,colour:"#6600cc",tooltip:"",helpUrl:""},backgroundColor=e=>{e.Blocks.canvas_background_color={init:function(){this.jsonInit(definition$k)}},e.JavaScript.canvas_background_color=function(t){var a=`engine.drawBackground(${e.JavaScript.valueToCode(t,"backgroundColor",e.JavaScript.ORDER_NONE)||"''"}); 47 | `;return a}},definition$j={type:"canvas_text_size",message0:"Text size %1",args0:[{type:"input_value",name:"textSize",check:"Number"}],previousStatement:null,nextStatement:null,colour:"#6600cc",tooltip:"",helpUrl:""},textSize=e=>{e.Blocks.canvas_text_size={init:function(){this.jsonInit(definition$j)}},e.JavaScript.canvas_text_size=function(t){var a=`engine.setTextSize(${e.JavaScript.valueToCode(t,"textSize",e.JavaScript.ORDER_NONE)||"''"}); 48 | `;return a}},definition$i={type:"canvas_width",message0:"CANVAS_WIDTH",output:null,colour:"#6600cc",tooltip:"",helpUrl:""},canvasWidth=e=>{e.Blocks.canvas_width={init:function(){this.jsonInit(definition$i)}},e.JavaScript.canvas_width=function(t){return["canvas.width",e.JavaScript.ORDER_NONE]}},definition$h={type:"canvas_height",message0:"CANVAS_HEIGHT",output:null,colour:"#6600cc",tooltip:"",helpUrl:""},canvasHeight=e=>{e.Blocks.canvas_height={init:function(){this.jsonInit(definition$h)}},e.JavaScript.canvas_height=function(t){return["canvas.width",e.JavaScript.ORDER_NONE]}},definition$g={type:"canvas_set_text_color",message0:"text color %1",args0:[{type:"input_value",name:"textColor",check:"Colour"}],previousStatement:null,nextStatement:null,colour:"#6600cc",tooltip:"",helpUrl:""},canvasSetTextColor=e=>{e.Blocks.canvas_set_text_color={init:function(){this.jsonInit(definition$g)}},e.JavaScript.canvas_set_text_color=function(t){var a=`engine.setTextColor(${e.JavaScript.valueToCode(t,"textColor",e.JavaScript.ORDER_NONE)||"''"}); 49 | `;return a}},definition$f={type:"canvas_set_cursor",message0:"Set Text Cursor %1 X %2 Y %3",args0:[{type:"input_dummy"},{type:"input_value",name:"x",check:"Number"},{type:"input_value",name:"y",check:"Number"}],colour:"#6600cc",tooltip:"",helpUrl:"",previousStatement:null,nextStatement:null},canvasSetCursor=e=>{e.Blocks.canvas_set_cursor={init:function(){this.jsonInit(definition$f)}},e.JavaScript.canvas_set_cursor=function(t){const n=e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC)||0,a=e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC)||0;return`engine.setCursor(${n}, ${a}); 50 | `}},definition$e={type:"canvas_draw_rectangle",message0:"drawRectangle %1 x %2 y %3 width %4 height %5 Colour %6",args0:[{type:"input_dummy"},{type:"input_value",name:"x",check:"Number"},{type:"input_value",name:"y",check:"Number"},{type:"input_value",name:"width",check:"Number"},{type:"input_value",name:"height",check:"Number"},{type:"input_value",name:"color",check:"Colour"}],colour:"#6600cc",tooltip:"",helpUrl:"",previousStatement:null,nextStatement:null},canvasDrawRectangle=e=>{e.Blocks.canvas_draw_rectangle={init:function(){this.jsonInit(definition$e)}},e.JavaScript.canvas_draw_rectangle=function(t){const n=e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC),a=e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC),o=e.JavaScript.valueToCode(t,"width",e.JavaScript.ORDER_ATOMIC),i=e.JavaScript.valueToCode(t,"height",e.JavaScript.ORDER_ATOMIC),s=e.JavaScript.valueToCode(t,"color",e.JavaScript.ORDER_ATOMIC);return`engine.drawRectangle(${n||0}, ${a||0}, ${o||0}, ${i||0}, ${s})`}},definition$d={type:"canvas_set_text_align",message0:"setTextAlign %1",args0:[{type:"field_dropdown",name:"align",options:[["left","left"],["right","right"],["center","center"]]}],previousStatement:null,nextStatement:null,colour:"#6600cc",tooltip:"",helpUrl:""},canvasSetTextAlign=e=>{e.Blocks.canvas_set_text_align={init:function(){this.jsonInit(definition$d)}},e.JavaScript.canvas_set_text_align=function(t){return`engine.setTextAlign('${t.getFieldValue("align")}'); 51 | `}},definition$c={type:"player_x",message0:"PLAYER_X",output:null,colour:"#FFAABB",tooltip:"",helpUrl:""},playerX=e=>{e.Blocks.player_x={init:function(){this.jsonInit(definition$c)}},e.JavaScript.player_x=function(t){return["engine.getPlayerX()",e.JavaScript.ORDER_NONE]}},definition$b={type:"player_y",message0:"PLAYER_Y",output:null,colour:"#FFAABB",tooltip:"",helpUrl:""},playerY=e=>{e.Blocks.player_y={init:function(){this.jsonInit(definition$b)}},e.JavaScript.player_y=function(t){return["engine.getPlayerY()",e.JavaScript.ORDER_NONE]}},definition$a={type:"game_obstacle",message0:"Obstacle %1",args0:[{type:"input_statement",name:"obstacle"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameObstacle=e=>{e.Blocks.game_obstacle={init:function(){this.jsonInit(definition$a)}},e.JavaScript.game_obstacle=function(t){return` 52 | engine.setObstacles(() => { 53 | ${e.JavaScript.statementToCode(t,"obstacle")} 54 | }) 55 | ; 56 | `}},definition$9={type:"game_target",message0:"Target %1",args0:[{type:"input_statement",name:"target"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameTarget=e=>{e.Blocks.game_target={init:function(){this.jsonInit(definition$9)}},e.JavaScript.game_target=function(t){return` 57 | engine.setTarget(() => { 58 | ${e.JavaScript.statementToCode(t,"target")} 59 | }) 60 | ; 61 | `}},definition$8={type:"game_set_player_position",message0:"Set Player position %1 X %2 Y %3",args0:[{type:"input_dummy"},{type:"input_value",name:"x",check:"Number"},{type:"input_value",name:"y",check:"Number"}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null,nextStatement:null},gameSetPlayerPosition=e=>{e.Blocks.game_set_player_position={init:function(){this.jsonInit(definition$8)}},e.JavaScript.game_set_player_position=function(t){const n=e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC)||0,a=e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC)||0;return`engine.setPlayerPosition(${n}, ${a}); 62 | `}},definition$7={type:"game_set_player_position_x",message0:"Set Player position X %1",args0:[{type:"input_value",name:"x",check:"Number"}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null,nextStatement:null},gameSetPlayerPositionX=e=>{e.Blocks.game_set_player_position_x={init:function(){this.jsonInit(definition$7)}},e.JavaScript.game_set_player_position_x=function(t){return`engine.setPlayerPosition(${e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC)||0}); 63 | `}},definition$6={type:"game_set_player_position_y",message0:"Set Player position Y %1",args0:[{type:"input_value",name:"y",check:"Number"}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null,nextStatement:null},gameSetPlayerPositionY=e=>{e.Blocks.game_set_player_position_y={init:function(){this.jsonInit(definition$6)}},e.JavaScript.game_set_player_position_y=function(t){return`engine.setPlayerPosition(undefined,${e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC)||0}); 64 | `}},definition$5={type:"game_move_obstacle_x",message0:"move obstacle x %1",args0:[{type:"input_value",name:"x",check:"Number"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameMoveObstacleX=e=>{e.Blocks.game_move_obstacle_x={init:function(){this.jsonInit(definition$5)}},e.JavaScript.game_move_obstacle_x=function(t){return`engine.moveObstacleX(${e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC)});`}},definition$4={type:"game_move_obstacle_y",message0:"move obstacle y %1",args0:[{type:"input_value",name:"y",check:"Number"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameMoveObstacleY=e=>{e.Blocks.game_move_obstacle_y={init:function(){this.jsonInit(definition$4)}},e.JavaScript.game_move_obstacle_y=function(t){return`engine.moveObstacleY(${e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC)});`}},definition$3={type:"game_move_target_x",message0:"move target x %1",args0:[{type:"input_value",name:"x",check:"Number"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameMoveTargetX=e=>{e.Blocks.game_move_target_x={init:function(){this.jsonInit(definition$3)}},e.JavaScript.game_move_target_x=function(t){return`engine.moveTargetX(${e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC)});`}},definition$2={type:"game_move_target_y",message0:"move target y %1",args0:[{type:"input_value",name:"y",check:"Number"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameMoveTargetY=e=>{e.Blocks.game_move_target_y={init:function(){this.jsonInit(definition$2)}},e.JavaScript.game_move_target_y=function(t){return`engine.moveTargetY(${e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC)});`}},definition$1={type:"game_end_game",message0:"end game",previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameEndGame=e=>{e.Blocks.game_end_game={init:function(){this.jsonInit(definition$1)}},e.JavaScript.game_end_game=function(t){return`engine.endGame(); 65 | `}},definition={type:"game_set_player_icon",message0:"set player icon %1",args0:[{type:"input_statement",name:"playerIcon"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},setPlayerIcon=e=>{e.Blocks.game_set_player_icon={init:function(){this.jsonInit(definition)}},e.JavaScript.game_set_player_icon=function(t){return`engine.setAvatar(${e.JavaScript.statementToCode(t,"playerIcon")}); 66 | `}};function initializeCustomBlocks(e){gameSetup(e),playerDuck(e),playerChicken(e),overWrite(e),backgroundColor(e),textSize(e),canvasWidth(e),canvasHeight(e),canvasSetCursor(e),canvasSetTextAlign(e),canvasSetTextColor(e),canvasDrawRectangle(e),playerY(e),playerX(e),gameSetPlayerPosition(e),gameSetPlayerPositionX(e),gameSetPlayerPositionY(e),gameObstacle(e),gameTarget(e),gameMoveObstacleX(e),gameMoveObstacleY(e),gameMoveTargetX(e),gameMoveTargetY(e),gameEndGame(e),playerDeadDuck(e),playerDeadChicken(e),setPlayerIcon(e)}const toolbox={kind:"categoryToolbox",contents:[{kind:"category",name:"Loops",colour:"#5ba55b",contents:[{kind:"block",blockxml:` 67 | 68 | 69 | 10 70 | 71 | 72 | `},{kind:"block",blockxml:` 73 | WHILE 74 | `},{kind:"block",blockxml:` 75 | i 76 | 77 | 78 | 1 79 | 80 | 81 | 82 | 83 | 10 84 | 85 | 86 | 87 | 88 | 1 89 | 90 | 91 | `},{kind:"block",blockxml:` 92 | j 93 | `},{kind:"block",blockxml:` 94 | 95 | BREAK 96 | `}]},{kind:"category",name:"logic",colour:"210",contents:[{kind:"block",type:"controls_if"},{kind:"block",type:"controls_whileUntil"},{kind:"block",blockxml:` 97 | EQ 98 | `},{kind:"block",blockxml:` 99 | AND 100 | `},{kind:"block",blockxml:` 101 | TRUE 102 | `},{kind:"block",type:"logic_negate"},{kind:"block",type:"logic_null"},{kind:"block",type:"logic_ternary"}]},{kind:"category",name:"Math",colour:"#5b67a5",contents:[{kind:"block",blockxml:` 103 | 0 104 | `},{kind:"block",blockxml:` 105 | ADD 106 | 107 | 108 | 1 109 | 110 | 111 | 112 | 113 | 1 114 | 115 | 116 | `},{kind:"block",blockxml:` 117 | ROOT 118 | 119 | 120 | 9 121 | 122 | 123 | `},{kind:"block",blockxml:` 124 | SIN 125 | 126 | 127 | 45 128 | 129 | 130 | `},{kind:"block",blockxml:` 131 | PI 132 | `},{kind:"block",blockxml:` 133 | 134 | EVEN 135 | 136 | 137 | 0 138 | 139 | 140 | `},{kind:"block",blockxml:` 141 | ROUND 142 | 143 | 144 | 3.1 145 | 146 | 147 | `},{kind:"block",blockxml:` 148 | 149 | SUM 150 | `},{kind:"block",blockxml:` 151 | 152 | 153 | 64 154 | 155 | 156 | 157 | 158 | 10 159 | 160 | 161 | `},{kind:"block",blockxml:` 162 | 163 | 164 | 50 165 | 166 | 167 | 168 | 169 | 1 170 | 171 | 172 | 173 | 174 | 100 175 | 176 | 177 | `},{kind:"block",blockxml:` 178 | 179 | 180 | 1 181 | 182 | 183 | 184 | 185 | 100 186 | 187 | 188 | `},{kind:"block",type:"math_random_float"}]},{kind:"category",name:"text",colour:"#5ba58c",contents:[{kind:"block",blockxml:` 189 | 190 | `},{kind:"block",blockxml:` 191 | 192 | 193 | `},{kind:"block",blockxml:` 194 | item 195 | 196 | 197 | 198 | 199 | 200 | `},{kind:"block",blockxml:` 201 | 202 | 203 | 204 | abc 205 | 206 | 207 | `},{kind:"block",blockxml:` 208 | 209 | 210 | 211 | 212 | 213 | 214 | `},{kind:"block",blockxml:` 215 | FIRST 216 | 217 | 218 | text 219 | 220 | 221 | 222 | 223 | abc 224 | 225 | 226 | `},{kind:"block",blockxml:` 227 | 228 | FROM_START 229 | 230 | 231 | text 232 | 233 | 234 | `},{kind:"block",blockxml:` 235 | 236 | FROM_START 237 | FROM_START 238 | 239 | 240 | text 241 | 242 | 243 | `},{kind:"block",blockxml:` 244 | UPPERCASE 245 | 246 | 247 | abc 248 | 249 | 250 | `},{kind:"block",blockxml:` 251 | BOTH 252 | 253 | 254 | abc 255 | 256 | 257 | `},{kind:"block",blockxml:` 258 | 259 | 260 | abc 261 | 262 | 263 | `}]},{kind:"category",name:"Lists",colour:"#745ba5",contents:[{kind:"block",blockxml:` 264 | 265 | `},{kind:"block",blockxml:` 266 | 267 | `},{kind:"block",blockxml:` 268 | 269 | 270 | 5 271 | 272 | 273 | `},{kind:"block",type:"lists_length"},{kind:"block",blockxml:` 274 | FIRST 275 | 276 | 277 | list 278 | 279 | 280 | `},{kind:"block",blockxml:` 281 | 282 | GET 283 | FROM_START 284 | 285 | 286 | list 287 | 288 | 289 | `},{kind:"block",blockxml:` 290 | 291 | SET 292 | FROM_START 293 | 294 | 295 | list 296 | 297 | 298 | `},{kind:"block",blockxml:` 299 | 300 | FROM_START 301 | FROM_START 302 | 303 | 304 | list 305 | 306 | 307 | `},{kind:"block",blockxml:` 308 | 309 | SPLIT 310 | 311 | 312 | , 313 | 314 | 315 | `},{kind:"block",blockxml:` 316 | NUMERIC 317 | 1 318 | `}]},{kind:"category",name:"Colour",colour:"#a5745b",contents:[{kind:"block",blockxml:` 319 | #ff0000 320 | `},{kind:"block",type:"colour_random"},{kind:"block",blockxml:` 321 | 322 | 323 | 100 324 | 325 | 326 | 327 | 328 | 50 329 | 330 | 331 | 332 | 333 | 0 334 | 335 | 336 | `},{kind:"block",blockxml:` 337 | 338 | 339 | #ff0000 340 | 341 | 342 | 343 | 344 | #3333ff 345 | 346 | 347 | 348 | 349 | 0.5 350 | 351 | 352 | `}]},{kind:"sep"},{kind:"category",name:"Variables",colour:"#a55b80",custom:"VARIABLE"},{kind:"category",name:"Procedures",colour:"#995ba5",custom:"PROCEDURE"},{kind:"sep"},{kind:"category",name:"canvas",colour:"#6600cc",contents:[{kind:"block",blockxml:` 353 | 354 | 355 | #33ccff 356 | 357 | 358 | `},{kind:"block",blockxml:` 359 | 360 | 361 | #000000 362 | 363 | 364 | `},{kind:"block",type:"canvas_set_text_align"},{kind:"block",blockxml:` 365 | 366 | 367 | 3 368 | 369 | 370 | 371 | `},{kind:"block",blockxml:` 372 | 373 | 374 | #00FF00 375 | 376 | 377 | 378 | 379 | 380 | 0 381 | 382 | 383 | 384 | 385 | 0 386 | 387 | 388 | 389 | 390 | 5 391 | 392 | 393 | 394 | 395 | 35 396 | 397 | 398 | `},{kind:"block",type:"canvas_width"},{kind:"block",type:"canvas_height"},{kind:"block",blockxml:` 399 | 400 | 401 | 0 402 | 403 | 404 | 405 | 406 | 407 | 0 408 | 409 | 410 | 411 | `}]},{kind:"category",name:"game",colour:"#FFAABB",contents:[{kind:"block",blockxml:` 412 | 413 | 414 | 500 415 | 416 | 417 | 418 | 419 | 900 420 | 421 | 422 | 423 | 424 | 425 | 2000 426 | 427 | 428 | 429 | `},{kind:"block",type:"game_duck"},{kind:"block",type:"game_dead_duck"},{kind:"block",type:"game_chicken"},{kind:"block",type:"game_dead_chicken"},{kind:"block",type:"player_x"},{kind:"block",type:"player_y"},{kind:"block",type:"game_set_player_position"},{kind:"block",type:"game_set_player_position_x"},{kind:"block",type:"game_set_player_position_y"},{kind:"block",type:"game_set_player_icon"},{kind:"block",type:"game_obstacle"},{kind:"block",type:"game_target"},{kind:"block",type:"game_move_obstacle_x"},{kind:"block",type:"game_move_obstacle_y"},{kind:"block",type:"game_move_target_x"},{kind:"block",type:"game_move_target_y"},{kind:"block",type:"game_end_game"}]}]};function debounce(e,t=300){let n;return(...a)=>{clearTimeout(n),n=setTimeout(()=>{e.apply(this,a)},t)}}function initialize(e,t,n,i){var s=i,{initialXml:a}=s,o=f(s,["initialXml"]);initializeCustomBlocks(Blockly),console.log("initializing blockly"),Blockly.setLocale(locale);const r=Blockly.inject(e,g({toolbox},o)),l="blockly_saved_workspace",c=m=>{const h=Blockly.Xml.workspaceToDom(r),_=Blockly.Xml.domToText(h);n(_),localStorage.setItem(l,_),t(Blockly.JavaScript.workspaceToCode(r))},u=localStorage.getItem(l);return n(u),r.addChangeListener(debounce(c,500)),Blockly.Xml.domToWorkspace(Blockly.Xml.textToDom(u||a),r),t(Blockly.JavaScript.workspaceToCode(r)),r}const BlocklyEditor=a=>{var o=a,{currentPage:e,children:t}=o,n=f(o,["currentPage","children"]);const i=react.exports.useRef(),s=react.exports.useRef();let r=react.exports.useRef();const{setGetJsCode:l,setWorkspaceXml:c}=react.exports.useContext(WorkspaceContext);function u(){if(!r.current||!s.current)return;Blockly.svgResize(r.current);const{height:m,width:h}=s.current.getBoundingClientRect();console.info(`Resizing blockly to ${m}`),!!m&&(i.current.querySelector(".blocklySvg").setAttribute("height",`${m}px`),i.current.querySelector(".blocklySvg").setAttribute("width",`${h}px`))}return react.exports.useEffect(()=>{r.current||(r.current=initialize(i.current,l,c,n),new ResizeObserver(u).observe(s.current))}),react.exports.useEffect(()=>{},[e]),jsx("div",{className:"blockly-container",ref:s,children:jsx("div",{ref:i,id:"blocklyDiv"})})};function App(){const[e,t]=react.exports.useState(PAGE_MIX),[n,a]=react.exports.useState(()=>""),[o,i]=react.exports.useState(()=>"");return jsx(WorkspaceContext.Provider,{value:{getJsCode:n,setGetJsCode:a,getWorkspaceXml:o,setWorkspaceXml:i},children:jsxs(Wrapper,{children:[jsx(Navigator,{onApp:()=>t(PAGE_APP),onCode:()=>t(PAGE_CODE),onMix:()=>t(PAGE_MIX),onSettings:()=>t(PAGE_SETTINGS),currentPage:e}),jsxs(ContentWrapper,{currentPage:e,children:[(e===PAGE_MIX||e===PAGE_CODE)&&jsx(BlocklyEditor,{readOnly:!1,trashcan:!0,currentPage:e,move:{scrollbars:!0,drag:!0,wheel:!0},zoom:{controls:!0,wheel:!0},initialXml:` 430 | 431 | 432 | 433 | `}),(e===PAGE_MIX||e===PAGE_APP)&&jsx(GameArea,{currentPage:e}),e===PAGE_SETTINGS&&jsx(Settings,{})]})]})})}ReactDOM.render(jsx(React.StrictMode,{children:jsx(App,{})}),document.getElementById("root")); 434 | -------------------------------------------------------------------------------- /assets/index.994285b4.js: -------------------------------------------------------------------------------- 1 | var A=Object.defineProperty;var S=Object.getOwnPropertySymbols;var T=Object.prototype.hasOwnProperty,R=Object.prototype.propertyIsEnumerable;var w=(e,t,n)=>t in e?A(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,g=(e,t)=>{for(var n in t||(t={}))T.call(t,n)&&w(e,n,t[n]);if(S)for(var n of S(t))R.call(t,n)&&w(e,n,t[n]);return e};var f=(e,t)=>{var n={};for(var a in e)T.call(e,a)&&t.indexOf(a)<0&&(n[a]=e[a]);if(e!=null&&S)for(var a of S(e))t.indexOf(a)<0&&R.call(e,a)&&(n[a]=e[a]);return n};var d=(e,t,n)=>(w(e,typeof t!="symbol"?t+"":t,n),n);import{j as jsxRuntime,r as react,B as Blockly,l as locale,R as ReactDOM,a as React}from"./vendor.4895ae15.js";const p=function(){const t=document.createElement("link").relList;if(t&&t.supports&&t.supports("modulepreload"))return;for(const o of document.querySelectorAll('link[rel="modulepreload"]'))a(o);new MutationObserver(o=>{for(const i of o)if(i.type==="childList")for(const s of i.addedNodes)s.tagName==="LINK"&&s.rel==="modulepreload"&&a(s)}).observe(document,{childList:!0,subtree:!0});function n(o){const i={};return o.integrity&&(i.integrity=o.integrity),o.referrerpolicy&&(i.referrerPolicy=o.referrerpolicy),o.crossorigin==="use-credentials"?i.credentials="include":o.crossorigin==="anonymous"?i.credentials="omit":i.credentials="same-origin",i}function a(o){if(o.ep)return;o.ep=!0;const i=n(o);fetch(o.href,i)}};p();var index="";const jsx=jsxRuntime.exports.jsx,jsxs=jsxRuntime.exports.jsxs,Wrapper=({children:e})=>jsx("div",{className:"wrapper",children:e}),PAGE_CODE=0,PAGE_MIX=1,PAGE_APP=2,PAGE_SETTINGS=3,Navigator=({onCode:e,onMix:t,onApp:n,onSettings:a,currentPage:o})=>jsxs("nav",{className:"navigator",children:[jsx("div",{className:"menu-item",onClick:a,"data-is-current":o===PAGE_SETTINGS,children:"Settings"}),jsx("div",{className:"menu-item",onClick:e,"data-is-current":o===PAGE_CODE,children:"Code"}),jsx("div",{className:"menu-item",onClick:t,"data-is-current":o===PAGE_MIX,children:"Mix"}),jsx("div",{className:"menu-item",onClick:n,"data-is-current":o===PAGE_APP,children:"App"})]}),WorkspaceContext=react.exports.createContext();var duckImage$2="/blockly-player/images/duck.png",src$1="/blockly-player/images/chicken.png",deadDuckImage="/blockly-player/images/deadDuck.png",deadChickenImage="/blockly-player/images/deadChicken.png";const PLAYER_DUCK=Symbol("PLAYER_DUCK"),PLAYER_CHICKEN=Symbol("PLAYER_CHICKEN"),PLAYER_DEAD_DUCK=Symbol("PLAYER_DEAD_DUCK"),PLAYER_DEAD_CHICKEN=Symbol("PLAYER_DEAD_CHICKEN"),imageMap={[PLAYER_DUCK]:duckImage$2,[PLAYER_CHICKEN]:src$1,[PLAYER_DEAD_DUCK]:deadDuckImage,[PLAYER_DEAD_CHICKEN]:deadChickenImage};class Engine{constructor(e,t,n){d(this,"canvas");d(this,"ctx");d(this,"textSizeInPercentage",5);d(this,"textCursor",[0,0]);d(this,"textColor","black");d(this,"textAlign","left");d(this,"customCursor",!1);d(this,"scenario",{});d(this,"currentScenario",{});d(this,"currentCode");d(this,"isGameRunning",!1);d(this,"playerPosition",[10,10]);d(this,"playerSize",10);d(this,"withinObstacleGuard",!1);d(this,"withinTargetGuard",!1);d(this,"obstacles",[]);d(this,"targets",[]);d(this,"gameHud",[]);d(this,"gameInterval");d(this,"enemyInterval");d(this,"onGameStart",()=>{});d(this,"onGameEnd",()=>{});this.canvas=e,this.onGameStart=t,this.onGameEnd=n,this.ctx=e.getContext("2d"),this.ctx.font="20px arial",document.addEventListener("keydown",this.listenToKeys.bind(this))}handleStart(){console.log("Will start interactions"),this.proccessBlocks(this.currentCode)}startGame(){if(console.log("Should start the game with ",this.currentScenario),this.scenario=g({},this.currentScenario),!(!this.scenario||this.isGameRunning)){this.onGameStart(),console.log("Starting game"),this.isGameRunning=!0,this.obstacles=[],this.targets=[],this.gameHud=[];try{console.log("Calling onStart",this.scenario.onStart),this.intepretCode(this.scenario.onStart()),this.renderFrame(),this.gameInterval=setInterval(()=>{this.gameHud=[],this.intepretCode(this.scenario.onUpdate())},this.scenario.initialSpeed||500),this.renderInterval=setInterval(()=>{this.renderFrame()},this.scenario.initialSpeed||100),this.enemyInterval=setInterval(()=>{var e;this.intepretCode((e=this.scenario)==null?void 0:e.onEnemyGeneration())},this.scenario.enemyGenerationSpeed||500),this.targetGenerationInterval=setInterval(()=>{var e;this.intepretCode((e=this.scenario)==null?void 0:e.onTargetGenerated())},this.scenario.targetGenerationSpeed||500)}catch(e){console.error(e)}}}listenToKeys(e){e.code==="Enter"&&this.startGame();const{scenario:t}=this;if(!!this.isGameRunning)try{e.code==="ArrowUp"&&this.intepretCode(t.onUpKey()),e.code==="ArrowDown"&&this.intepretCode(t.onDownKey()),e.code==="ArrowRight"&&this.intepretCode(t.onForwardKey()),e.code==="ArrowLeft"&&this.intepretCode(t.onBackwardKey())}catch(n){console.error(n)}}resize(e,t){if(!e&&!t)return;const n=100*Math.floor(Math.min(t,e)/100);n!==this.size&&(this.size=n,console.log(`Resizing canvas to ${n}`),this.canvas.setAttribute("width",`${n}px`),this.canvas.setAttribute("height",`${n}px`),this.proccessBlocks(this.currentCode))}tearDown(){console.log("Tearing game down"),this.clearGameLoop(),document.removeEventListener("keydown",this.listenToKeys.bind(this))}clearGameLoop(){window.clearInterval(this.renderInterval),window.clearInterval(this.gameInterval),window.clearInterval(this.targetGenerationInterval),window.clearInterval(this.enemyInterval),this.isGameRunning=!1}drawImage(e,t,n,a=void 0,o=void 0){const i=new Image;i.src=e,i.onload=()=>{this.ctx.drawImage(i,0,0,i.width,i.height,t,n,a,o)}}proccessBlocks(e){this.canvas,this.currentCode=e,console.log(`Interpreting code 2 | ${e}`),this.textSizeInPercentage=5,this.textCursor=[0,0],this.textColor="black",this.textAlign="left",this.customCursor=!1,this.playerPosition=[10,10],this.playerSize=10,this.intepretCode(e)}intepretCode(code){if(!code)return;const engine=this,canvas=this.canvas;if(engine&&canvas)try{eval(code)}catch(e){console.error(e)}}drawBackground(e){if(e||(e=this.backgroundColor),!e)return;const{ctx:t,size:n}=this;t.fillStyle=e,this.backgroundColor=e,t.fillRect(0,0,n,n)}writeText(e,t){if(this.isGameRunning&&!t){this.gameHud.push(()=>this.writeText(e,!0));return}const{ctx:n,canvas:a}=this,o=a.height*this.textSizeInPercentage/100;n.font=`${o}px Arial`,n.fillStyle=this.textColor,n.textAlign=this.textAlign;const[i,s]=this.textCursor;let r=i;if(!this.customCursor)switch(this.textAlign){case"left":r=0;break;case"center":r=a.width/2;break;case"right":r=a.width;break}n.fillText(e,r,s+o),this.textCursor[1]=s+o,this.customCursor=!1}setTextSize(e,t){if(this.isGameRunning&&!t){this.gameHud.push(()=>this.setTextSize(e,!0));return}this.textSizeInPercentage=e}setTextAlign(e,t){if(this.isGameRunning&&!t){this.gameHud.push(()=>this.setTextAlign(e,!0));return}this.textAlign=e}setCursor(e=0,t=0,n){if(this.isGameRunning&&!n){this.gameHud.push(()=>this.setCursor(e,t,!0));return}this.textCursor=[e,t]}setTextColor(e,t){if(this.isGameRunning&&!t){this.gameHud.push(()=>this.setTextColor(e,!0));return}this.textColor=e}setPlayer(e){this.player=e}setScenario(e){console.log("settign scenario",e),this.currentScenario=g({},e);const{player:t}=e;console.log({player:t}),this.renderGame(this.currentScenario)}renderGame(e){try{const{player:t}=e;if(console.log("rendering the game",e),!t){console.log("No game without a player");return}this.renderFrame(e)}catch(t){console.error(t)}}getPlayerX(){return this.playerPosition[0]}getPlayerY(){return this.playerPosition[1]}setPlayerPosition(e,t){typeof e=="undefined"&&(e=this.getPlayerX()),typeof t=="undefined"&&(t=this.getPlayerY()),this.playerPosition=[e,t],console.log(`Setting player to ${t}`),this.renderFrame()}renderPlayer(e){const{player:t}=e||this.scenario,{canvas:n,ctx:a}=this,o=n.height*this.playerSize/100,[i,s]=this.playerPosition,r=Math.min(n.width,Math.max(0,n.width*i/100-o/2)),l=Math.min(n.height,Math.max(0,n.height*s/100-o/2));this.drawImage(imageMap[t],r,l,o,o)}setAvatar(e){this.scenario.player=e}renderFrame(e,t){this.clearFrame(),this.drawBackground(),this.renderPlayer(e),this.obstacles.forEach(({x:n,y:a,recWidth:o,recHeight:i,color:s})=>{this.drawRectangle(n,a,o,i,s,!0,!1,t)}),this.targets=this.targets.filter(({x:n,y:a,recWidth:o,recHeight:i,color:s})=>!this.drawRectangle(n,a,o,i,s,!1,!0,t)),this.gameHud.forEach((n,a)=>{n()})}clearFrame(){const{ctx:e,canvas:t}=this;e.clearRect(0,0,t.width,t.height),e.beginPath(),e.moveTo(0,0),e.lineTo(t.width,t.height),e.stroke()}drawRectangle(e,t,n,a,o,i,s,r){var C,E;const{ctx:l,canvas:c}=this,{height:u,width:m}=c,h=i||this.withinObstacleGuard,_=s||this.withinObstacleGuard;l.fillStyle=o,this.withinObstacleGuard&&this.obstacles.push({x:e,y:t,recWidth:n,recHeight:a,color:o}),this.withinTargetGuard&&this.targets.push({x:e,y:t,recWidth:n,recHeight:a,color:o});const v=e*m/100,b=t*u/100,k=n*m/100,y=a*u/100;l.fillRect(v,b,k,y);let x=!1;return r||(x=this.checkColision(v,b,k,y)),x&&(h?this.intepretCode((C=this.scenario)==null?void 0:C.onColision()):_&&(this.intepretCode((E=this.scenario)==null?void 0:E.onTargetGrabbed()),this.renderFrame(this.scenario,!0))),x}checkColision(e,t,n,a){if(!this.isGameRunning)return!1;const{canvas:o}=this,i=o.height*this.playerSize/100,[s,r]=this.playerPosition,l=Math.min(o.width,Math.max(0,o.width*s/100-i/2)),c=Math.min(o.height,Math.max(0,o.height*r/100-i/2));return le&&ct}setObstacles(e){!e||(this.withinObstacleGuard=!0,e(),this.withinObstacleGuard=!1)}setTarget(e){!e||(this.withinTargetGuard=!0,e(),this.withinTargetGuard=!1)}moveObstacleX(e){const{width:t}=this.canvas,n=[];this.obstacles.forEach((r,s)=>{var l=r,{x:a,recWidth:o}=l,i=f(l,["x","recWidth"]);var h;const c=g({x:a+e,recWidth:o},i),u=a*t/100,m=o*t/100;u+m>0?n.push(c):((h=this.scenario)==null||h.onObstacleOutside(),console.log("removing obstacle"))}),this.obstacles=n}moveObstacleY(e){const{height:t}=this.canvas,n=[];this.obstacles.forEach((r,s)=>{var l=r,{y:a,recHeight:o}=l,i=f(l,["y","recHeight"]);const c=g({y:a+e,recHeight:o},i),u=a*t/100,m=o*t/100;u+m>0?n.push(c):console.log("removing obstacle")}),this.obstacles=n}moveTargetX(e){const{width:t}=this.canvas,n=[];this.targets.forEach((a,o)=>{const m=a,{x:i,recWidth:s}=m,r=f(m,["x","recWidth"]),l=g({x:i+e,recWidth:s},r),c=i*t/100,u=s*t/100;console.log({absoluteX:c,absoluteWidth:u,deltaX:e,x:i,recWidth:s}),c+u>0?n.push(l):console.log(`removing target, ${c+u}`,{absoluteX:c,absoluteWidth:u,deltaX:e,x:i,recWidth:s,originalTarget:a})}),this.targets=n}moveTargetY(e){const{height:t}=this.canvas;console.log(`Move target y ${e}`);const n=[];this.targets.forEach((r,s)=>{var l=r,{y:a,recHeight:o}=l,i=f(l,["y","recHeight"]);const c=g({y:a+e,recHeight:o},i),u=a*t/100,m=o*t/100;u+m>0?n.push(c):console.log("removing target")}),this.targets=n}endGame(){this.clearGameLoop(),window.setTimeout(()=>{this.intepretCode(this.scenario.onEnd()),this.renderFrame(this.scenario,!0)},100),this.onGameEnd()}}const GameArea=({currentPage:e})=>{const t=react.exports.useRef(),n=react.exports.useRef(),a=react.exports.useRef(),[o,i]=react.exports.useState("Game stopped! click and press enter to play"),{getJsCode:s}=react.exports.useContext(WorkspaceContext);react.exports.useEffect(()=>{!a.current||a.current.proccessBlocks(s)},[s]);function r(){const{height:l,width:c}=t.current.getBoundingClientRect();!c&&!l||a.current.resize(c,l)}return react.exports.useEffect(()=>{if(!a.current)return a.current=new Engine(n.current,()=>i("Game Running"),()=>i("Game stopped! click and press enter to play")),r(),a.current.proccessBlocks(s),()=>{a.current.tearDown()}},[s]),react.exports.useEffect(()=>(window.addEventListener("resize",r),()=>window.removeEventListener("resize",r)),[]),react.exports.useEffect(()=>{!t.current||r()},[e]),jsxs("div",{className:"game-area",children:[jsx("p",{className:"info",children:o}),jsx("div",{className:"container",ref:t,children:jsx("canvas",{ref:n,onBlur:()=>console.log("blur")})})]})},Settings=()=>{const{getWorkspaceXml:e}=react.exports.useContext(WorkspaceContext);return jsxs("div",{className:"settings",children:[jsx("h2",{children:"Settings"}),jsxs("div",{className:"innerWrapper",children:[jsxs("fieldset",{children:[jsx("legend",{children:"Import"}),jsx("p",{children:"Select a file that was previously exported"}),jsxs("div",{children:[jsx("label",{htmlFor:"importCode",children:"Import code"}),jsx("input",{type:"file",id:"importCode",name:"importCode",onChange:async a=>{a.preventDefault();const o=new FileReader;o.onload=async i=>{const s=i.target.result;localStorage.setItem("blockly_saved_workspace",s)},o.readAsText(a.target.files[0])}})]})]}),jsxs("fieldset",{children:[jsx("legend",{children:"Export"}),jsx("p",{children:"Click here to export your current code and use it later"}),jsx("button",{onClick:()=>{const a=new Blob([e],{type:"application/xml"}),o=document.createElement("a");o.download="munich_coding_club.xml",o.href=window.URL.createObjectURL(a),o.onclick=function(i){const s=this;setTimeout(function(){window.URL.revokeObjectURL(s.href)},1500)},o.click(),o.remove()},children:"Export code"})]})]})]})},ContentWrapper=({children:e,currentPage:t})=>{let a=`content-wrapper ${{[PAGE_APP]:"is-app",[PAGE_CODE]:"is-code",[PAGE_MIX]:"is-mix",[PAGE_SETTINGS]:"is-settings"}[t]}`;return jsx("div",{className:a,children:e})},definition$p={type:"game_setup",colour:"#FFAABB",hat:"cap",message0:"Game setup %1 initial speed %2 Enemy generation speed %3 target generation speed %4 %5 player %6 on start %7 on update %8 onEnemyGeneration %9 on end %10 on colision %11 on up key %12 on down key %13 on forward key %14 on back key %15 on obstacle outside %16 on target generation %17 on target grabbed %18",args0:[{type:"input_dummy"},{type:"input_value",name:"initialSpeedDefault"},{type:"input_value",name:"enemyGenerationSpeed",check:"Number"},{type:"input_value",name:"targetGenerationSpeed",check:"Number"},{type:"input_dummy"},{type:"input_statement",name:"player",check:["game_duck","game_chicken","game_dead_duck","game_dead_chicken"]},{type:"input_statement",name:"onStart"},{type:"input_statement",name:"onUpdate"},{type:"input_statement",name:"onEnemyGeneration"},{type:"input_statement",name:"onEnd"},{type:"input_statement",name:"onColision"},{type:"input_statement",name:"onUp"},{type:"input_statement",name:"onDown"},{type:"input_statement",name:"onForward"},{type:"input_statement",name:"onBackward"},{type:"input_statement",name:"onObstacleOutside"},{type:"input_statement",name:"onTargetGenerated"},{type:"input_statement",name:"onTargetGrabbed"}],inputsInline:!1,previousStatement:null,nextStatement:null,tooltip:"Configures the game settings",helpUrl:""},gameSetup=e=>{e.Blocks.game_setup={init:function(){this.jsonInit(definition$p)}},e.JavaScript.game_setup=function(t){const n=e.JavaScript.valueToCode(t,"initialSpeedDefault",e.JavaScript.ORDER_ATOMIC),a=e.JavaScript.valueToCode(t,"enemyGenerationSpeed",e.JavaScript.ORDER_ATOMIC),o=e.JavaScript.valueToCode(t,"targetGenerationSpeed",e.JavaScript.ORDER_ATOMIC),i=e.JavaScript.statementToCode(t,"player");var s=e.JavaScript.statementToCode(t,"onStart"),r=e.JavaScript.statementToCode(t,"onUpdate"),l=e.JavaScript.statementToCode(t,"onEnd");const c=e.JavaScript.statementToCode(t,"onUp"),u=e.JavaScript.statementToCode(t,"onDown"),m=e.JavaScript.statementToCode(t,"onForward"),h=e.JavaScript.statementToCode(t,"onBackward"),_=e.JavaScript.statementToCode(t,"onColision"),v=e.JavaScript.statementToCode(t,"onEnemyGeneration"),b=e.JavaScript.statementToCode(t,"onObstacleOutside"),k=e.JavaScript.statementToCode(t,"onTargetGrabbed"),y=e.JavaScript.statementToCode(t,"onTargetGenerated");return`engine.setScenario( 3 | { 4 | initialSpeed: ${n||500}, 5 | enemyGenerationSpeed: ${a||500}, 6 | targetGenerationSpeed: ${o||500}, 7 | player: ${i||"null"}, 8 | onStart: () => { 9 | ${s} 10 | }, 11 | onUpdate: () => { 12 | ${r} 13 | }, 14 | onEnd: () => { 15 | ${l} 16 | }, 17 | onEnemyGeneration: () => { 18 | ${v} 19 | }, 20 | onUpKey: () => { 21 | ${c} 22 | }, 23 | onDownKey: () => { 24 | ${u} 25 | }, 26 | onForwardKey: () => { 27 | ${m} 28 | }, 29 | onBackwardKey: () => { 30 | ${h} 31 | }, 32 | onColision: () => { 33 | ${_} 34 | }, 35 | onObstacleOutside: () => { 36 | ${b} 37 | }, 38 | onTargetGrabbed: () => { 39 | ${k} 40 | }, 41 | onTargetGenerated: () => { 42 | ${y} 43 | } 44 | }); 45 | `}};var duckImage$1="/blockly-player/images/duck.svg";const definition$o={type:"game_duck",message0:"Duck %1",args0:[{type:"field_image",src:duckImage$1,width:40,height:40,alt:"duck",flipRtl:!1}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null},playerDuck=e=>{e.Blocks.game_duck={init:function(){this.jsonInit(definition$o)}},e.JavaScript.game_duck=function(t){var n="PLAYER_DUCK";return n}};var duckImage="/blockly-player/images/deadDuck.svg";const definition$n={type:"game_dead_duck",message0:"Dead Duck %1",args0:[{type:"field_image",src:duckImage,width:40,height:40,alt:"dead duck",flipRtl:!1}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null},playerDeadDuck=e=>{e.Blocks.game_dead_duck={init:function(){this.jsonInit(definition$n)}},e.JavaScript.game_dead_duck=function(t){return"PLAYER_DEAD_DUCK"}};var src="/blockly-player/images/deadChicken.svg";const definition$m={type:"game_dead_chicken",message0:"Dead Chicken %1",args0:[{type:"field_image",src,width:40,height:40,alt:"dead chicken",flipRtl:!1}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null},playerDeadChicken=e=>{e.Blocks.game_dead_chicken={init:function(){this.jsonInit(definition$m)}},e.JavaScript.game_dead_chicken=function(t){var n="PLAYER_DEAD_CHICKEN";return n}},definition$l={type:"game_chicken",message0:"Chicken %1",args0:[{type:"field_image",src:src$1,width:40,height:40,alt:"chicken",flipRtl:!1}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null},playerChicken=e=>{e.Blocks.game_chicken={init:function(){this.jsonInit(definition$l)}},e.JavaScript.game_chicken=function(t){var n="PLAYER_CHICKEN";return n}};function overWrite(e){e.JavaScript.text_print=function(t){return`engine.writeText(${e.JavaScript.valueToCode(t,"TEXT",e.JavaScript.ORDER_NONE)||"''"}); 46 | `}}const definition$k={type:"canvas_background_color",message0:"background color %1",args0:[{type:"input_value",name:"backgroundColor",check:"Colour"}],previousStatement:null,nextStatement:null,colour:"#6600cc",tooltip:"",helpUrl:""},backgroundColor=e=>{e.Blocks.canvas_background_color={init:function(){this.jsonInit(definition$k)}},e.JavaScript.canvas_background_color=function(t){var a=`engine.drawBackground(${e.JavaScript.valueToCode(t,"backgroundColor",e.JavaScript.ORDER_NONE)||"''"}); 47 | `;return a}},definition$j={type:"canvas_text_size",message0:"Text size %1",args0:[{type:"input_value",name:"textSize",check:"Number"}],previousStatement:null,nextStatement:null,colour:"#6600cc",tooltip:"",helpUrl:""},textSize=e=>{e.Blocks.canvas_text_size={init:function(){this.jsonInit(definition$j)}},e.JavaScript.canvas_text_size=function(t){var a=`engine.setTextSize(${e.JavaScript.valueToCode(t,"textSize",e.JavaScript.ORDER_NONE)||"''"}); 48 | `;return a}},definition$i={type:"canvas_width",message0:"CANVAS_WIDTH",output:null,colour:"#6600cc",tooltip:"",helpUrl:""},canvasWidth=e=>{e.Blocks.canvas_width={init:function(){this.jsonInit(definition$i)}},e.JavaScript.canvas_width=function(t){return["canvas.width",e.JavaScript.ORDER_NONE]}},definition$h={type:"canvas_height",message0:"CANVAS_HEIGHT",output:null,colour:"#6600cc",tooltip:"",helpUrl:""},canvasHeight=e=>{e.Blocks.canvas_height={init:function(){this.jsonInit(definition$h)}},e.JavaScript.canvas_height=function(t){return["canvas.width",e.JavaScript.ORDER_NONE]}},definition$g={type:"canvas_set_text_color",message0:"text color %1",args0:[{type:"input_value",name:"textColor",check:"Colour"}],previousStatement:null,nextStatement:null,colour:"#6600cc",tooltip:"",helpUrl:""},canvasSetTextColor=e=>{e.Blocks.canvas_set_text_color={init:function(){this.jsonInit(definition$g)}},e.JavaScript.canvas_set_text_color=function(t){var a=`engine.setTextColor(${e.JavaScript.valueToCode(t,"textColor",e.JavaScript.ORDER_NONE)||"''"}); 49 | `;return a}},definition$f={type:"canvas_set_cursor",message0:"Set Text Cursor %1 X %2 Y %3",args0:[{type:"input_dummy"},{type:"input_value",name:"x",check:"Number"},{type:"input_value",name:"y",check:"Number"}],colour:"#6600cc",tooltip:"",helpUrl:"",previousStatement:null,nextStatement:null},canvasSetCursor=e=>{e.Blocks.canvas_set_cursor={init:function(){this.jsonInit(definition$f)}},e.JavaScript.canvas_set_cursor=function(t){const n=e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC)||0,a=e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC)||0;return`engine.setCursor(${n}, ${a}); 50 | `}},definition$e={type:"canvas_draw_rectangle",message0:"drawRectangle %1 x %2 y %3 width %4 height %5 Colour %6",args0:[{type:"input_dummy"},{type:"input_value",name:"x",check:"Number"},{type:"input_value",name:"y",check:"Number"},{type:"input_value",name:"width",check:"Number"},{type:"input_value",name:"height",check:"Number"},{type:"input_value",name:"color",check:"Colour"}],colour:"#6600cc",tooltip:"",helpUrl:"",previousStatement:null,nextStatement:null},canvasDrawRectangle=e=>{e.Blocks.canvas_draw_rectangle={init:function(){this.jsonInit(definition$e)}},e.JavaScript.canvas_draw_rectangle=function(t){const n=e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC),a=e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC),o=e.JavaScript.valueToCode(t,"width",e.JavaScript.ORDER_ATOMIC),i=e.JavaScript.valueToCode(t,"height",e.JavaScript.ORDER_ATOMIC),s=e.JavaScript.valueToCode(t,"color",e.JavaScript.ORDER_ATOMIC);return`engine.drawRectangle(${n||0}, ${a||0}, ${o||0}, ${i||0}, ${s})`}},definition$d={type:"canvas_set_text_align",message0:"setTextAlign %1",args0:[{type:"field_dropdown",name:"align",options:[["left","left"],["right","right"],["center","center"]]}],previousStatement:null,nextStatement:null,colour:"#6600cc",tooltip:"",helpUrl:""},canvasSetTextAlign=e=>{e.Blocks.canvas_set_text_align={init:function(){this.jsonInit(definition$d)}},e.JavaScript.canvas_set_text_align=function(t){return`engine.setTextAlign('${t.getFieldValue("align")}'); 51 | `}},definition$c={type:"player_x",message0:"PLAYER_X",output:null,colour:"#FFAABB",tooltip:"",helpUrl:""},playerX=e=>{e.Blocks.player_x={init:function(){this.jsonInit(definition$c)}},e.JavaScript.player_x=function(t){return["engine.getPlayerX()",e.JavaScript.ORDER_NONE]}},definition$b={type:"player_y",message0:"PLAYER_Y",output:null,colour:"#FFAABB",tooltip:"",helpUrl:""},playerY=e=>{e.Blocks.player_y={init:function(){this.jsonInit(definition$b)}},e.JavaScript.player_y=function(t){return["engine.getPlayerY()",e.JavaScript.ORDER_NONE]}},definition$a={type:"game_obstacle",message0:"Obstacle %1",args0:[{type:"input_statement",name:"obstacle"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameObstacle=e=>{e.Blocks.game_obstacle={init:function(){this.jsonInit(definition$a)}},e.JavaScript.game_obstacle=function(t){return` 52 | engine.setObstacles(() => { 53 | ${e.JavaScript.statementToCode(t,"obstacle")} 54 | }) 55 | ; 56 | `}},definition$9={type:"game_target",message0:"Target %1",args0:[{type:"input_statement",name:"target"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameTarget=e=>{e.Blocks.game_target={init:function(){this.jsonInit(definition$9)}},e.JavaScript.game_target=function(t){return` 57 | engine.setTarget(() => { 58 | ${e.JavaScript.statementToCode(t,"target")} 59 | }) 60 | ; 61 | `}},definition$8={type:"game_set_player_position",message0:"Set Player position %1 X %2 Y %3",args0:[{type:"input_dummy"},{type:"input_value",name:"x",check:"Number"},{type:"input_value",name:"y",check:"Number"}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null,nextStatement:null},gameSetPlayerPosition=e=>{e.Blocks.game_set_player_position={init:function(){this.jsonInit(definition$8)}},e.JavaScript.game_set_player_position=function(t){const n=e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC)||0,a=e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC)||0;return`engine.setPlayerPosition(${n}, ${a}); 62 | `}},definition$7={type:"game_set_player_position_x",message0:"Set Player position X %1",args0:[{type:"input_value",name:"x",check:"Number"}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null,nextStatement:null},gameSetPlayerPositionX=e=>{e.Blocks.game_set_player_position_x={init:function(){this.jsonInit(definition$7)}},e.JavaScript.game_set_player_position_x=function(t){return`engine.setPlayerPosition(${e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC)||0}); 63 | `}},definition$6={type:"game_set_player_position_y",message0:"Set Player position Y %1",args0:[{type:"input_value",name:"y",check:"Number"}],colour:"#FFAABB",tooltip:"",helpUrl:"",previousStatement:null,nextStatement:null},gameSetPlayerPositionY=e=>{e.Blocks.game_set_player_position_y={init:function(){this.jsonInit(definition$6)}},e.JavaScript.game_set_player_position_y=function(t){return`engine.setPlayerPosition(undefined,${e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC)||0}); 64 | `}},definition$5={type:"game_move_obstacle_x",message0:"move obstacle x %1",args0:[{type:"input_value",name:"x",check:"Number"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameMoveObstacleX=e=>{e.Blocks.game_move_obstacle_x={init:function(){this.jsonInit(definition$5)}},e.JavaScript.game_move_obstacle_x=function(t){return`engine.moveObstacleX(${e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC)});`}},definition$4={type:"game_move_obstacle_y",message0:"move obstacle y %1",args0:[{type:"input_value",name:"y",check:"Number"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameMoveObstacleY=e=>{e.Blocks.game_move_obstacle_y={init:function(){this.jsonInit(definition$4)}},e.JavaScript.game_move_obstacle_y=function(t){return`engine.moveObstacleY(${e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC)});`}},definition$3={type:"game_move_target_x",message0:"move target x %1",args0:[{type:"input_value",name:"x",check:"Number"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameMoveTargetX=e=>{e.Blocks.game_move_target_x={init:function(){this.jsonInit(definition$3)}},e.JavaScript.game_move_target_x=function(t){return`engine.moveTargetX(${e.JavaScript.valueToCode(t,"x",e.JavaScript.ORDER_ATOMIC)});`}},definition$2={type:"game_move_target_y",message0:"move target y %1",args0:[{type:"input_value",name:"y",check:"Number"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameMoveTargetY=e=>{e.Blocks.game_move_target_y={init:function(){this.jsonInit(definition$2)}},e.JavaScript.game_move_target_y=function(t){return`engine.moveTargetY(${e.JavaScript.valueToCode(t,"y",e.JavaScript.ORDER_ATOMIC)});`}},definition$1={type:"game_end_game",message0:"end game",previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},gameEndGame=e=>{e.Blocks.game_end_game={init:function(){this.jsonInit(definition$1)}},e.JavaScript.game_end_game=function(t){return`engine.endGame(); 65 | `}},definition={type:"game_set_player_icon",message0:"set player icon %1",args0:[{type:"input_statement",name:"playerIcon"}],previousStatement:null,nextStatement:null,colour:"#FFAABB",tooltip:"",helpUrl:""},setPlayerIcon=e=>{e.Blocks.game_set_player_icon={init:function(){this.jsonInit(definition)}},e.JavaScript.game_set_player_icon=function(t){return`engine.setAvatar(${e.JavaScript.statementToCode(t,"playerIcon")}); 66 | `}};function initializeCustomBlocks(e){gameSetup(e),playerDuck(e),playerChicken(e),overWrite(e),backgroundColor(e),textSize(e),canvasWidth(e),canvasHeight(e),canvasSetCursor(e),canvasSetTextAlign(e),canvasSetTextColor(e),canvasDrawRectangle(e),playerY(e),playerX(e),gameSetPlayerPosition(e),gameSetPlayerPositionX(e),gameSetPlayerPositionY(e),gameObstacle(e),gameTarget(e),gameMoveObstacleX(e),gameMoveObstacleY(e),gameMoveTargetX(e),gameMoveTargetY(e),gameEndGame(e),playerDeadDuck(e),playerDeadChicken(e),setPlayerIcon(e)}const toolbox={kind:"categoryToolbox",contents:[{kind:"category",name:"Loops",colour:"#5ba55b",contents:[{kind:"block",blockxml:` 67 | 68 | 69 | 10 70 | 71 | 72 | `},{kind:"block",blockxml:` 73 | WHILE 74 | `},{kind:"block",blockxml:` 75 | i 76 | 77 | 78 | 1 79 | 80 | 81 | 82 | 83 | 10 84 | 85 | 86 | 87 | 88 | 1 89 | 90 | 91 | `},{kind:"block",blockxml:` 92 | j 93 | `},{kind:"block",blockxml:` 94 | 95 | BREAK 96 | `}]},{kind:"category",name:"logic",colour:"210",contents:[{kind:"block",type:"controls_if"},{kind:"block",type:"controls_whileUntil"},{kind:"block",blockxml:` 97 | EQ 98 | `},{kind:"block",blockxml:` 99 | AND 100 | `},{kind:"block",blockxml:` 101 | TRUE 102 | `},{kind:"block",type:"logic_negate"},{kind:"block",type:"logic_null"},{kind:"block",type:"logic_ternary"}]},{kind:"category",name:"Math",colour:"#5b67a5",contents:[{kind:"block",blockxml:` 103 | 0 104 | `},{kind:"block",blockxml:` 105 | ADD 106 | 107 | 108 | 1 109 | 110 | 111 | 112 | 113 | 1 114 | 115 | 116 | `},{kind:"block",blockxml:` 117 | ROOT 118 | 119 | 120 | 9 121 | 122 | 123 | `},{kind:"block",blockxml:` 124 | SIN 125 | 126 | 127 | 45 128 | 129 | 130 | `},{kind:"block",blockxml:` 131 | PI 132 | `},{kind:"block",blockxml:` 133 | 134 | EVEN 135 | 136 | 137 | 0 138 | 139 | 140 | `},{kind:"block",blockxml:` 141 | ROUND 142 | 143 | 144 | 3.1 145 | 146 | 147 | `},{kind:"block",blockxml:` 148 | 149 | SUM 150 | `},{kind:"block",blockxml:` 151 | 152 | 153 | 64 154 | 155 | 156 | 157 | 158 | 10 159 | 160 | 161 | `},{kind:"block",blockxml:` 162 | 163 | 164 | 50 165 | 166 | 167 | 168 | 169 | 1 170 | 171 | 172 | 173 | 174 | 100 175 | 176 | 177 | `},{kind:"block",blockxml:` 178 | 179 | 180 | 1 181 | 182 | 183 | 184 | 185 | 100 186 | 187 | 188 | `},{kind:"block",type:"math_random_float"}]},{kind:"category",name:"text",colour:"#5ba58c",contents:[{kind:"block",blockxml:` 189 | 190 | `},{kind:"block",blockxml:` 191 | 192 | 193 | `},{kind:"block",blockxml:` 194 | item 195 | 196 | 197 | 198 | 199 | 200 | `},{kind:"block",blockxml:` 201 | 202 | 203 | 204 | abc 205 | 206 | 207 | `},{kind:"block",blockxml:` 208 | 209 | 210 | 211 | 212 | 213 | 214 | `},{kind:"block",blockxml:` 215 | FIRST 216 | 217 | 218 | text 219 | 220 | 221 | 222 | 223 | abc 224 | 225 | 226 | `},{kind:"block",blockxml:` 227 | 228 | FROM_START 229 | 230 | 231 | text 232 | 233 | 234 | `},{kind:"block",blockxml:` 235 | 236 | FROM_START 237 | FROM_START 238 | 239 | 240 | text 241 | 242 | 243 | `},{kind:"block",blockxml:` 244 | UPPERCASE 245 | 246 | 247 | abc 248 | 249 | 250 | `},{kind:"block",blockxml:` 251 | BOTH 252 | 253 | 254 | abc 255 | 256 | 257 | `},{kind:"block",blockxml:` 258 | 259 | 260 | abc 261 | 262 | 263 | `}]},{kind:"category",name:"Lists",colour:"#745ba5",contents:[{kind:"block",blockxml:` 264 | 265 | `},{kind:"block",blockxml:` 266 | 267 | `},{kind:"block",blockxml:` 268 | 269 | 270 | 5 271 | 272 | 273 | `},{kind:"block",type:"lists_length"},{kind:"block",blockxml:` 274 | FIRST 275 | 276 | 277 | list 278 | 279 | 280 | `},{kind:"block",blockxml:` 281 | 282 | GET 283 | FROM_START 284 | 285 | 286 | list 287 | 288 | 289 | `},{kind:"block",blockxml:` 290 | 291 | SET 292 | FROM_START 293 | 294 | 295 | list 296 | 297 | 298 | `},{kind:"block",blockxml:` 299 | 300 | FROM_START 301 | FROM_START 302 | 303 | 304 | list 305 | 306 | 307 | `},{kind:"block",blockxml:` 308 | 309 | SPLIT 310 | 311 | 312 | , 313 | 314 | 315 | `},{kind:"block",blockxml:` 316 | NUMERIC 317 | 1 318 | `}]},{kind:"category",name:"Colour",colour:"#a5745b",contents:[{kind:"block",blockxml:` 319 | #ff0000 320 | `},{kind:"block",type:"colour_random"},{kind:"block",blockxml:` 321 | 322 | 323 | 100 324 | 325 | 326 | 327 | 328 | 50 329 | 330 | 331 | 332 | 333 | 0 334 | 335 | 336 | `},{kind:"block",blockxml:` 337 | 338 | 339 | #ff0000 340 | 341 | 342 | 343 | 344 | #3333ff 345 | 346 | 347 | 348 | 349 | 0.5 350 | 351 | 352 | `}]},{kind:"sep"},{kind:"category",name:"Variables",colour:"#a55b80",custom:"VARIABLE"},{kind:"category",name:"Procedures",colour:"#995ba5",custom:"PROCEDURE"},{kind:"sep"},{kind:"category",name:"canvas",colour:"#6600cc",contents:[{kind:"block",blockxml:` 353 | 354 | 355 | #33ccff 356 | 357 | 358 | `},{kind:"block",blockxml:` 359 | 360 | 361 | #000000 362 | 363 | 364 | `},{kind:"block",type:"canvas_set_text_align"},{kind:"block",blockxml:` 365 | 366 | 367 | 3 368 | 369 | 370 | 371 | `},{kind:"block",blockxml:` 372 | 373 | 374 | #00FF00 375 | 376 | 377 | 378 | 379 | 380 | 0 381 | 382 | 383 | 384 | 385 | 0 386 | 387 | 388 | 389 | 390 | 5 391 | 392 | 393 | 394 | 395 | 35 396 | 397 | 398 | `},{kind:"block",type:"canvas_width"},{kind:"block",type:"canvas_height"},{kind:"block",blockxml:` 399 | 400 | 401 | 0 402 | 403 | 404 | 405 | 406 | 407 | 0 408 | 409 | 410 | 411 | `}]},{kind:"category",name:"game",colour:"#FFAABB",contents:[{kind:"block",blockxml:` 412 | 413 | 414 | 500 415 | 416 | 417 | 418 | 419 | 900 420 | 421 | 422 | 423 | 424 | 425 | 2000 426 | 427 | 428 | 429 | `},{kind:"block",type:"game_duck"},{kind:"block",type:"game_dead_duck"},{kind:"block",type:"game_chicken"},{kind:"block",type:"game_dead_chicken"},{kind:"block",type:"player_x"},{kind:"block",type:"player_y"},{kind:"block",type:"game_set_player_position"},{kind:"block",type:"game_set_player_position_x"},{kind:"block",type:"game_set_player_position_y"},{kind:"block",type:"game_set_player_icon"},{kind:"block",type:"game_obstacle"},{kind:"block",type:"game_target"},{kind:"block",type:"game_move_obstacle_x"},{kind:"block",type:"game_move_obstacle_y"},{kind:"block",type:"game_move_target_x"},{kind:"block",type:"game_move_target_y"},{kind:"block",type:"game_end_game"}]}]};function debounce(e,t=300){let n;return(...a)=>{clearTimeout(n),n=setTimeout(()=>{e.apply(this,a)},t)}}function initialize(e,t,n,i){var s=i,{initialXml:a}=s,o=f(s,["initialXml"]);initializeCustomBlocks(Blockly),console.log("initializing blockly"),Blockly.setLocale(locale);const r=Blockly.inject(e,g({toolbox},o)),l="blockly_saved_workspace",c=m=>{const h=Blockly.Xml.workspaceToDom(r),_=Blockly.Xml.domToText(h);n(_),localStorage.setItem(l,_),t(Blockly.JavaScript.workspaceToCode(r))},u=localStorage.getItem(l);return n(u),r.addChangeListener(debounce(c,500)),Blockly.Xml.domToWorkspace(Blockly.Xml.textToDom(u||a),r),t(Blockly.JavaScript.workspaceToCode(r)),r}const BlocklyEditor=a=>{var o=a,{currentPage:e,children:t}=o,n=f(o,["currentPage","children"]);const i=react.exports.useRef(),s=react.exports.useRef();let r=react.exports.useRef();const{setGetJsCode:l,setWorkspaceXml:c}=react.exports.useContext(WorkspaceContext);function u(){if(!r.current||!s.current)return;Blockly.svgResize(r.current);const{height:m,width:h}=s.current.getBoundingClientRect();console.info(`Resizing blockly to ${m}`),!!m&&(i.current.querySelector(".blocklySvg").setAttribute("height",`${m}px`),i.current.querySelector(".blocklySvg").setAttribute("width",`${h}px`))}return react.exports.useEffect(()=>{r.current||(r.current=initialize(i.current,l,c,n),new ResizeObserver(u).observe(s.current))}),react.exports.useEffect(()=>{},[e]),jsx("div",{className:"blockly-container",ref:s,children:jsx("div",{ref:i,id:"blocklyDiv"})})};function App(){const[e,t]=react.exports.useState(PAGE_MIX),[n,a]=react.exports.useState(()=>""),[o,i]=react.exports.useState(()=>"");return jsx(WorkspaceContext.Provider,{value:{getJsCode:n,setGetJsCode:a,getWorkspaceXml:o,setWorkspaceXml:i},children:jsxs(Wrapper,{children:[jsx(Navigator,{onApp:()=>t(PAGE_APP),onCode:()=>t(PAGE_CODE),onMix:()=>t(PAGE_MIX),onSettings:()=>t(PAGE_SETTINGS),currentPage:e}),jsxs(ContentWrapper,{currentPage:e,children:[(e===PAGE_MIX||e===PAGE_CODE)&&jsx(BlocklyEditor,{readOnly:!1,trashcan:!0,currentPage:e,move:{scrollbars:!0,drag:!0,wheel:!0},zoom:{controls:!0,wheel:!0},initialXml:` 430 | 431 | #33ccffOl\xE1 432 | `}),(e===PAGE_MIX||e===PAGE_APP)&&jsx(GameArea,{currentPage:e}),e===PAGE_SETTINGS&&jsx(Settings,{})]})]})})}ReactDOM.render(jsx(React.StrictMode,{children:jsx(App,{})}),document.getElementById("root")); 433 | --------------------------------------------------------------------------------