Capitalisation de fonctions JS

Capitalisation de fonctions JS - HTML/CSS - Programmation

Marsh Posté le 07-12-2002 à 18:56:22    

Salut,
 
Bon je suis souvent amené à effectuer des développements en JS entre autres et je me demandais si ça ne serait pas une bonne idée de "capitaliser" les fonctions réutilisables en JS dont tout le monde pourrait avoir besoin.
 
Si je dis ça, c'est parceque c'est chiant de devoir toujours mettre à jour ses listes de fct JS dans son coin alors que si on met ça en accès sur le forum, c'est accessible de partout et pour tout le monde...
 
Qu'en pensez-vous ???

Reply

Marsh Posté le 07-12-2002 à 18:56:22   

Reply

Marsh Posté le 07-12-2002 à 19:03:36    

que c'est une idée louable, mais pas forcément réaliste.
on n'a pas les memes besoins

Reply

Marsh Posté le 07-12-2002 à 19:06:02    

Oui c'est vrai que les besoins sont rarement les mêmes mais il y a toujours certaines fonctions qui sont utilisées par tout le monde, je pense aux fonctions de manipulations de String, aux vérifications de dates, de format d'adresses mails, etc...
 
Toujours pas convaincu ???  :(  
 

Reply

Marsh Posté le 07-12-2002 à 19:08:58    

pas tellement, non. ceci dit, que ca ne t'empeche surtout pas de le lancer, c'est pas parce que je n'y vois pas d'interet qu'il n'y en a pas.
 
en plus dans mon cas, je dois encapsuler ces fonctions dans des taglibs pour simplifier la vie des developpeurs, qui n'ont du coup que leurs jsp & servlets a maintenir.

Reply

Marsh Posté le 07-12-2002 à 19:28:58    

Bon ben si je fais un flop, je m'en fous après tout  :D  
 
Méthode de manipulation de champ
 

Code :
  1. /* --------------------------------------------------------------- */
  2. /* Teste si le champ dont le nom est passé en paramètre est        */
  3. /* alimenté dans le formulaire ...                                 */
  4. /* --------------------------------------------------------------- */
  6. function isPresent(pElem) {
  7. var element = window.document.forms[0].elements[pElem];
  8. switch(element.type) {
  9.  case 'hidden' : return (element.value != '');
  10.  case 'password' : return (element.value != '');
  11.  case 'text' : return (element.value != '');
  12.  case 'textarea' : return (element.value != '');
  13.  case 'select-one' : return ((element.selectedIndex != -1) && (element.options[element.selectedIndex].value != ''));
  14.  case 'checkbox' : return (element.checked);
  15.  case 'radio' : return (element.checked);
  16.  default : for(var k=0 ; k<element.length ; k++) { if (element[k].checked) { return true; } }
  17. }
  18. return false;
  19. }


 
Méthode de manipulation de chaînes de caractères
 

Code :
  1. /* --------------------------------------------------------------- */
  2. /* Retourne la partie gauche d'une chaîne de caractères sur n      */
  3. /* positions                                                       */
  4. /* --------------------------------------------------------------- */
  6. function left(pString, pLen) {
  7. return pString.substr(0, pLen);
  8. }
  10. /* --------------------------------------------------------------- */
  11. /* Retourne la partie droite d'une chaîne de caractères sur n      */
  12. /* positions                                                       */
  13. /* --------------------------------------------------------------- */
  15. function right(pString,pLen) {
  16. return pString.substr(pString.length - pLen, pLen);
  17. }
  19. /* --------------------------------------------------------------- */
  20. /* Complète une chaîne (un nombre) sur pLen caractères avec des    */
  21. /* zéros à gauche                                                  */
  22. /* --------------------------------------------------------------- */
  24. function padNumber(pN,pLen) {
  25. str = new String(pN);
  26. while (str.length < pLen) { str = "0" + str; }
  27. return str;
  28. }


 
Méthodes de manipulation de dates
 

Code :
  1. /* --------------------------------------------------------------- */
  2. /* Retourne la date du jour sous la forme JJ/MM/SSAA               */
  3. /* --------------------------------------------------------------- */
  4. /* Fonction stand-alone !                                          */
  5. /* --------------------------------------------------------------- */
  7. function getToday() {
  8.     myDat = new Date();
  9.     JJ = myDat.getDate();
  10.     JJ = (JJ < 10 ? "0" + JJ : "" + JJ);
  11.     MM = myDat.getMonth() + 1;
  12.     MM = (MM < 10 ? "0" + MM : "" + MM);
  13.     SSAA = myDat.getFullYear();
  14.     return JJ + "/" + MM + "/" + SSAA;
  15. }
  17. * --------------------------------------------------------------- */
  18. /* Retourne un tableau avec tous les jours fériés de l'année       */
  19. /* pAnnee sous la forme JJ/MM                                      */
  20. /* --------------------------------------------------------------- */
  22. function getTousFeries(pAnnee) {
  23. tabFeriesFixes = "01/01.01/05.08/05.01/11.11/11.14/07.15/08.25/12";
  25. AA = parseInt(pAnnee,10);
  27. JOUR = 1000 * 60 * 60 * 24;
  28. NbOr = (AA % 19) + 1;
  29. S1 = Math.floor(AA/100);
  30. S2 = Math.floor((2 + S1) * 3/7);
  31. Epacte = (11 * NbOr - (3 + S2)) % 30;
  32. Delta = (Epacte + 6) % 30;
  33. PLune = new Date(AA, 3, 19-Delta);   // 19 Avril de l'année AA
  34. if (Epacte == 24) { PLune = new Date(PLune.valueOf() - JOUR); }
  35. if ((Epacte == 25) && (AA >= 1900 && AA < 2000)) { PLune = new Date(PLune.valueOf() - JOUR); }
  37. Paques = new Date(PLune.valueOf() - (PLune.getDay() * JOUR) + 8 * JOUR);
  38. tabTousFeries = tabFeriesFixes + "." + padNumber(Paques.getDate(), 2) + "/" + padNumber(Paques.getMonth()+1,2);
  40. Ascension = new Date(Paques.valueOf() + 38*JOUR);
  41. tabTousFeries += "." + padNumber(Ascension.getDate(), 2) + "/" + padNumber(Ascension.getMonth()+1, 2);
  43. Pentecote = new Date(Ascension.valueOf() + 11*JOUR);
  44. tabTousFeries += "." + padNumber(Pentecote.getDate(), 2) + "/" + padNumber(Pentecote.getMonth()+1, 2);
  46. return tabTousFeries.split("." );
  47. }
  49. /* --------------------------------------------------------------- */
  50. /* Compare les deux dates pDate1 et pDate2 et retourne 0, <0 ou >0 */
  51. /* Les paramètres pDate1 et pDate2 sont des chaînes de caractères  */
  52. /* au format JJ/MM/SSAA OBLIGATOIREMENT !                          */
  53. /* --------------------------------------------------------------- */
  54. /* Fonction stand-alone !                                          */
  55. /* --------------------------------------------------------------- */
  57. function compareDates(pDate1, pDate2) {
  58.     dat1 = parseInt(new String(pDate1).split("/" ).reverse().join("" ), 10);
  59.     dat2 = parseInt(new String(pDate2).split("/" ).reverse().join("" ), 10);
  60.     return dat1 - dat2;
  61. }


Message édité par machinbidule1974 le 09-12-2002 à 11:43:34
Reply

Marsh Posté le 08-12-2002 à 18:50:53    

Moi jai plein de fonction pour manipuler les <DIV>
 

Code :
  1. var ns4 = (document.layers)? true:false; //détéction du browser
  2. var ie4 = (document.all)? true:false;
  3. var dom = (document.getElementById)? true:false; //window.sidebar fonctionne aussi ... mieux ?
  5. var NbImage = 0;
  6. var Img = new Array();
  7. var Loading = false;
  9. function MoveWin(name,X,Y)
  10. {
  11. if (ie4 || dom)
  12.    {
  13.     name.moveTo(X,Y)
  14.  }
  15. }
  17. function ChangeLayer(id,HTML)
  18. {
  19. if (ie4)//marche aussi avec Opera 7. il faudrait faire un meilleur test
  20.    {
  21.  document.getElementById(id).innerHTML = HTML;
  22.  }
  23. /*else if (ns4)
  24.    {
  25.     document.open();
  26.     document.write("caca" );
  27.  document.close();
  28.  document.layers[id].write = HTML;
  29.  }*/
  30. }
  32. function HideOverflow()
  33. {
  34. document.body.style.overflow='hidden';
  35.   }
  36.  
  37. function ChangeImg(name,newsrc)//marche pas terrible pour l'instant, en dévellopement
  38. {
  39.   if(document.images)
  40.    {
  42.     if(Loading == false)
  43.      {
  44.       Img[NbImage] = new Image();
  45.      Img[NbImage].src = newsrc;
  46.   Loading=true;
  47.       eval("TimeoutID = window.setTimeout(\"ChangeImg('"+name+"','"+newsrc+"')\",200);" );
  48.   }
  49.  else
  50.      {
  51.      
  52.       if(Img[NbImage].complete==true)
  53.        {
  54.         //document.images[name].src = Img[NbImage].src;
  55.       eval("document."+name+".src = Img[NbImage].src;" );
  56.         NbImage = NbImage + 1;
  57.        Loading = false;
  58.         }
  59.         else
  60.          {
  61.          eval("TimeoutID = window.setTimeout(\"ChangeImg('"+name+"','"+newsrc+"')\",200);" );
  62.     }
  63.      }
  64.  }
  65. }
  67. function GetObj(id)//renvoie un identifiant manipulable
  68. {
  69.   if (dom)
  70.    {
  71.  return document.getElementById(id);
  72.  }
  73. else if (ie4)
  74.    {
  75.  return document.all[id];
  76.  }
  77. else if (ns4)
  78.    {
  79.  return document.layers[id];
  80.  }
  81.   else
  82.    {
  83.     return false;
  84.    }
  85.   }
  87. function HideLayer(id)//rend invisible un layer
  88. {
  89. if (dom)
  90.    {
  91.  document.getElementById(id).style.visibility = "hidden";
  92.  }
  93. else if (ie4)
  94.    {
  95.  document.all[id].style.visibility = "hidden";
  96.  }
  97. else if (ns4)
  98.    {
  99.  document.layers[id].visibility = "hide";
  100.  }
  101. }
  103. function ShowLayer(id)//affiche un layer
  104. {
  105. if (dom)
  106.    {
  107.  document.getElementById(id).style.visibility = "visible";
  108.  }
  109. else if (ie4)
  110.    {
  111.  document.all[id].style.visibility = "visible";
  112.  }
  113. else if (ns4)
  114.    {
  115.  document.layers[id].visibility ="show";
  116.  }
  117. }
  119. function MoveLayerX(id,X)//déplace un layers
  120. {
  121. if (dom)
  122.    {
  123.  document.getElementById(id).style.left = X;
  124.  }
  125. else if (ie4)
  126.    {
  127.  document.all[id].style.posLeft = X;
  128.  }
  129. else if (ns4)
  130.    {
  131.  document.layers[id].pageX = X;
  132.  }
  133. }
  134.  
  135. function MoveLayerY(id,Y)//déplace un layer vertivalement
  136. {
  137. if (dom)
  138.    {
  139.  document.getElementById(id).style.top = Y;
  140.  }
  141. else if (ie4)
  142.    {
  143.  document.all[id].style.posTop = Y;
  144.  }
  145. else if (ns4)
  146.    {
  147.  document.layers[id].pageY = Y;
  148.  }
  149. }
  151. function MoveLayer(id,X,Y)//déplace un layer horizontalement
  152. {
  153. if (dom)
  154.    {
  155.  document.getElementById(id).style.left = X;
  156.  document.getElementById(id).style.top = Y;
  157.  }
  158. else if (ie4)
  159.    {
  160.  document.all[id].style.posLeft = X;
  161.  document.all[id].style.posTop = Y;
  162.  }
  163. else if (ns4)
  164.    {
  165.  document.layers[id].pageX = X;
  166.  document.layers[id].pageY = Y;
  167.  }
  168. }
  169.  
  170.   function getLeft(MyObject)
  171. {
  172. if (dom || ie4)
  173.  {
  174.     if (MyObject.offsetParent)
  175.         return (MyObject.offsetLeft + getLeft(MyObject.offsetParent));
  176.     else
  177.         return (MyObject.offsetLeft);
  178.     }
  179. if (ns4)
  180.  {
  181.  return (MyObject.x);
  182.  }
  183. }
  186. function getTop(MyObject)
  187. {
  188. if (dom || ie4)
  189.  {
  190.  if (MyObject.offsetParent)
  191.   return (MyObject.offsetTop + getTop(MyObject.offsetParent));
  192.  else
  193.   return (MyObject.offsetTop);
  194.  }
  195. if (ns4)
  196.  {
  197.  return (MyObject.y);
  198.  }
  199. }
  201. function AnchorLayer(id,AnchorId)//positionne un layer par rapport à une ancre. ne pas oublier id et name dans l'encre
  202. {
  203. var Anchor;
  204. if (dom)
  205.    {
  206.  Anchor = document.getElementById(AnchorId);
  207.  }
  208. else if (ie4)
  209.    {
  210.  Anchor = document.all[AnchorId];
  211.  }
  212. else if (ns4)
  213.    {
  214.     Anchor = document.anchors[AnchorId];
  215.     }
  216. MoveLayer(id,getLeft(Anchor),getTop(Anchor));
  217. }
  219. function out(id)//cache un layer après un compte à rebours, utile pour des menus
  220. {
  221. eval("window.time"+id+" = window.setTimeout(\"hidelayer('"+id+"')\", 800);" );
  222. }
  224. function over(id)//annule le compte à rebours
  225. {
  226. showlayers(id);
  227. if(eval("window.time"+id)){
  228.  window.clearTimeout(eval("window.time"+id));
  229.  }
  230. }


Message édité par The Kinetics le 08-12-2002 à 18:56:41
Reply

Marsh Posté le 08-12-2002 à 18:51:04    

Je cherche un outil gratuit et bien fait pour faire du HTML/JS ... EN ce moment j'utilise HTML-KIT ... IL souffre de nombreux défault(à mon goût), je cherche quelquechose de plus simple et de plus efficace ! :hello:


Message édité par The Kinetics le 08-12-2002 à 19:00:56
Reply

Marsh Posté le 08-12-2002 à 20:07:46    

The Kinetics a écrit :

Je cherche un outil gratuit et bien fait pour faire du HTML/JS ... EN ce moment j'utilise HTML-KIT ... IL souffre de nombreux défault(à mon goût), je cherche quelquechose de plus simple et de plus efficace ! :hello:  


 
ConTEXT, plus simple tu meurs, et il contient tout ce qu'il faut pour faire du HTML, du JS, du PHP etc...
 
Enfin, mon avis est que tout devrait se situer du côté serveur. Les applications en javascript, j'en vois pas bcp de vraiment utile et de toutes façon, il faut bien s'assurer qu'avec la désactivation du JS, on a pas de problème.
 
Bref, le js, c'est juste pour du superflu...
 
Par exemple, il ne me viendrait plus à l'idée de vérifier un formulaire avec du JS.

Reply

Marsh Posté le 08-12-2002 à 21:15:53    

Hermes le Messager a écrit :


 
Bref, le js, c'est juste pour du superflu...
 


 
 
 [:tecoswsn] c'est c'la, rouiiii


---------------
Que Viva Galicia y España [Quand on a pas ce que l'on aime, il faut aimer ce que l'on a!]
Reply

Marsh Posté le 08-12-2002 à 22:55:34    

merci pour le prog hermes je vais tester !
 
Pour ce qui est du javascript, si je te suis je peux mettre mon site que j'essaye de dévolloper à la poubelle !
 
En faite cest vrai que des fois je me casse les burnes pour rien à vouloir faire un site en js/html alors que en flash ca serais 1000X plus simple ...
 
Honnetement que pensez vous de ca: www.magnin-sante.ch/dhtml
 

Reply

Marsh Posté le 08-12-2002 à 22:55:34   

Reply

Marsh Posté le 08-12-2002 à 22:57:22    

The Kinetics a écrit :


Honnetement que pensez vous de ca: www.magnin-sante.ch/dhtml


que tu peux effectivement le mettre a la poubelle... ca fait une jolie page blanche (oui, j'ai javascript activé, non, je n'ai pas ie)

Reply

Marsh Posté le 08-12-2002 à 23:01:44    

:sweat: Heuuu tu a activé les Pop-up ?
Tu utilise quoi comme navigateur ?
 

Reply

Marsh Posté le 09-12-2002 à 11:40:42    

Voici d'autres fonctions utiles en JS
 
Pour ceux qui veulent désactiver le bouton droit de la souris sur leur formulaire
 

Code :
  1. /* --------------------------------------------------------------- */
  2. /* Désactiver le bouton droit de la souris                         */
  3. /* --------------------------------------------------------------- */
  5. var message = "Vous n'êtes pas autorisé à utiliser le bouton droit de la souris.";
  6. var ns4 = (document.layers) ? true : false;
  7. var ie4 = (document.all) ? true : false;
  8. var dom = (document.getElementById) ? true : false;
  10. if (dom) {
  11. if (document.addEventListener) {
  12.  document.addEventListener("mouseup", RightMouseDisable, false);
  13. } else {
  14.  document.oncontextmenu = IsForbidden;
  15. }
  16. } else if (ie4) {
  17. document.onkeydown = CheckKey;
  18. document.onmousedown = RightMouseDisable;
  19. } else if (ns4) {
  20. document.captureEvents(Event.MOUSEDOWN);
  21. document.onmousedown = RightMouseDisable;
  22. }
  24. function CheckKey() {
  25. var MyKey = event.keyCode;
  26. if (MyKey==93) {
  27.  var MyValue = IsForbidden;
  28.  return false;
  29. }
  30. }
  32. function RightMouseDisable(e) {
  33. var MyNumber=0;
  34. if (ie4) {
  35.  MyNumber = event.button;
  36. } else {
  37.  MyNumber = e.which;
  38.  if (MyNumber == 2 || MyNumber == 3) {
  39.   var MyValue = IsForbidden();
  40.   return false;
  41.  } else {
  42.   return true;
  43.  }
  44. }
  45. }
  47. function IsForbidden() {
  48. alert(message);
  49. return false;
  50. }


 
Autres fonctions sur les chaînes de caractères
 

Code :
  1. /* --------------------------------------------------------------- */
  2. /* Vérifie la numéricité d'une chaîne                              */
  3. /* --------------------------------------------------------------- */
  5. function isNumeric(pStr) {
  6. return !(pStr.search(/\D/) >= 0);
  7. }
  9. /* --------------------------------------------------------------- */
  10. /* Change la première lettre d'une chaîne en majuscule             */
  11. /* Exemple: DERTY => Derty                                         */
  12. /* --------------------------------------------------------------- */
  14. function capitalize(pString) {
  15. return (pString.charAt(0)).toUpperCase() + pString.slice(1).toLowerCase();
  16. }
  18. /* --------------------------------------------------------------- */
  19. /* Supprime les espaces superflus dans la chaîne de caractères en  */
  20. /* paramètre                                                       */
  21. /* --------------------------------------------------------------- */
  23. function trim(inputString) {
  24. if (typeof inputString != "string" ) {
  25.  return inputString;
  26. }
  28. var retValue = inputString;
  29. var ch = retValue.substring(0, 1);
  31. while (ch == " " ) {
  32.  retValue = retValue.substring(1, retValue.length);
  33.  ch = retValue.substring(0, 1);
  34. }
  36. ch = retValue.substring(retValue.length-1, retValue.length);
  38. while (ch == " " ) {
  39.  retValue = retValue.substring(0, retValue.length-1);
  40.  ch = retValue.substring(retValue.length-1, retValue.length);
  41. }
  43. while (retValue.indexOf("  " ) != -1) {
  44.  retValue = retValue.substring(0, retValue.indexOf("  " )) + retValue.substring(retValue.indexOf("  " )+1, retValue.length);
  45. }
  47. return retValue;
  48. }


 
Méthode de manipulation de champ
 

Code :
  1. /* --------------------------------------------------------------- */
  2. /* Réinitialise le champ pElem du document passé en paramètre      */
  3. /* --------------------------------------------------------------- */
  5. function resetField(pElem, doc) {
  6.     var el;
  8. if (doc != null) {
  9.  el = doc.forms[0].elements[pElem];
  10. } else {
  11.  el = window.document.forms[0].elements[pElem];
  12. }
  14.     switch(el.type) {
  15.  case 'hidden' : el.value = ''; break;
  16.  case 'password' : el.value = ''; break;
  17.  case 'text' : el.value = ''; break;
  18.  case 'textarea' : el.value = ''; break;
  19.  case 'select-one' : el.selectedIndex = 0; break;
  20.  case 'checkbox' : case 'radio' : el.checked = false; break;
  21.  default : for(var k=0 ; k<el.length ; k++) { el[k].checked = false; }
  22. }
  23. }


 
Test du navigateur
 

Code :
  1. /* --------------------------------------------------------------- */
  2. /* Teste si le navigateur est Netscape version >= 4.               */
  3. /* --------------------------------------------------------------- */
  4. /* @return true si le navigateur correspond au test                */
  5. /*         false sinon.                                            */
  6. /* --------------------------------------------------------------- */
  8. function isNS4() {
  9.     return (navigator.appName.substring(0,8) == "Netscape" && parseFloat(navigator.appVersion.substring(0,4)) >= 4);
  10. }
  12. /* --------------------------------------------------------------- */
  13. /* Teste si le navigateur est Internet Explorer version >= 5.      */
  14. /* --------------------------------------------------------------- */
  15. /* @return true si le navigateur correspond au test                */
  16. /*         false sinon.                                            */
  17. /* --------------------------------------------------------------- */
  19. function isIE5() {
  20.     return (navigator.appName.substring(0,9) == "Microsoft" && navigator.appVersion.indexOf("MSIE 5" ) != -1);
  21. }


 
Fonctions de travail sur les heures
 

Code :
  1. /* --------------------------------------------------------------- */
  2. /* Vérifie la validité d'une heure au format HH:MM                 */
  3. /* --------------------------------------------------------------- */
  5. function validTime(pTime) {
  6. tabTime = new String(pTime).split(":" );
  7. if (tabTime.length != 2) { return false; }
  8. if (!(isNumeric(tabTime [0]) && isNumeric(tabTime [1]))) { return false; }
  9. HH = eval(tabTime[0]);
  10. MM = eval(tabTime[1]);
  11. if (!((HH >= 0) && (HH <= 23))) { return false; }
  12. if (!((MM >= 0) && (MM <= 59))) { return false; }
  13. return true;
  14. }
  16. /* --------------------------------------------------------------- */
  17. /* Retourne une heure HH:MM sous la forme d'une durée en minutes   */
  18. /* --------------------------------------------------------------- */
  20. function HHMMToDuree(paramDuree) {
  21. if (!validTime(paramDuree)) { return -1; }
  22. tabTime = new String(paramDuree).split(":" );
  23. return eval(eval(tabTime[0])*60 + eval(tabTime[1]));
  24. }
  26. /* --------------------------------------------------------------- */
  27. /* Retourne une durée en minutes sous la forme HH:MM               */
  28. /* --------------------------------------------------------------- */
  30. function DureeToHHMM(paramDuree) {
  31. MM = eval(paramDuree) % 60;
  32. HH = (eval(paramDuree) - MM) / 60;
  33. return padNumber(HH, 2) + ":" + padNumber(MM, 2);
  34. }
  36. /* --------------------------------------------------------------- */
  37. /* Retourne l'heure courante en nombre de minutes depuis minuit    */
  38. /* --------------------------------------------------------------- */
  40. function getTime() {
  41. dat = new Date();
  42. return eval(dat.getHours() * 60 + dat.getMinutes());
  43. }


 
Si vous avez des choses à partager, n'hésitez pas
 
 :hello:

Reply

Marsh Posté le 09-12-2002 à 11:41:43    

The Kinetics a écrit :

:sweat: Heuuu tu a activé les Pop-up ?
Tu utilise quoi comme navigateur ?


ah oui, j'ai viré les popups sur les onload.
mozilla

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed