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