المساعد الشخصي الرقمي

مشاهدة النسخة كاملة : [درس] إضافة ميزة التقييم لسكربتك


إيهاب عصام
14-02-2010, 05:38 صباحاً
بسم الله الرحمن الرحيم
اليوم سوف اشرح لكم كيفية إضافة ميزة التقييم لسكربتاتكم ..
مثال ! :
http://4-scripts.com/new.php?id=13
اولاً : نحتاج إلى أن ننشأ جدولاً خاصاً بالتقييم ..
على ماذا يحتوي الجدول؟!
- الرقم التسلسلي id للتقييم نفسه..
- rating_id الرقم التسلسلي للموضوع أو الدرس الذي نقييمه
- rating_num : رقم التقييم (من 1 إلى 5) عدد النجوم يعني
- ip : لتسجيل I.P المستخدم كي لا يقيم أكثر من مرة ..
كود الجدول :
CREATE TABLE IF NOT EXISTS `ratings` (
`id` int(11) NOT NULL auto_increment,
`rating_id` varchar(80) NOT NULL,
`rating_num` int(11) NOT NULL,
`IP` varchar(25) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=5 ;
ملاحظة : مش شرط يكون عندك جدول اخبار او دروس
ممكن نكتب رقم وهمي و نعمل التقييم على اساسه
المهم نيجي للعذاب ملف الكونفج ..
هو كل برمجة هينطلنا
<?
$server = 'localhost'; //مستضيف قواعد البيانات غالباً "localhost"
$dbuser = 'root';//اسم مستخدم قواعد البيانات
$dbpass = '';//كلمة مرور قاعدة البيانات
$dbname = 'traidnt';//قاعد البيانات

$x = mysql_connect($server,$dbuser,$dbpass) or die(mysql_error());//أمر الإتصال بخادم قواعد البيانات
mysql_select_db($dbname,$x);//أمر تحديد قاعدة البيانات
?>خلصنا منه
طبعاً الشرح مدموج مع الكود
طيب نيجي للدوال الخاصة ..
نعمل ملف functions.php
اول دالة ..
دالة إحضار التقييم لرقم معين ..
نبدأ
function getRating($id){تمام .. طبعاً دالة عادية اسمها getRating وبنعطيها الرقم التسلسلي عشان تجيب التقييم ..
ثم ندخل :
$total = 0;
$rows = 0;كل التقييمات = 0
rows = 0
شو هي الـ rows ??!
أظن سهلة ع البعض بس ممكن حد مايعرفها
هي الخلايا في الجدول ..
$sel = mysql_query("SELECT rating_num FROM ratings WHERE rating_id = '$id'");
if(mysql_num_rows($sel) > 0){

while($data = mysql_fetch_assoc($sel)){

$total = $total + $data['rating_num'];
$rows++;
}هنختار من جدولنا ratings الخلية رقم التقييم rating_num ..
لو رقم خلاياها أكبر من 0
هنعمل تكرار
وفيه
هنزود عدد التقييم الكلي على عدد التقييم
وهنزود الخلايا ++
النسبة المئوية للتقيم :
$perc = ($total/$rows) * 20;الكل / الخلايا * 20
$newPerc = round($perc,2);
return $newPerc.'%';النسبة الجديدة هتساوي دوران (النسبة , 2 )
موضوع كده
لمعلومات اكثر :
http://php.net/manual/en/function.round.php
تمام .
لو لم يكن العدد أكثر من 0
اي = 0
} else {

return '0%';

}تمام ..
هيرجع بالنسبة 0 % طبعاً
الدوال الأخرى :
دالة إحضار الأصوات :
function getVotes($id){

$sel = mysql_query("SELECT rating_num FROM ratings WHERE rating_id = '$id'");
$rows = mysql_num_rows($sel);
if($rows == 0){
$votes = '0 صوت';
}
else if($rows == 1){
$votes = '1 صوت';
} else {
$votes = $rows.' اصوات';
}
return $votes;

}مش هقدر اشرح كله ..
هي حاجات سهلة ..
دالة التقييم ..
function pullRating($id,$show5 = false, $showPerc = false, $showVotes = false, $static = NULL){

// Check if they have already voted...
$text = '';

$sel = mysql_query("SELECT id FROM ratings WHERE IP = '".$_SERVER['REMOTE_ADDR']."' AND rating_id = '$id'");
if(mysql_num_rows($sel) > 0 || $static == 'novote' || isset($_COOKIE['has_voted_'.$id])){



if($show5 || $showPerc || $showVotes){

$text .= '<div class="rated_text">';

}

if($show5){
$text .= 'تم التقييم<span id="outOfFive_'.$id.'" class="out5Class">'.outOfFive($id).'</span>/5';
}
if($showPerc){
$text .= ' (<span id="percentage_'.$id.'" class="percentClass">'.getRating($id).'</span>)';
}
if($showVotes){
$text .= ' (<span id="showvotes_'.$id.'" class="votesClass">'.getVotes($id).'</span>)';
}

if($show5 || $showPerc || $showVotes){

$text .= '</div>';

}


return $text.'
<ul class="star-rating2" id="rater_'.$id.'">
<li class="current-rating" style="width:'.getRating($id).';" id="ul_'.$id.'"></li>
<li><a onclick="return false;" href="#" title="1 star out of 5" class="one-star" >1</a></li>
<li><a onclick="return false;" href="#" title="2 stars out of 5" class="two-stars">2</a></li>
<li><a onclick="return false;" href="#" title="3 stars out of 5" class="three-stars">3</a></li>
<li><a onclick="return false;" href="#" title="4 stars out of 5" class="four-stars">4</a></li>
<li><a onclick="return false;" href="#" title="5 stars out of 5" class="five-stars">5</a></li>
</ul>
<div id="loading_'.$id.'"></div>';


} else {

if($show5 || $showPerc || $showVotes){

$text .= '<div class="rated_text">';

}
if($show5){
$show5bool = 'true';
$text .= 'تم التقييم <span id="outOfFive_'.$id.'" class="out5Class">'.outOfFive($id).'</span>/5';
} else {
$show5bool = 'false';
}
if($showPerc){
$showPercbool = 'true';
$text .= ' (<span id="percentage_'.$id.'" class="percentClass">'.getRating($id).'</span>)';
} else {
$showPercbool = 'false';
}
if($showVotes){
$showVotesbool = 'true';
$text .= ' (<span id="showvotes_'.$id.'" class="votesClass">'.getVotes($id).'</span>)';
} else {
$showVotesbool = 'false';
}

if($show5 || $showPerc || $showVotes){

$text .= '</div>';

}

return $text.'
<ul class="star-rating" id="rater_'.$id.'">
<li class="current-rating" style="width:'.getRating($id).';" id="ul_'.$id.'"></li>
<li><a onclick="rate(\'1\',\''.$id.'\','.$show5bool.','.$showPercb ool.','.$showVotesbool.'); return false;" href="includes/rating_process.php?id='.$id.'&rating=1" title="1 star out of 5" class="one-star" >1</a></li>
<li><a onclick="rate(\'2\',\''.$id.'\','.$show5bool.','.$showPercb ool.','.$showVotesbool.'); return false;" href="includes/rating_process.php?id='.$id.'&rating=2" title="2 stars out of 5" class="two-stars">2</a></li>
<li><a onclick="rate(\'3\',\''.$id.'\','.$show5bool.','.$showPercb ool.','.$showVotesbool.'); return false;" href="includes/rating_process.php?id='.$id.'&rating=3" title="3 stars out of 5" class="three-stars">3</a></li>
<li><a onclick="rate(\'4\',\''.$id.'\','.$show5bool.','.$showPercb ool.','.$showVotesbool.'); return false;" href="includes/rating_process.php?id='.$id.'&rating=4" title="4 stars out of 5" class="four-stars">4</a></li>
<li><a onclick="rate(\'5\',\''.$id.'\','.$show5bool.','.$showPercb ool.','.$showVotesbool.'); return false;" href="includes/rating_process.php?id='.$id.'&rating=5" title="5 stars out of 5" class="five-stars">5</a></li>
</ul>
<div id="loading_'.$id.'"></div>';

}
}
طبعاً إنتو شايفين
الدالة طويييييييلة جداً .
الملف الثالث : ملف عملية التقييم ..
rating_process.php
<?

header("Cache-Control: no-cache");
header("Pragma: nocache");

include("rating_config.php");
//إعدادات الكوكيز
$expire = time() + 99999999;
$domain = ($_SERVER['HTTP_HOST'] != 'localhost') ? $_SERVER['HTTP_HOST'] : false; // make cookies work with localhost

//دالة escape
function escape($val){

$val = trim($val);

if(get_magic_quotes_gpc()) {
$val = stripslashes($val);
}

return mysql_real_escape_string($val);

}

// IF JAVASCRIPT IS ENABLED

if($_POST){


$id = escape($_POST['id']);
$rating = (int) $_POST['rating'];

if($rating <= 5 && $rating >= 1){

if(@mysql_fetch_assoc(mysql_query("SELECT id FROM ratings WHERE IP = '".$_SERVER['REMOTE_ADDR']."' AND rating_id = '$id'")) || isset($_COOKIE['has_voted_'.$id])){

echo 'تم التقييم من قبل';

} else {


setcookie('has_voted_'.$id,$id,$expire,'/',$domain,false);
mysql_query("INSERT INTO ratings (rating_id,rating_num,IP) VALUES ('$id','$rating','".$_SERVER['REMOTE_ADDR']."')") or die(mysql_error());

$total = 0;
$rows = 0;

$sel = mysql_query("SELECT rating_num FROM ratings WHERE rating_id = '$id'");
while($data = mysql_fetch_assoc($sel)){

$total = $total + $data['rating_num'];
$rows++;
}

$perc = ($total/$rows) * 20;

echo round($perc,2);
//echo round($perc/5)*5;

}

}

}

//لو الجافا معطلة

if($_GET){

$id = escape($_GET['id']);
$rating = (int) $_GET['rating'];



if($rating <= 5 && $rating >= 1){

if(@mysql_fetch_assoc(mysql_query("SELECT id FROM ratings WHERE IP = '".$_SERVER['REMOTE_ADDR']."' AND rating_id = '$id'")) || isset($_COOKIE['has_voted_'.$id])){

echo 'تم التقييم من قبل';

} else {

setcookie('has_voted_'.$id,$id,$expire,'/',$domain,false);
mysql_query("INSERT INTO ratings (rating_id,rating_num,IP) VALUES ('$id','$rating','".$_SERVER['REMOTE_ADDR']."')") or die(mysql_error());

}

header("Location:".$_SERVER['HTTP_REFERER']."");
die;

}
else {

echo 'انت لا تستطيع التقييم اكثر من 5 او اقل من 1<a href="'.$_SERVER['HTTP_REFERER'].'">back</a>';

}



}

?>
تمام ..
عملنا إنكلود لملف الكونفج
والدوال مشروحة
واجزاء منها
كانت في الملف القديم ..
كدا ناقصنا ملف الجافا و الـ css
كود الـ css ..
.star-rating,
.star-rating a:hover,
.star-rating a:active,
.star-rating .current-rating{
background: url(../images/rating_star.gif) left -1000px repeat-x;
}
.star-rating{
position:relative;
width:125px;
height:25px;
overflow:hidden;
list-style:none;
margin:0;
padding:0;
background-position: left top;
}
.star-rating li{
display: inline;
}
.star-rating a,
.star-rating .current-rating{
position:absolute;
top:0;
left:0;
text-indent:-1000em;
height:25px;
line-height:25px;
outline:none;
overflow:hidden;
border: none;
}
.star-rating a:hover{
background-position: left bottom;
}
.star-rating a.one-star{
width:20%;
z-index:6;
}
.star-rating a.two-stars{
width:40%;
z-index:5;
}
.star-rating a.three-stars{
width:60%;
z-index:4;
}
.star-rating a.four-stars{
width:80%;
z-index:3;
}
.star-rating a.five-stars{
width:100%;
z-index:2;
}
.star-rating .current-rating{
z-index:1;
background-position: left center;
}

/* SECOND STAR (ALREADY VOTED */


.star-rating2,
.star-rating2 a:active,
.star-rating2 .current-rating{
background: url(../images/rating_star_2.gif) left -1000px repeat-x;
}
.star-rating2{
position:relative;
width:125px;
height:25px;
overflow:hidden;
list-style:none;
margin:0;
padding:0;
background-position: left top;
}
.star-rating2 li{
display: inline;
}
.star-rating2 a,
.star-rating2 .current-rating {
position:absolute;
top:0;
left:0;
text-indent:-1000em;
height:25px;
line-height:25px;
outline:none;
overflow:hidden;
border: none;
cursor:default;
}

.star-rating2 a.one-star{
width:20%;
z-index:6;
}
.star-rating2 a.two-stars{
width:40%;
z-index:5;
}
.star-rating2 a.three-stars{
width:60%;
z-index:4;
}
.star-rating2 a.four-stars{
width:80%;
z-index:3;
}
.star-rating2 a.five-stars{
width:100%;
z-index:2;
}
.star-rating2 .current-rating{
z-index:1;
background-position: left center;
}


/* END SECOND STAR */

/* for an inline rater */
.inline-rating{
display:-moz-inline-block;
display:-moz-inline-box;
display:inline-block;
vertical-align: middle;
}
.voted_twice {
background: #FFDDDD url(../images/rating_warning.gif) no-repeat 5px 50%;
padding:5px 5px 5px 16px;
text-align:center;
font-family:Verdana, Arial, Helvetica, sans-serif;
color:#333;
width:130px;
font-size:11px;
}
.voted {
background: #E7FFCE url(../images/rating_tick.gif) no-repeat 5px 50%;
padding:5px 5px 5px 16px;
text-align:center;
font-family:Verdana, Arial, Helvetica, sans-serif;
color:#333;
width:130px;
font-size:11px;
}
/* The text that displays the rating information */
.rated_text {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
margin-bottom:5px;
color:#666;
}
/* Green text that shows 3.34/5 */
.out5Class {
color:#00CC00;
font-weight:bold;
}
.percentClass {
/* Insert styles here for the percentage display. Example (74%) */
}
.votesClass {
/* Insert styles here for the votes display. Example (2 Votes) */
}
.topRatedList {
padding:0;
margin:0;
}
.topRatedList li {
list-style-type:none;
}

ملف الجافا :

if (document.images){
pic1 = new Image(220,19);
pic1.src = "images/rating_loading.gif";

pic2 = new Image(25,75);
pic2.src = "images/rating_star.gif";

pic3 = new Image(25,75);
pic3.src = "images/rating_star_2.gif";

pic4 = new Image(16,13);
pic4.src = "images/rating_tick.gif";

pic5 = new Image(14,14);
pic5.src = "images/rating_warning.gif";
}

// AJAX ----------------------------------------

var xmlHttp

function GetXmlHttpObject(){

var xmlHttp = null;

try {
// Firefox, Opera 8.0+, Safari
xmlHttp = new XMLHttpRequest();
}
catch (e) {
// Internet Explorer
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e){
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}

return xmlHttp;

}

// Calculate the rating
function rate(rating,id,show5,showPerc,showVotes){

xmlHttp = GetXmlHttpObject()

if(xmlHttp == null){
alert ("Your browser does not support AJAX!");
return;
}

xmlHttp.onreadystatechange = function(){

var loader = document.getElementById('loading_'+id);
var uldiv = document.getElementById('ul_'+id);

if (xmlHttp.readyState == 4){

//loader.style.display = 'none';
var res = xmlHttp.responseText;

//alert(res);

if(res == 'already_voted'){

loader.style.display = 'block';
loader.innerHTML = '<div class="voted_twice">لقد قمت بالتقييم من قبل !</div>';

} else {

loader.style.display = 'block';
loader.innerHTML = '<div class="voted">شكراً لتقييمك !</div>';

if(show5 == true){
var out = document.getElementById('outOfFive_'+id);
var calculate = res/20;
out.innerHTML = Math.round(calculate*100)/100; // 3.47;
//out.innerHTML = Math.round((calculate*2),0)/2; // 3.5;
}

if(showPerc == true){
var perc = document.getElementById('percentage_'+id);
//var newPerc = Math.round(Math.ceil(res/5))*5;
var newPerc = res;
perc.innerHTML = newPerc+'%';
}

else if(showPerc == false){
var newPerc = res;
}

if(showVotes == true){
var votediv = document.getElementById('showvotes_'+id).firstChil d.nodeValue;
var splitted = votediv.split(' ');
var newval = parseInt(splitted[0]) + 1;
if(newval == 1){
document.getElementById('showvotes_'+id).innerHTML = newval+' Vote';
} else {
document.getElementById('showvotes_'+id).innerHTML = newval+' Votes';
}
}

var ulRater = document.getElementById('rater_'+id);
ulRater.className = 'star-rating2';

var all_li = ulRater.getElementsByTagName('li');

// start at 1 because the first li isn't a star
for(var i=1;i<all_li.length;i++){

all_li[i].getElementsByTagName('a')[0].onclick = 'return false;';
all_li[i].getElementsByTagName('a')[0].setAttribute('href','#');

}

if(navigator.appName == 'Microsoft Internet Explorer'){
uldiv.style.setAttribute('width',newPerc+'%'); // IE
} else {
uldiv.setAttribute('style','width:'+newPerc+'%'); // Everyone else
}

}
} else {
loader.innerHTML = '<img src="images/rating_loading.gif" alt="loading" />';
}

}
var url = "includes/rating_process.php";
var params = "id="+id+"&rating="+rating;
xmlHttp.open("POST",url,true);
xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlHttp.setRequestHeader("Content-length", params.length);
xmlHttp.setRequestHeader("Connection", "close");
xmlHttp.send(params);

} مثال بسيط :
$rate = pullRating('1',true,true,true);بإمكانك تغيير '1' إلى $_GET['id'] ..
ثم الإظهار :
print $rate;او في سمارتي :
$smarty->assign('rate',$rate);في القالب :
{$rate}تماااام ..
تطوير :
دالة إحضار اكثر المواضيع - الدروس - اي حاجة تقييماً

function getTopRated($limit, $table, $idfield, $namefield){

$result = '';

$sql = "SELECT COUNT(ratings.id) as rates,ratings.rating_id,".$table.".".$namefield." as thenamefield,ROUND(AVG(ratings.rating_num),2) as rating
FROM ratings,".$table." WHERE ".$table.".".$idfield." = ratings.rating_id GROUP BY rating_id
ORDER BY rates DESC,rating DESC LIMIT ".$limit."";

$sel = mysql_query($sql);

$result .= '<ul class="topRatedList">'."\n";

while($data = @mysql_fetch_assoc($sel)){
$result .= '<li>'.$data['thenamefield'].' ('.$data['rating'].')</li>'."\n";
}

$result .= '</ul>'."\n";

return $result;

}استخدامها :
getTopRated($limit, $table, $idfield, $namefield);مثال :
getTopRated('10', 'news', 'id', 'title');$limit : الكمية ..
$table : اسم الجدول .
$idfield : اسم خلية الرقم التسلسلي .
$namefield : اسم خلية عنوان المقال - الخبر .. إلخ
صور النجوم ومستلزمات التقييم بالمرفقات
اي استفسار موجود
أي سؤال او استفسار اوتطوير ..
انا موجود
سلام عليكم

خ ــادم الإسلام
14-02-2010, 11:07 صباحاً
شرح متعوب عليه الله يحفظك

إيهاب عصام
14-02-2010, 11:25 صباحاً
شرح متعوب عليه الله يحفظك
ويحفظك غلاي

ήsέť άήsάќ
11-04-2010, 03:31 مساءً
الله يعطيك العافية ,

ما قصرت :)