Wireless gaming controler (Arduino)

Data Flow

Arduino ---> PHPoC WiFi Shield ---> Web browser

There are two people playing game. each people uses two buttons to control direction of goalkeepers. Therefore, we need four buttons.

Arduino reads the states of four buttons, If any of them is changed, Arduino will re-calculated the moving direction of goalkeeper and send the direction values to PHPoC WiFi Shield. When receiving the values, PHPoC WiFi Shield send it to Web Browser via websocket. JavaScript function will update the moving direction of goalkeepers.

JavaScript program will continuously update position of ball, goalkeepers and obstacles based on their direction and check collision as well.

Direction of goalkeepers are changed based on the state of buttons.

Note that: PHPoC shield has a built-in program to pass data from Arduino to web browser. Therefore, we don't need to care about it.

What We Need to Do

  • Set WiFi information for PHPoC shield (SSID and password)
  • Upload new UI to PHPoC shield
  • Write Arduino code

Setting WiFi Information for PHPoC Shield

See this instruction.

Upload new Web UI to PHPoC Shield

When receiving HTTP request from web browser, PHPoC Shield interprets PHP script in this file, and then send the interpreted file to web browser. The interpreted file (contains HTML, CSS and JavaScript code) provides UI (User Interface), updates position of ball, goalkeepers and obstacles based on their direction and checks collision as well. It also receives the moving direction of goalkeepers from websocket.

Write Arduino Code

Testing

  • Click serial button on Arduino IDE to see the IP address.
  • Open web browser, type http:// replace_ip_address/remote_game.php
  • Click connect button and test it

The Best Arduino Starter Kit for Beginner

See The Best Arduino Kit for Beginners


Function References

Commentaires