Git Product home page Git Product logo

hearts's Introduction

Hearts

I wanted to play Hearts with three friends without the need to make an account, install an app, or get paired with strangers/robots. So I made this.

Screenshot choosing cards to trade

Screenshot playing a trick

Things it does

Please file an issue (or PR) if there is something else you want Hearts to do.

  • Lets you play Hearts with three of your friends in your browser
  • Looks decent on three screens
  • Keep score between rounds
  • Take a card back if played incorrectly
  • Rejoin if you lose connection (though this only works if at least one of your friends stayed on the page)

Things it does not do (yet)

  • Check that the move you made was allowed
    • As with Hearts live, though, you may redo your move if you made a mistake
  • Sort the cards in your hand
  • Save a game for you & your friends to return to later
  • Collect any sort of stats or keep player profiles

Tech used

The app is (more-or-less) a single-page application served via a Node Express app. The game state is handled by a Vue component, and game updates are streamed between players via Socket.io.

Special thanks to the Deck of Cards API for the wonderful API methods & card images.

Running locally

Make sure you have Node installed. Then,

  1. Clone the repository
  2. From inside the folder, run npm install
  3. Run npm start, and you may access Hearts locally at localhost:9090

Do whatever you want with it

Clone it. Fork it. Twist it. Bop it.

hearts's People

Contributors

zchr avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

hearts's Issues

Delay requesting game on join

There is a delay when landing on the game page (or the emit is not firing at all). My theory is that the client requests the game state before the server has added it to a room. Switch to using callbacks if possible.

This only happens sometimes, and there is also a disconnect issue. My guess is it's this has something to do with it: https://devcenter.heroku.com/articles/node-websockets

Minor style issues

  • My cards scroll includes the header text
  • Check scroll for players, too
  • Undo trade buttons need margin top

Confirm before dealing when mid-round

You should be allowed to re-deal during a round (in case something went wrong or you want to start the round over). However, you should be alerted before re-dealing so you don't inadvertently mess up the game.

Make sure that your play is valid

Don't let a user play an invalid card. Such cards are

  • Not matching the leading suit (and the user has a card of that suit)
  • Leading with hearts/QS before hearts have been broken
  • Playing a point-value card on the first trick

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.