https://github.com/la-lo-go/the-phpoly

Monopoly web port with vanilla JavaScript
https://github.com/la-lo-go/the-phpoly

dom-manipulation game jquery monopoly-game php sass sql vanilla-javascript webgame

Last synced: 2 days ago
JSON representation

Monopoly web port with vanilla JavaScript

• Host: GitHub
• URL: https://github.com/la-lo-go/the-phpoly
• Owner: la-lo-go
• License: mit
• Created: 2022-08-04T16:36:47.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2022-08-05T18:30:50.000Z (over 2 years ago)
• Last Synced: 2024-11-21T06:34:10.902Z (2 months ago)
• Topics: dom-manipulation, game, jquery, monopoly-game, php, sass, sql, vanilla-javascript, webgame
• Language: HTML
• Homepage: https://la-lo-go.github.io/the-PHPoly/index_html.html
• Size: 20.4 MB
• Stars: 4
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        









4 player Monopoly web game made with HTML, SASS, PHP and JavaScript (vanilla, without any framework) with inspiration from *The Office* series.

The players names and icons are stored in a SQL database.

You can try a **fully** functional version [here](https://la-lo-go.github.io/the-PHPoly/index_html.html) but note that the names of the players and their icons are set by default and there is not any database hosted there so, if you summit the restart form, it throw an error.

## Gameplay 

![General example demostration GIF](./docs/captures/gifs/GeneralExample.gif)

Players roll a dice (hitting the 🎲 icon) and choose whether to buy the propertie (🪙) or pass (➡️) and if they land on others' properties, they automatically pay rent. The game ends when only one player remains.

The game can be restarted clicking the ♻️ icon and a form will appear to enter the names and preffered icon of the players.

## UI Details

| Transaction between players  | Dice and buttons switch |

|:---:|:-----------------------:|

|||

**Properties purchased by the players**

![](./docs/captures/imgs/Casillas.png)

**New Player form**



## Deploy

1. Copy or clone the repository into your PHP folder

   ```bash

    git clone https://github.com/la-lo-go/the-PHPoly

   ```

2. Import the database (the [thephpoly.sql](./thephpoly.sql) file) into your MySQL server.

3. If necessary, change the `$host`, `$user` or `$pass` values in the [conexion.php](./conexion.php) file with the keys of your database server.

4. Run the PHP and SQL server and enter to the [index.php](./index.php) page

## Documentation

 

   Expand to see the diagrams

   | Use cases  | Navigation flow |

   |:---:|:-----------------------:|

   |||

   | Class diagram  | Architecture |

   |:---:|:-----------------------:|

   |||

## Final notes

I wish this was a complete port but it is not, this was part of my first course final project so a lot of stuff that I would have liked to implement, like building or cards, are not here.

So... that's it! Thanks! 🤠

## References and credits

1. [Monopoly board skeleton](https://codepen.io/johnnycopes/pen/yzQyMp) from [@johnnycopes](https://github.com/johnnycopes)

2. [3D dice with CSS](https://codepen.io/abirana/pen/rNMLrPB) from [@abirana](https://github.com/abirana)