/2020NTUEEWeekGame

Primary LanguageJavaScriptMIT LicenseMIT

2020NTUEEWeekGame

How to run the game (for testing)

  1. Clone this project
  2. cmd npm install (if done it before then don't need)
  3. cmd npm run develop
  4. Open browser and go to 127.0.0.1:3000

Urgent things to do now (10/8)

  1. Problem of camera vision out of bound
  2. Character select page should be shown
  3. Game over page (to show who won)
  4. Power bar

Develop

npm run develop

Production

npm run build

npm start

Frontend

pixi.js

Backend

express

socket.io

Code Styling

eslint, airbnb config

prettier

Credit

How to Build a Multiplayer(.io) Web Game -- Victor Zhou

Content of Server

Classes

  • Object

    • constructor (id, x, y, dir, speed)

      Info Description
      Parameters id - A random number
      x - Initial x-coordinate
      y - Initial y-coordinate
      dir - Initial orientation
      speed - A fixed number

      Save basic object information.

    • update (dt)

      Info Description
      Parameters dt - A time interval between two frames

      Change the position of the object.

    • distanceTo (object)

      Info Description
      Parameters object - Any subclasses of Object class
      Return Distance between two objects
      Return type Number

      Calculate the distance between two given objects.

    • setDirection (dir)

      Info Description
      Parameters dir - Direction

      Set direction.

    • serializeForUpdate ()

      Info Description
      Return Id and x, y coordinates of the object
      Return type Object

      Return a object containing the information of the object itself at this moment.

  • Bullet

    • constructor (parent, x, y, dir, speed)

      Info Description
      Parameters parent - The role instance that shots the bullet
      x - Initial x-coordinate
      y - Initial y-coordinate
      dir - Initial orientation
      speed - A fixed number

      Save basic bullet information.

    • update (dt)

      Info Description
      Parameters dt - A time interval between two frames
      Return If or not the bullet exceeds the map border
      Return type Boolean

      Checkout that if the bullet exceeds the border or not. If so, it returns true and the bullet should be destroyed.

  • Player

    • constructor (id, username, x, y)

      Info Description
      Parameters id - A random number
      username - The name from the user input
      x - Initial x-coordinate
      y - Initial y-coordinate

      Save basic player information.

    • update (dt)

      Info Description
      Parameters dt - A time interval between two frames
      Return A new bullet object if cool-down time finished, if not so, null.
      Return type Object / Null

      Update the player's score, coordinates and cool-down time, if needed, a bullet also will be fired.

    • takeBulletDamage (role)

      Info Description
      Parameters role - One of the roles

      Decrease the player's hp value if shot by a bullet from different roles.

    • onDealtDamage () Increase the player's score if another player is shot by which.

    • serializeForUpdate ()

      Info Description
      Return The player's ID, current coordinates, orientation and hp value
      Return type Object

  • Game

    • constructor () Build a new room.

    • addPlayer (socket, username)

      Info Description
      Parameters socket - The player's socket
      username - Name from the user input

      Add the player to the room and randomly assign the initial position.

    • removePlayer (socket)

      Info Description
      Parameters socket - The socket used by the player to be removed

      Remove the player and the socket.

    • handleInput (socket, dir)

      Info Description
      Parameters socket - The socket used by the player
      dir - Keyboard input

      Grab the keyboard input and then change the direction.

    • update () Calculate the time elapsed, update the bullets' and the players' status, judge collisions and scores and renew all players' scenes.

    • getLeaderBoard ()

      Info Description
      Return The new dashboard
      Return type Array
      Renew the dashboard by ordering players by their new scores and return it.

    • createUpdate (player, leaderboard)

      Info Description
      Parameters player -
      leaderboard -
      Return
      Return type Object

      Return the current time, the player's information and others', all bullets' status and dashboard.

Functions

  • applyCollisions (players, bullets)

    Info Description
    Parameters
    Return Destroyed bullets
    Return type Array
    Check if the player is shot by a bullet, if so, decrease the player's hp value and return the bullet array to be cleared.

  • joinGame (username)

    Info Description
    Parameters player -

    Add the player to a room.

  • handleInput (dir)

    Info Description
    Parameters dir - Keyboard input

    Grab the input from the keyboard at this moment.

  • onDisconnect ()

    Info Description
    Parameters