speakid-hangman 1.0.2 → 1.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { jsx as n, jsxs as u, Fragment as
|
|
2
|
-
import { useState as m, useMemo as
|
|
1
|
+
import { jsx as n, jsxs as u, Fragment as O } from "react/jsx-runtime";
|
|
2
|
+
import { useState as m, useMemo as X, useCallback as ae, useEffect as le } from "react";
|
|
3
3
|
const a = {
|
|
4
4
|
gmCenterScreen: {
|
|
5
5
|
position: "relative",
|
|
@@ -203,10 +203,10 @@ const a = {
|
|
|
203
203
|
};
|
|
204
204
|
function ve({
|
|
205
205
|
mistakes: r,
|
|
206
|
-
maxMistakes:
|
|
207
|
-
size:
|
|
206
|
+
maxMistakes: U,
|
|
207
|
+
size: D = 200
|
|
208
208
|
}) {
|
|
209
|
-
const l =
|
|
209
|
+
const l = D, d = D * 1.25, y = Math.max(2, D / 100), T = 10 * (l / 200), b = 240 * (d / 250), f = 150 * (l / 200), x = 80 * (l / 200), Z = 20 * (d / 250), G = 240 * (d / 250), w = 80 * (l / 200), Q = 20 * (d / 250), $ = 150 * (l / 200), B = 150 * (l / 200), M = 20 * (d / 250), z = 50 * (d / 250), v = 150 * (l / 200), C = 70 * (d / 250), N = 20 * (l / 200), S = 150 * (l / 200), K = 90 * (d / 250), E = 150 * (d / 250), h = 150 * (l / 200), F = 110 * (d / 250), g = 130 * (l / 200), W = 130 * (d / 250), q = 150 * (l / 200), H = 110 * (d / 250), ce = 170 * (l / 200), L = 130 * (d / 250), J = 150 * (l / 200), _ = 150 * (d / 250), p = 130 * (l / 200), ee = 190 * (d / 250), I = 150 * (l / 200), te = 150 * (d / 250), s = 170 * (l / 200), ne = 190 * (d / 250), c = r === 0 || r <= U * 0.5 ? "#1f2937" : r <= U * 0.75 ? "#f59e0b" : "#ec4c44";
|
|
210
210
|
return /* @__PURE__ */ u(
|
|
211
211
|
"svg",
|
|
212
212
|
{
|
|
@@ -232,9 +232,9 @@ function ve({
|
|
|
232
232
|
"line",
|
|
233
233
|
{
|
|
234
234
|
x1: x,
|
|
235
|
-
y1:
|
|
235
|
+
y1: Z,
|
|
236
236
|
x2: x,
|
|
237
|
-
y2:
|
|
237
|
+
y2: G,
|
|
238
238
|
stroke: c,
|
|
239
239
|
strokeWidth: y
|
|
240
240
|
}
|
|
@@ -243,9 +243,9 @@ function ve({
|
|
|
243
243
|
"line",
|
|
244
244
|
{
|
|
245
245
|
x1: w,
|
|
246
|
-
y1:
|
|
246
|
+
y1: Q,
|
|
247
247
|
x2: $,
|
|
248
|
-
y2:
|
|
248
|
+
y2: Q,
|
|
249
249
|
stroke: c,
|
|
250
250
|
strokeWidth: y
|
|
251
251
|
}
|
|
@@ -266,7 +266,7 @@ function ve({
|
|
|
266
266
|
{
|
|
267
267
|
cx: v,
|
|
268
268
|
cy: C,
|
|
269
|
-
r:
|
|
269
|
+
r: N,
|
|
270
270
|
stroke: c,
|
|
271
271
|
fill: "none",
|
|
272
272
|
strokeWidth: y
|
|
@@ -276,9 +276,9 @@ function ve({
|
|
|
276
276
|
"line",
|
|
277
277
|
{
|
|
278
278
|
x1: S,
|
|
279
|
-
y1:
|
|
279
|
+
y1: K,
|
|
280
280
|
x2: S,
|
|
281
|
-
y2:
|
|
281
|
+
y2: E,
|
|
282
282
|
stroke: c,
|
|
283
283
|
strokeWidth: y
|
|
284
284
|
}
|
|
@@ -297,7 +297,7 @@ function ve({
|
|
|
297
297
|
r > 7 && /* @__PURE__ */ n(
|
|
298
298
|
"line",
|
|
299
299
|
{
|
|
300
|
-
x1:
|
|
300
|
+
x1: q,
|
|
301
301
|
y1: H,
|
|
302
302
|
x2: ce,
|
|
303
303
|
y2: L,
|
|
@@ -308,10 +308,10 @@ function ve({
|
|
|
308
308
|
r > 8 && /* @__PURE__ */ n(
|
|
309
309
|
"line",
|
|
310
310
|
{
|
|
311
|
-
x1:
|
|
312
|
-
y1:
|
|
311
|
+
x1: J,
|
|
312
|
+
y1: _,
|
|
313
313
|
x2: p,
|
|
314
|
-
y2:
|
|
314
|
+
y2: ee,
|
|
315
315
|
stroke: c,
|
|
316
316
|
strokeWidth: y
|
|
317
317
|
}
|
|
@@ -320,9 +320,9 @@ function ve({
|
|
|
320
320
|
"line",
|
|
321
321
|
{
|
|
322
322
|
x1: I,
|
|
323
|
-
y1:
|
|
323
|
+
y1: te,
|
|
324
324
|
x2: s,
|
|
325
|
-
y2:
|
|
325
|
+
y2: ne,
|
|
326
326
|
stroke: c,
|
|
327
327
|
strokeWidth: y
|
|
328
328
|
}
|
|
@@ -333,8 +333,8 @@ function ve({
|
|
|
333
333
|
}
|
|
334
334
|
function Le({
|
|
335
335
|
gameCubeSize: r = 400,
|
|
336
|
-
screenHeight:
|
|
337
|
-
screenWidth:
|
|
336
|
+
screenHeight: U = 800,
|
|
337
|
+
screenWidth: D = 800,
|
|
338
338
|
logoUrl: l,
|
|
339
339
|
showLogo: d = !0,
|
|
340
340
|
baseURL: y
|
|
@@ -357,7 +357,7 @@ function Le({
|
|
|
357
357
|
Environment: ["tree", "forest", "air", "water", "pollution", "recycle", "nature", "clean", "waste", "plastic", "energy", "animal", "climate", "earth", "ocean", "river", "planet", "save", "green", "environment", "litter", "organic"],
|
|
358
358
|
Space: ["planet", "star", "sun", "moon", "astronaut", "rocket", "space", "galaxy", "universe", "telescope", "comet", "asteroid", "orbit", "gravity", "alien", "spaceship", "mars", "satellite", "sky", "eclipse"],
|
|
359
359
|
Devices: ["computer", "laptop", "phone", "tablet", "tv", "keyboard", "mouse", "printer", "camera", "headphones", "charger", "screen", "watch", "microphone", "speaker", "console", "router", "battery", "cable", "remote"]
|
|
360
|
-
}, [b, f] = m("lobby"), [x,
|
|
360
|
+
}, [b, f] = m("lobby"), [x, Z] = m(""), [G] = m("Normal"), [w, Q] = m(0), [$, B] = m(1), [M, z] = m(""), [v, C] = m([]), [N, S] = m(0), [K, E] = m(0), [h, F] = m(null), [g, W] = m(null), [q, H] = m(1), [ce, L] = m([]), J = G === "Easy" ? 8 : G === "Normal" ? 6 : 4, _ = y || (typeof window < "u" && window.origin ? `${window.origin}/cloud/speakid/games/hangman` : "/cloud/speakid/games/hangman"), [p, ee] = m(!1), [I, te] = m(!1), s = X(() => {
|
|
361
361
|
const e = (g || r || 1e3) / 400;
|
|
362
362
|
return {
|
|
363
363
|
headline1: p ? Math.max(24, Math.min(30, 30 * e)) : Math.max(28, Math.min(32, 32 * e)),
|
|
@@ -377,49 +377,49 @@ function Le({
|
|
|
377
377
|
button: Math.max(12, Math.min(18, 16 * e))
|
|
378
378
|
// Desktop: 16px
|
|
379
379
|
};
|
|
380
|
-
}, [p, g, r]),
|
|
380
|
+
}, [p, g, r]), ne = X(() => {
|
|
381
381
|
const e = (g || r || 1e3) / 400;
|
|
382
382
|
return I ? Math.max(8, Math.min(12, 10 * e)) : Math.max(12, Math.min(24, 16 * e));
|
|
383
|
-
}, [I, g, r]), o =
|
|
383
|
+
}, [I, g, r]), o = X(() => {
|
|
384
384
|
const e = (g || r || 1e3) / 400;
|
|
385
385
|
return I ? Math.max(3, Math.min(6, 5 * e)) : Math.max(4, Math.min(12, 8 * e));
|
|
386
|
-
}, [I, g, r]), c =
|
|
386
|
+
}, [I, g, r]), c = X(() => {
|
|
387
387
|
const e = (g || r || 1e3) / 400;
|
|
388
388
|
return Math.max(6, Math.min(10, 8 * e));
|
|
389
|
-
}, [g, r]), he = (e, t) => e.split("").every((i) => t.includes(i)), me = (e, t) => e.split("").map((i) => t.includes(i) ? i : "_").join(" "), fe = (e) => "abcdefghijklmnopqrstuvwxyz".split("").filter((i) => !e.includes(i)),
|
|
390
|
-
var
|
|
389
|
+
}, [g, r]), he = (e, t) => e.split("").every((i) => t.includes(i)), me = (e, t) => e.split("").map((i) => t.includes(i) ? i : "_").join(" "), fe = (e) => "abcdefghijklmnopqrstuvwxyz".split("").filter((i) => !e.includes(i)), V = (e, t = []) => {
|
|
390
|
+
var P;
|
|
391
391
|
if (!e || !T[e]) {
|
|
392
392
|
const k = Object.keys(T)[0];
|
|
393
|
-
return ((
|
|
393
|
+
return ((P = T[k]) == null ? void 0 : P[0]) || "";
|
|
394
394
|
}
|
|
395
395
|
const i = T[e];
|
|
396
396
|
if (!i || i.length === 0)
|
|
397
397
|
return "";
|
|
398
|
-
const
|
|
399
|
-
if (
|
|
398
|
+
const R = i.filter((k) => !t.includes(k)), j = R.length > 0 ? R : i;
|
|
399
|
+
if (j.length === 0)
|
|
400
400
|
return "";
|
|
401
|
-
let
|
|
401
|
+
let A;
|
|
402
402
|
if (typeof crypto < "u" && crypto.getRandomValues) {
|
|
403
403
|
const k = new Uint32Array(1);
|
|
404
404
|
crypto.getRandomValues(k);
|
|
405
405
|
const ue = k[0] / 4294967295;
|
|
406
|
-
|
|
406
|
+
A = Math.floor(ue * j.length);
|
|
407
407
|
} else
|
|
408
|
-
|
|
409
|
-
return
|
|
408
|
+
A = Math.floor(Math.random() * j.length);
|
|
409
|
+
return j[A];
|
|
410
410
|
}, xe = () => {
|
|
411
411
|
if (!x) return;
|
|
412
412
|
L([]);
|
|
413
|
-
const e =
|
|
413
|
+
const e = V(x, []);
|
|
414
414
|
if (!e) {
|
|
415
415
|
f("category");
|
|
416
416
|
return;
|
|
417
417
|
}
|
|
418
|
-
z(e), L([e]), C([]), S(0), B(1),
|
|
418
|
+
z(e), L([e]), C([]), S(0), B(1), E(0), F(null), f("game");
|
|
419
419
|
}, oe = ae((e) => {
|
|
420
420
|
if (b !== "game" || h !== null) return;
|
|
421
421
|
const t = e.toLowerCase();
|
|
422
|
-
/^[a-z]$/.test(t) && (C((i) => i.includes(t) ? i : [...i, t]), z((i) => (i && !i.includes(t) && S((
|
|
422
|
+
/^[a-z]$/.test(t) && (C((i) => i.includes(t) ? i : [...i, t]), z((i) => (i && !i.includes(t) && S((R) => R + 1), i)));
|
|
423
423
|
}, [b, h]), re = ae((e) => {
|
|
424
424
|
oe(e.key);
|
|
425
425
|
}, [oe]);
|
|
@@ -427,19 +427,19 @@ function Le({
|
|
|
427
427
|
if (b === "game")
|
|
428
428
|
return window.addEventListener("keydown", re), () => window.removeEventListener("keydown", re);
|
|
429
429
|
}, [b, re]);
|
|
430
|
-
const ye = M ? me(M, v) : "", de = M ? he(M, v) : !1, ge =
|
|
430
|
+
const ye = M ? me(M, v) : "", de = M ? he(M, v) : !1, ge = N >= 10, be = fe(v), ie = ae(() => {
|
|
431
431
|
if (!x || $ >= w) {
|
|
432
432
|
f("result");
|
|
433
433
|
return;
|
|
434
434
|
}
|
|
435
435
|
B((e) => e + 1), L((e) => {
|
|
436
|
-
const t =
|
|
436
|
+
const t = V(x, e);
|
|
437
437
|
return t ? (z(t), [...e, t]) : e;
|
|
438
438
|
}), C([]), S(0), F(null);
|
|
439
439
|
}, [x, $, w]);
|
|
440
440
|
le(() => {
|
|
441
441
|
if (de && h === null) {
|
|
442
|
-
F("win"),
|
|
442
|
+
F("win"), E((t) => t + 1);
|
|
443
443
|
const e = setTimeout(() => {
|
|
444
444
|
ie();
|
|
445
445
|
}, 2e3);
|
|
@@ -459,21 +459,21 @@ function Le({
|
|
|
459
459
|
return;
|
|
460
460
|
}
|
|
461
461
|
B((e) => e + 1), L((e) => {
|
|
462
|
-
const t =
|
|
462
|
+
const t = V(x, e);
|
|
463
463
|
return t ? (z(t), [...e, t]) : e;
|
|
464
464
|
}), C([]), S(0), F(null);
|
|
465
465
|
};
|
|
466
466
|
le(() => {
|
|
467
467
|
const e = () => {
|
|
468
|
-
const t = window.innerWidth, i = window.innerHeight,
|
|
469
|
-
if (
|
|
468
|
+
const t = window.innerWidth, i = window.innerHeight, R = t < 768 || t === 926 && i === 428 || t === 932 && i === 430, j = i < 700, A = t / i > 1.8, P = t === 1024 && i === 600;
|
|
469
|
+
if (ee(R), te(P), r && r >= 320) {
|
|
470
470
|
const $e = Math.max(320, Math.min(1200, r));
|
|
471
471
|
W($e), H(1);
|
|
472
|
-
} else if (
|
|
472
|
+
} else if (R)
|
|
473
473
|
W(null), H(1);
|
|
474
|
-
else if (
|
|
474
|
+
else if (j)
|
|
475
475
|
W(null), H(1);
|
|
476
|
-
else if (
|
|
476
|
+
else if (A) {
|
|
477
477
|
const k = Math.min(1e3, Math.min(t, i) * 0.9);
|
|
478
478
|
W(k), H(0.85);
|
|
479
479
|
} else {
|
|
@@ -531,12 +531,12 @@ function Le({
|
|
|
531
531
|
...a.gmCenterScreen,
|
|
532
532
|
width: "100%",
|
|
533
533
|
height: "100%",
|
|
534
|
-
padding: `${
|
|
534
|
+
padding: `${ne}px`,
|
|
535
535
|
overflow: "auto",
|
|
536
536
|
position: "relative",
|
|
537
537
|
boxSizing: "border-box",
|
|
538
538
|
background: "transparent"
|
|
539
|
-
}, pe = !p && d,
|
|
539
|
+
}, pe = !p && d, Y = X(
|
|
540
540
|
() => {
|
|
541
541
|
const e = window.innerWidth, t = window.innerHeight;
|
|
542
542
|
if (p && e > t || t < 700 || !pe)
|
|
@@ -562,8 +562,8 @@ function Le({
|
|
|
562
562
|
] }) });
|
|
563
563
|
},
|
|
564
564
|
[p, pe, l]
|
|
565
|
-
), Me = () => b === "lobby" ? /* @__PURE__ */ u(
|
|
566
|
-
|
|
565
|
+
), Me = () => b === "lobby" ? /* @__PURE__ */ u(O, { children: [
|
|
566
|
+
Y,
|
|
567
567
|
/* @__PURE__ */ n("div", { dangerouslySetInnerHTML: { __html: se } }),
|
|
568
568
|
/* @__PURE__ */ n("h1", { style: {
|
|
569
569
|
...a.gmHeadline1,
|
|
@@ -642,7 +642,7 @@ function Le({
|
|
|
642
642
|
/* @__PURE__ */ n(
|
|
643
643
|
"img",
|
|
644
644
|
{
|
|
645
|
-
src: `${
|
|
645
|
+
src: `${_}/sun.png`,
|
|
646
646
|
alt: "Sun",
|
|
647
647
|
style: {
|
|
648
648
|
position: "absolute",
|
|
@@ -659,7 +659,7 @@ function Le({
|
|
|
659
659
|
/* @__PURE__ */ n(
|
|
660
660
|
"img",
|
|
661
661
|
{
|
|
662
|
-
src: `${
|
|
662
|
+
src: `${_}/character.png`,
|
|
663
663
|
alt: "Hangman character",
|
|
664
664
|
style: {
|
|
665
665
|
position: "absolute",
|
|
@@ -674,8 +674,8 @@ function Le({
|
|
|
674
674
|
}
|
|
675
675
|
)
|
|
676
676
|
] })
|
|
677
|
-
] }) : b === "category" ? /* @__PURE__ */ u(
|
|
678
|
-
|
|
677
|
+
] }) : b === "category" ? /* @__PURE__ */ u(O, { children: [
|
|
678
|
+
Y,
|
|
679
679
|
/* @__PURE__ */ n("div", { dangerouslySetInnerHTML: { __html: se } }),
|
|
680
680
|
/* @__PURE__ */ n(
|
|
681
681
|
"button",
|
|
@@ -694,9 +694,10 @@ function Le({
|
|
|
694
694
|
padding: `${o}px ${o * 1.5}px`,
|
|
695
695
|
borderRadius: `${c}px`,
|
|
696
696
|
position: "absolute",
|
|
697
|
-
top:
|
|
698
|
-
|
|
699
|
-
|
|
697
|
+
top: "52px",
|
|
698
|
+
// ✅ Под логотипом (16px top логотипа + 28px высота логотипа + 8px отступ)
|
|
699
|
+
left: "16px",
|
|
700
|
+
// ✅ Та же позиция что и логотип
|
|
700
701
|
zIndex: 10
|
|
701
702
|
},
|
|
702
703
|
children: "←"
|
|
@@ -706,7 +707,7 @@ function Le({
|
|
|
706
707
|
"button",
|
|
707
708
|
{
|
|
708
709
|
onClick: () => {
|
|
709
|
-
|
|
710
|
+
Z(e), f("rounds");
|
|
710
711
|
},
|
|
711
712
|
onMouseEnter: (t) => {
|
|
712
713
|
t.currentTarget.style.backgroundColor = "#f0f0f0", t.currentTarget.style.borderColor = "#1f2937", t.currentTarget.style.transform = "scale(1.05)";
|
|
@@ -733,8 +734,8 @@ function Le({
|
|
|
733
734
|
},
|
|
734
735
|
e
|
|
735
736
|
)) })
|
|
736
|
-
] }) : b === "rounds" ? /* @__PURE__ */ u(
|
|
737
|
-
|
|
737
|
+
] }) : b === "rounds" ? /* @__PURE__ */ u(O, { children: [
|
|
738
|
+
Y,
|
|
738
739
|
/* @__PURE__ */ n("div", { dangerouslySetInnerHTML: { __html: se } }),
|
|
739
740
|
/* @__PURE__ */ n(
|
|
740
741
|
"button",
|
|
@@ -753,9 +754,10 @@ function Le({
|
|
|
753
754
|
padding: `${o}px ${o * 1.5}px`,
|
|
754
755
|
borderRadius: `${c}px`,
|
|
755
756
|
position: "absolute",
|
|
756
|
-
top:
|
|
757
|
-
|
|
758
|
-
|
|
757
|
+
top: "52px",
|
|
758
|
+
// ✅ Под логотипом (16px top логотипа + 28px высота логотипа + 8px отступ)
|
|
759
|
+
left: "16px",
|
|
760
|
+
// ✅ Та же позиция что и логотип
|
|
759
761
|
zIndex: 10
|
|
760
762
|
},
|
|
761
763
|
children: "←"
|
|
@@ -766,7 +768,7 @@ function Le({
|
|
|
766
768
|
"button",
|
|
767
769
|
{
|
|
768
770
|
onClick: () => {
|
|
769
|
-
|
|
771
|
+
Q(e), xe();
|
|
770
772
|
},
|
|
771
773
|
onMouseEnter: (t) => {
|
|
772
774
|
t.currentTarget.style.backgroundColor = "#f0f0f0", t.currentTarget.style.borderColor = "#1f2937", t.currentTarget.style.transform = "scale(1.05)";
|
|
@@ -793,8 +795,8 @@ function Le({
|
|
|
793
795
|
},
|
|
794
796
|
e
|
|
795
797
|
)) })
|
|
796
|
-
] }) : b === "game" ? /* @__PURE__ */ u(
|
|
797
|
-
|
|
798
|
+
] }) : b === "game" ? /* @__PURE__ */ u(O, { children: [
|
|
799
|
+
Y,
|
|
798
800
|
/* @__PURE__ */ u("div", { style: {
|
|
799
801
|
...a.gmInfoBox,
|
|
800
802
|
padding: `${o * 0.8}px`,
|
|
@@ -830,8 +832,8 @@ function Le({
|
|
|
830
832
|
}, children: /* @__PURE__ */ n(
|
|
831
833
|
ve,
|
|
832
834
|
{
|
|
833
|
-
mistakes:
|
|
834
|
-
maxMistakes:
|
|
835
|
+
mistakes: N,
|
|
836
|
+
maxMistakes: J,
|
|
835
837
|
size: I ? Math.max(80, Math.min(110, (g || r) * 0.16)) : Math.max(100, Math.min(150, (g || r) * 0.2))
|
|
836
838
|
}
|
|
837
839
|
) }),
|
|
@@ -959,8 +961,8 @@ function Le({
|
|
|
959
961
|
marginTop: `${o}px`,
|
|
960
962
|
marginBottom: `${o}px`
|
|
961
963
|
}, children: "Type a letter on your keyboard" })
|
|
962
|
-
] }) : b === "result" ? /* @__PURE__ */ u(
|
|
963
|
-
|
|
964
|
+
] }) : b === "result" ? /* @__PURE__ */ u(O, { children: [
|
|
965
|
+
Y,
|
|
964
966
|
/* @__PURE__ */ n("h1", { style: {
|
|
965
967
|
...a.gmHeadline1,
|
|
966
968
|
fontSize: `${s.headline1}px`,
|
|
@@ -972,7 +974,7 @@ function Le({
|
|
|
972
974
|
marginBottom: `${o * 2}px`
|
|
973
975
|
}, children: [
|
|
974
976
|
"You guessed ",
|
|
975
|
-
/* @__PURE__ */ n("strong", { children:
|
|
977
|
+
/* @__PURE__ */ n("strong", { children: K }),
|
|
976
978
|
" out of ",
|
|
977
979
|
/* @__PURE__ */ n("strong", { children: w }),
|
|
978
980
|
" words correctly."
|
|
@@ -992,8 +994,8 @@ function Le({
|
|
|
992
994
|
return;
|
|
993
995
|
}
|
|
994
996
|
L([]);
|
|
995
|
-
const e =
|
|
996
|
-
e && (z(e), L([e]), C([]), S(0), B(1),
|
|
997
|
+
const e = V(x, []);
|
|
998
|
+
e && (z(e), L([e]), C([]), S(0), B(1), E(0), F(null), f("game"));
|
|
997
999
|
},
|
|
998
1000
|
onMouseEnter: (e) => {
|
|
999
1001
|
e.currentTarget.style.backgroundColor = "#d43a32";
|
|
@@ -1067,7 +1069,7 @@ function Le({
|
|
|
1067
1069
|
margin: p ? "0 auto" : "unset",
|
|
1068
1070
|
position: "relative",
|
|
1069
1071
|
// needed so absolute logo is inside the square
|
|
1070
|
-
transform: `scale(${
|
|
1072
|
+
transform: `scale(${q})`
|
|
1071
1073
|
},
|
|
1072
1074
|
children: /* @__PURE__ */ n(
|
|
1073
1075
|
"div",
|