Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Dudo: translate rules to French #9

Merged
merged 3 commits into from
Jul 8, 2024
Merged

Dudo: translate rules to French #9

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
ffd798b
Fix `make watch`
simlmx Jul 7, 2024
4898f81
Dudo: translate rules to French
simlmx Jul 7, 2024
118811f
Tweak the palifico animation
simlmx Jul 8, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion Makefile
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ check-format:

.PHONY: watch
watch:
pnpm run -r watch
pnpm run --parallel -r watch

.PHONY: dev
dev:
Expand Down
4 changes: 2 additions & 2 deletions game/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,8 @@
"test": "pnpm vitest run src"
},
"dependencies": {
"@lefun/core": "1.4.0",
"@lefun/game": "1.4.0",
"@lefun/core": "1.5.0",
"@lefun/game": "1.5.0",
"lodash-es": "^4.17.21"
},
"devDependencies": {
Expand Down
86 changes: 43 additions & 43 deletions pnpm-lock.yaml
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

10 changes: 5 additions & 5 deletions ui/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,11 +26,11 @@
},
"devDependencies": {
"@babel/preset-react": "^7.24.7",
"@lefun/core": "^1.4.0",
"@lefun/dev-server": "^1.4.0",
"@lefun/game": "^1.4.0",
"@lefun/ui": "^1.4.0",
"@lefun/ui-testing": "^1.4.0",
"@lefun/core": "^1.5.0",
"@lefun/dev-server": "^1.5.0",
"@lefun/game": "^1.5.0",
"@lefun/ui": "^1.5.0",
"@lefun/ui-testing": "^1.5.0",
"@lingui/cli": "^4.11.1",
"@lingui/conf": "^4.11.1",
"@lingui/macro": "^4.11.1",
Expand Down
74 changes: 26 additions & 48 deletions ui/src/Board.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,7 @@ import "tippy.js/dist/tippy.css";

import { msg, Trans } from "@lingui/macro";
import { useLingui } from "@lingui/react";
import {
animated,
config as springConfig,
useSpring,
useTransition,
} from "@react-spring/web";
import { animated, config as springConfig, useSpring } from "@react-spring/web";
import Tippy from "@tippyjs/react";
import classNames from "classnames";
import { ReactNode, useEffect, useState } from "react";
Expand All @@ -31,27 +26,13 @@ import {
} from "dudo-game";

import { Die } from "./Die";
import { useFonts } from "./hooks";
import {
iAmAliveSelector,
iHaveRolledSelector,
itsMyTurnSelector,
} from "./selectors";

const useSetFont = () => {
// Add the google font. This is a bit hacky but we have no other way to control the
// "outer" HTML.
useEffect(() => {
const parent = document.getElementsByTagName("head")[0];
parent.insertAdjacentHTML(
"beforeend",
`
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Hammersmith+One&display=swap" rel="stylesheet">
`,
);
}, []);
};

type PlayerColor = {
text: string;
bg: string;
Expand Down Expand Up @@ -472,36 +453,33 @@ const WildsInfo = () => {
palifico &&
(step === "play" || (step === "revealed" && (!iHaveRolled || !iAmAlive)));

const palificoTrans = useTransition(shouldSeePalifico, {
const style = useSpring({
opacity: shouldSeePalifico ? 1 : 0,
transform: shouldSeePalifico
? "scale(1) rotate(-5deg)"
: "scale(0) rotate(12deg)",
immediate: !shouldSeePalifico,
config: {
tension: 200,
friction: 22,
clamp: true,
tension: 500,
friction: 12,
precision: 0.02,
},
from: { opacity: 0, transform: "scale(4) rotate(12deg)" },
enter: { opacity: 1, transform: "scale(1) rotate(-5deg)" },
leave: { opacity: 0 },
});

return (
<div className="w-full h-full flex justify-end">
{palificoTrans(
(style, item) =>
item && (
<div className="ml auto w-24 h-full relative">
{/* absolute so that it doesn't influence the height of the container. */}
<div className="absolute right-0 top-0 bottom-0 flex items-center">
<animated.div
className="my-auto ml-auto mr-1 opacity-0"
style={{ ...style }}
>
<Palifico />
</animated.div>
</div>
</div>
),
)}
<div className="flex-1 w-0 max-w-60 flex">
<div className="ml auto w-24 h-full relative">
{/* absolute so that it doesn't influence the height of the container. */}
<div className="absolute right-0 top-0 bottom-0 flex items-center">
<animated.div
className="my-auto ml-auto mr-1 opacity-0"
style={{ ...style }}
>
<Palifico />
</animated.div>
</div>
</div>
<div className="flex">
<div className="ml-auto my-auto inline-block text-gray-600 py-0.5 pl-1 pr-1.5 leading-5">
{shouldSeePalifico ? (
<Trans>
Expand Down Expand Up @@ -867,7 +845,7 @@ const Header = () => {
};

const Board = () => {
useSetFont();
useFonts();

const playerOrder = useSelectorShallow((state) => {
return state.board.playerOrder;
Expand All @@ -893,13 +871,13 @@ const Board = () => {
`}
>
<Header />
<div className="panel">
<div className="panel pb-1 vsm:pb-2.5">
<div className="space-y-1 vsm:space-y-1.5">
{playerOrder.map((u) => (
<Player userId={u} key={u} />
))}
</div>
<div className="h-11 vsm:mt-2 flex items-center">
<div className="h-11 mt-1 vsm:mt-2 flex items-center">
<WildsInfo />
</div>
</div>
Expand Down
Loading