Première fois que j'utilise le forum. J'ai vérifié avant de poster, à ne pas faire de doublon et je ne crois pas que ce soit le cas, donc veuillez m'excuser si je me trompe
J'ai pour projet de réaliser un chat instantané type "Facebook".
J'ai donc actuellement une barre à droite de l'écran qui affiche les utilisateurs connectés et qui se rafraichit automatiquement tous les 5s. Jusque la, je ne pense pas avoir de problème.
Je souhaite ouvrir une nouvelle fenêtre de chat à chaque clic sur un utilisateur (en gardant la précédente ouverte). J'ai donc dans un premier temps, créé cette fenêtre en permanence affichée sur ma page principale, grâce à laquelle j'envoie des messages et qui change de destinataire à chaque clic sur un visiteur.
Voila mon problème actuel : Maintenant, j'aimerais n'avoir que la liste des utilisateurs en arrivant sur le chat. j'ai donc viré la partie "discussion" qui correspond finalement au différentes fenêtres, pour la mettre dans un fichier conversation.php.
Plus que novice et JQuery, j'ai donc essayé de faire en sorte que lorsque je clique sur un utilisateur, j'utilise la fonction .load(conversation.php) pour afficher la fenêtre. Apparemment cela fonctionne. En revanche ça ne doit pas être la bonne solution pour réaliser ce chat. Je rencontre 3 problèmes :
Tout d'abord : lors du clic sur l'utilisateur pour correspondre avec lui, je suis censé enregistrer son id via une variable GET. Sauf que ceci ne marche pas lorsque je place un id (pour détecter le clic et ouvrir la fenêtre de chat) et la balise href (pour enregistrer le nom), sur le même élément. Il semblerait qu'une seule des deux ne soit pris en compte. Avez vous des solutions pour cette partie la ?
Le deuxième problème rencontré concerne le chat : lorsque ma fenêtre apparait, je ne peux plus envoyer de messages. En effet, j'utilise un formulaire classique pour envoyer les messages, mais lorsque je clique sur le bouton "envoyer", la fenêtre se ferme et le message n'est pas envoyé. 5je ne sais pas si c'est très clair ce charabia). Pouvez-vous m'éclairer sur ce point également ?
Enfin, le dernier soucis majeur : pour ouvrir une fenêtre ça se passe presque bien. Mais quand il sagit d'en ouvrir une seconde, rien ne se passe... Comment pourrais-je faire ?
Voici la, le code (très moche et pas optimisé) actuellement réalisé.
chat.php (page principale du chat avec la liste des utilisateurs connectés)
<?php
session_start();
include('connexionbdd.php'); //connexion à la base de données
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF8"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
<link href="https://fonts.googleapis.com/css?family=Quicksand" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="style.css">
<title>Chat</title>
</head>
<body>
<?php
$res = $bdd->query('SELECT COUNT(*) AS nb FROM utilisateur'); //on compte le nombre d'utilisateurs connectés
$data = $res->fetch();
$nb = $data['nb']; //on affecte cette valeur à une variable, pour pouvoir l'afficher dans l'entête de la liste des utilisateurs connectés
?>
<div class="conteneur_utilisateurs"> <!-- on met en place un conteneur à droite, de la hauteur de l'écran, pour afficher les utilisateurs connectés -->
<div class="nb_utilisateurs">Utilisateurs en ligne (<?php echo $nb;?>)</div>
<div id="utilisateurs"> <!-- le conteneur est rafraichit toutes les 5s-->
<?php
$utilisateurs = $bdd->query('SELECT * FROM utilisateur WHERE utilisateur != "'.$_SESSION['id_utilisateur'].'"'); //on sélectionne tous les utilisateurs
while($liste_utilisateurs = $utilisateurs->fetch()) //on affiche la liste des utilisateurs connectés
{
?>
<a id="nouveau" href="?interlocuteur=<?php echo $liste_utilisateurs['utilisateur'];?> "><div class="liste_utilisateurs">
Visiteur <?php echo $liste_utilisateurs['utilisateur'];?>
</div></a>
<?php
}
if(isset($_GET['interlocuteur']))
{
$_SESSION['interlocuteur'] = $_GET['interlocuteur']; //on attribue le nom de l'utilisateur cliqué, à la variable "interlocuteur"
}
?>
</div>
</div> <!-- fin de la liste des utilisateurs -->
<div id="conteneur_conv"></div>
<script type="text/javascript">
//on rafraîchit la liste des utilisateurs connectés toutes les 5s
var auto_refreshvisiteur = setInterval(function (){
$('#utilisateurs').load('chat.php #utilisateurs').fadeIn("slow");
}, 5000);
function afficheConversation() {
$('#conteneur_conv').load('conversation.php'); //on insère une nouvelle fenêtre de chat
}
$('#nouveau').live("click", function() {
afficheConversation();
return false;
});
</script>
</body>
</html>
Puis voila ma page conversation.php (censée s'occuper des fenêtres de chat)
<?php
session_start();
include('connexionbdd.php'); //connexion à la base de données
echo 'id interlocuteur'; echo $_SESSION['interlocuteur'];
?>
<div id="conteneurmsg" class="conteneur">
<div class="entete">
Visiteur <?php echo $_SESSION['interlocuteur'];?> <button id="fermer">Fermer</button><button id="reduire">Réduire</button>
</div>
<div id="conv"class="conversation">
<div class="messages">
<?php
$messages = $bdd->query('SELECT * FROM messagerie WHERE (emetteur ="'.$_SESSION['id_utilisateur'].'" AND recepteur = "'.$_SESSION['interlocuteur'].'")
OR (emetteur ="'.$_SESSION['interlocuteur'].'" AND recepteur = "'.$_SESSION['id_utilisateur'].'") ORDER BY datetime DESC LIMIT 20'); //on récupère les 10 derniers messages échangés entre les 2 uilisateurs
while($messages_echanges = $messages->fetch())
{
if($messages_echanges['emetteur'] == $_SESSION['id_utilisateur'])
{
?>
<div class="emis"><?php echo $messages_echanges['message']; ?></div><br>
<?php
}
elseif($messages_echanges['recepteur'] == $_SESSION['interlocuteur'])
{
?>
<div class="recu"><?php echo $messages_echanges['message']; ?></div><br>
<?php
}
}
?>
</div>
</div>
<div class="ecrire">
<form method="post">
<input class="saisie" type="text" name="nouveau_message" placeholder="Message..."/>
<input id="submit" class="hidden" type="submit" name="envoyer" value="Envoyer"/>
</form>
</div>
</div>
<?php
if(isset($_POST['envoyer']))
{
if(!empty($_POST['nouveau_message']))
$bdd->query('INSERT INTO messagerie VALUES(NULL, "'.$_SESSION['id_utilisateur'].'", "'.$_SESSION['interlocuteur'].'", "'.htmlspecialchars($_POST['nouveau_message']).'", "0", NOW())');
}
?>
<script type="text/javascript">
//on rafraîchit la conversation toutes les 100ms
var auto_refresh = setInterval(function (){
$('#conv').load('chat.php #conv').fadeIn("slow");
}, 100);
//réduire la fenêtre
$("#reduire").toggle(function(){
$("#conteneurmsg").css("height", "23px");
},function(){
$("#conteneurmsg").css("height", "400px");
});
//fermer la fenêtre
$("#fermer").toggle(function(){
$("#conteneurmsg").css("visibility", "hidden", "position", "absolute"); //on cache le div
},function(){
$("#conteneurmsg").css("visibility", "visible", "position", "static"); //on l'affiche et on lui rend sa position par défaut
});
$(function() { // ready
$("form").on("submit", function(e) { // on écoute
return false; // on stop le formulaire pour qu'il n'actualise pas la page
});
});
</script>
Merci à ceux qui voudront m'aider, j'ai essayé d'être le plus clair possible. Ne m'en voulez pas si je fais un doublons ou si je ne poste pas dans la bonne catégorie du forum, je ne crois pas que ce soit le cas mais sinon, pouvez-vous rediriger mon sujet ?
Merci, bon weekend !
- Edité par PierreMathelin 4 février 2017 à 16:39:50
Chat like Facebook
× 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.
