GithubHelp home page GithubHelp logo

multiplayer-consensus-cardgame's Introduction

To Run

Installing dependencies and running the flask application:

cd flask-app
pip3 install -r requirements.txt
flask run

Building and running the node.js server which handles the socket.io calls:

cd server 
npm install
node index.js

Running React.js client:

cd client
npm install
npm start 

Reference: Build a real-time chat app with React hooks and Socket.io.

Project structure

  1. \client: This folder contains the code for the React.js frontend of the application
  2. \server: This folder contains the code for the node.js application which is handling the configuration and socket.io server.
  3. \flask-app: This folder contains the flask application code which is used to expose API's to retrive and store information to a MYSQL database

Database structure:

This project uses MYSQL for storing all the data which is generated by users through the frontend interactions.

Following is a description of the tables and the data they hold:

  1. demographic_info: This tables hosts the data entered by users when they start interacting with the application. This table includes information like users age, primary language etc.
  2. player_moves: This table contains information about the cards selected by specific users during various rounds of the game
  3. survey_repsonses: This table has the user responses for survey questions asked after each round and after each game.

Configuring the room/ game/ card information

All the configuration for the application can be made using RoomCardConfig.json file present in \server folder.

The following is a description on how to change/ add/ remove different components of this json file to change the behavior on the application:

  1. Editing a Card information like description or name etc.

    {
    "rooms": [
        {...
            "games": [
                {...
                    "cards": [
                        {"name": "Card 1.1", "description": "Card 1.1 description", "player": 0}
    

    Edit the cards[].name or cards[].description fields to change information about a specific card in the game

  2. Changing Survey questions asked to the user at the end of a round or a game:

    {
    "rooms": [
        {...
            "games": [
                {...
                    "feedback_questions": ["Question 1.1", "Question 1.2"],
                    "game_end_survey": ["Game end survey Question 1.1", "Game end survey Question 1.2"]
    
    • Change the values of list "feedback_questions" to change the questions displayed after each round of a certain game.

    • Chnage the values of the list "game_End_survey" to change the questions displayed after each game. NOTE: In the current implementation these lists can only contains 2 questions. In future updates this will be made dynamic

  3. Changing game parameters like number of players, rounds or games or the time delay for displayig the survey page after the user plays a card.

    {
    "rooms": [
        {
            "roomid": "a",
            "player_limit": 2,
            "round_limit": 2,
            "game_limit": 2,
            "display_survey_delay": 10000,
    
    • Changing the parameters "roomid", "player_limit", "round_limit", "game_limit" or "display_survye_delay" can change different aspects of the game
    • NOTE: If the number of games is changed make sure that the "games" list for that room is also modified to reflect the new number of games
    • NOTE: the parameter "display_survey_delay" takes values in milliseconds
  4. Adding new rooms to the game:

        {
        "roomid": "a",
        "player_limit": 2,
        "round_limit": 2,
        "game_limit": 2,
        "display_survey_delay": 10000,
        "games": [
            {
                "gameid": "Game 1",
                "cards": [
                    {"name": "Card 1.1", "description": "Card 1.1 description", "player": 0},
                    {"name": "Card 1.2", "description": "Card 1.2 description", "player": 0},
                    {"name": "Card 1.3", "description": "Card 1.3 description", "player": 1},
                    {"name": "Card 1.4", "description": "Card 1.4 description", "player": 1}
                ],
                "feedback_questions": ["Question 1.1", "Question 1.2"],
                "game_end_survey": ["Game end survey Question 1.1", "Game end survey Question 1.2"]
            },
            {
                "gameid": "Game 2",
                "cards": [
                    {"name": "Card 2.1", "description": "Card 2.1 description", "player": 0},
                    {"name": "Card 2.3", "description": "Card 2.3 description", "player": 0},
                    {"name": "Card 2.2", "description": "Card 2.2 description", "player": 1},
                    {"name": "Card 2.4", "description": "Card 2.4 description", "player": 1}
                ],
                "feedback_questions": ["Question 2.1", "Question 2.2"],
                "game_end_survey": ["Game end survey Question 2.1", "Game end survey Question 2.2"]
            }
        ]
    }
    
    • Each room in the game is defined wih a configuration block as shown above.
    • Adding or removing such blocks from the configuration will allow us to add or remove rooms into which users can join.

multiplayer-consensus-cardgame's People

Contributors

athimma2 avatar abhinav-thimma avatar

Watchers

 avatar

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.