iFractions is developed to run mainly on the client side. However, it communicates with a MySQL database to save information about the player's progress after each level. There's a PHP file called save.php
that manages the connection between the game and the database. Also, the asynchronous communication is stablished using XMLHTTPRequest.
First you'll need a MySQL database installed on the server (more info in https://www.mysql.com).
Now, in order for iFractions to successfully establish a connection to the database you must:
php/save.php
js/globals/globals_functions.js
Considering the database name to be db_ifractins
and the table name to be ifractions
, you can setup the MySQL database as follows:
CREATE DATABASE db_ifractions;
USE db_ifractions;
CREATE TABLE ifractions (
line_id int(11) NOT NULL AUTO_INCREMENT,
line_hostip varchar(255) DEFAULT NULL,
line_playername varchar(256) CHARACTER SET latin1 COLLATE latin1_general_ci NOT NULL,
line_datetime varchar(20) CHARACTER SET latin1 COLLATE latin1_general_ci NOT NULL,
line_lang varchar(6) CHARACTER SET latin1 COLLATE latin1_general_ci NOT NULL,
line_game varchar(10) CHARACTER SET latin1 COLLATE latin1_general_ci NOT NULL,
line_mode varchar(1) CHARACTER SET latin1 COLLATE latin1_general_ci NOT NULL,
line_operator varchar(5) CHARACTER SET latin1 COLLATE latin1_general_ci NOT NULL,
line_level int(5) NOT NULL,
line_mappos int(5) NOT NULL,
line_result varchar(6) CHARACTER SET latin1 COLLATE latin1_general_ci NOT NULL,
line_time varchar(20) CHARACTER SET latin1 COLLATE latin1_general_ci NOT NULL,
line_details varchar(120) CHARACTER SET latin1 COLLATE latin1_general_ci NOT NULL,
PRIMARY KEY (line_id)
) ENGINE = InnoDB AUTO_INCREMENT = 1 DEFAULT CHARSET = latin1;
Note that each column has the prefix line_
.
You have to set values for the following variables in php/save.php
to match the database's:
$servername = "localhost"; // INSERT MySQL server
$username = "your_db_username"; // INSERT MySQL user name
$password = "your_db_password"; // INSERT MySQL password
$dbname = "db_ifractions"; // INSERT database name (default=db_ifractions)
$tablename = "ifractions"; // INSERT table name (default=ifractions)
Inside js/globals/globals_functions.js
there's a global function called sendToDatabase()
. When the player's information is collected after each game, the game file sends it as a parameter to sendToDatabase()
. It makes an asynchronous call to php/save.php
, that executes the connection to the database.
const data = 'line_ip='// INSERT the IP of the machine where the MySQL was set up
+ '&line_name=' + // player's name
+ '&line_lang=' + // selected language for the game
+ // data received from the game as parameter to this function
There is a function postScore()
in every game file:
js/games/squareOne.js
js/games/squareTwo.js
js/games/circleOne.js
After each level is completed (with the player's answer being correct or not), before going back to the level map, the function postScore()
, is called. It joins all the player's progress information into a string (as can be seen below), that is sent as a parameter to sendToDatabase()
, from js/globals/globals_functions.js
, that sends it to the database.
const data = '&line_game=' + // collect game shape
+ '&line_mode=' + // collect game mode type
+ '&line_oper=' + // collect game math operation type
+ '&line_leve=' + // collect the selected difficulty for the game
+ '&line_posi=' + // collect the players position on the map
+ '&line_resu=' + // collect status for players answer (correct or incorrect)
+ '&line_time=' + // collect time spent finishing the game
+ '&line_deta=' + // collect extra details specific to current game