Partage
  • Partager sur Facebook
  • Partager sur Twitter

Amélioration minichat (Tp m@teo)

Sujet résolu
Yarin
    13 décembre 2010 à 20:57:49

    Bonjour, j'ai un minichat et je souhaiterai l'améliorer en faisant rafraichir la page toute seule lorsquil y a un nouveau message.Je n'ai quas-aucune connaissances en javascript, quelqun aurait-il un code qui permettrait de faire cele?

    Page formulaire:
    <!DOCTYPE html PUBLIC"_//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml111/DTD/xhtml11.dtd">
<html  xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head >	
<script>
function ajoute_smiley(monSmile)
{
    document.getElementById('message').value += monSmile;
}
var page = 0;
document.getElementById('lien_autres_smilies').onclick = function(){
   smilies = document.getElementById('smilies');
   smilies.getElementsTagName[page].style.display = 'none';
   page = page==0 ? 1 : 0;
   smilies.getElementsTagName[page].style.display = 'inline';
}

</script>

<script type="text/javascript">
<!--
var page = 0;
document.getElementById('lien_autres_smilies').onclick = function(){
   smilies = document.getElementById('smilies');
   smilies.getElementsTagName[page].style.display = 'none';
   page = page==0 ? 1 : 0;
   smilies.getElementsTagName[page].style.display = 'inline';
}




sfHover = function() {
        var sfEls = document.getElementById("menu").getElementsByTagName("LI");
        for (var i=0; i<sfEls.length; i++) {
                sfEls[i].onmouseover=function() {
                        this.className+=" sfhover";
                }
                sfEls[i].onmouseout=function() {
                        this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
                }
        }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

-->

</script>


<title >Le site du 31, mini chat. </title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<link rel="stylesheet" media="screen" type="text/css" title="cssindex" href="CSSi.css"/>

</head>

<body >
<div id="corps">


						
<a href="index.php">Accueil</a> > <a href="accins.php"> Accueil des privilèges des inscrits </a> >Mini chat
<h1 >Mini Chat</h1><center>

<h4>Membres connectés sur le mini chat:     <?php
$requete4 = mysql_query("SELECT membre_pseudo, membre_id FROM forum_membres ORDER BY membre_id DESC LIMIT 0, 1000000");
$data4 = mysql_fetch_assoc($requete4);

if(isset($_SESSION['pseudo']))
{
        $dnns = mysql_fetch_array(mysql_query('select count(pseudo) as nb from cpt_connectes2 where pseudo="'.$_SESSION['pseudo'].'"'));
        if($dnns['nb']>0)
        {
                mysql_query('update cpt_connectes2 set timestamp="'.time().'" where pseudo="'.$_SESSION['pseudo'].'"');
        }
        else
        {
                mysql_query('insert into cpt_connectes2 (pseudo, timestamp) values ("'.$_SESSION['pseudo'].'", "'.time().'")');
        }
}
$timestamp_5min = time() - (60 * 5); // 60 * 5 = nombre de secondes écoulées en 5 minutes
mysql_query('DELETE FROM cpt_connectes2 WHERE timestamp < ' . $timestamp_5min);
$dnns2 = mysql_query('select mem.membre_pseudo, mem.membre_id FROM forum_membres AS mem JOIN cpt_connectes2 AS cpt ON mem.membre_pseudo = cpt.pseudo') or exit(mysql_error());

$num = mysql_num_rows($dnns2);


if($num > 0)
{
        echo '';
        $i=0;
        while($dn2 = mysql_fetch_array($dnns2))
        {
                $i++;
                echo '<a href="./voirprofil.php?m='.$dn2['membre_id'].'&amp;action=consulter">'.$dn2['membre_pseudo'].'</a>';
				echo',';
                if($i<$num)
                {
                        echo '';
                }
        }
}
echo '';
?></h4></center>

   

<p>
 
	
	
<form id="ancremini" method="POST" action="minichatpost.php" name="Formulaire"> 
<center>
 
<table class="rouge" bgcolor="#eeeeee" width="370">
<tr>
<td width="100">Pseudo: <INPUT  type="hidden" name="pseudo"  <?php echo "value='".$_SESSION['pseudo']."'";?> /><INPUT  type="text" name="pseudo2" disabled="disabled" size="20"<?php echo "value='".$_SESSION['pseudo']."'";?> /></td>
 

</tr>
<tr>
<td colspan="2" align="center"><TEXTAREA name="message" id="message" rows=5 COLS=45></TEXTAREA></td>
</tr>
<tr><td colspan="2">
 <select name="couleur"><br /><br />
<option value='#000000' <?php if(isset($_POST['couleur']) AND $_POST['couleur']=="#000000"){echo "selected";}?> >Couleur</option>
		<option value='#000000' <?php if(isset($_POST['couleur']) AND $_POST['couleur']=="#000000"){echo "selected";}?>>Noir</option>
		<option class="rouge" value='#FF0000' <?php if(isset($_POST['couleur']) AND $_POST['couleur']=="#FF0000"){echo "selected";}?>>Rouge</option>
		<option class="orange" value='#FF6600' <?php if(isset($_POST['couleur']) AND $_POST['couleur']=="#FF6600"){echo "selected";}?>>Orange</option>
		<option class="jaune" value='#FFCC00' <?php if(isset($_POST['couleur']) AND $_POST['couleur']=="#FFCC00"){echo "selected";}?>>Jaune</option>
		<option class="vert" value='#008000' <?php if(isset($_POST['couleur']) AND $_POST['couleur']=="#008000"){echo "selected";}?>>Vert</option>
		<option class="bleumarine" value='#0000FF' <?php if(isset($_POST['couleur']) AND $_POST['couleur']=="#0000FF"){echo "selected";}?>>Bleu marine</option>
		<option class="bleufonce" value='#000080' <?php if(isset($_POST['couleur']) AND $_POST['couleur']=="#000080"){echo "selected";}?>>Bleu foncé</option>
		<option class="violet" value='#8000FF' <?php if(isset($_POST['couleur']) AND $_POST['couleur']=="#8000FF"){echo "selected";}?>>Violet</option>
		<option class="rose" value='#FF99CC' <?php if(isset($_POST['couleur']) AND $_POST['couleur']=="#FF99CC"){echo "selected";}?>>Rose</option>
		
	</select>
	<select name="police"><br /><br />
<option value='Times New Roman' <?php if(isset($_POST['police']) AND $_POST['police']=="#000000"){echo "selected";}?> >Police d'écriture</option>
		<option class="times"value='Times New Roman' <?php if(isset($_POST['police']) AND $_POST['police']=="Times New Roman"){echo "selected";}?>>Times New Roman</option>
		<option class="arial" value='Arial' <?php if(isset($_POST['police']) AND $_POST['police']=="Arial"){echo "selected";}?>>Arial</option>
		<option class="pristina" value='Pristina' <?php if(isset($_POST['police']) AND $_POST['police']=="Pristina"){echo "selected";}?>>Pristina</option>
		<option class="lucidahand" value='Lucida Handwriting' <?php if(isset($_POST['police']) AND $_POST['police']=="Lucida Handwriting"){echo "selected";}?>>Lucida Handwriting</option>

	
	</p>
	</select>



 </td>
</tr><tr><td colspan="2">
<input type="submit"  name="envoyer" value="Envoyer"> <a href="minichat.php" >Actualiser</a>





</td>
</tr>
</table>
</center>
</form> 
 


	<br/ >	<br/ >
	<br/ >
 

<?php
			$req = mysql_query("SELECT * FROM minichat ORDER BY ID DESC LIMIT 0, 10");?><?php
			while ($donnees = mysql_fetch_array($req))
			{
			?>
			<div>



			<?php
			
			/*
			<div><em>le  echo ''.date('d/m/Y à H\hi'). '';  </em></div>*/?>
			 

			    <span><!--<tr><td colspan="2">-->
			<div style=" color: #444488; font-family: Arial; font-weight: bold; text-decoration: underline; font-size: 13.5px;">
			    <?php
			    echo $donnees['pseudo'];
				?> (Le  <?php
			    echo $donnees['date'];
				?>) :</div> 
				</span>
				<FONT color="<?php echo $donnees['couleur'];?>" face="<?php echo $donnees['police'];?>">
				<span>
			    
				<?php echo remplace_smiley($donnees['message']); ?>
				</span>
				</FONT><!--
</td></tr>-->

	<br/ >

</div>

<?php					
			}
?>

<br />
<br /><br />

</div>




         

<?php

mysql_close ($conn); 
?>


    Page de traitement:
    <?php
if  (!Empty($_POST['pseudo']) AND !Empty($_POST['message']))
{
	$pseudo = mysql_real_escape_string(htmlspecialchars($_POST["pseudo"]));
	$message = mysql_real_escape_string(htmlspecialchars($_POST["message"]));
	$couleur = mysql_real_escape_string(htmlspecialchars($_POST["couleur"]));
	$police = mysql_real_escape_string(htmlspecialchars($_POST["police"]));
	$message = nl2br($message);
	

	
	$req = "select * from minichat";
	$res = mysql_query($req) OR DIE ("Erreur lors de l'interrogation : ".mysql_error());	//lance la requete
	

		$resultat = mysql_query("INSERT INTO minichat(pseudo, message, couleur, police, date) VALUES('$pseudo', '$message', '$couleur', '$police', NOW())");
	
// Effectuer ici la requête qui insère le message
// Puis rediriger vers minichat.php comme ceci :
header('Location: minichat.php#ancremini');
?>

    Merci d'avance
    • Partager sur Facebook
    • Partager sur Twitter
    xavierm02
    • Javascript
      13 décembre 2010 à 23:47:17

      Le faire quand il y a un nouveau message, c'est dur...
      Par contre, tu peux le faire s'actualiser toutes les minutes... ou toutes les 5 secondes.
      Tu peux faire ça avec des headers HTTP envoyés par PHP.
      • Partager sur Facebook
      • Partager sur Twitter
      Natsu Nakatomi
        14 décembre 2010 à 0:14:04

        Avant tout désoler de donné mon code dans sont intégralité mais je ne sait comment expliqué cela sans donné de code.
        </span></span>
        C'est marrant je vient justement de finir cette amélioration :) étant un passionné de PHP depuis maintenant 3 ans, je vient juste d'apprendre la connexion avec PDO et j'en ai profité pour amélioré le TP. Ce n'est pas grand chose mais j'ai 2 page, index et envoie l'index charge le formulaire et envoie ajoute un message et liste les messages.

        Dans l'index j'ai mis un petit Iframe et une petite fonction en JavaScript assez maline ;) Si tu veut changé le temps de rechargement automatique (désactivable par l'utilisateur) tu a juste a changé la valeur du setTimeout :) Le rechargement de la page est invisible, a par pour les très très très petite connexion ^^

        Index.php
        <script>
function refresh(){
	if(document.getElementById('Case').checked == true){
		setTimeout(refresh,3000);
		document.getElementById('iframe').src = 'envoie.php';
		}
	}
</script>
<body onLoad="refresh();">
<center><form action="envoie.php" method="post">
	Pseudo : <input type="text" name="pseudo" /><br />
	Message : <input type="text" name="message" /><br />
	<input type="submit" /><input type="button" value="Rafraichir" onClick="document.getElementById('iframe').src = 'envoie.php';"/><br /><br />		
	<input type="checkbox" id="Case" onClick="refresh();" checked />Rafraichisement automatique ?</form></center>
<center><iframe src="./envoie.php" frameborder="0" id="iframe" scrolling="no" width="100%" height="100%"></iframe></center>


        Envoie.php
        <?php
try{
	$pdo_options[PDO::ATTR_ERRMODE] = PDO::ERRMODE_EXCEPTION;
	$bdd = new PDO('mysql:host=localhost;dbname=test', 'root', '', $pdo_options);
	$req = $bdd->query('SELECT * FROM chat ORDER BY id DESC');
	if(!empty($_POST['pseudo']) && !empty($_POST['message'])){
		$com = $bdd->prepare('INSERT INTO chat (pseudo, message) VALUES (:pseudo, :message)');
		$com->execute(array(
				'pseudo' => $_POST['pseudo'],
				'message' => $_POST['message']));
		header('Location:index.php');
	}
	while($donnees = $req->fetch()){ ?>
		<center><p><strong style="color:Green;"><?php echo stripslashes($donnees['pseudo']); ?></strong> : <em><?php echo stripslashes($donnees['message']); ?></em><br /></p></center>
	<?php		
	}
}
catch (Exception $e){
	die('Erreur : ' . $e->getMessage());
}
?>


        En espérant que cela t'a aidé :) Si tu veut absolument faire rechargé la page a chaque nouveaux messages tu doit utilisé l'ajax mais la je ne peut pas t'aidé
        • Partager sur Facebook
        • Partager sur Twitter
        Golmote
        • Javascript
        Natsu Nakatomi
          14 décembre 2010 à 12:15:56

          Je comprend pas ce que tu veut dire, hors mis que j'ai pas mis <head> et tout le reste ^^
          • Partager sur Facebook
          • Partager sur Twitter
          Golmote
          • Javascript
          Natsu Nakatomi
            14 décembre 2010 à 13:03:38

            Non il ni avais pas besoin mais sur le coup je n'avais pas compris c'est seulement après relecture que j'ai compris ^^
            Je vient de le corrigé
            • Partager sur Facebook
            • Partager sur Twitter
            Golmote
            • Javascript
            Yarin

            Amélioration minichat (Tp m@teo)

            × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
            × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
            • Editeur ●
            • Markdown