X-Git-Url: http://git.euphorik.ch/?p=euphorik.git;a=blobdiff_plain;f=js%2Feuphorik.js;h=825e4c34a4aa008bc615b0eaee6bfdda9faa92aa;hp=2b885ab0ab2fedf4444232da30dfee4d422545c2;hb=fdbd960f3fda4a5b1e71dc410ad162c78390f409;hpb=9d95f5af441fda194444405983e4d110c2514680 diff --git a/js/euphorik.js b/js/euphorik.js index 2b885ab..825e4c3 100755 --- a/js/euphorik.js +++ b/js/euphorik.js @@ -1,4 +1,20 @@ -// coding: utf-8 +// coding: utf-8 +// Copyright 2008 Grégory Burri +// +// This file is part of Euphorik. +// +// Euphorik is free software: you can redistribute it and/or modify +// it under the terms of the GNU General Public License as published by +// the Free Software Foundation, either version 3 of the License, or +// (at your option) any later version. +// +// Euphorik is distributed in the hope that it will be useful, +// 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 +// along with Euphorik. If not, see . /** * Contient la base javascript pour le site euphorik.ch. @@ -13,9 +29,11 @@ * Normalement 'const' à la place de 'var' mais non supporté par IE7. */ var conf = { - nbMessageAffiche : 10, // (par page) + nbMessageAffiche : 40, // (par page) pseudoDefaut : "", - tempsAffichageMessageDialogue : 4000, // en ms + tempsAffichageMessageDialogue : 4000, // en ms + tempsKick : 15, // en minute + tempsBan : 60 * 24 * 3, // en minutes (3jours) smiles : { "smile" : [/:\)/g, /:-\)/g], "bigsmile" : [/:D/g, /:-D/g], @@ -65,26 +83,40 @@ String.prototype.rtrim = function() /////////////////////////////////////////////////////////////////////////////////////////////////// /** - * Cette classe regroupe des fonctions utilitaires (helpers). + * Cette classe regroupe des fonctions utilitaires (helpers). + * @formateur est permet de formater les messages affichés à l'aide de messageDialogue (facultatif) */ -function Util() +function Util(formateur) { $("#info .fermer").click(function(){ $("#info").slideUp(50) }) + + $("body").append('
').append('

') + + this.formateur = formateur + this.bulleActive = true } +var messageType = {informatif: 0, question: 1, erreur: 2} + /** * Affiche une boite de dialogue avec un message à l'intérieur. * @param message le message (string) * @param type voir 'messageType'. par défaut messageType.informatif * @param les boutons sous la forme d'un objet ou les clefs sont les labels des boutons * et les valeurs les fonctions executées lorsqu'un bouton est activé. + * @param formate faut-il formaté le message ? true par défaut */ -Util.prototype.messageDialogue = function(message, type, boutons) +Util.prototype.messageDialogue = function(message, type, boutons, formate) { + var thisUtil = this + if (type == undefined) type = messageType.informatif + + if (formate == undefined) + formate = true if (this.timeoutMessageDialogue != undefined) clearTimeout(this.timeoutMessageDialogue) @@ -92,7 +124,7 @@ Util.prototype.messageDialogue = function(message, type, boutons) var fermer = function(){$("#info").slideUp(100)} fermer() - $("#info .message").html(message) + $("#info .message").html(thisUtil.formateur == undefined || !formate ? message : thisUtil.formateur.traitementComplet(message)) switch(type) { case messageType.informatif : $("#info #icone").attr("class", "information"); break @@ -105,9 +137,56 @@ Util.prototype.messageDialogue = function(message, type, boutons) $("#info").slideDown(200) 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 thisUtil = this -var messageType = {informatif: 0, question: 1, erreur: 2} + var cacherBulle = function() + { + $("#flecheBulle").hide() + $("#messageBulle").hide() + } + + element.hover( + function(e) + { + if (!thisUtil.bulleActive) + return + + var m = $("#messageBulle") + var f = $("#flecheBulle") + + $("p", m).html(message) + + 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() + }, + cacherBulle + ).click(cacherBulle) +} /** * Utilisé pour l'envoie de donnée avec la méthode ajax de jQuery. @@ -173,19 +252,16 @@ Util.prototype.replaceSelection = function(input, replaceString) { this.setCaretToPos(input, selectionStart + replaceString.length) } else if (document.selection) - { - var range = document.selection.createRange(); + { + input.focus() + var range = document.selection.createRange() if (range.parentElement() == input) { var isCollapsed = range.text == '' range.text = replaceString if (!isCollapsed) - { - // there has been a selection - // it appears range.select() should select the newly - // inserted text but that fails with IE + { range.moveStart('character', -replaceString.length); - range.select(); } } } @@ -222,10 +298,21 @@ function Pages() this.pages = {} } +/** + * Accepte soit un objet soit un string. + * un string correspond au nom de la page, par exemple : "page" -> "page.html" + */ Pages.prototype.ajouterPage = function(page) { - page.pages = this // la magie des langages dynamiques : le foutoire - this.pages[page.nom] = page + if (typeof page == "string") + { + this.pages[page] = page + } + else + { + page.pages = this // la magie des langages dynamiques : le foutoire + this.pages[page.nom] = page + } } Pages.prototype.afficherPage = function(nomPage, forcerChargement) @@ -238,11 +325,16 @@ Pages.prototype.afficherPage = function(nomPage, forcerChargement) if (this.pageCourante != null && this.pageCourante.decharger) this.pageCourante.decharger() - $("#menu div").removeClass("courante") - $("#menu div." + nomPage).addClass("courante") + $("#menu li").removeClass("courante") + $("#menu li." + nomPage).addClass("courante") this.pageCourante = page - $("#page").html(this.pageCourante.contenu()).removeClass().addClass(this.pageCourante.nom) + var contenu = "" + if (typeof page == "string") + $.ajax({async: false, url: "pages/" + page + ".html", success : function(page) { contenu += page }}) + else + contenu += this.pageCourante.contenu() + $("#page").html(contenu).removeClass().addClass(this.pageCourante.nom) if (this.pageCourante.charger) this.pageCourante.charger() @@ -250,6 +342,11 @@ Pages.prototype.afficherPage = function(nomPage, forcerChargement) /////////////////////////////////////////////////////////////////////////////////////////////////// +/** + * Classe permettant de formater du texte par exemple pour la substitution des liens dans les + * message par "[url]". + * TODO : améliorer l'efficacité des méthods notamment lié au smiles. + */ function Formateur() { this.smiles = conf.smiles @@ -277,14 +374,19 @@ Formateur.prototype.getSmilesHTML = function() var XHTML = "" for (var sNom in this.smiles) { - XHTML += "" + XHTML += "\""" } return XHTML } +/** + * Formatage complet d'un texte. + * @M le message + * @pseudo facultatif, permet de contruire le label des images sous la forme : " : " + */ Formateur.prototype.traitementComplet = function(M, pseudo) { - return this.traiterLiensConv(this.traiterSmiles(this.traiterURL(this.remplacerBalisesHTML(M), pseudo))) + return this.traiterLiensConv(this.traiterSmiles(this.traiterURL(this.traiterWikiSyntaxe(this.remplacerBalisesHTML(M)), pseudo))) } /** @@ -306,7 +408,7 @@ Formateur.prototype.traiterLiensConv = function(M) /** * FIXME : Cette méthode est attrocement lourde ! A optimiser. - * moyenne su échantillon : 234ms + * moyenne sur échantillon : 234ms */ Formateur.prototype.traiterSmiles = function(M) { @@ -314,22 +416,19 @@ Formateur.prototype.traiterSmiles = function(M) { ss = this.smiles[sNom] for (var i = 0; i < ss.length; i++) - M = M.replace(ss[i], "") + M = M.replace(ss[i], "\""") } return M } Formateur.prototype.remplacerBalisesHTML = function(M) { - return M.replace(//g, ">") + return M.replace(//g, ">").replace(/"/g, """) } Formateur.prototype.traiterURL = function(M, pseudo) { thisFormateur = this - - if (pseudo == undefined) - pseudo = "" var traitementUrl = function(url) { @@ -337,10 +436,31 @@ Formateur.prototype.traiterURL = function(M, pseudo) if (!thisFormateur.regexTestProtocoleExiste.test(url)) url = "http://" + url var extension = thisFormateur.getShort(url) - return "[" + extension[0] + "]" + return "[" + extension[0] + "]" } return M.replace(this.regexUrl, traitementUrl) } + +/** + * Formatage en utilisant un sous-ensemble des règles de mediwiki. + * par exemple ''italic'' devient italic + */ +Formateur.prototype.traiterWikiSyntaxe = function(M) +{ + return M.replace( + /'''(.*?)'''/g, + function(texte, capture) + { + return "" + capture + "" + } + ).replace( + /''(.*?)''/g, + function(texte, capture) + { + return "" + capture + "" + } + ) +} /** * Renvoie une version courte de l'url. @@ -350,8 +470,8 @@ Formateur.prototype.getShort = function(url) { var estUneImage = false var versionShort = null - var rechercheImg = this.regexImg.exec(url) - //alert(url) + var rechercheImg = this.regexImg.exec(url) + if (rechercheImg != null) { versionShort = rechercheImg[1].toLowerCase() @@ -382,7 +502,7 @@ Formateur.prototype.traiterPourFenetreLightBox = function(M, urlCourante) thisFormateur = this var traitementUrl = function(url) { - return "[" + thisFormateur.getShort(url)[0] + (urlCourante == url ? ": image courante" : "") + "]" + return "[" + thisFormateur.getShort(url)[0] + (urlCourante == url ? "*" : "") + "]" } return this.remplacerBalisesHTML(M).replace(this.regexUrl, traitementUrl) @@ -411,20 +531,24 @@ function Client(util) // données personnels this.resetDonneesPersonnelles() - this.setStatut(statutType.deconnected) - - // le dernier message d'erreur recut du serveur (par exemple une connexion foireuse : "login impossible") - this.dernierMessageErreur = "" + this.setStatut(statutType.deconnected) + + // si true alors chaque modification du client est mémorisé sur le serveur + this.autoflush = $.browser["opera"] } Client.prototype.resetDonneesPersonnelles = function() -{ +{ + this.id = 0 this.pseudo = conf.pseudoDefaut this.login = "" this.password = "" this.email = "" this.css = $("link#cssPrincipale").attr("href") this.nickFormat = "nick" + this.viewTimes = true + this.viewTooltips = true + this.cookie = undefined this.pagePrincipale = 1 this.ekMaster = false @@ -437,12 +561,14 @@ Client.prototype.resetDonneesPersonnelles = function() Client.prototype.setCss = function(css) { - if (this.css == css) + if (this.css == css || css == "") return this.css = css $("link#cssPrincipale").attr("href", this.css) - this.majMenu() + this.majMenu() + + if (this.autoflush) this.flush(true) } Client.prototype.pageSuivante = function(numConv) @@ -495,7 +621,10 @@ Client.prototype.ajouterConversation = function(racine) if (this.conversations[i].root == racine) return false - this.conversations.push({root : racine, page : 1}) + this.conversations.push({root : racine, page : 1}) + + if (this.autoflush) this.flush(true) + return true } @@ -506,7 +635,9 @@ Client.prototype.supprimerConversation = function(num) // décalage TODO : supprimer le dernier élément for (var i = num; i < this.conversations.length - 1; i++) this.conversations[i] = this.conversations[i+1] - this.conversations.pop() + this.conversations.pop() + + if (this.autoflush) this.flush(true) } Client.prototype.getJSONLogin = function(login, password) @@ -562,6 +693,8 @@ Client.prototype.getJSONProfile = function() "email" : this.email, "css" : this.css, "nick_format" : this.nickFormat, + "view_times" : this.viewTimes, + "view_tooltips" : this.viewTooltips, "main_page" : this.pagePrincipale < 1 ? 1 : this.pagePrincipale, "conversations" : this.getJSONConversations() } @@ -582,14 +715,16 @@ Client.prototype.delCookie = function() document.cookie = "cookie=; max-age=0" } -Client.prototype.setCookie = function(cookie) +Client.prototype.setCookie = function() { - if (this.cookie == null) + if (this.cookie == null || this.cookie == undefined) return - document.cookie = - "cookie="+this.cookie+ - "; max-age=" + (60 * 60 * 24 * 365) + // ne fonctionne pas sous IE.... + /*document.cookie = "cookie=" + this.cookie + "; max-age=" + (60 * 60 * 24 * 365) */ + + document.cookie = + "cookie="+this.cookie+"; expires=" + new Date(new Date().getTime() + 1000 * 60 * 60 * 24 * 365).toUTCString() } Client.prototype.authentifie = function() @@ -599,7 +734,6 @@ Client.prototype.authentifie = function() Client.prototype.setStatut = function(statut) { - //alert(statut) // conversation en "enum" si en "string" if (typeof(statut) == "string") { @@ -609,7 +743,7 @@ Client.prototype.setStatut = function(statut) (statut == "auth_not_registered" ? statutType.auth_not_registered : statutType.deconnected) } - if (statut == this.statut) return + if (statut == this.statut) return this.statut = statut this.majMenu() @@ -640,8 +774,11 @@ Client.prototype.enregistrement = function(login, password) this.login = login this.password = password if(this.flush()) + { this.setStatut(statutType.auth_registered) - return true + return true + } + return false } else { @@ -651,7 +788,7 @@ Client.prototype.enregistrement = function(login, password) Client.prototype.connexion = function(messageJson) { - ;;; dumpObj(messageJson) + ;; dumpObj(messageJson) thisClient = this jQuery.ajax( { @@ -663,8 +800,11 @@ Client.prototype.connexion = function(messageJson) success: function(data) { - ;;; dumpObj(data) - thisClient.chargerDonnees(data) + ;; dumpObj(data) + if (data["reply"] == "error") + thisClient.util.messageDialogue(data["error_message"]) + else + thisClient.chargerDonnees(data) } } ) @@ -673,44 +813,42 @@ Client.prototype.connexion = function(messageJson) Client.prototype.deconnexion = function() { - this.flush() - this.delCookie() - this.setStatut(statutType.deconnected) // deconnexion + this.flush(true) + this.delCookie() this.resetDonneesPersonnelles() + this.setStatut(statutType.deconnected) // deconnexion } Client.prototype.chargerDonnees = function(data) { - var thisClient = this - + // la modification du statut qui suit met à jour le menu, le menu dépend (page admin) + // de l'état ekMaster + this.ekMaster = data["ek_master"] != undefined ? data["ek_master"] : false + this.setStatut(data["status"]) if (this.authentifie()) { this.cookie = data["cookie"] this.setCookie() - + + this.id = data["id"] this.login = data["login"] this.pseudo = data["nick"] this.email = data["email"] - this.css = data["css"] + this.setCss(data["css"]) this.nickFormat = data["nick_format"] + this.viewTimes = data["view_times"] + this.viewTooltips = data["view_tooltips"] // la page de la conversation principale this.pagePrincipale = data["main_page"] == undefined ? 1 : data["main_page"] - // met à jour la css - if (this.css != "") - { - $("link#cssPrincipale").attr("href", this.css) - this.majMenu() - } // les conversations - thisClient.conversations = data["conversations"] + this.conversations = data["conversations"] - thisClient.ekMaster = data["ek_master"] + this.majBulle() } - this.dernierMessageErreur = data["error_message"] } /** @@ -721,13 +859,15 @@ Client.prototype.chargerDonnees = function(data) Client.prototype.flush = function(async) { if (async == undefined) - async = true + async = false if (!this.authentifie()) return false - thisClient = this - ;;; dumpObj(this.getJSONProfile()) + var thisClient = this + var ok = true + + ;; dumpObj(this.getJSONProfile()) jQuery.ajax( { async: async, @@ -738,17 +878,30 @@ Client.prototype.flush = function(async) success: function(data) { - //thisClient.util.log(thisClient.util.serializer.serializeToString(data)) + ;; dumpObj(data) + if (data["reply"] == "error") + { + thisClient.util.messageDialogue(data["error_message"]) + ok = false + } + else + { + thisClient.majBulle() + } } } ) - // TODO : retourner false si un problème est survenu lors de l'update du profile - return true + + return ok } Client.prototype.majMenu = function() { - var displayType = this.css == "css/3/euphorik.css" ? "block" : "inline" //this.client + // TODO : à virer : ne plus changer de style de display ... spa beau .. ou trouver une autre méthode + // var displayType = this.css == "css/3/euphorik.css" ? "block" : "inline" //this.client + displayType = "block" + + $("#menu .admin").css("display", this.ekMaster ? displayType : "none") // met à jour le menu if (this.statut == statutType.auth_registered) @@ -771,13 +924,45 @@ Client.prototype.majMenu = function() } } -Client.prototype.ban = function(userId, minutes) +/** + * Met à jour l'affichage des infos bulles en fonction du profile. + */ +Client.prototype.majBulle = function() +{ + this.util.bulleActive = this.viewTooltips +} + +Client.prototype.slap = function(userId, raison) +{ + var thisClient = this + + jQuery.ajax({ + type: "POST", + url: "request", + dataType: "json", + data: this.util.jsonVersAction( + { + "action" : "slap", + "cookie" : thisClient.cookie, + "user_id" : userId, + "reason" : raison + }), + success: + function(data) + { + if (data["reply"] == "error") + thisClient.util.messageDialogue(data["error_message"]) + } + }) +} + +Client.prototype.ban = function(userId, raison, minutes) { var thisClient = this // par défaut un ban correspond à 3 jours if (typeof(minutes) == "undefined") - minutes = 60 * 24 * 3 + minutes = conf.tempsBan; jQuery.ajax({ type: "POST", @@ -788,7 +973,8 @@ Client.prototype.ban = function(userId, minutes) "action" : "ban", "cookie" : thisClient.cookie, "duration" : minutes, - "user_id" : userId + "user_id" : userId, + "reason" : raison }), success: function(data) @@ -799,9 +985,99 @@ Client.prototype.ban = function(userId, minutes) }) } -Client.prototype.kick = function(userId) +Client.prototype.kick = function(userId, raison) { - this.ban(userId, 15) + this.ban(userId, raison, conf.tempsKick) +} + +/////////////////////////////////////////////////////////////////////////////////////////////////// + +/** + * classe permettant de gérer les événements (push serveur). + * @page la page + */ +function PageEvent(page, util) +{ + this.page = page + this.util = util + + // l'objet JSONHttpRequest représentant la connexion d'attente + this.attenteCourante = null + + // le multhreading du pauvre, merci javascript de m'offrire autant de primitives pour la gestion de la concurrence... + this.stop = false +} + +/** + * Arrête l'attente courante s'il y en a une. + */ +PageEvent.prototype.stopAttenteCourante = function() +{ + this.stop = true + + if (this.attenteCourante != null) + { + this.attenteCourante.abort() + } +} + +/** + * Attend un événement lié à la page. + * @funSend une fonction renvoyant les données json à envoyer + * @funReceive une fonction qui accepte un paramètre correspondant au données reçues + */ +PageEvent.prototype.waitEvent = function(funSend, funReceive) +{ + this.stopAttenteCourante() + + this.stop = false + + var thisPageEvent = this + + // on doit conserver l'ordre des valeurs de l'objet JSON (le serveur les veut dans l'ordre définit dans le protocole) + // TODO : ya pas mieux ? + var dataToSend = + { + "action" : "wait_event", + "page" : this.page + } + var poulpe = funSend() + for (v in poulpe) + dataToSend[v] = poulpe[v] + + ;; dumpObj(dataToSend) + + this.attenteCourante = jQuery.ajax({ + type: "POST", + url: "request", + dataType: "json", + data: this.util.jsonVersAction(dataToSend), + success: + function(data) + { + ;; dumpObj(data) + + funReceive(data) + + // rappel de la fonction dans 100 ms + setTimeout(function(){ thisPageEvent.waitEvent2(funSend, funReceive) }, 100) + }, + error: + function(XMLHttpRequest, textStatus, errorThrown) + { + setTimeout(function(){ thisPageEvent.waitEvent2(funSend, funReceive) }, 1000) + } + }) +} + +/** + * Si un stopAttenteCourante survient un peu n'importe quand il faut imédiatement arreter de boucler. + */ +PageEvent.prototype.waitEvent2 = function(funSend, funReceive) +{ + if (this.stop) + return + this.waitEvent(funSend, funReceive) } /////////////////////////////////////////////////////////////////////////////////////////////////// @@ -817,26 +1093,28 @@ function initialiserListeStyles(client) } // charge dynamiquement le script de debug -;;; jQuery.ajax({async : false, url : "js/debug.js", dataType : "script"}) +;; jQuery.ajax({async : false, url : "js/debug.js", dataType : "script"}) // le main $(document).ready( function() { - var util = new Util() + var formateur = new Formateur() + var util = new Util(formateur) var client = new Client(util) - var pages = new Pages() - var formateur = new Formateur() + var pages = new Pages() // connexion vers le serveur (utilise un cookie qui traine) client.connexionCookie() initialiserListeStyles(client) - // TODO : pourquoi $(document).unload ne fonctionne pas ? - $(window).unload(function(){client.flush(false)}) + // FIXME : ne fonctionne pas sous opera + // voir : http://dev.jquery.com/ticket/2892#preview + $(window).unload(function(){client.flush()}) $("#menu .minichat").click(function(){ pages.afficherPage("minichat") }) + $("#menu .admin").click(function(){ pages.afficherPage("admin") }) $("#menu .profile").click(function(){ pages.afficherPage("profile") }) $("#menu .logout").click(function(){ util.messageDialogue("Êtes-vous sur de vouloir vous délogger ?", messageType.question, @@ -851,11 +1129,17 @@ $(document).ready( }) $("#menu .register").click(function(){ pages.afficherPage("register") }) $("#menu .about").click(function(){ pages.afficherPage("about") }) + + // TODO : simplifier et pouvoir créer des liens par exemple : Conditions d'utilisation + $("#footer .conditions").click(function(){ pages.afficherPage("conditions_utilisation") }) pages.ajouterPage(new PageMinichat(client, formateur, util)) + pages.ajouterPage(new PageAdmin(client, formateur, util)) pages.ajouterPage(new PageProfile(client, formateur, util)) pages.ajouterPage(new PageRegister(client, formateur, util)) pages.ajouterPage(new PageAbout(client, formateur, util)) + pages.ajouterPage("conditions_utilisation") + pages.afficherPage("minichat") } -) \ No newline at end of file +)