js/util.js

   1
   2 /**
   3   * Cette classe regroupe des fonctions utilitaires (helpers).
   4   * @formateur est permet de formater les messages affichés à l'aide de messageDialogue (facultatif)
   5   */
   6 euphorik.Util = function (formateur)
   7 {
   8    $("#info .fermer").click(function(){
   9       $("#info").slideUp(50)
  10    })
  11
  12    $("body").append('<div id="flecheBulle"></div>').append('<div id="messageBulle"><p></p></div>')
  13
  14    this.formateur = formateur
  15    this.bulleActive = true
  16 }
  17
  18 euphorik.Util.messageType = {informatif: 0, question: 1, erreur: 2}
  19
  20 /**
  21   * Affiche une boite de dialogue avec un message à l'intérieur.
  22   * @param message le message (string)
  23   * @param type voir 'messageType'. par défaut messageType.informatif
  24   * @param les boutons sous la forme d'un objet ou les clefs sont les labels des boutons
  25   *        et les valeurs les fonctions executées lorsqu'un bouton est activé.
  26   * @param formate faut-il formaté le message ? true par défaut
  27   */
  28 euphorik.Util.prototype.messageDialogue = function(message, type, boutons, formate)
  29 {
  30    var thisUtil = this
  31
  32    type = type || euphorik.Util.messageType.informatif
  33
  34    if (formate == undefined)
  35       formate = true
  36
  37    if (this.timeoutMessageDialogue != undefined)
  38       clearTimeout(this.timeoutMessageDialogue)
  39
  40    var fermer = function(){$("#info").slideUp(100)}
  41    fermer()
  42
  43    $("#info .message").html(thisUtil.formateur == undefined || !formate ? message : thisUtil.formateur.traitementComplet(message))
  44    switch(type)
  45    {
  46       case euphorik.Util.messageType.informatif : $("#info #icone").attr("class", "information"); break
  47       case euphorik.Util.messageType.question : $("#info #icone").attr("class", "interrogation"); break
  48       case euphorik.Util.messageType.erreur : $("#info #icone").attr("class", "exclamation"); break
  49    }
  50    $("#info .boutons").html("")
  51    for (var b in boutons)
  52       $("#info .boutons").append("<div>" + b + "</div>").find("div:last").click(boutons[b]).click(fermer)
  53
  54    $("#info").slideDown(200)
  55    this.timeoutMessageDialogue = setTimeout(fermer, euphorik.conf.tempsAffichageMessageDialogue)
  56 }
  57
  58 euphorik.Util.positionTypeX = {gauche: 0, gaucheRecouvrement: 1, centre: 2, droiteRecouvrement: 3, droite: 4}
  59 euphorik.Util.positionTypeY = {haut: 0, hautRecouvrement: 1, centre: 2, basRecouvrement: 3, bas: 4}
  60
  61 /**
  62   * Afficher une boite flottante (élément) par rapport à une cible.
  63   * La boite est affichée de manière à ne pas dépasser de la fenêtre.
  64   * @boite l'élément à afficher
  65   * @cible l'élément sur lequel est affiché la boite
  66   * @positionX de type positionTypeX
  67   * @positionY de type positionTypeY
  68   */
  69 euphorik.Util.prototype.afficherBoite = function(boite, cible, positionX, positionY)
  70 {
  71     var positionCible = cible.offset()
  72     var positionBoite =
  73       {
  74          left : positionX == euphorik.Util.positionTypeX.gauche ? positionCible.left - boite.width() :
  75             (positionX == euphorik.Util.positionTypeX.gaucheRecouvrement ? positionCible.left - boite.width() + cible.width() :
  76             (positionX == euphorik.Util.positionTypeX.droitelsRecouvrement ? positionCible.left :
  77             (positionX == euphorik.Util.positionTypeX.droite ? positionCible.left + cible.width() :
  78             positionCible.left + cible.width() / 2 - boite.width() / 2 ))), // centre
  79          top : positionY == euphorik.Util.positionTypeY.haut ? positionCible.top - boite.height() :
  80             (positionY == euphorik.Util.positionTypeY.hautRecouvrement ? positionCible.top - boite.height() + cible.height() :
  81             (positionY == euphorik.Util.positionTypeY.basRecouvrement ? positionCible.top :
  82             (positionY == euphorik.Util.positionTypeY.bas ? positionCible.top + cible.height() :
  83             positionCible.top + cible.height() / 2 - boite.height() / 2 ))) // centre
  84       }
  85
  86     // calcul les décalages en x et en y pour éviter que la boite ne sorte de la fenêtre, tient compte de la position des barres de défilement
  87     var marge = 10
  88     positionBoite.left = positionBoite.left < marge + window.pageXOffset ? marge + window.pageXOffset :
  89       (boite.width() - $(window).width() + (positionBoite.left - window.pageXOffset) + marge > 0 ? $(window).width() - boite.width() - marge + window.pageXOffset : positionBoite.left)
  90     positionBoite.top = positionBoite.top < marge + window.pageYOffset ? marge + window.pageYOffset :
  91       (boite.height() - $(window).height() + (positionBoite.top - window.pageYOffset) + marge > 0 ? $(window).height() - boite.height() - marge + window.pageYOffset : positionBoite.top)
  92
  93     boite.css("top", positionBoite.top).css("left", positionBoite.left).show()
  94 }
  95
  96 euphorik.Util.positionBulleType = {haut : 0, droite : 1, bas : 2, gauche : 3}
  97
  98 /**
  99   * Affiche un info bulle lorsque le curseur survole l'élément donné.
 100   * @param message le message à afficher
 101   * @param element l'élément DOM sur lesquel afficher la bulle
 102   * @param la position de la bulle, voir positionBulleType. Par défaut à 0 (haut)
 103   */
 104 euphorik.Util.prototype.infoBulle = function(message, element, position)
 105 {
 106    var thisUtil = this
 107    position = position || euphorik.Util.positionBulleType.haut
 108
 109    var cacherBulle = function()
 110       {
 111          $("#flecheBulle").hide()
 112          $("#messageBulle").hide()
 113       }
 114
 115    element.hover(
 116       function()
 117       {
 118          if (!thisUtil.bulleActive)
 119             return
 120
 121          var m = $("#messageBulle")
 122          var f = $("#flecheBulle")
 123          f.removeClass().addClass(position == euphorik.Util.positionBulleType.haut ? "flecheBulleHaut" :
 124             (position == euphorik.Util.positionBulleType.droite ? "flecheBulleDroite" :
 125             (position == euphorik.Util.positionBulleType.bas ? "flecheBulleBas" : "flecheBulleGauche" )))
 126
 127          // remplie le paragraphe de la bulle avec le message
 128          $("p", m).html(message)
 129
 130          // réinitialise la position, évite le cas ou la boite est collé à droite et remplie avec un texte la faisant dépassé
 131          // dans ce cas la hauteur n'est pas calculé correctement
 132          m.css("top", 0).css("left", 0)
 133
 134          var positionFleche = {
 135             left : position == euphorik.Util.positionBulleType.haut || position == euphorik.Util.positionBulleType.bas ?
 136                 element.offset().left + element.outerWidth() / 2 - f.width() / 2 :
 137                 (position == euphorik.Util.positionBulleType.gauche ? element.offset().left - f.width() : element.offset().left + element.outerWidth()),
 138             top : position == euphorik.Util.positionBulleType.gauche || position == euphorik.Util.positionBulleType.droite ?
 139                 element.offset().top + element.outerHeight() / 2 - f.height() / 2 :
 140                 (position == euphorik.Util.positionBulleType.haut ? element.offset().top - f.height() : element.offset().top + element.outerHeight())
 141          }
 142          var positionMessage = {
 143             left : position == euphorik.Util.positionBulleType.haut || position == euphorik.Util.positionBulleType.bas ?
 144                 element.offset().left + element.width() / 2 - m.width() / 2 :
 145                 (position == euphorik.Util.positionBulleType.gauche ? element.offset().left - f.width() - m.width() : element.offset().left + f.width() + element.outerWidth()),
 146             top : position == euphorik.Util.positionBulleType.gauche || position == euphorik.Util.positionBulleType.droite ?
 147                 element.offset().top + element.outerHeight() / 2 - m.height() / 2 :
 148                 (position == euphorik.Util.positionBulleType.haut ? element.offset().top - f.height() - m.height() : element.offset().top + f.height() + element.outerHeight())
 149          }
 150          var depassementDroit = (positionMessage.left + m.width()) - $("body").width()
 151          if (depassementDroit > 0)
 152             positionMessage.left -= depassementDroit
 153          else
 154          {
 155             if (positionMessage.left < 0)
 156                positionMessage.left = 0
 157          }
 158
 159          m.css("top", positionMessage.top).css("left", positionMessage.left).show()
 160          f.css("top", positionFleche.top).css("left", positionFleche.left).show()
 161       },
 162       cacherBulle
 163    ).click(cacherBulle)
 164 }
 165
 166 /**
 167   * Utilisé pour l'envoie de donnée avec la méthode ajax de jQuery.
 168   */
 169 euphorik.Util.prototype.jsonVersAction = function(json)
 170 {
 171    return {action : JSON.stringify(json) }
 172 }
 173
 174 euphorik.Util.prototype.md5 = function(chaine)
 175 {
 176    return hex_md5(chaine)
 177 }
 178
 179 // pompé de http://www.faqts.com/knowledge_base/view.phtml/aid/13562/fid/130
 180 euphorik.Util.prototype.setSelectionRange = function(input, selectionStart, selectionEnd)
 181 {
 182    if (input.setSelectionRange)
 183    {
 184       input.focus()
 185       input.setSelectionRange(selectionStart, selectionEnd)
 186    }
 187    else if (input.createTextRange)
 188    {
 189       var range = input.createTextRange()
 190       range.collapse(true)
 191       range.moveEnd('character', selectionEnd)
 192       range.moveStart('character', selectionStart)
 193       range.select()
 194    }
 195 }
 196
 197 euphorik.Util.prototype.setCaretToEnd = function(input)
 198 {
 199    this.setSelectionRange(input, input.value.length, input.value.length)
 200 }
 201 euphorik.Util.prototype.setCaretToBegin = function(input)
 202 {
 203    this.setSelectionRange(input, 0, 0)
 204 }
 205 euphorik.Util.prototype.setCaretToPos = function(input, pos)
 206 {
 207    this.setSelectionRange(input, pos, pos)
 208 }
 209 euphorik.Util.prototype.selectString = function(input, string)
 210 {
 211    var match = new RegExp(string, "i").exec(input.value)
 212    if (match)
 213    {
 214       this.setSelectionRange (input, match.index, match.index + match[0].length)
 215    }
 216 }
 217 euphorik.Util.prototype.replaceSelection = function(input, replaceString) {
 218    if (input.setSelectionRange)
 219    {
 220       var selectionStart = input.selectionStart
 221       var selectionEnd = input.selectionEnd
 222       input.value = input.value.substring(0, selectionStart) + replaceString + input.value.substring(selectionEnd)
 223
 224       if (selectionStart != selectionEnd) // has there been a selection
 225          this.setSelectionRange(input, selectionStart, selectionStart + replaceString.length)
 226       else // set caret
 227          this.setCaretToPos(input, selectionStart + replaceString.length)
 228    }
 229    else if (document.selection)
 230    {
 231       input.focus()
 232       var range = document.selection.createRange()
 233       if (range.parentElement() == input)
 234       {
 235          var isCollapsed = range.text == ''
 236          range.text = replaceString
 237          if (!isCollapsed)
 238          {
 239             range.moveStart('character', -replaceString.length);
 240          }
 241       }
 242    }
 243 }
 244
 245 euphorik.Util.prototype.rot13 = function(chaine)
 246 {
 247    var ACode = 'A'.charCodeAt(0)
 248    var aCode = 'a'.charCodeAt(0)
 249    var MCode = 'M'.charCodeAt(0)
 250    var mCode = 'm'.charCodeAt(0)
 251    var ZCode = 'Z'.charCodeAt(0)
 252    var zCode = 'z'.charCodeAt(0)
 253
 254    var f = function(ch, pos) {
 255       if (pos == ch.length)
 256          return ""
 257
 258       var c = ch.charCodeAt(pos);
 259       return String.fromCharCode(
 260          c +
 261          (c >= ACode && c <= MCode || c >= aCode && c <= mCode ? 13 :
 262          (c > MCode && c <= ZCode || c > mCode && c <= zCode ? -13 : 0))
 263       ) + f(ch, pos + 1)
 264    }
 265    return f(chaine, 0)
 266 }