Book Image

Build Gamified Websites with PHP and jQuery

By : Detrick DeBurr
Book Image

Build Gamified Websites with PHP and jQuery

By: Detrick DeBurr

Overview of this book

Gamification involves the process of leveraging the features of real games into real life. A gamified website has the potential to increase user engagement, ROI, and learning. This book will help you build gamified websites with PHP and jQuery by making you understand the gamification design process to implement game mechanics in practical applications. Gamified websites are very popular amongst Internet users. The gamification of a web content draws users into action to empower them and help them develop new skills. Games engage user attention into the task and each task accomplished will mean the development and enhancement of new skills. This book will help you to apply the essence of games into real word applications such as business and education. Build Gamified Websites with PHP and jQuery aims at empowering and educating the users with an educational gamified website. The book walks through the process of developing a gamified website. Through the course of the book, you will learn gamification development process. The book emphasizes on the application of game mechanics to motivate the user. You will then use the Fogg behaviour model to influence the user behaviour. By the end of the book, you will see yourself building more engaging yet simple websites based on rational principles.
Table of Contents (15 chapters)

Players currently online


Let's build out the code to get and show a list of players that are currently online. Here we write a JavaScript function that calls our PHP module to return a list of players that are logged in.

The JavaScript function is as follows:

function GetPlayersOnlineNow(){
var action='GetPlayersOnlineNow',Username='',  html="<table>";
$.ajax({
dataType: "json",
data: {action:action},
url: $AJAXHANDLER,
        success: function (data){
    for (var i = 0; i < data.length; i++) { 
    if(data[i].UserName==''){Username='Anonymous'}else{Username=data[i].UserName};
    html+='<tr><td><a href="#">'+Username +'</a></td></tr>';  
    }
    html+="</table>";
    $("#playersonlinenowdiv").append(html);
  },
        error: function (xhr, status, error) {
            alert(status + error + xhr.responseText);
        }
    });
  
}

The PHP code is as follows:

function GetPlayersOnlineNow(){
$storedProcedure = "Select  UserName from Player...