Skip to content

Commit 63ae603

Browse files
Maek0sMaek0s
committed
v0.0.2 released - OneWord gamemode is now available.
- Ventana con las futuras actualizaciones - Lista de controles en la parte inferior - Settings nuevos
1 parent 34f365d commit 63ae603

File tree

19 files changed

+916
-137
lines changed

19 files changed

+916
-137
lines changed

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "textcode",
33
"private": true,
4-
"version": "0.0.1",
4+
"version": "0.0.2",
55
"type": "module",
66
"homepage": "https://maek0s.github.io/TextCode",
77
"scripts": {

‎src/App.css‎

Lines changed: 71 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -81,13 +81,13 @@ div.icon img {
8181

8282
.optionsGame {
8383
position: fixed;
84-
top: calc(50% - 180px);
84+
top: calc(50% - 200px);
8585
left: 50%;
8686
transform: translateX(-50%);
8787
display: flex;
8888
justify-content: center;
8989
align-items: center;
90-
gap: 20px;
90+
gap: 10px;
9191
}
9292

9393
.optionsGame .group {
@@ -174,6 +174,12 @@ span.timerDisplayed {
174174
justify-content: center;
175175
}
176176

177+
.mode.disabled {
178+
opacity: 0.5;
179+
pointer-events: none;
180+
cursor: default;
181+
}
182+
177183
/* Game */
178184

179185
.game {
@@ -235,6 +241,43 @@ span.timerDisplayed {
235241
margin-top: 10px !important;
236242
}
237243

244+
/* Controls div */
245+
246+
.controlsDiv {
247+
position: fixed;
248+
bottom: 10vh;
249+
left: 50%;
250+
transform: translateX(-50%);
251+
font-size: 0.85rem;
252+
color: #888;
253+
text-align: center;
254+
opacity: 0.9;
255+
}
256+
257+
.controlsDiv ul {
258+
list-style: none;
259+
margin: 0;
260+
padding: 0;
261+
}
262+
263+
.controlsDiv li {
264+
margin: 4px 0;
265+
display: flex;
266+
justify-content: center;
267+
align-items: center;
268+
gap: 6px;
269+
}
270+
271+
.controlsDiv kbd {
272+
background: #f5f5f5;
273+
border: 1px solid #ccc;
274+
border-radius: 4px;
275+
padding: 2px 6px;
276+
font-size: 0.8rem;
277+
font-family: monospace;
278+
color: #333;
279+
}
280+
238281
/* Code game mode */
239282

240283
::-webkit-scrollbar {
@@ -287,40 +330,51 @@ span.timerDisplayed {
287330

288331
footer {
289332
display: flex;
333+
justify-content: space-between;
290334
align-items: center;
291-
justify-content: center;
292-
position: relative;
293-
height: 50px;
294-
padding: 0px 10px 0px 5px;
335+
position: fixed;
336+
bottom: 0;
337+
left: 0;
338+
width: 100%;
339+
height: 35px;
340+
padding: 0 10px;
341+
box-sizing: border-box;
295342
}
296343

297-
.githubCreator {
298-
position: absolute;
299-
left: 10px;
344+
.githubCreator,
345+
.nextUpdates,
346+
.madeWith {
347+
flex: 1;
300348
display: flex;
301349
align-items: center;
302350
}
303351

304-
.githubCreator a {
305-
display: flex;
306-
align-items: center;
307-
gap: 6px;
352+
.githubCreator {
353+
justify-content: flex-start;
354+
}
355+
356+
.nextUpdates {
357+
justify-content: center;
308358
}
309359

310360
.madeWith {
361+
justify-content: flex-end;
362+
}
363+
364+
.githubCreator a,
365+
.madeWith a {
311366
display: flex;
312367
align-items: center;
313-
justify-content: right;
314-
flex: 1;
315-
text-align: right;
368+
gap: 6px;
316369
}
317370

318-
.madeWith a {
371+
.nextUpdates {
319372
display: flex;
320373
align-items: center;
321374
gap: 6px;
322375
}
323376

377+
324378
/* Cursor mode code */
325379

326380
.cursor {

‎src/App.jsx‎

Lines changed: 69 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -16,53 +16,87 @@ import { MdLeaderboard } from "react-icons/md";
1616

1717
import SettingsModal from "./components/SettingsModal.jsx";
1818

19+
import { saveSettings } from "./logic/storage/settings.js"
20+
import UpdatesModal from './components/UpdatesModal.jsx';
21+
1922
function App() {
2023
// Header
21-
const [isSettingsOpen, setIsSettingsOpen] = useState(false);
24+
const [ isSettingsOpen, setIsSettingsOpen ] = useState(false);
2225

2326
// Settings
24-
const [ tabulado, setTabulacion ] = useState(() => {
25-
const tabuladoSetting = window.localStorage.getItem("tabulado")
26-
27-
return tabuladoSetting ? JSON.parse(tabuladoSetting) : false
27+
const [ settings, setSettings ] = useState(() => {
28+
const stored = window.localStorage.getItem("settings")
29+
return stored ? JSON.parse(stored) : {
30+
tabulado: false,
31+
efectosSonido: true,
32+
sonidoEscribir: true,
33+
controles: true,
34+
}
2835
})
2936

37+
// Footer
38+
const [ isUpdatesOpen, setIsUpdatesOpen ] = useState(false);
39+
40+
const handleSave = (newSettings) => {
41+
setSettings(newSettings)
42+
saveSettings(newSettings)
43+
}
44+
45+
// Return
3046
return (
3147
<>
32-
<header>
33-
<div className="headerLeft">
34-
<a id="logo" href="./">
35-
<div className="icon">
36-
<img src={logo}/>
48+
<header>
49+
<div className="headerLeft">
50+
<a id="logo" href="./">
51+
<div className="icon">
52+
<img src={logo}/>
53+
</div>
54+
<h1 className="iconLogo">Text&Code</h1>
55+
</a>
3756
</div>
38-
<h1 className="iconLogo">Text&Code</h1>
39-
</a>
40-
</div>
41-
<div className="headerRight">
42-
<OptionNav nameClass="username">
43-
<MdLeaderboard size={22}/>
44-
</OptionNav>
45-
<OptionNav nameClass="username">
46-
<IoMdSettings size={22} onClick={() => setIsSettingsOpen(true)}/>
47-
</OptionNav>
48-
<OptionNav nameClass="username">
49-
<FaUser size={18}/>
50-
Username
51-
</OptionNav>
57+
<div className="headerRight">
58+
<OptionNav nameClass="username">
59+
<MdLeaderboard size={22}/>
60+
</OptionNav>
61+
<OptionNav nameClass="username">
62+
<IoMdSettings size={22} onClick={() => setIsSettingsOpen(true)}/>
63+
</OptionNav>
64+
<OptionNav nameClass="username">
65+
<FaUser size={18}/>
66+
Username
67+
</OptionNav>
68+
</div>
69+
</header>
70+
<div>
71+
<SettingsModal
72+
isOpen={isSettingsOpen}
73+
onClose={() => setIsSettingsOpen(false)}
74+
settings={settings}
75+
onSave={handleSave}
76+
/>
77+
<UpdatesModal
78+
isOpen={isUpdatesOpen}
79+
onClose={() => setIsUpdatesOpen(false)}
80+
/>
5281
</div>
53-
</header>
54-
<div>
55-
<SettingsModal
56-
isOpen={isSettingsOpen}
57-
onClose={() => setIsSettingsOpen(false)}
58-
tabuladoSetting={tabulado}
59-
setTabulacion={setTabulacion}
60-
/>
61-
</div>
6282

63-
<Game tabuladoSetting={tabulado}/>
83+
<Game settings={settings}/>
6484

65-
<Footer/>
85+
{
86+
settings.controles && (
87+
<div className="controlsDiv">
88+
<ul>
89+
<li><kbd>Ctrl</kbd> + <kbd>R</kbd> Reiniciar</li>
90+
{/*<li><kbd>Esc</kbd> Parar juego</li>*/}
91+
</ul>
92+
</div>
93+
)
94+
}
95+
96+
<Footer
97+
isUpdatesOpen={isUpdatesOpen}
98+
setIsUpdatesOpen={setIsUpdatesOpen}
99+
/>
66100
</>
67101
)
68102
}

‎src/assets/gamemodes/time/spain.json‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
{
2+
"words": [
3+
"amor", "casa", "perro", "gato", "coche", "árbol", "trabajo", "ciudad", "país", "playa",
4+
"sol", "luna", "estrella", "río", "montaña", "amigo", "escuela", "familia", "niño", "mujer",
5+
"hombre", "tiempo", "mundo", "historia", "semana", "día", "noche", "comida", "fruta", "libro",
6+
"palabra", "canción", "jardín", "ventana", "puerta", "calle", "plaza", "puente", "bosque", "mar",
7+
"océano", "lago", "flor", "viento", "lluvia", "nieve", "fuego", "color", "azul", "rojo", "verde",
8+
"amarillo", "blanco", "negro", "gris", "dulce", "salado", "enemigo", "maestro", "estudiante",
9+
"médico", "enfermero", "doctor", "bicicleta", "tren", "avión", "barco", "moto", "sombrero",
10+
"camisa", "pantalón", "vestido", "ropa", "chaqueta", "mochila", "dinero", "oro", "plata", "piedra",
11+
"cristal", "reloj", "teléfono", "computadora", "pantalla", "ratón", "teclado", "cámara", "foto",
12+
"cine", "teatro", "música", "baile", "pintura", "arte", "escultura", "leyenda", "cuento", "novela",
13+
"poema", "viaje", "aventura", "vivienda", "pan", "leche", "agua", "café", "té", "queso", "huevo",
14+
"pollo", "pescado", "carne", "ensalada", "tomate", "patata", "cebolla", "ajo", "manzana", "pera",
15+
"plátano", "uva", "naranja", "limón", "sandía", "melón", "fresa", "frambuesa", "mango", "pelota",
16+
"juego", "deporte", "fútbol", "balón", "carrera", "amable", "feliz", "triste", "grande", "pequeño",
17+
"rápido", "lento", "nuevo", "viejo", "bonito", "feo", "fuerte", "débil", "frío", "calor", "solitario",
18+
"importante", "interesante", "difícil", "fácil", "divertido", "correr", "caminar", "saltar", "leer",
19+
"escribir", "escuchar", "hablar", "mirar", "ver", "sentir", "amar", "odiar", "vivir", "morir",
20+
"carro", "tren", "avión", "barco", "puerto", "ciudad", "aldea", "pueblo", "colina", "valle",
21+
"río", "lago", "montaña", "bosque", "pradera", "campo", "huerto", "jardín", "planta", "flor",
22+
"árbol", "hoja", "raíz", "fruto", "semilla", "cielo", "sol", "luna", "estrella", "nube", "lluvia",
23+
"viento", "trueno", "relámpago", "tormenta", "nieve", "granizo", "arena", "playa", "mar", "olas",
24+
"arena", "piedra", "roca", "caverna", "cueva", "lago", "río", "arroyo", "manantial", "fuente",
25+
"camino", "carretera", "sendero", "puente", "calle", "avenida", "plaza", "parque", "jardín",
26+
"edificio", "casa", "vivienda", "apartamento", "habitante", "vecino", "amigo", "familia", "padre",
27+
"madre", "hermano", "hermana", "tío", "tía", "sobrino", "sobrina", "abuelo", "abuela", "niño",
28+
"niña", "hijo", "hija", "persona", "gente", "público", "grupo", "equipo", "clase", "escuela",
29+
"universidad", "profesor", "maestro", "estudiante", "alumno", "niñez", "juventud", "adulto",
30+
"anciano", "trabajo", "oficio", "profesión", "empleo", "salario", "dinero", "plata", "oro",
31+
"mercado", "tienda", "supermercado", "panadería", "carnicería", "frutería", "verdulería",
32+
"restaurante", "café", "bar", "hotel", "hostal", "casa", "hogar", "vivienda", "apartamento",
33+
"edificio", "puerta", "ventana", "techo", "pared", "suelo", "piso", "muebles", "silla", "mesa",
34+
"cama", "sofá", "armario", "cómoda", "lámpara", "luz", "electricidad", "agua", "gas", "teléfono",
35+
"computadora", "pantalla", "ratón", "teclado", "cámara", "foto", "vídeo", "película", "cine",
36+
"teatro", "música", "baile", "canción", "arte", "pintura", "escultura", "dibujo", "canto",
37+
"poema", "novela", "cuento", "relato", "historia", "aventura", "viaje", "tour", "excursión",
38+
"vacaciones", "descanso", "ocio", "diversión", "juego", "deporte", "fútbol", "balón", "carrera",
39+
"natación", "atletismo", "tenis", "voleibol", "baloncesto", "equipo", "jugador", "entrenador",
40+
"partido", "competición", "victoria", "derrota", "campeón", "medalla", "trofeo", "premio"
41+
]
42+
}

‎src/assets/sounds/keypress.wav‎

150 KB
Binary file not shown.

‎src/components/Footer.jsx‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
import { FaCodeBranch } from "react-icons/fa";
22
import { IoLogoGithub } from "react-icons/io";
3+
import { MdBrowserUpdated } from "react-icons/md";
34

45
import packageJson from '/package.json';
56

6-
function Footer() {
7+
function Footer({ isUpdatesOpen, setIsUpdatesOpen }) {
8+
console.log(isUpdatesOpen)
79
return (
810
<footer>
911
<span className="githubCreator">
@@ -12,6 +14,11 @@ function Footer() {
1214
<p>Maek0s</p>
1315
</a>
1416
</span>
17+
<span className="nextUpdates"
18+
onClick={() => setIsUpdatesOpen(true)}>
19+
<MdBrowserUpdated/>
20+
<p>Next updates</p>
21+
</span>
1522
<span className="madeWith">
1623
<a href="https://github.com/Maek0s/TextCode" target="_blank" rel="noopener noreferrer">
1724
<FaCodeBranch/>

0 commit comments

Comments
 (0)