Monday, August 25, 2008

AJAX & PHP star rating system script

Here is how to make a star rating script for your webpages.
The new and updated version of the script is now tracking all of your web pages automatically. You just have to include it on the desired page.
A new and improved version of the script, along with its explanation can be found in the star rating script course.

if you don't have a database you can create it with first with:

CREATE DATABASE ratings;

then enter the database with :

use database ratings;


and lets set up the MySQL table:


CREATE TABLE IF NOT EXISTS `ratings` (

  `id` varchar(255) NOT NULL,

  `total_votes` int(11) NOT NULL,

  `total_value` int(11) NOT NULL,

  `used_ips` longtext,

  PRIMARY KEY (`id`)

);


Then copy and paste this php code into ratings.php and open the file for edit:

 var http_request = false;  
 function alertContents(response, ret_el) {  
   document.getElementById(ret_el).innerHTML = response;  
 }  
 function makePOSTRequest(url, parameters, ret_el, callback_function) {  
   if (typeof callback_function == 'undefined') callback_function = alertContents;  
   var http_request = false;  
   var activex_ids = ['MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP', 'Microsoft.XMLHTTP'];  
   if (window.XMLHttpRequest) { // Mozilla, Safari, IE7+...  
     http_request = new XMLHttpRequest();  
     if (http_request.overrideMimeType) {  
       http_request.overrideMimeType('text/xml');  
     }  
   } else if (window.ActiveXObject) { // IE6 and older  
     for (i = 0; i < activex_ids.length; i++) {  
       try {  
         http_request = new ActiveXObject(activex_ids[i]);  
       } catch (e) {}  
     }  
   }  
   if (!http_request) {  
     alert('Please update your browser!');  
     return false;  
   }  
   document.getElementById(ret_el).innerHTML = "Please wait...";  
   document.getElementsByTagName("body").item(0).style.cursor = "wait";  
   http_request.onreadystatechange = function() {  
     if (http_request.readyState !== 4) {  
       return;  
     }  
     if (http_request.status !== 200) {  
       alert('Please try again later.');  
       return;  
     }  
     document.getElementsByTagName("body").item(0).style.cursor = "auto";  
     var response = http_request.responseText;  
     callback_function(response, ret_el);  
     return;  
   };  
   http_request.open('POST', url, true);  
   http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");  
   // http_request.setRequestHeader("Charset", "windows-1251");  
   http_request.setRequestHeader("Content-length", parameters.length);  
   http_request.setRequestHeader("Connection", "close");  
   http_request.send(parameters);  
 }  
 function rate(url_id, vote) {  
   makePOSTRequest('star_rating.php', 'url_id=' + url_id + '&vote=' + vote, 'myspan');  
 }  
 window.onload = function() {  
   var percentstyle = '',  
     rate_percent = 0;  
   var current_rating = document.getElementById("current_rating");  
   if (current_rating) {  
     rate_id = current_rating.getAttribute('data-id');  
     rate_percent = current_rating.getAttribute('data-percent');  
   }  
   percentstyle = 'width:' + rate_percent + 'px;';  
   var content = '<div class="rating" id="rating"><ul class="star-rating"><li class="current-rating" style="' + percentstyle + '" >Current rating</li><li><a id="rate1" class="one-star">1</a></li><li><a id="rate2" class="two-stars">2</a></li><li><a id="rate3" class="three-stars">3</a></li><li><a id="rate4" class="four-stars">4</a></li><li><a id="rate5" class="five-stars">5</a></li></ul></div>';  
   if (document.getElementById("myspan")) {  
     document.getElementById("myspan").innerHTML = content;  
   }  
   var url_id = encodeURIComponent(rate_id);  
   for (var i = 1; i < 6; i++) {  
     (function(i) {  
       document.getElementById("rate" + i).addEventListener("click", function() {  
         rate(url_id, i);  
         return false;  
       });  
     })(i);  
   }  
 }  


<?php  
 $dbhost = 'localhost';  
 $dbuser = '';  
 $dbpass = '';  
 $dbname = 'ratings';  
 $dbtable = "ratings";  
 $conn = mysqli_connect($dbhost, $dbuser, $dbpass, $dbname) or die('Error connecting to mysql');  
 $is_voting = isset($_POST['vote']) ? $_POST['vote'] : ''; //the actual user vote  
 if ($is_voting) {  
   $id = isset($_POST['url_id']) ? $_POST['url_id'] : ''; //passed url_id   
 } else {  
   $id = substr($_SERVER['REQUEST_URI'], 1);  
   $id = htmlentities(urlencode($id), ENT_QUOTES);  
 }  
 //make initial vote check  
 $sql = "SELECT total_votes, total_value, used_ips FROM $dbtable WHERE id = '$id' ";  
 $query = mysqli_query($conn, $sql) or die(" Error: " . mysqli_error());  
 $number_rows  = mysqli_num_rows($query);  
 $numbers    = mysqli_fetch_assoc($query);  
 $checkIP    = unserialize($numbers['used_ips']);  
 $count     = $numbers['total_votes']; //how many votes total  
 $current_rating = $numbers['total_value']; //total number of rating added together and stored  
 $sum      = $is_voting + $current_rating; // add together the current vote value and the total vote value  
 $tense     = ($count == 1) ? "vote" : "votes"; //plural form votes/vote  
 if (!$is_voting) {  
   //check if have voted already  
   $voted = mysqli_fetch_assoc(mysqli_query($conn, "SELECT * FROM $dbtable WHERE used_ips LIKE '%" . $_SERVER['REMOTE_ADDR'] . "%' AND id='$id' ")); //This variable searches through the previous ip addresses that have voted and returns true or false  
   //when already voted  
   if ($voted) {  
     echo '<ul class="star-rating"><li class="current-rating" style="width:' . @number_format($current_rating / $count, 2) * 25 . '%;"></li></ul>  
 Rating: <strong>' . @number_format($current_rating / $count, 2) . '</strong> ( ' . $count . $tense . ')  
 <br /><span style="color:red;">You have already voted.</span><br />';  
   } else {  
     //if not voting just show the current rating  
     //set data for the css  
     echo '<div id="myspan"><span id="current_rating" data-id="' . $id . '" data-percent="' . @number_format($current_rating / $count, 2) * 25 . '"></span></div>';  
   }  
 }  
 //if not voted do the actual voting  
 if ($is_voting) {  
   //open initial voting row if necessary  
   if ($number_rows == 0) {  
     $sql = "INSERT INTO $dbtable (id, total_votes, total_value, used_ips) VALUES ('$id', '0', '0', '')";  
     $result = mysqli_query($conn, $sql) or die("err");  
   }  
   //increment votes, check ips & add/update vote to table  
   if ($sum == 0) {  
     $added = 0;  
   } else {  
     $added = $count + 1;  
   }  
   if (is_array($checkIP)) {  
     array_push($checkIP, $_SERVER['REMOTE_ADDR']);  
   } else {  
     $checkIP = array(  
       $_SERVER['REMOTE_ADDR']  
     );  
   }  
   $insert = serialize($checkIP);  
   mysqli_query($conn, "UPDATE $dbtable SET total_votes='$added', total_value='$sum', used_ips='$insert' WHERE id='$id'") or die("Error");  
   echo $response = '<div class="rating">Your rating:' . $is_voting . ' <br />';  
   echo '<ul class="star-rating"><li class="current-rating" style="width:' . @number_format($sum / $added, 2) * 25 . '%;"></li></ul>';  
   echo 'Overall rating: <strong>' . @number_format($sum / $added, 2) . '</strong> <br />   
   <span style="color:red;">Thank you for your vote cast!</span></div>';  
   //echo iconv("windows-1251", "UTF-8", $response);  
 }  
 ?>  


You can also explore the full version of the script in the course.

Enjoy!

Subscribe To My Channel for updates

Burnout or toxic culture ?

Outsourcing companies are hell to be in for an experienced programmer, because managers are being allowed to mistakes, which are covered, th...