taivu / angular-deck-of-cards

Deck of cards simulator with filtering, animations and shuffling written in Angular/Material.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Angular Deck Of Cards

Zipari Front End Project

Demo

https://angular-deck-of-cards.firebaseapp.com/

Task

Create a simple angular 2 application to draw a hand from a deck of cards.

Rules

Your interface should have 1 page that has a draw button, four filters, and a view of the current hand you have drawn. We can assume that after ever draw all cards are shuffled back into the deck and every hand being drawn is taken from a full deck.

Four Filters - The four filters should allow you to filter by the following:

  • Possible card Suit (spade, heart, club, diamond -- multi-selection preferred),
  • Number of Cards in a hand (1-52),
  • Max card Value (e.g.: No cards larger than a Jack),
  • Min Card Value (e.g.: No cards lower than a 4).

All hands must consist of unique cards and randomized (to the best of your ability)

Hand size should be dynamic based on the filters selected. I.e.: If you have selected Spades, and Hearts as possible suits your hands size should not be able to be larger than 26 etc..

Future builds may require that you add more Decks to draw from. If there are 2 decks you could have 2 of the same card within one hand and a maximum of 104 cards in a hand size. If you have 3 decks you could have 3 of the same card in a hand and a max of 156 cards in a hand etc… Is there any special consideration you might want to make as the size of the hands gets larger and larger to help usability of the app? Will the display change based on the hand size?

Delivery

  • Please place code on a public GitHub repo and share with us
  • This does not have to be up and running on a server. You’ll need to run this locally to test of course, but we’ll just want to look at the code
  • Use your best judgement for open questions. We won’t answer anything specifically.

About

Deck of cards simulator with filtering, animations and shuffling written in Angular/Material.


Languages

Language:TypeScript 49.4%Language:CSS 30.1%Language:HTML 15.4%Language:JavaScript 5.2%