Despite my efforts to find a solution on Google, I have decided to seek assistance here since this platform has helped me with previous questions.
Currently, I am developing an HTML5 canvas game using
PHP, MYSQL, Html5, and JavaScriptI have already set up MYSQL databases and a PHP page that displays player high-scores and usernames. Now, my challenge is how to display these high-scores inside the canvas once the game ends and save the high score at the end of the game. Although I have researched AJAX on W3SCHOOLS, I'm still uncertain about the codes to integrate into the JavaScript file. Below are snippets of relevant PHP and script codes:
// Save high score in savescore.php file
<?php
include 'connect.php';
$user_score = ($_POST['user_score']);
$user_name = ($_POST['user_name']);
if(mysql_query("INSERT INTO users VALUES('$user_name','$user_score')"))
echo "Score Successfully Saved";
else
echo "Score Saving Failed";
?>
// Index.php snippet
<link rel="stylesheet" href="css.css">
</HEAD>
<body>
<div id="menu">
<a class="item" href="/index.php">Home</a>
<?php
include 'connect.php';
session_start();
if($_SESSION['signed_in'])
{
echo 'Hello ' . $_SESSION['user_name'] . '. Not you? <a href="signout.php">Sign out</a>';
include 'chat.php';
}
else
{
echo '<a href="signin.php">Sign in</a> or <a href="signup.php">create an account</a>.';
}
?>
</div>
<BODY>
<canvas id="canvasGAMEOVER" width="800" height="599"> </canvas>
<script src="game.js"> </script>
// The part within game.js file responsible for saving scores
var score = 0;
function drawGAMEOVER() {
}
While I managed to connect to the server via AJAX by implementing a simple form in index.php:
<form action="savescore.php">
user_name: <input type="text" name="user_name"><br>
user_score: <input type="text" name="user_score"><br>
<input type="submit" value="Submit">
</form>
In this form, I am unsure of how to retrieve the logged-in user's name (displayed on index.php) along with this.score (shown within the JavaScript file). If anyone can guide me on achieving this or suggest a better approach, I would greatly appreciate it. Thank you in advance for any help or response.