1 of 10

Team-B Bomberman

Suhan Koh Su Khai Koh Raymond Thai Steven Nguyen

2 of 10

Initial Goals

Features

  • Have bomb objects, sound effects
  • Have user chat box
  • Leaderboard
    • Keep track of user scores
  • Facebook integration (stretch goals)
    • Invite friends to play
    • In game unlocks from Facebook referrals (give lives)
  • Social media notifications (post on timeline)
  • 2 - 3 players
  • 2 - 3 monsters

3 of 10

Goals Achieved

Features

  • Have bomb objects, sound effects
  • Allows users to host or join game rooms in game lobby
  • Have user chat box
  • Leaderboard
    • Keeps track of user scores and ranks them accordingly
  • Facebook integration
    • Login with facebook account
  • 2 - 4 players
  • Disclaimer and about us page

4 of 10

Technologies Used

  • Technologies discussed in class
    • Ruby on Rails - MVC pattern
    • HTML - structure of website
    • CSS / bootstrap - styling the website
    • Javascript / Jquery - making page interactive and handling client side scripting
    • Pusher - creating real-time applications on our site
  • Technologies used outside of class
    • Phaser.io - creating game logic

5 of 10

Phaser.io

  • HTML game framework
  • Handles
    • camera angles
    • physics
    • tile maps
    • animations
    • sprites
    • etcs.

6 of 10

Domain Entities

7 of 10

Workflow

8 of 10

Challenges

  • Rails routing
    • Understanding how it works
  • Implementation of Pusher
  • Pusher channels and events workflow
  • Communication between server and clients
    • Updates between clients (chat messages, player left, etc)
    • Messages from server to clients (send data from server to clients, which HTML to render, etc)
  • Heroku
    • CSS / Javascript does not work the same way as localhost
    • Assets precompile was confusing

9 of 10

Solution

  • Rails routing
    • Stackoverflow
    • Rails documentation (http://guides.rubyonrails.org/routing.html)
    • Explicitly specify the routing we want on route.rb
      • post ‘gamelobbies/leave’, to: ‘gamelobbies#leave’
  • Implementation of Pusher
    • A lot of testing
  • Pusher channels and events workflow
    • Draw out the possible workflow, including what channel and events to subscribe or unsubscribe, on a piece of paper first, then code the workflow
  • Heroku
    • CSS / Javascript does not work the same way as localhost
    • RAILS_ENV=production rake asset:precompile before pushing to Heroku

10 of 10

Solution (Continue)

  • Communication between server and clients
    • Chat messages we use an open source library, and modify the source code based on what we need (i.e modify its Javascript file so the chat window and minimize and position at the bottom right, and expand if it is not in minimized state
    • Lobby, game room, and game session real time updates
      • Use Ajax POST to send updates from client to server, then let server broadcast out to other clients
        • Reason:
          • Avoid clients to be authenticated
          • It is mentioned in the Pusher documentation
      • The Ajax request to the server will have a callback from the server with data about which view to render