gavin/Tarokka
1
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

cleanup

Browse Source
This commit is contained in:
Gavin McDonald
2025-06-26 14:39:04 -04:00
parent 12ae8dd6d8
commit 2c2e93649c
3 changed files with 16 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
components/Card.tsx
View File

@@ -11,32 +11,33 @@ import getURL from '@/tools/getURL';
import tarokkaCards from '@/constants/tarokkaCards';
import { layout } from '@/constants/tarokka';
import { Settings, TarokkaGameCard } from '@/types';
import { TarokkaGameCard } from '@/types';
const cardBack = tarokkaCards.find((card) => card.back)!;
type CardProps = {
dm: boolean;
card: TarokkaGameCard;
cardIndex: number;
settings: Settings;
};
export default function Card({ dm, card, cardIndex, settings }: CardProps) {
export default function Card({ card, cardIndex }: CardProps) {
const [tooltip, setTooltip] = useState<React.ReactNode>(null);
const { flipCard, redraw, setSelectCardIndex } = useAppContext();
const { flipCard, gameData, redraw, setSelectCardIndex } = useAppContext();
const { dmID, settings } = gameData;
const isDM = !!dmID;
const { aria, flipped } = card;
const position = layout[cardIndex];
const handleClick = () => {
if (dm) {
if (isDM) {
flipCard(cardIndex);
}
};
const getTooltip = () => {
const text = getCardInfo(card, position, dm, settings);
const text = getCardInfo(card, position, isDM, settings);
return text.length ? (
<>
@@ -53,7 +54,7 @@ export default function Card({ dm, card, cardIndex, settings }: CardProps) {
return (
<ToolTip content={tooltip || getTooltip()}>
<TiltCard
className={`h-[21vh] w-[15vh] relative perspective transition-transform duration-200 z-0 hover:z-10 hover:scale-150 ${dm ? 'cursor-pointer' : ''} `}
className={`h-[21vh] w-[15vh] relative perspective transition-transform duration-200 z-0 hover:z-10 hover:scale-150 ${isDM ? 'cursor-pointer' : ''} `}
cardID={position.id}
>
<div
@@ -61,7 +62,7 @@ export default function Card({ dm, card, cardIndex, settings }: CardProps) {
onClick={handleClick}
>
<div className="absolute inset-0 group backface-hidden">
{dm && (
{isDM && (
<>
<img src={getURL(card, settings)} alt={aria} className="absolute rounded-lg" />
<img
@@ -74,9 +75,9 @@ export default function Card({ dm, card, cardIndex, settings }: CardProps) {
<img
src={getURL(cardBack as TarokkaGameCard, settings)}
alt="Card Back"
className={`absolute rounded-lg ${dm ? 'transition duration-500 group-hover:opacity-0' : ''} ${settings.cardStyle === 'grayscale' ? 'border border-yellow-500/25 group-hover:drop-shadow-[0_0_3px_#ffd700/50]' : ''}`}
className={`absolute rounded-lg ${isDM ? 'transition duration-500 group-hover:opacity-0' : ''} ${settings.cardStyle === 'grayscale' ? 'border border-yellow-500/25 group-hover:drop-shadow-[0_0_3px_#ffd700/50]' : ''}`}
/>
{dm && !flipped && (
{isDM && !flipped && (
<StackTheDeck
onRedraw={() => redraw(cardIndex)}
onSelect={() => setSelectCardIndex(cardIndex)}

6
components/TarokkaGrid.tsx
View File

@@ -7,9 +7,7 @@ import type {} from '@/types';
export default function TarokkaGrid() {
const { gameData } = useAppContext();
const { dmID, cards, settings } = gameData;
const isDM = !!dmID;
const { cards } = gameData;
// map our five Tarokka cards to their proper locations in a 3x3 grid
// common deck cards: left, top, and right
@@ -22,7 +20,7 @@ export default function TarokkaGrid() {
.map(arrangeCards)
.map((card, index) => (
<div key={index} className="aspect-[2/3]}">
{card && <Card dm={isDM} card={card} cardIndex={cardMap[index]} settings={settings} />}
{card && <Card card={card} cardIndex={cardMap[index]} />}
</div>
))}
</div>