first commit
This commit is contained in:
commit
433c13f4ac
14 changed files with 1563 additions and 0 deletions
22
.gitignore
vendored
Normal file
22
.gitignore
vendored
Normal file
|
|
@ -0,0 +1,22 @@
|
||||||
|
# Logs
|
||||||
|
logs
|
||||||
|
*.log
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
pnpm-debug.log*
|
||||||
|
lerna-debug.log*
|
||||||
|
|
||||||
|
node_modules
|
||||||
|
dist
|
||||||
|
dist-ssr
|
||||||
|
*.local
|
||||||
|
|
||||||
|
# Editor directories and files
|
||||||
|
.idea
|
||||||
|
.DS_Store
|
||||||
|
*.suo
|
||||||
|
*.ntvs*
|
||||||
|
*.njsproj
|
||||||
|
*.sln
|
||||||
|
*.sw?
|
||||||
3
.vscode/extensions.json
vendored
Normal file
3
.vscode/extensions.json
vendored
Normal file
|
|
@ -0,0 +1,3 @@
|
||||||
|
{
|
||||||
|
"recommendations": ["svelte.svelte-vscode", "esbenp.prettier-vscode"]
|
||||||
|
}
|
||||||
6
.vscode/settings.json
vendored
Normal file
6
.vscode/settings.json
vendored
Normal file
|
|
@ -0,0 +1,6 @@
|
||||||
|
{
|
||||||
|
"editor.defaultFormatter": "esbenp.prettier-vscode",
|
||||||
|
"[svelte]": {
|
||||||
|
"editor.defaultFormatter": "svelte.svelte-vscode"
|
||||||
|
}
|
||||||
|
}
|
||||||
26
index.html
Normal file
26
index.html
Normal file
|
|
@ -0,0 +1,26 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en" style="height: 100%; margin: 0; padding: 0">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link
|
||||||
|
href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@200&family=Sour+Gummy:ital,wght@0,100..900;1,100..900&display=swap"
|
||||||
|
rel="stylesheet"
|
||||||
|
/>
|
||||||
|
</head>
|
||||||
|
<body style="height: 100%; margin: 0; padding: 0">
|
||||||
|
<div id="app" style="height: 100%"></div>
|
||||||
|
<script type="module">
|
||||||
|
import { mount } from "svelte";
|
||||||
|
import App from "./src/app.svelte";
|
||||||
|
|
||||||
|
const app = mount(App, {
|
||||||
|
target: document.getElementById("app"),
|
||||||
|
});
|
||||||
|
|
||||||
|
export default app;
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
28
jsconfig.json
Normal file
28
jsconfig.json
Normal file
|
|
@ -0,0 +1,28 @@
|
||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"moduleResolution": "bundler",
|
||||||
|
"target": "ESNext",
|
||||||
|
"module": "ESNext",
|
||||||
|
/**
|
||||||
|
* svelte-preprocess cannot figure out whether you have
|
||||||
|
* a value or a type, so tell TypeScript to enforce using
|
||||||
|
* `import type` instead of `import` for Types.
|
||||||
|
*/
|
||||||
|
"verbatimModuleSyntax": true,
|
||||||
|
"isolatedModules": true,
|
||||||
|
"resolveJsonModule": true,
|
||||||
|
/**
|
||||||
|
* To have warnings / errors of the Svelte compiler at the
|
||||||
|
* correct position, enable source maps by default.
|
||||||
|
*/
|
||||||
|
"sourceMap": true,
|
||||||
|
"esModuleInterop": true,
|
||||||
|
"skipLibCheck": true,
|
||||||
|
/**
|
||||||
|
* Typecheck JS in `.svelte` and `.js` files by default.
|
||||||
|
* Disable this if you'd like to use dynamic types.
|
||||||
|
*/
|
||||||
|
"checkJs": true,
|
||||||
|
"types": ["svelte", "estree"]
|
||||||
|
}
|
||||||
|
}
|
||||||
1185
package-lock.json
generated
Normal file
1185
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load diff
21
package.json
Normal file
21
package.json
Normal file
|
|
@ -0,0 +1,21 @@
|
||||||
|
{
|
||||||
|
"name": "package",
|
||||||
|
"private": true,
|
||||||
|
"version": "0.0.0",
|
||||||
|
"type": "module",
|
||||||
|
"scripts": {
|
||||||
|
"dev": "vite",
|
||||||
|
"build": "vite build",
|
||||||
|
"preview": "vite preview"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@sveltejs/vite-plugin-svelte": "^5.0.3",
|
||||||
|
"@types/estree": "^1.0.6",
|
||||||
|
"svelte": "^5.20.2",
|
||||||
|
"vite": "^6.2.4"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"common-words": "^0.1.3",
|
||||||
|
"wordlist-english": "^1.2.1"
|
||||||
|
}
|
||||||
|
}
|
||||||
35
src/app.svelte
Normal file
35
src/app.svelte
Normal file
|
|
@ -0,0 +1,35 @@
|
||||||
|
<script>
|
||||||
|
import Game from "./wordle/game.svelte";
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div id="root">
|
||||||
|
<h1>CLASSROOM WORDLE <span>~made by Rhythm Upadhyay of 7th A</span></h1>
|
||||||
|
<Game />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
background-color: #121212;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
#root {
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
margin: 0;
|
||||||
|
font-family: "Sour Gummy", sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
text-align: center;
|
||||||
|
margin: 5px 0px;
|
||||||
|
text-decoration: underline #444;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-size: 0.5em;
|
||||||
|
text-decoration: none;
|
||||||
|
color: #444;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
75
src/wordle/display.svelte
Normal file
75
src/wordle/display.svelte
Normal file
|
|
@ -0,0 +1,75 @@
|
||||||
|
<script>
|
||||||
|
import { CurrentWord, words } from "./logic.svelte.js";
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div id="root">
|
||||||
|
{#each words as word}
|
||||||
|
<div class="word">
|
||||||
|
{#each word as letter}
|
||||||
|
<span class={letter[1]}>{letter[0]}</span>
|
||||||
|
{/each}
|
||||||
|
</div>
|
||||||
|
{/each}
|
||||||
|
<div class="word">
|
||||||
|
<span>{CurrentWord[0]}</span>
|
||||||
|
<span>{CurrentWord[1]}</span>
|
||||||
|
<span>{CurrentWord[2]}</span>
|
||||||
|
<span>{CurrentWord[3]}</span>
|
||||||
|
<span>{CurrentWord[4]}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
#root {
|
||||||
|
height: calc(100% - 320px);
|
||||||
|
border: 2px solid #202020;
|
||||||
|
margin: 20px;
|
||||||
|
border-radius: 10px;
|
||||||
|
overflow-y: scroll;
|
||||||
|
}
|
||||||
|
|
||||||
|
.word {
|
||||||
|
display: flex;
|
||||||
|
gap: 5px;
|
||||||
|
margin: 10px;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
width: 70px;
|
||||||
|
height: 70px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
border-radius: 10px;
|
||||||
|
font-size: 50px;
|
||||||
|
border: 2px solid #444;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c {
|
||||||
|
background-color: #2b5f2d;
|
||||||
|
}
|
||||||
|
.d {
|
||||||
|
background-color: #804d00;
|
||||||
|
}
|
||||||
|
.w {
|
||||||
|
background-color: #2b2b2b;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* width */
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
width: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Track */
|
||||||
|
::-webkit-scrollbar-track {
|
||||||
|
box-shadow: inset 0 0 5px grey;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Handle */
|
||||||
|
::-webkit-scrollbar-thumb {
|
||||||
|
background: red;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
22
src/wordle/game.svelte
Normal file
22
src/wordle/game.svelte
Normal file
|
|
@ -0,0 +1,22 @@
|
||||||
|
<script>
|
||||||
|
import Keyboard from "./keyboard.svelte";
|
||||||
|
import Display from "./display.svelte";
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div id="root">
|
||||||
|
<Display />
|
||||||
|
<Keyboard />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
#root {
|
||||||
|
width: calc(50% - 40px);
|
||||||
|
height: calc(100% - 75px);
|
||||||
|
border-radius: 20px;
|
||||||
|
margin: 20px;
|
||||||
|
margin-top: 5px;
|
||||||
|
border: 2px solid #444;
|
||||||
|
|
||||||
|
font-family: "JetBrains Mono", monospace;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
71
src/wordle/keyboard.svelte
Normal file
71
src/wordle/keyboard.svelte
Normal file
|
|
@ -0,0 +1,71 @@
|
||||||
|
<script>
|
||||||
|
import { keys, ButtonPressed } from "./logic.svelte.js";
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div id="root">
|
||||||
|
<div class="word">
|
||||||
|
{#each keys.slice(0, 10) as key}
|
||||||
|
<button on:click={() => ButtonPressed(key[0])} class={key[1]}
|
||||||
|
>{key[0]}</button
|
||||||
|
>
|
||||||
|
{/each}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="word">
|
||||||
|
{#each keys.slice(10, 19) as key}
|
||||||
|
<button on:click={() => ButtonPressed(key[0])} class={key[1]}
|
||||||
|
>{key[0]}</button
|
||||||
|
>
|
||||||
|
{/each}
|
||||||
|
</div>
|
||||||
|
<div class="word">
|
||||||
|
{#each keys.slice(19) as key}
|
||||||
|
<button on:click={() => ButtonPressed(key[0])} class={key[1]}
|
||||||
|
>{key[0]}</button
|
||||||
|
>
|
||||||
|
{/each}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
#root {
|
||||||
|
height: 255px;
|
||||||
|
margin: 20px;
|
||||||
|
border-radius: 10px;
|
||||||
|
border: 2px solid #202020;
|
||||||
|
}
|
||||||
|
|
||||||
|
.word {
|
||||||
|
display: flex;
|
||||||
|
gap: 5px;
|
||||||
|
margin: 10px;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
background-color: #202020;
|
||||||
|
font-family: "JetBrains Mono", monospace;
|
||||||
|
color: #808080;
|
||||||
|
width: 70px;
|
||||||
|
height: 70px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
border-radius: 10px;
|
||||||
|
font-size: 50px;
|
||||||
|
border: 2px solid #444;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c {
|
||||||
|
background-color: #2b5f2d;
|
||||||
|
}
|
||||||
|
.d {
|
||||||
|
background-color: #804d00;
|
||||||
|
}
|
||||||
|
.w {
|
||||||
|
background-color: #2b2b2b;
|
||||||
|
}
|
||||||
|
.o {
|
||||||
|
background-color: #202829;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
55
src/wordle/logic.svelte.js
Normal file
55
src/wordle/logic.svelte.js
Normal file
|
|
@ -0,0 +1,55 @@
|
||||||
|
import commonWords from "common-words";
|
||||||
|
|
||||||
|
export let keys = $state([
|
||||||
|
["Q", "n"],
|
||||||
|
["W", "n"],
|
||||||
|
["E", "n"],
|
||||||
|
["R", "n"],
|
||||||
|
["T", "n"],
|
||||||
|
["Y", "n"],
|
||||||
|
["U", "n"],
|
||||||
|
["I", "n"],
|
||||||
|
["O", "n"],
|
||||||
|
["P", "n"],
|
||||||
|
["A", "n"],
|
||||||
|
["S", "n"],
|
||||||
|
["D", "n"],
|
||||||
|
["F", "n"],
|
||||||
|
["G", "n"],
|
||||||
|
["H", "n"],
|
||||||
|
["J", "n"],
|
||||||
|
["K", "n"],
|
||||||
|
["L", "n"],
|
||||||
|
["⇦", "o"],
|
||||||
|
["Z", "n"],
|
||||||
|
["X", "n"],
|
||||||
|
["C", "n"],
|
||||||
|
["V", "n"],
|
||||||
|
["B", "n"],
|
||||||
|
["N", "n"],
|
||||||
|
["M", "n"],
|
||||||
|
["↵", "o"],
|
||||||
|
]);
|
||||||
|
|
||||||
|
export let words = $state([
|
||||||
|
[
|
||||||
|
["R", "c"],
|
||||||
|
["A", "d"],
|
||||||
|
["D", "w"],
|
||||||
|
["I", "w"],
|
||||||
|
["O", "w"],
|
||||||
|
],
|
||||||
|
]);
|
||||||
|
|
||||||
|
export let CurrentWord = $state([]);
|
||||||
|
|
||||||
|
export function ButtonPressed(key) {
|
||||||
|
CurrentWord.push(key);
|
||||||
|
}
|
||||||
|
|
||||||
|
function getRandomWord() {
|
||||||
|
let fiveLetterWords = commonWords
|
||||||
|
.map((entry) => entry.word)
|
||||||
|
.filter((word) => word.length === 5);
|
||||||
|
return fiveLetterWords[Math.floor(Math.random() * fiveLetterWords.length)];
|
||||||
|
}
|
||||||
7
svelte.config.js
Normal file
7
svelte.config.js
Normal file
|
|
@ -0,0 +1,7 @@
|
||||||
|
import { vitePreprocess } from '@sveltejs/vite-plugin-svelte'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
// Consult https://svelte.dev/docs#compile-time-svelte-preprocess
|
||||||
|
// for more information about preprocessors
|
||||||
|
preprocess: vitePreprocess(),
|
||||||
|
}
|
||||||
7
vite.config.js
Normal file
7
vite.config.js
Normal file
|
|
@ -0,0 +1,7 @@
|
||||||
|
import { defineConfig } from 'vite'
|
||||||
|
import { svelte } from '@sveltejs/vite-plugin-svelte'
|
||||||
|
|
||||||
|
// https://vite.dev/config/
|
||||||
|
export default defineConfig({
|
||||||
|
plugins: [svelte()],
|
||||||
|
})
|
||||||
Loading…
Add table
Add a link
Reference in a new issue