Update Vue and package game in an .xdc

This commit is contained in:
James Shiffer 2025-04-23 13:53:10 -07:00
parent ce61ee3e6e
commit 4c4898342b
9 changed files with 2257 additions and 559 deletions

3
bundle-xdc.sh Executable file
View File

@ -0,0 +1,3 @@
#!/bin/bash
npm run build
(cd dist && zip -9 --recurse-paths - *) > wordle.xdc

8
env.d.ts vendored
View File

@ -1 +1,9 @@
/// <reference types="vue/macros-global" />
import { Webxdc } from "webxdc-types";
import { Payload } from "./src/types";
declare global {
interface Window {
webxdc: Webxdc<Payload>;
}
}

View File

@ -4,7 +4,8 @@
<meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>VVordle - a Wordle clone with Vue.js</title>
<script src="webxdc.js"></script>
<title>WorldeXDC - a Wordle clone for WebXDC</title>
</head>
<body>
<div id="app"></div>

2759
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -10,7 +10,10 @@
"vue": "^3.2.25"
},
"devDependencies": {
"@vitejs/plugin-vue": "^2.0.0",
"vite": "^2.7.2"
"@vitejs/plugin-vue": "^5.2.3",
"@vue-macros/reactivity-transform": "^3.0.0-beta.8",
"vite": "^6.3.2",
"vite-plugin-singlefile": "^2.2.0",
"webxdc-types": "^1.0.1"
}
}
}

View File

@ -1,5 +1,6 @@
<script setup lang="ts">
import { onUnmounted } from 'vue'
import { $ref, $computed } from 'vue/macros'
import { getWordOfTheDay, allWords } from './words'
import Keyboard from './Keyboard.vue'
import { LetterState } from './types'
@ -33,6 +34,8 @@ const letterStates: Record<string, LetterState> = $ref({})
// Handle keyboard input.
let allowInput = true
const webxdc = window.webxdc
const onKeyup = (e: KeyboardEvent) => onKey(e.key)
window.addEventListener('keyup', onKeyup)
@ -70,6 +73,18 @@ function clearTile() {
}
}
function sendFinalResultGrid(won) {
let caption = webxdc.selfName;
if (won) {
caption += " guessed the word!";
} else {
caption += " didn't guess the word :(";
}
webxdc.sendToChat({
text: caption + '\n\n' + genResultGrid()
});
}
function completeRow() {
if (currentRow.every((tile) => tile.letter)) {
const guess = currentRow.map((tile) => tile.letter).join('')
@ -110,6 +125,7 @@ function completeRow() {
allowInput = false
if (currentRow.every((tile) => tile.state === LetterState.CORRECT)) {
// yay!
sendFinalResultGrid(true)
setTimeout(() => {
grid = genResultGrid()
showMessage(
@ -128,6 +144,7 @@ function completeRow() {
}, 1600)
} else {
// game over :(
sendFinalResultGrid(false)
setTimeout(() => {
showMessage(answer.toUpperCase(), -1)
}, 1600)
@ -179,10 +196,10 @@ function genResultGrid() {
</div>
</Transition>
<header>
<h1>VVORDLE</h1>
<h1>WORDLE</h1>
<a
id="source-link"
href="https://github.com/yyx990803/vue-wordle"
href="https://git.linux.ucla.edu/jshiffer/wordle.xdc"
target="_blank"
>Source</a
>

View File

@ -4,3 +4,7 @@ export const enum LetterState {
PRESENT = 'present',
ABSENT = 'absent'
}
export type Payload = {
resultGrid: string;
};

View File

@ -9,7 +9,8 @@
"sourceMap": true,
"resolveJsonModule": true,
"esModuleInterop": true,
"lib": ["esnext", "dom"]
"lib": ["esnext", "dom"],
"types": ["@vue-macros/reactivity-transform/macros-global"]
},
"include": ["env.d.ts", "src/**/*"]
}

View File

@ -1,9 +1,9 @@
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { viteSingleFile } from 'vite-plugin-singlefile'
import ReactivityTransform from '@vue-macros/reactivity-transform/vite'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue({
reactivityTransform: true
})]
plugins: [vue(), ReactivityTransform(), viteSingleFile()]
})