Fonctions, méthodes class et scripts utiles

// Votre code
// Commentez le dans la mesure de votre temps [cligne]

Array.prototype.inArray = function(val) {
	for(var a2 = 0; a2 < this.length; ++a2) {
		if(this[ a2] == val){
		return true;
		}
	}
	return false;
};

a écrit :
/** INFOBULLE
* ----------
* Jeremie Patonnier <jep@ibilab.net>
* Version : 1.0
* ----------
* Objet JavaScript qui permet de créer des infobulles hautement personnalisées
* ----------
* Propriétés de l'objet :
*
* 1 - infoBulle::decY : integer : Defaut : 20
* Décalage de l'infobulle par rapport au pointeur de la souris
* sur l'axe des Y.
*
* 2 - infoBulle::decX : integer : Defaut : 0
* Décalage de l'infobulle par rapport au pointeur de la souris
* sur l'axe des X.
*
* 3 - infoBulle::width : integer : Defaut : 210
* Largeur de l'infobulle (en pixel). il est conseillé que cette
* valeur soit egale à la valeur du style CSS width de l'infobulle.
*
* 4 - infoBulle::enableAlt : Boolean : Defaut : false
* Indique si l'objet doit se baser sur le contenu de l'attribut
* alt pour générer le contenue de l'infobulle (true) ou bien
* uniquement sur la contenue de l'attribut title (false).
*
* 5 - infoBulle::enableDrag : Boolean : Defaut : true
* Indique si l'infobulle doit suivre la souris (true) ou rester
* à un emplacement fixe sur la page (false);
*
* ----------
* Méthodes de l'objet :
*
* 1 - infoBulle::setTo(OBJ, TEXTE):
* Méthode qui permet d'assigner l'infobulle à l'objet OBJ et de
* rajouter le texte TEXTE à la suite du texte de l'infobulle
* pour cet objet.
*
* 2 - infoBulle::registerPointer(URLIMG):
* Méthode permetant de rajouter un pointeur suivant la souris
* à l'infobulle. Ce pointeur est une image dont l'URL est URLIMG.
*
* 3 - infoBulle::registerFormat(REGEXP,FORMAT):
* Méthode permettant de spécifié des règles de formatage du texte.
*
* La portion de texte à formater est identifié grace à un objet
* REGEXP, la règle de formatage est la chaine de caratère FORMAT.
*
* ----------
* Styliser l'infobulle :
* Le texte de l'infobulle est à l'interieur d'une balise DIV identifié par #insideBulle
* qui est elle même contenue dans une balise DIV identifié par #infoBulle
* ----------
* Exemple d'utilisation :
*
* <img src="test.jpg" id="test" alt="Photo test : Voici une infobulle personnalisé" />
*
* <script type="text/javascript">
* bulle = new infoBulle();
* bulle.enableAlt = true;
* bulle.setTo(document.getElementById("test"));
* bulle.registerFormat(/^(.*:)/,"<strong>$1</strong>");
* </script>
*
* <style type="text/css">
* #infoBulle{
* background:#FCC;
* border:1px solid #999;
* }
* #insideBulle{
* margin:10px;
* font:0.8em Arial,Helvetica,sans-serif;
* }
* </style>
*/

function DynamMenu(IdMenu){
		if(!document.getElementsByTagName) //On teste si on a le droit de faire mumuse avec le DOM sur les TAGNAME
			return; 
		var Menu = document.getElementById(IdMenu); //On récupère le menu
		var li = Menu.getElementsByTagName('LI'); //On récupère tous les LI du menu
   	  for(var ii=0; ii<li.length-1; ++ii) { //On scanne tous les LI
				var sousUL = li[ii].getElementsByTagName('UL'); //Pour chaque LI on recupère le UL dessous
				if (sousUL[0]) { //On vérifié qu'il y a un UL dans le LI
					sousUL[0].id = IdMenu + ii; //On met un ID à ce UL
					sousUL[0].style.display = "none";
					li[ii].getElementsByTagName('A')[0].href= "javascript:ShowHideMenu('" + IdMenu + ii + "')";
				}  
			}
	}
	window.onload = init;
	
	function ShowHideMenu(MenuId){
		var SousMenu = document.getElementById(MenuId);
		if (SousMenu.style.display=='block' || SousMenu.style.display == null) {
			SousMenu.style.display = 'none'; //ON cache le sous menu
		}
		else{ 
			SousMenu.style.display = 'block'; //On affiche le sous menu
		}
	}
	
	function init(){
		DynamMenu("menu");
	}

<ul id="menu">
	<li><a href="#">lien</a></li>
	<li><a href="#">lien</a></li>
	<li><a href="#">lien</a></li>
	<li><a href="#">Truc a cliquer pour etendre</a>
		<ul id="test">
			<li><a href="#">lien</a></li>
			<li><a href="#">infos 12</a>
				<ul>
					<li><a href="#">lien</a></li>
					<li><a href="#">encore un sous menu</a>
						<ul>
							<li><a href="#">lien</a></li>
							<li><a href="#">lien</a></li>
							<li><a href="#">encore un sous menu</a>
								<ul>
									<li><a href="#">lien</a></li>
									<li><a href="#">lien</a></li>
									<li><a href="#">encore un sous menu</a>
										<ul>
											<li><a href="#">lien</a></li>
											<li><a href="#">lien</a></li>
											<li><a href="#">lien</a></li>
										</ul>
									</li>
								</ul>
							</li>
						</ul>
					</li>
					<li><a href="#">lien</a></li>
				</ul>
			</li>
			<li><a href="#">lien</a></li>
		</ul>

	</li>
	<li><a href="#">lien</a></li>
	<li><a href="#">clic là aussi</a>
		<ul>
			<li><a href="#">lien</a></li>
			<li><a href="#">lien</a></li>
			<li><a href="#">lien</a></li>
		</ul>
	</li>
</ul>

/**
 * Classe de gestion graphique
 * 
 * @author : Marc Plessis
 * @version : 0.1
 * @date : 18/08/2005
 *
 */
function Graph() {
	this.constructor.apply(this,arguments);
}

//============================== Constantes ==================================

//============================== Variables ===================================
var opa=0;										//Pour gérer l'opacité de l'objet
var oOpacite=0;									//Pour avoir l'opacité à atteindre
var oPas=0;										//Pas pour atteindre l'opacité
var oObjet=false;								//Objet à modifier

Graph.prototype._oObj=false;					//Pour gérer l'objet à faire jouer
var tTimer=false;								//Permet de gérer le timer de relance

/**
 * Constructeur de la classe
 */
Graph.prototype.constructor=function(pObj,opacity) {

	//On initialise l'objet à faire jouer en variable
	if(pObj!=undefined) {
	
		this._oObj=document.getElementById(pObj)

		if (navigator.appName.indexOf("Explorer") > -1) {
			
			//Il s'agit de IE
			this._oObj.style.filter="Alpha(opacity="+(opacity*100)+")";
		}else{
			
			//Tentative de modification de la propriété opacity
			this._oObj.style.opacity=parseFloat(opacity);
		}
			
		//On indique le niveau d'opacité
		opa=opacity;
	}	
};

//=================================== Méthodes privées ======================================

//=================================== Méthodes publiques ======================================

/**
 * Méthode permettant de modifier l'opacité
 * @param int Opacity : opacité à atteindre
 * @param int Vitesse : Vitesse pour atteindre cette opacité en millisecondes
 * @param int nPas : Pas de modification de l'opacité
 * @param string oObj : Objet à modifier
 */
Graph.prototype.setOpacity=function(opacity,vitesse,nPas,oObj) {
	
	//On initialise les variables publique pour la fonction privée
	oOpacite=opacity;
	oPas=nPas;
	oObjet=oObj;
	
	//On appel la fonction suivant l'intervalle de temps demandée
	tTimer=setInterval(this._modOpacity,vitesse);
};

/**
 * Méthode permettant de modifier l'opacité (appel depuis la méthode publique)
 */
Graph.prototype._modOpacity=function() {
		
	//On met le pas d'avance à zéro
	var nPas_mod=0;
	
	//On va modifier l'opacité de l'objet
	if (opa>oOpacite) {
		nPas_mod = parseFloat(oPas) * -1;
	}else {
		nPas_mod=parseFloat(oPas);
	}

	if (navigator.appName.indexOf("Explorer") > -1) {
		
		//Il s'agit d'IE
		document.getElementById(oObjet).style.filter="Alpha(opacity="+((parseFloat(opa) + nPas_mod)*100)+")";
	}else{
		
		//Tentative de modification du niveau d'opacité
		document.getElementById(oObjet).style.opacity=parseFloat(opa) + nPas_mod;
	}
			
	//On indique l'opacité en cours
	opa=parseFloat(opa) + nPas_mod;
	
	if (nPas_mod<0) {
		if (opa<=oOpacite) {
		
			//On détruit l'objet car c'est la fin de la fonction
			clearInterval(tTimer);
		}
	}else {
		if (opa>=oOpacite) {
		
			//On détruit l'objet car c'est la fin de la fonction
			clearInterval(tTimer);
		}
	}
};

/**
 * Module permettant de gérer les événements sur les pages HTML
 * 
 * @author : Marc Plessis
 * @version : 0.1
 * @date : 10/08/2005
 *
 */

//============================== Constantes ===============================
GRAPH_PASOPACITY=0.05;				//Pas d'ouverture de l'accueil
GRAPH_VITOPACITY=75;				//Vitesse d'ouverture de l'accueil
OBJ_ACCUEIL="c_centre_ind"			//Objet à ouvrir

//============================== Variables ===================================

/**
 * Méthode lancée au chargement de la page
 */
onLoad = function()
{
	
	//On initialise la classe d'opacite
	var oObjOpa = new Graph(OBJ_ACCUEIL,0);
	
    //On demande une opacite plus élevée
 oObjOpa.setOpacity(0.95,GRAPH_VITOPACITY,GRAPH_PASOPACITY,OBJ_ACCUEIL);
}
 
//On éxecute la fonction onLoad au lancement de la page
window.onload = onLoad;

function getDOMName(DOMObject) //DOMObject(type : objet DOM)
{
   var tmp = new String();
   for (var i in DOMObject.parentNode.childNodes)
   {
     if(DOMObject.parentNode.childNodes[ i ] == DOMObject)
       tmp = i;
   }
   return tmp
}

function getDOMPath(DOMObject) //DOMObject(type : objet DOM)
{
  var tmp = new String();
  var tmpObj = DOMObject;
  while(tmpObj.parentNode != null)
  {
    tmp = '.childNodes[' + getDOMName(tmpObj) + ']' + tmp;
    tmpObj = tmpObj.parentNode;
  }
  return 'document' + tmp
}

function transform(xml, xsl, id)
{
  try {
    // navigateur basé sur Gecko
    if (window.XSLTProcessor)
    {
      var fragment;
      var xsltProcessor = new XSLTProcessor();
    	
      xsltProcessor.importStylesheet(xsl);
      fragment = xsltProcessor.transformToFragment(xml, document);
      var target = document.getElementById(id);
      target.appendChild(fragment);
      document.appendChild(target);
      // ActiveX pour Internet Explorer
    } else if (window.ActiveXObject) {
      var target = document.getElementById(id);
      target.innerHTML = xml.transformNode(xsl);
    }
  } catch (e) {
    return e;
  }
}

function loadXML(url)
{
  var xmlDoc;

  /* chargement du fichier XML */
  try {
    // navigateur basé sur Gecko
    if (document.implementation && document.implementation.createDocument)
    {
      xmlDoc = document.implementation.createDocument('', '', null);
      xmlDoc.load(url);
    // ActiveX pour Internet Explorer
    } else if (window.ActiveXObject) {
      try {
        xmlDoc = new ActiveXObject('Msxml2.XMLDOM');
      } catch (e) {
        xmlDoc = new ActiveXObject('Microsoft.XMLDOM');
      }
      xmlDoc.async = false;
      xmlDoc.load(url);
    // à l'aide de lobjet XMLHTTPRequest
    } else if (window.XMLHttpRequest) {
      xmlDoc = new XMLHttpRequest();
      xmlDoc.overrideMimeType('text/xml'); 
      xmlDoc.open('GET', url, false);
      xmlDoc.send(null);
      if (this.xmlDoc.readyState == 4) xmlDoc = xmlDoc.responseXML;
    }
  } catch (e) {
    return e;
  }
  return xmlDoc;
}

<body>

<p>
<a href="?yes">Je veux activer javascript.</a>
</p>

<script type="text/javascript"> 

if(location.search){
	var censure=document.createElement("script");
	censure.setAttribute("src","fonctions.js");// contient les instructions javascript;
	document.links[0].search="";
	document.links[0].firstChild.replaceData(3,12,"conchie");
	document.getElementsByTagName("body")[0].appendChild(censure);
}

</script>

<PUBLIC:COMPONENT>  
  <script type="text/javascript">
    [#green]/*
    HTMLElements Prototyping
    Thank to Jason Davis,  http://www.browserland.org/scripts/htmlelement/
 
    and  http://www.webmasterworld.com/forum91/4886.htm
 
    
    Here copying all methods & fields prototyped by script
    */[/#]
    
    [#green]// inherite all methods & fields of HTMLElement[/#]
    for(var j in HTMLElement.prototype)
      element[j] = HTMLElement.prototype[j];
    
    [#green]//if nodeName field exist & if is not document (HTMLElement methods & fields inherited)[/#]
    if(typeof element.nodeName != 'undefined' && element.nodeName != '#document')
    {
      var constructorName = 'HTML'+ constructors[element.nodeName] +'Element';
      [#green]// inherite all methods & fields of self HTMLElement constructor[/#]
      for(var j in eval(constructorName).prototype)
        element[j]= eval(constructorName).prototype[j];
    }
  </script>
</PUBLIC:COMPONENT>

var constructors = {
	HTML: 'Html', HEAD: 'Head', LINK: 'Link', TITLE: 'Title', META: 'Meta',
	BASE: 'Base', ISINDEX: 'IsIndex', STYLE: 'Style', BODY: 'Body',
	FORM: 'Form', SELECT: 'Select', OPTGROUP: 'OptGroup', OPTION: 'Option',
	INPUT: 'Input', TEXTAREA: 'TextArea', BUTTON: 'Button', LABEL: 'Label',
	FIELDSET: 'FieldSet', LEGEND: 'Legend', UL: 'UList', OL: 'OList',
	DL: 'DList', DT: 'Span', DD: 'Span', DIR: 'Directory', MENU: 'Menu', LI: 'LI', DIV: 'Div',
	P: 'Paragraph', H1: 'Heading', H2: 'Heading', H3: 'Heading', H4: 'Heading',
	H5: 'Heading', H6: 'Heading', Q: 'Quote', PRE: 'Pre', BR: 'BR',
	BASEFONT: 'BaseFont', FONT: 'Font', HR: 'HR', INS: 'Mod', A: 'Anchor',
	IMG: 'Image', OBJECT: 'Object', PARAM: 'Param', APPLET: 'Applet',
	MAP: 'Map', AREA: 'Area', SCRIPT: 'Script', TABLE: 'Table',
	CAPTION: 'TableCaption', COL: 'TableCol', TBODY: 'TableSection',
	THEAD: 'TableSection', TFOOT: 'TableSection', TR: 'TableRow',
	TD: 'TableCell', TH: 'TableCell', FRAMESET: 'FrameSet', FRAME: 'Frame', IFRAME: 'IFrame',
	SPAN: 'Span', FIELDSET : 'FieldSet'
};
[#green]//pour la Classe [#darkred]HTMLElement[/#][/#]
if(typeof HTMLElement == 'undefined') var HTMLElement = function(){};
[#green]//Pour les sousClasses [#darkred]HTML[/#]Xxx[#darkred]Element[/#] ou Xxx est contenu dans le tableau [i]constructor[/i][/#]
for(var j in constructors)
{
  var constructorName = 'HTML'+ constructors[j] +'Element';
  if(eval('typeof ' + constructorName +' == \'undefined\''))
    eval('var ' + constructorName + ' = function(){}');
}
[#green]//Et la partie la plus interéssante du script celle pour laquel tout ce script est fait : l'implémentation de méthode au classes HTMLElement s
Ici c'est l'implémentation de la méthode foo() sur tous les éléments Inputs[/#]
[#blue]HTMLInputElement.prototype.foo = function()
{
  alert(this.value)
};[/#]

<html>
  <head>
    <title>HTMLElement.prototype</title>
    <script type="text/javascript" src="script.js"></script>
    [#green]<!--[if ie]>
      <style type="text/css">
        *{behavior:url(behavior.htc)}
      </style>
    <![endif]-->[/#]
   </head>
   <body>
     <input type="button" onclick="this.foo()" value="click">
   </body>
</html>