Vous vous apprêtez à lire un tutoriel rédigé par un membre de ce site. Malgré tout le soin que ce membre a pu apporter au tutoriel, nous ne pouvons pas garantir que les informations contenues sur cette page sont exactes à 100%. Merci de garder cela en tête lorsque vous lirez cette page ;o)
Voici de quoi faire un système de notation de cours, de téléchargement, de vidéo, de récit... J'ai choisi
vidéo pour l'exemple, mais vous pourrez facilement l'adapter à autre chose.
Code à placer dans la balise head
Le script suivant permettra de colorer les étoiles quand le pointeur passe au dessus :
Code : JavaScript 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29 | <script type="text/javascript">
<!--
var etoile=new Image();
etoile.src="site_image/etoile.gif";
function ov(url,id)
{
for(i=1;i<=id;i++)
{
document.getElementById(url+i).src=etoile.src;
}
document.getElementById('count'+url).innerHTML=nombre;
return true;
}
function out(url)
{
document.getElementById('count'+url).innerHTML='0';
for(i=1;i<=5;i++)
{
document.getElementById(id+i).src="site_image/etoileb.gif";
}
return true;
}
function vote(url, id)
{
window.location.href="?page=4111&vote="+url+"¬e="+id;
return true;
}
-->
</script>
|
Code au niveau de la vidéo PHP + HTML
Code : PHP 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35 | <?php
/* Code pour chaque vidéo */
$url="video/super_drole.wmv";
echo '<embed type="application/x-mplayer2" width="512px" height="384px" autostart="1" showcontrols="1" src="'.$url.'" /><br />
Note des visiteurs : ';
$note=array(); $total=array();
$note[$lettre]=0;
$total[$lettre]=0;
for($i=1;$i<=5;$i++)
{
$valeur=$ini_ob->m_valeur($url,$i);
$note[$lettre]+=($i*$valeur);
$total[$lettre]+=$valeur;
}
if($total[$lettre]==0)
{
echo 'Aucune note';
}
else
{
// On arrondit la note sur 10 (en 10 demi-étoiles)
$dix=round($note[$lettre]*2/$total[$lettre]);
for($k=1;$k<=5;$k++)
{
if($k*2<=$dix)
echo '<img src="site_image/etoile_jaune.gif" />';
elseif($k*2-1<=$dix)
echo '<img src="site_image/etoile_demi.gif" />';
else
echo '<img src="site_image/etoile_blanche.gif" />';
}
echo ' '.($dix/2);
// Les images sont en dessous si vous ne voulez pas faire les vôtres
}
?>
|
Code : HTML1 | Votre note : <span onmouseout="javascript:out('<? echo $url; ?>');" style="cursor:pointer;"><img onclick="javascript:vote('<? echo $url; ?>',1);" id="<? echo $url; ?>1" src="site_image/etoileb.gif" onmouseover="javascript:ov('<? echo $url; ?>',1);" /><img onclick="javascript:vote('<? echo $url; ?>',2);" id="<? echo $url; ?>2" src="site_image/etoileb.gif" onmouseover="javascript:ov('<? echo $url; ?>',2);" /><img onclick="javascript:vote('<? echo $url; ?>',3);" id="<? echo $url; ?>3" src="site_image/etoileb.gif" onmouseover="javascript:ov('<? echo $url; ?>',3);" /><img onclick="javascript:vote('<? echo $url; ?>',4);" id="<? echo $url; ?>4" src="site_image/etoileb.gif" onmouseover="javascript:ov('<? echo $url; ?>',4);" /><img onclick="javascript:vote('<? echo $url; ?>',5);" id="<? echo $url; ?>5" src="site_image/etoileb.gif" onmouseover="javascript:ov('<? echo $url; ?>',5);" /></span> <span id="count<? echo $url; ?>">0</span>
|
Code à mettre tout au début de la page
Code : PHP 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22 | <?php
require "require/class.ini.php";
$ini_ob=new ini();
$ini_ob->m_fichier('site_image/cours.ini');
if(!isset($_SESSION['identifiant'])) $_SESSION['identifiant']=rand(11111,99999);
if(isset($_GET['vote']))
{
$note=round(min(5,max(1,$_GET['note']))); // Dans une variable get, il peut y avoir n'importe quoi ; donc on arrondit (bloquer les nombres décimaux) et on limite entre 1 et 5. Donc, si $note est différent de $_GET['note'], c'est qu'il y avait une valeur non comptant dans $_GET['note'].
if($note==$_GET['note']false===$ini_ob->m_valeur($_SESSION['identifiant'],$_GET['vote']))
{
$ini_ob->m_groupe($_GET['vote']);
$ini_ob->m_item($note);
$ini_ob->m_put($ini_ob->valeur+1);
$ini_ob->m_groupe($_SESSION['identifiant']);
$ini_ob->m_item($_GET['vote']);
$ini_ob->m_put($note);
$ini_ob->save();
echo 'Note enregistrée : '.$note.'<br />';
}
}
?>
|
Si par exemple vous avez des news que l'on peut différencier grâce à un index (numéro qui s'incrémente à chaque nouvelle news), voici comment procéder :
D'abord, rappelons-le dans le langage .ini, une ligne = une instruction ; alors comment faire rentrer un textarea multi-lignes dans une valeur item-groupe ?
Avec deux fonctions :
nl2br() et
preg_replace().
Code : PHP1
2
3
4 | <?php
$com=nl2br($_POST['commentaire']); /* On met une balise <br /> à chaque nouvelle ligne */
$com=preg_replace('#\n#','',$com); /* On supprime toutes les entrées à la ligne */
?>
|
Code complet
Code : PHP 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19 | <?php
/* Ici on affiche la news */
$id_news=3; // à remplacer par l'index de la news
$obj_ini=new ini();
$obj_ini->m_fichier("commentaires.ini");
if(isset($_POST['commentaire']))
{
$com=preg_replace('#\n#','',nl2br(htmlspecialchars($_POST['commentaire'])));
$obj_ini->m_put($com,time(),$id_news);
$obj_ini->save();
}
// Puis on affiche les commentaires
foreach($obj_ini->array_groupe($id_news) as $time=>$commentaire)
{
echo '<hr />'; // On met un autre signe de séparation
echo 'Message posté le '.date('d/m/Y à H:i',$time).'<br />
'.$commentaire;
}
?>
|
Placez le formulaire à la suite :
Code : HTML1
2
3
4 | <form method="post" action="">
<label>Poster un commentaire : <br />
<textarea rows="4" cols="60" name="commentaire"></textarea></label>
</form>
|
Toutefois, quand vous aurez plus de données à insérer (pseudo, un index des commentaires, un titre...), je vous conseille d'utiliser la méthode suivante :
- pour insérer :
Code : PHP1 | <?php $obj_ini->m_put(time().'##'.$pseudo.'##'.$titre.'##'.$com,$id_com,$id_news); ?>
|
- et pour extraire :
Code : PHP1
2
3
4 | <?php
list($time,$pseudo,$titre,$commentaire)=explode('##',$commentaire,4);
/* Le 4 correspond au nombre de variables dans list(), il faut le mettre sinon lorsqu'un utilisateur mettra ## dans son commentaire, la fin du commentaire manquera.*/
?>
|
Voilà une petite liste non exhaustive de ce que vous pouvez encore faire avec l'objet
ini :
- système de news complet,
- avatars pour les membres,
- tableau de scores pour un jeu en ligne,
- galerie d'images,
- tribune libre,
- livre d'or.
Vous aurez, j'en suis sûr, bien assez d'idées pour utiliser le nouvel outil que vous détenez maintenant !
À nouveau, pas besoin de Q.C.M pour ce chapitre. Si vous avez d'autres idées pour améliorer la class
ini (d'autres méthodes à ajouter ou des variables complémentaires), postez un commentaire !