FIX petites corrections concernant les messages auquels l'utilisateur veut répondre
[euphorik.git] / js / pageMinichat.js
index 67354cf..8586bb5 100755 (executable)
@@ -34,17 +34,18 @@ function PageMinichat(client, formateur, util)
 
 PageMinichat.prototype.contenu = function()
 {
+   // le fait que tout soit collé est fait exprès, permet d'éviter d'avoir des espaces supplémentaires entre les spans'
    return '\
 <div id="trollCourant">Troll de la semaine : <span class="troll"></span></div>\
 <form method="post" action="" id ="posterMessage">\
-   <p>\
-      <input class="captcha" name="captcha" type="text" size="8" maxlength="8"></input>\
-      <input class="pseudo" name="pseudo" type="text" maxlength="50" value="' + encodeURI(conf.nickDefaut) + '"></input>\
-      <div id="repondA">0<div class="messages"></div></div>\
-      <input class="message" name="message" type="text" maxlength="500" value=""></input>\
-      <button class="smiles"></button>\
-      <button class="return"></button>\
-   </p>\
+<p>\
+<input class="captcha" name="captcha" type="text" size="8" maxlength="8"></input>\
+<input class="pseudo" name="pseudo" type="text" maxlength="50" value="' + encodeURI(conf.nickDefaut) + '"></input>\
+<span id="repondA"><span class="nb">0</span><span class="messages"></span></span>\
+<input class="message" name="message" type="text" maxlength="500" value=""></input>\
+<button class="smiles"></button>\
+<button class="return"></button>\
+</p>\
 </form>\
 <div id="conversations"></div>'
 }
@@ -81,6 +82,13 @@ PageMinichat.prototype.charger = function()
    }
    
    this.util.infoBulle("Ouvrir la conversation liée au troll de la semaine", $("#trollCourant .troll")) 
+   
+    this.util.infoBulle("Cliquer sur les messages pour les enlevers de la liste",
+      $("form#posterMessage #repondA").hover(
+         function() { thisPage.util.afficherBoite($(".messages", this), $(this), positionTypeX.centre, positionTypeY.bas) },
+         function() { $(".messages", this).hide() }
+      )
+   )
 
    // <smiles>
    $("body").append('<div id="smiles"></div>')
@@ -211,7 +219,6 @@ PageMinichat.prototype.envoyerMessage = function(pseudo, message)
    }
    this.envoieMessageEnCours = true
    
-   ;; dumpObj(this.getJSONMessage(pseudo, message))
    jQuery.ajax(
       {
          url : "request", 
@@ -224,25 +231,23 @@ PageMinichat.prototype.envoyerMessage = function(pseudo, message)
             xmlHttpRequest.setRequestHeader("X-Requested-With", "")
          },
          success : function(data, textStatus)
-         {
-            ;; dumpObj(data)
-         
+         {         
             if(data["reply"] == "ok")
-            {  
-               $("form input.message").val("")
-               thisPageMinichat.messages.enleverMessagesRepond()
-                        
+            {           
                // met à jour la classe des messages auquel repond celui ci (c'est un peu de la triche) TODO : ya mieux ?
-               for (var i = 0; i < repondA.length; i++)
+               for (var messId in thisPageMinichat.messages.messagesRepond)
                {
                   for (var j = 0; j < thisPageMinichat.messages.conversations.length; j++)
                   {
-                     var mess = thisPageMinichat.messages.conversations[j].messagesParId[repondA[i]]
+                     var mess = thisPageMinichat.messages.conversations[j].messagesParId[messId]
                      if (mess != undefined)
                         mess.clientARepondu = true
                   }
-                  $("#conversations div#mess" + repondA[i].toString(36)).addClass("repondu")
+                  $("#conversations div#" + thisPageMinichat.messages.messagesRepond[messId].getId()).addClass("repondu")
                }
+               
+               $("form input.message").val("")
+               thisPageMinichat.messages.enleverMessagesRepond()
             }
             else if (data["reply"] == "error")
             {
@@ -304,9 +309,16 @@ function Message(client, formateur, id, auteurId, racineId, date, pseudo, login,
    this.repondA = {} // un ensemble de reponse (voir Reponse) indexé par l'id du message de la reponses
 }
 
-Message.prototype.getId = function()
+/**
+  * @param pre est un prefix permettant de créer un Id différent pour deux mêmes messages.
+  *   Cela est utile pour afficher plusieurs mêmes messages au sein d'un document XHTML.
+  *   voir également la fonction 'XHTML()'.
+  */
+Message.prototype.getId = function(pre)
 {
-   return "mess" + this.id.toString(36)
+   if (pre == undefined)
+      pre = ""
+   return pre + "mess" + this.id.toString(36)
 }
 
 /**
@@ -345,7 +357,7 @@ Message.prototype.getConversation = function(messages)
    // recherche les réponses (O(n))
    for (var i = 0; i < messages.messages.length; i++)
       if (messages.messages[i].repondA.hasOwnProperty(this.id))
-         messagesEnEvidence[messages.messages[i].id] = messages.messages[i].auteurId == this.auteurId ? 1 : 2
+         messagesEnEvidence[messages.messages[i].id] = 2
    
    var premierNiveau = true
    var f = function(tabIds)
@@ -355,7 +367,7 @@ Message.prototype.getConversation = function(messages)
          var message = messages.messagesParId[id]
          if (message != undefined)
          {         
-            messagesEnEvidence[id] = message.auteurId == thisMessage.auteurId ? 1 : ( premierNiveau ? 3 : 0 )
+            messagesEnEvidence[id] = premierNiveau ? 3 : (message.auteurId == thisMessage.auteurId ? 1 : 0)
             premierNiveau = false
             f (message.repondA)
          }
@@ -366,10 +378,16 @@ Message.prototype.getConversation = function(messages)
    return messagesEnEvidence
 }
 
-Message.prototype.XHTML = function(messagePair)
+/**
+  * Renvoie le message sous la forme de code XHTML (string) prêt à être inséré dans un document.
+  * Aucun callback n'est affecté.
+  */
+Message.prototype.XHTML = function(messagePair, pre)
 {
    if (messagePair == undefined)
       messagePair = true
+   if (pre == undefined)
+      pre = ""
       
    // construit l'identifiant de la personne
    var identifiant = 
@@ -388,7 +406,7 @@ Message.prototype.XHTML = function(messagePair)
    if (XHTMLrepondA != "")
       XHTMLrepondA = "<span class=\"repondA\">" + XHTMLrepondA + "</span><span class=\"delimitationRepondA\"></span>"
    
-   return "<div id=\"" + this.getId() + "\" class=\"" + (messagePair ? "messagePair" : "messageImpair") + " message" +
+   return "<div id=\"" + this.getId(pre) + "\" class=\"" + (messagePair ? "messagePair" : "messageImpair") + " message" +
          (this.appartientAuClient ? " proprietaire" : "")  +
          (this.clientARepondu ? " repondu" : "") +
          (this.estUneReponse ? " reponse" : "") +
@@ -455,10 +473,10 @@ Conversation.prototype.colorerEntetes = function()
    {
       if (this.messages[i].appartientAuClient)
          messagesProprietaire += "#" + this.messages[i].getId() + ","
-      else if (this.messages[i].estUneReponse)
-         messagesReponse += "#" + this.messages[i].getId() + ","
       else if (this.messages[i].clientARepondu)
          messagesRepondu += "#" + this.messages[i].getId() + ","
+      else if (this.messages[i].estUneReponse)
+         messagesReponse += "#" + this.messages[i].getId() + ","
    }
    $(messagesReponse).addClass("reponse")
    $(messagesRepondu).addClass("repondu")
@@ -779,6 +797,10 @@ function Messages(client, formateur, util)
    this.pageEvent = new PageEvent("chat", this.util)
 }
 
+// les messages insérés dans le document XHTML on leur id prefixé par cette valeur
+// cela permet de les distinguer des "vrais" messages
+Messages.prototype.prefixIdMessage = "rep"
+
 /**
   * Permet de définir un message comme étant ou n'étant plus un message auquel l'utilisateur
   * répond.
@@ -788,11 +810,42 @@ Messages.prototype.toggleMessageRepond = function(mess)
    // est-ce que l'on répond déjà à ce message ? si oui alors on l'enlève de la liste
    if (mess.id in this.messagesRepond)
    {
-      $("#" + mess.getId()).removeClass("repondEnEvidence")
-      delete this.messagesRepond[mess.id]
+      this.enleverMessageRepond(mess)
       return
    }
    
+   this.ajouterMessageRepond(mess)
+}
+
+/**
+  * Enlève tous les messages auquel l'utilisateur souhaite répond.
+  */
+Messages.prototype.enleverMessagesRepond = function()
+{
+   this.messagesRepond = {}
+   $("#conversations div.message").removeClass("repondEnEvidence")
+   $("form#posterMessage #repondA .messages").empty()
+}
+
+/**
+  * Définit un message comme n'y répondant plus.
+  */
+Messages.prototype.enleverMessageRepond = function(mess)
+{
+    console.log(mess)
+   $("#" + mess.getId()).removeClass("repondEnEvidence")
+   $("#" + mess.getId(this.prefixIdMessage)).remove()
+   delete this.messagesRepond[mess.id]
+   this.rafraichireNombreMessagesRepond()
+}
+
+/**
+  * Définit un message comme y répondant.
+  */
+Messages.prototype.ajouterMessageRepond = function(mess)
+{
+   var thisMessages = this
+    
    // est-ce que le message fait partie de la même conversation que les autres messages ?
    // TODO : solution plus élégante pour prendre un mess parmis messagesRepond !?
    var mess2
@@ -805,35 +858,48 @@ Messages.prototype.toggleMessageRepond = function(mess)
       return
    }
    
+   $("form#posterMessage #repondA .messages").append(mess.XHTML(undefined, this.prefixIdMessage))
    this.messagesRepond[mess.id] = mess
-   $("#" + mess.getId()).addClass("repondEnEvidence")
+   $("#" + mess.getId(this.prefixIdMessage) + ", #" + mess.getId()).addClass("repondEnEvidence")
+   $("#" + mess.getId(this.prefixIdMessage)).click(
+      function()
+      {
+         $(this).fadeOut("normal", function(){
+            thisMessages.enleverMessageRepond(mess)
+            $("form#posterMessage #repondA .messages").hide()
+         })
+      }
+   )
+   this.rafraichireNombreMessagesRepond()
 }
 
 /**
-  * Enlève tous les messages auquel l'utilisateur souhaite répond.
+  * Met à jour le nombre qui indique à l'utilisateur à combien de messages il répond.
   */
-Messages.prototype.enleverMessagesRepond = function()
+Messages.prototype.rafraichireNombreMessagesRepond = function()
 {
-   this.messagesRepond = {}
-   $(".message").removeClass("repondEnEvidence")
+   // TODO : ya pas mieux pour trouver le nombre d'objet ?
+   var nb = 0
+   for (m in this.messagesRepond)
+      nb += 1
+   $("#posterMessage #repondA .nb").text(nb)
+   
+   var boite = $("#posterMessage #repondA")
+   if (nb > 0) boite.show()
+   else boite.hide()
 }
 
-
 /**
-  * Définit un message comme n'y répondant plus.
+  * Affiche les messages auquel l'utilisateur souhaite répondre au sein des messages des conversations.
+  * Utilisé lorsqu'une conversation est extraite.
   */
-/*Messages.prototype.enleverMessageRepond = function(id)
+Messages.prototype.afficherMessagesRepondConversations = function()
 {
-
-}*/
-
-/**
-  * Définit un message comme y répondant.
-  */
-/*Messages.prototype.ajouterMessageRepond = function(id)
-{
-
-}*/
+   var expr = ""
+   for(var messId in this.messagesRepond)
+      expr += "#" + this.messagesRepond[messId].getId() + ","
+   $(expr).addClass("repondEnEvidence")
+}
 
 /**
   * Crée un message JSON contenant le message demandant un rafraichissement.
@@ -1093,10 +1159,7 @@ Messages.prototype.rafraichirMessages = function(vider)
             function(data)
             {
                if (vider)
-               {
                   thisMessages.viderMessages()
-                  vider = false
-               }
                // ajoute les messages reçus à leur conversation respective
                for (var numConv = 0; numConv < data["conversations"].length; numConv++)
                {
@@ -1106,6 +1169,9 @@ Messages.prototype.rafraichirMessages = function(vider)
                      thisMessages.client.supprimerConversation(numConv - 1) 
                   }
                }
+               if (vider)
+                  thisMessages.afficherMessagesRepondConversations()
+               vider = false
             }
       }
    )