OVERVIEW
This tutorial will show you how to set up a basic AJAX based multi-user demo app, whatever you would like to call it. Well, this is more of an explanation than a tutorial, however I have included all the files needed to complete this tutorial.
We have a tack on the screen and anyone who is looking at that same web page can move it. Every time the tack is drag and dropped it uses AJAX to submit the tack new location to a PHP page on a web server, which in turn updates the database.
The web page will also use AJAX every 5 seconds to update the location of the tack from the PHP page which gets the information from the database.
This isn't meant to be used by more than a few people wanting to test it out otherwise the tack will be all over the place.
FLOW
1. Source the .SQL file into your mySQL server
2. Edit the CAPX file to contain the URL where the project is uploaded to a web server
3. Edit the PHP file to contain your database connection information.
4. Export the project as HTML5 files
5. Upload the HTML5 files to your web server
6. Upload the PHP file into the same directory on your web server
7. Load up the app on two computers or two browser windows
8. Move the Tack and watch it update every 5 seconds
0. (I know this may seem boring but it's a very simple tutorial)
CAPX INFORMATION
The CAPX file contains
- 1 Sprite Object (The Tack)
- 1 Tiled Background Object (The Pegboard)
We set up two global variables to store the location of the tack which is updated by the AJAX and then used to place the tack on the screen.
Event 1: Updates the tack location from the database once every 5 seconds.
Event 2: Parses the information returned from event 1 and places the tack in the right location on the screen. It uses the "tokenat" system expression to split up the info into 2 variables used by C2.
Event 3: Updates the database with the new location of the tack when it is drag and dropped, when it is dropped.
You must change the 'YOURURL' text in the events to be the URL where you have your files on your website or it won't be able to find the PHP page used to update the database.
mySQL INFORMATION
Source this file into your database on your mySQL server, which is beyond the scope of this tutorial.
PHP INFORMATION
This file must be uploaded to the same place you have the C2 HTML5 exported from this project on your web server.
I hope this tutorial helps a few people with some basic AJAX based updating and I hope to submit some higher quality tutorials soon.
MWMDragon