diff --git a/site/.eslintrc.json b/site/.eslintrc.json index 72cc705c1..b74bf91d8 100644 --- a/site/.eslintrc.json +++ b/site/.eslintrc.json @@ -1,3 +1,6 @@ { - "extends": "next/core-web-vitals" + "extends": "next/core-web-vitals", + "rules": { + "@typescript-eslint/no-unused-vars": "warn" + } } diff --git a/site/comps/Blockly.tsx b/site/comps/Blockly.tsx index 210413337..3789c74b4 100644 --- a/site/comps/Blockly.tsx +++ b/site/comps/Blockly.tsx @@ -401,7 +401,7 @@ const BlocklyEditor = forwardRef(({...props}, ref) => { workspaceRef.current = workspace - workspace.addChangeListener((e: WorkspaceEvent) => { + workspace.addChangeListener((e) => { if (SAVE_EVENTS.has(e.type)) { // TODO: auto save } diff --git a/site/comps/Nav.tsx b/site/comps/Nav.tsx index 71034f841..4e5a1bbba 100644 --- a/site/comps/Nav.tsx +++ b/site/comps/Nav.tsx @@ -170,6 +170,7 @@ const IndexContent: React.FC = ({ + @@ -193,7 +194,6 @@ const IndexContent: React.FC = ({ return ( { - - return new Promise((resolve, reject) => { - + return new Promise((resolve) => { setTooltipStack((prevStack) => { - // if it's already the current tooltip, we just return that const last = Array.from(prevStack)[prevStack.size - 1] - if (last && t.name === last[1].name && t.desc === last[1].desc) { resolve(last[0]) return prevStack } - const newStack = prevStack.clone() const id = newStack.push(t) - resolve(id) - return newStack - }) - }) - }, [ setTooltipStack ]) // pop a tooltip from tooltip stack with id @@ -121,12 +111,11 @@ const Page = ({ font-family: IBM Plex Sans; font-size: var(--text-normal); color: var(--color-fg1); - overflow: hidden; } body { width: 100%; height: 100%; - overflow: hidden; + background: var(--color-bg1); } a { text-decoration: none; diff --git a/site/comps/Text.tsx b/site/comps/Text.tsx index 0cae61704..8815332cc 100644 --- a/site/comps/Text.tsx +++ b/site/comps/Text.tsx @@ -9,6 +9,8 @@ interface TextProps { noselect?: boolean, code?: boolean, underline?: boolean, + font?: string, + align?: "center" | "end" | "justify" | "left" | "match-parent" | "right" | "start", } type Props = TextProps & Omit, keyof TextProps>; @@ -22,15 +24,18 @@ const Text: React.FC = (({ noselect, code, underline, + font, + align, ...props }) => ( ( url: string | null, - parse: (res: Response) => Promise + parse: (res: Response) => Promise, ) { - const [ res, setRes ] = React.useState(null); - const [ data, setData ] = React.useState(null); - const [ loading, setLoading ] = React.useState(true); - const [ err, setErr ] = React.useState(null); + const [ res, setRes ] = React.useState(null) + const [ data, setData ] = React.useState(null) + const [ loading, setLoading ] = React.useState(true) + const [ err, setErr ] = React.useState(null) React.useEffect(() => { if (!url) { - return; + return } - let didCancel = false; + let didCancel = false fetch(url) .then((res) => { if (!didCancel) { - setRes(res); + setRes(res) } - return parse(res); + return parse(res) }) .then((d) => { - if (didCancel) return; - setData(d); - setLoading(false); + if (didCancel) return + setData(d) + setLoading(false) }) .catch((e) => { - if (didCancel) return; - setErr(e); - setLoading(false); - }); + if (didCancel) return + setErr(e) + setLoading(false) + }) return () => { - didCancel = true; - }; + didCancel = true + } - }, [ url ]); + }, [ url ]) return { res, data, loading, err, - }; + } -}; +} diff --git a/site/lib/kaboomBlockly.ts b/site/lib/kaboomBlockly.ts index 97be77b1a..066021a4f 100644 --- a/site/lib/kaboomBlockly.ts +++ b/site/lib/kaboomBlockly.ts @@ -532,7 +532,7 @@ Blockly.Blocks["kaboom_offscreen"] = { this.appendDummyInput() .appendField(icon("offscreen")) .appendField("offscreen | destroy") - .appendField(new Blockly.FieldCheckbox(1), "DESTROY") + .appendField(new Blockly.FieldCheckbox(), "DESTROY") this.setColour(colors.component) this.setOutput(true, "Object") this.setTooltip("Component to define object behavior when offscreen") diff --git a/site/package-lock.json b/site/package-lock.json index 5119f0bfe..b0bdab4cc 100644 --- a/site/package-lock.json +++ b/site/package-lock.json @@ -17,6 +17,7 @@ "blockly": "^10.0.2", "gray-matter": "^4.0.3", "highlight.js": "^11.8.0", + "kaboomware": "^0.1.2", "marked": "^5.1.2", "marked-highlight": "^2.0.1", "next": "^13.4.12", @@ -3075,6 +3076,19 @@ "node": ">=4.0" } }, + "node_modules/kaboom": { + "version": "3000.1.8", + "resolved": "https://registry.npmjs.org/kaboom/-/kaboom-3000.1.8.tgz", + "integrity": "sha512-jjugkmSQ04yy7J3YZxGxz9JjvsuiycrnIwd0/jrpAT+vop2Lh0p9ZYwq2dgh0y8OZKMwxCNsTCpzWB2TR0IyWw==" + }, + "node_modules/kaboomware": { + "version": "0.1.2", + "resolved": "https://registry.npmjs.org/kaboomware/-/kaboomware-0.1.2.tgz", + "integrity": "sha512-6kdXZEkHDYD17Gzy4nMcg6QJzJxDBHuJ2EBAUydGPvEdacDyPRJG7oOPS7gxqsTHiseXgFdJbLqV2fPx98JWJQ==", + "dependencies": { + "kaboom": "^3000.1.8" + } + }, "node_modules/kind-of": { "version": "6.0.3", "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz", diff --git a/site/package.json b/site/package.json index 3e0605d71..10499d25b 100644 --- a/site/package.json +++ b/site/package.json @@ -20,6 +20,7 @@ "blockly": "^10.0.2", "gray-matter": "^4.0.3", "highlight.js": "^11.8.0", + "kaboomware": "^0.1.2", "marked": "^5.1.2", "marked-highlight": "^2.0.1", "next": "^13.4.12", diff --git a/site/pages/kaboomware.tsx b/site/pages/kaboomware.tsx new file mode 100644 index 000000000..0fc04d86e --- /dev/null +++ b/site/pages/kaboomware.tsx @@ -0,0 +1,106 @@ +import { Global, css } from "@emotion/react" +import * as React from "react" +import kaboomware from "kaboomware" +import View from "comps/View" +import Text from "comps/Text" +import Markdown from "comps/Markdown" + +const bubble = css(` +&:after { + content: ''; + position: absolute; + left: 0; + top: 50%; + width: 0; + height: 0; + border: 10px solid transparent; + border-right-color: #ffffff; + border-left: 0; + margin-top: 0px; + margin-left: -10px; +} +`) + +const example = ` +\`\`\`js +const squeezeGame = { + prompt: "Squeeze!", + author: "tga", + hue: 0.46, + onLoad: (k) => { + k.loadSound("fly", "sounds/fly.mp3") + k.loadSprite("hand", "sprites/hand.png") + }, + onStart: (k) => { + const scene = k.make() + const hand = scene.add([ + k.pos(420, 240), + k.sprite("hand"), + ]) + k.onButtonPress("action", () => { + hand.squeeze() + if (gotIt) { + k.win() + } + }) + return scene + }, +} +\`\`\` +`.trim() + +export default function Doc() { + const wareRef = React.useRef(null) + React.useEffect(() => { + // const ware = kaboomware([]) + }, []) + return ( + + + + KaboomWare is a mini-game engine + event based on Kaboom, inspired by the great WarioWare series. + + + + + You must supply 100 mini-games per month, or we have to destroy your planet. + + Ken (alien), KaboomWare operation lead + + + + + ) +} diff --git a/site/public/static/fonts/apl386.ttf b/site/public/static/fonts/apl386.ttf new file mode 100644 index 000000000..c0ca8ed0d Binary files /dev/null and b/site/public/static/fonts/apl386.ttf differ diff --git a/site/public/static/img/kaboomware.png b/site/public/static/img/kaboomware.png new file mode 100644 index 000000000..8db5e0afa Binary files /dev/null and b/site/public/static/img/kaboomware.png differ diff --git a/site/public/static/img/ken.png b/site/public/static/img/ken.png new file mode 100644 index 000000000..ab2e09d47 Binary files /dev/null and b/site/public/static/img/ken.png differ diff --git a/src/kaboom.ts b/src/kaboom.ts index f36682831..241d1914b 100644 --- a/src/kaboom.ts +++ b/src/kaboom.ts @@ -3993,6 +3993,7 @@ export default (gopt: KaboomOpt = {}): KaboomCtx => { return Object.values(colliding) }, + // TODO: perform check instead of use cache isColliding(other: GameObj) { return Boolean(colliding[other.id]) },