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

Allow any number of hearts and stop duplicate cards #105

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Allow any number of hearts and stop duplicate cards #105

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
9 changes: 6 additions & 3 deletions components/hearts.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,11 +34,14 @@ interface Props {
export default function Hearts(props: Props) {
const { lives } = props;

const elements: JSX.Element[] = [];
for (let counter = 1; counter <= lives; counter++) {
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hello! Thank you for your contribution. I also want to have a flexible number of lives, but it's a bit more complicated than you patch. What you're doing here is to add the same number of component Heart that the player has lives, but this isn't what we want: we want the hearts to still be displayed, but differently when we lost a life:
image

The actual number of lives is initialized here: https://github.com/tom-james-watson/wikitrivia/blob/master/lib/create-state.ts#L15
But as you spotted, we also need to have the number of <Heart> below dynamic.
So, we have to have the number of lives coming from somewhere. Should it be a const in a config file? Should we ask the users? Or let them select a level? (hard 3 lives, medium 5 lives, easy 8 lives?). What do you want?

elements.push(<Heart have={lives >= counter} />);
}

return (
<div className={styles.hearts}>
<Heart have={lives >= 1} />
<Heart have={lives >= 2} />
<Heart have={lives >= 3} />
{elements}
</div>
);
}
5 changes: 5 additions & 0 deletions lib/items.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,11 @@ export function getRandomItem(deck: Item[], played: Item[]): Item {
if (tooClose(candidate, played)) {
return false;
}
for (const playedItem of played) {
if (playedItem.id === candidate.id) {
return false;
}
}
return true;
});

Expand Down