Tom Alperin

Traditional artistry...

Traditional artists use a variety of media including oil paints, watercolors, pen, pencil, and pastels. They use a wide variety of brushes, and tools to achieve the desired effect, mixing different media types if necessary to create their masterpieces. Multiple tools and techniques are seamlessly blended together to achieve their final goal. To be a true artist, many disciplines must be mastered.

Modern web design has its box of tools. PHP, JavaScript, HTML, and CSS work together to create an immersive user experience. Frameworks like Bootstrap and Angular JS help to quickly develop a website that is interactive, immersive, and ready for the mobile device generation.

...meets the modern skill set.

If the repair man you called shows up with only a hammer to do a complicated job, you probably don't want to let him in. If your doctor insists he can cure any problem with one medication, you should seek a second opinion. If your surgeon swears he can do the entire operation with only a scalpel, get another surgeon. Complex jobs require diverse skill sets. You want people with the necessary tools and skills. You want them to be able to understand and communicate with the rest of the team and knowing how the rest of the team works makes that easier.

You want your team to have access to all the modern tools. Combine them with some traditional tools and amazing things can be achieved.

Tom

“Play” suggests recreation, but some of the most challenging coding sometimes involves creating a computer game. My name is Tom Alperin. This website is an example of several JavaScript techniques to improve the interactivity of a website. This project is my first attempt at writing a website that uses JavaScript this heavily. While I am familiar with jQuery, I chose not to use it or any other libraries, other than one to provide better sound output called howler.js written by James Simpson. My choice to do this was so the page could demonstrate my understanding of “Vanilla JavaScript”, but also to hopefully achieve a little better performance. I may eventually set up a duplicate site using jQuery to compare performance. Something else I hoped to accomplish was to make the site act as much like a mobile app as possible when accessed from a mobile device.

Animations use JavaScript rather than using animated GIF files to avoid limitations of the GIF format. Other techniques include:

  • Use of sprite sheets to arrange graphics and reduce web site load times.
  • 3D CSS animation to show the flipping of the dealers card.
  • Responsive web design. Buttons are placed differently for portrait and landscape. In landscape, buttons are also placed differently for mobile and desktop.
  • Smaller mobile screens will display a different set of cards that is easier to read at the reduced size.
  • LocalStorage not only holds the players score, but every stage of the game. It is possible for the player to close the game and return to exactly where they left off. Saving the game is done automatically on each move.
  • Some sections of HTML are inserted and changed after the game has loaded using “innerHTML.”

I have not done much to prevent cheating for someone familiar with JavaScript. It's your fake money, so have at it! I did however try to prevent the possibility of cheating by other means. You can't hit refresh to get a new deck of cards or restore money to your bank should you think you have a losing hand. If you want to cheat, you are going to have to learn a little JavaScript and figure things out.

My intentions for writing this page were to not only refresh my programming skills, but to also make a fun game my friends and relatives could play.

Rules

Try to achieve highest hand with a value of 21 or less. Face cards have a value of 10. Aces have a value of 11 unless they cause the hand value to exceed 21 in which case they have a value of 1. All other cards have a value equal to the cards value. Player wins if their hand value exceeds the dealers hand and they have not "busted" by going over 21. Player also wins if they have not "busted" and the dealer has "busted."

  • Win pays 1:1 players bet.
  • Player hand value of 21, "blackjack" with only two cards pays 3:2.
  • All ties are called a push and results in the players bet being returned to the player.
  • "Surrender" returns half the players bet and is only available as first choice in hand.
  • Player hand value of 21, "blackjack" with only two cards pays 3:2.
  • "Double" increases the bet to twice its original value and draws only one more card. This is only available after the initial deal
  • The Player may also "Split" a hand into two independent hands if the two initial cards are of the same value.
  • Splitting is only allowed once per hand.
  • Split hands may be "Doubled."
  • This game is dealt from two decks.

Click the egg to start a game.

Dealer

Card Card
Card Card Card Card Card Card Card

Split

Card Card Card Card Card Card Card Card

Player

Card Card Card Card Card Card Card Card

Game Stats

Highest Score:
Games Played:
Most Hands:
Hands this Game:
Winning Streak:
Best Winning Streak:
Losing Streak:
Worst Losing Streak:
Total Won:
Total Lost: