From: Greg Burri Date: Tue, 27 May 2008 21:00:32 +0000 (+0000) Subject: ADD infos bulles (pas fini, quelques bugs à corriger) X-Git-Tag: 1.0.0^2~22 X-Git-Url: http://git.euphorik.ch/?p=euphorik.git;a=commitdiff_plain;h=84a86204f1f87a6b898975bc1d817130c7168a7c ADD infos bulles (pas fini, quelques bugs à corriger) --- diff --git a/css/1/euphorik.css b/css/1/euphorik.css index 2812e70..3a41bae 100755 --- a/css/1/euphorik.css +++ b/css/1/euphorik.css @@ -167,14 +167,29 @@ div#info .boutons div:hover { /***** Les infos bulles *****/ #flecheBulle { + position: absolute; + z-index: 50; width: 15px; height: 8px; - background-image: url(../../img/css1/fleche_bulle.png) + background-image: url(../../img/css1/fleche_bulle.png); + display: none +} +#messageBulle { + position: absolute; + z-index: 50; + color: #ffffff; + background-color: #841919; + display: none; + font-size: 10px; +} +#messageBulle p { + padding: 3px 6px; } /***** Le faux captcha *****/ .captcha { display:none; +} /***** Les formulaires *****/ form input, diff --git a/img/css1/fleche_bulle.png b/img/css1/fleche_bulle.png new file mode 100644 index 0000000..0676a33 Binary files /dev/null and b/img/css1/fleche_bulle.png differ diff --git a/js/euphorik.js b/js/euphorik.js index b44f042..1b78ba8 100755 --- a/js/euphorik.js +++ b/js/euphorik.js @@ -134,6 +134,49 @@ Util.prototype.messageDialogue = function(message, type, boutons, formate) this.timeoutMessageDialogue = setTimeout(fermer, conf.tempsAffichageMessageDialogue) } +/** + * Affiche un info bulle lorsque le curseur survole l'élément donné. + * FIXME : le width de element ne tient pas compte du padding !? + */ +Util.prototype.infoBulle = function(message, element) +{ + var virerMess = function() + { + $("#flecheBulle").remove() + $("#messageBulle").remove() + } + + element.click(virerMess) + + element.hover( + function(e) + { + f = $('
').appendTo("body") + m = $('

' + message + '

').appendTo("body") + var positionFleche = { + left : element.offset().left + element.width() / 2 - f.width() / 2, + top : element.offset().top - f.height() + } + var positionMessage = { + left : element.offset().left + element.width() / 2 - m.width() / 2, + top : element.offset().top - f.height() - m.height() + } + var depassementDroit = (positionMessage.left + m.width()) - $("body").width() + if (depassementDroit > 0) + positionMessage.left -= depassementDroit + else + { + if (positionMessage.left < 0) + positionMessage.left = 0 + } + + m.css("top", positionMessage.top).css("left", positionMessage.left).show() + f.css("top", positionFleche.top).css("left", positionFleche.left).show() + }, + virerMess + ) +} + /** * Utilisé pour l'envoie de donnée avec la méthode ajax de jQuery. */ diff --git a/js/pageMinichat.js b/js/pageMinichat.js index 770fc42..45d7242 100755 --- a/js/pageMinichat.js +++ b/js/pageMinichat.js @@ -9,8 +9,8 @@ // (at your option) any later version. // // Euphorik is distributed in the hope that it will be useful, +// MERCHANTABILITY or FIAller à la première pageTNESS FOR A PARTICULAR PURPOSE. See the // but WITHOUT ANY WARRANTY; without even the implied warranty of -// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the // GNU General Public License for more details. // // You should have received a copy of the GNU General Public License @@ -76,6 +76,8 @@ PageMinichat.prototype.charger = function() } ) } + + this.util.infoBulle("Ouvrir la conversation liée au troll de la semaine", $("#trollCourant")) // $("body").append("
") @@ -381,6 +383,13 @@ function Conversation(num, util, formateur, client) ' ) + this.util.infoBulle("Aller à la première page", $("#conversations #" + this.getId() + " .numPage")) + if (num != 0) + { + this.util.infoBulle("Créer un lien vers la conversation", $("#conversations #" + this.getId() + " .lien")) + this.util.infoBulle("Fermer la conversation", $("#conversations #" + this.getId() + " .fermer")) + } + // enlève la mise en évidence pour la conversation $("#conversations #" + this.getId()).hover( function(){}, @@ -544,9 +553,6 @@ Conversation.prototype.flush = function(funClickOuvrirConv) if (nbMessagesAffiche > this.nbMessageMax) $("#conversations #" + this.getId() + " .message").slice(this.nbMessageMax, nbMessagesAffiche).empty() - - //.filter(function(){ return parseInt($(this).attr("id").substr(4), 36) > thisConversation.idDernierMessageAffiche }) - var DOM = $(XHTML) DOM.each( function() @@ -599,6 +605,8 @@ Conversation.prototype.flush = function(funClickOuvrirConv) function(){} ) + thisConversation.util.infoBulle("Extraction de la conversation", $(".extraire", this)) + $(this).click( function(event) {