/branches/jsdoc_tk_gui/setup/workingDirectory/Webeo/gui/table/Table.js

   1ek.require("gui.window.Wait");
   2ek.require("ao.data.Json");
   3ek.require("ao.ajax.Ajax");
   4ek.require("gui.button.Button");
   5ek.require("gui.event.KeyListener");
   6
   7ek.register("gui.table.Table");
   8
   9ek.requireCSS("css.gui.table.Table", "table.Table");
  10
  11
  12/**
  13  *@require  "wait.js"
  14  *@require  "button.js"
  15  *@require  "json.js"
  16   *@require  "sarissa.js"
  17  *
  18  *  Copyright 2006 Emuki-Group for Emukina.fr
  19  *
  20  *  Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
  21  *  file except in compliance with the License. You may obtain a copy of the License at
  22  *
  23  *         http://www.apache.org/licenses/LICENSE-2.0
  24  *
  25  *  Unless required by applicable law or agreed to in writing, software distributed under the
  26  *  License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND,
  27  *  either express or implied. See the License for the specific language governing permissions
  28  *  and limitations under the License.
  29  **/  
  30  
  31/** Instance Manager */
  32var manager = new Array();
  33var ajax = new Array();    
  34
  35/** AJAX Manager */
  36//var xmlhttp;
  37
  38/** Determine si le navigateur est IE */
  39var isIE = (navigator.userAgent.toLowerCase().indexOf("msie")>-1);
  40//var isIE = (navigator.appName == "Microsoft Internet Explorer");
  41
  42/** 
  43 * Gestion des combinaisons de touches du clavier 
  44 * avec redirection de l'event vers le bon tableau
  45  * grace ? l'instance manager
  46 *//*
  47document.onkeyup = function(e){
  48
  49	var model = getCurrentTable();
  50	var isCtrlPressed;
  51	var key;
  52	if(isIE){
  53		isCtrlPressed = window.event.ctrlKey;
  54		key = window.event.keyCode;
  55	}else{
  56		isCtrlPressed = e.ctrlKey;
  57		key = e.which;
  58	}
  59	
  60	if(isCtrlPressed){
  61		switch (key){
  62			//Gauche
  63			case 37: model.pageCourante = (model.pageCourante-1 >1) ? model.pageCourante-1 : 1 ;
  64				break;
  65			//Haut
  66			case 38: model.pageCourante = 1; 
  67				break;
  68			//Droite
  69			case 39: model.pageCourante = (model.pageCourante+1 < model.nbPages) ? model.pageCourante+1 : model.nbPages;
  70				break;
  71			//Bas
  72			case 40: model.pageCourante = model.nbPages;
  73				break;
  74			case 49: model.sortAgain(0,(model.sens == 0)?1:0); break;
  75			case 50: model.sortAgain(1,(model.sens == 0)?1:0); break;
  76			case 51: model.sortAgain(2,(model.sens == 0)?1:0); break;
  77			case 52: model.sortAgain(3,(model.sens == 0)?1:0); break;
  78			case 53: model.sortAgain(4,(model.sens == 0)?1:0); break;
  79			case 54: model.sortAgain(5,(model.sens == 0)?1:0); break;			
  80			case 55: model.sortAgain(6,(model.sens == 0)?1:0); break;
  81			case 56: model.sortAgain(7,(model.sens == 0)?1:0); break;
  82			case 57: model.sortAgain(8,(model.sens == 0)?1:0); break;
  83			default:break;
  84		}
  85		model.rebuild();
  86	}
  87}*/
  88
  89/**
  90 * @return  la table qui poss?de le focus
  91 */
  92function getCurrentTable(){
  93	for(i = 0 ; i < manager.length ; i++){		
  94		if(manager[i].hasFocus){
  95			return manager[i];
  96		}
  97	}
  98}
  99
 100/**
 101 * Définition de l'objet métier Column
 102 * @param name Nom de la colonne
 103 * @param type Type de la colonne (String, Number)
 104 *@param isSorted Booléen indiquant si on peut trié la colonne
 105 * @param filter Type du filtre ? utilisé '', input, select, number
 106 * @param width Largeur de la colonne en px ou %
 107 * @param compare Méthode de caomparaison ? utiliser 
 108 */
 109function column(name, type, isSorted, filter, width, compare){
 110	this.name = name;
 111	this.type = type;
 112	this.isSorted = isSorted;
 113	this.filter = filter;
 114	this.width = width;
 115	this.compare = compare;
 116}
 117
 118/**
 119 * Définition de l'objet métier row
 120 * @param cols Tableau contenant les valeurs pour chaque colonne
 121 * @param children Tableau contenant les lignes enfants
 122 */
 123function row(cols, children){
 124	//Array
 125	this.cols = cols;	
 126	this.expanded = false;//Par defaut false
 127	this.children = children;
 128}
 129row.prototype.getValueAt = function(i){
 130	return (this.cols[i]!= undefined)?this.cols[i]:"";
 131}
 132row.prototype.getSortValue = function(){
 133	return this.getValueAt(this.sortIdx);
 134}
 135  
 136//-----------------------------------------------------------------------------
 137//Gestion du TreeTableFilteredPagedSorted
 138//-----------------------------------------------------------------------------
 139/**
 140 * Construction d'un nouveau TreeTable dans le conteneur passé en param?tre
 141 * @param divId l'id du div contenant le tableau
 142 */ 
 143function TreeTable(divId){
 144		
 145	this.divName = divId;
 146	this.divDOM = document.getElementById(this.divName);
 147	this.divDOM.model = this;
 148	
 149	this.divDOM.innerHTML = "<h4><b><i>Tableau en cours d'initialisation</i></b></h4>";
 150	
 151	this.info = 'info'+ this.divName;
 152	this.cbb;
 153	this.hasFocus = false;	
 154	
 155	//Tableau source contenat toutes les lignes
 156	this.rows = new Array();
 157	
 158	//Tableau filtré ne contenant que les lignes corespondant aux crit?res
 159	this.filteredContent = new Array();
 160	
 161	//Tableau stockant les filtres en cours d'utilisation
 162	this.filtreCourant = new Array();
 163	
 164	
 165	//-----------------------------------------------------------------------------
 166	//Definition des constantes du TreeTableFilteredPagedSorted 
 167	//-----------------------------------------------------------------------------
 168	this.size = 0 ;
 169	this.MAX_LINES = 10;
 170	this.pageCourante= 1;
 171	this.nbPages ;
 172	
 173	this.sens = 0;
 174	this.sortCol = 0;
 175	
 176	// DEBUT DU PARAMETRAGE
 177	
 178	this.waitActive = true;
 179	
 180	this.alt_bgcolor1 = "white";
 181	this.alt_bgcolor2 = "grey";
 182	
 183	this.repImg = "img/table/"
 184	this.displayDisabledIcon = true;
 185	
 186	//Images du tri
 187	this.asc_on		= "asc.gif";
 188	this.asc_press	= "asc_p.gif";
 189	this.asc_over	= "asc_h.gif";
 190	this.desc_on	= "desc.gif";
 191	this.desc_press	= "desc_p.gif";
 192	this.desc_over	= "desc_h.gif";
 193
 194	//Image de la pagination
 195	this.first	= "first.gif";
 196	this.first_o= "first.gif";
 197	this.first_p= "first.gif";
 198	this.first_d= "first_d.gif";	
 199	this.prev	= "prevt.gif";
 200	this.prev_o	= "prev.gif";
 201	this.prev_p	= "prev.gif";
 202	this.prev_d	= "prev_d.gif";
 203	this.next	= "next.gif";
 204	this.next_o	= "next.gif";
 205	this.next_p	= "next.gif";
 206	this.next_d	= "next_d.gif";
 207	this.last	= "last.gif";
 208	this.last_o	= "last.gif";
 209	this.last_p	= "last.gif";
 210	this.last_d	= "last_d.gif";
 211
 212
 213
 214	//Image de l'arbre
 215	this.tree_closed= "plus.gif";
 216	this.tree_open	= "plus.gif";
 217	this.one_leaf	= "minus.gif";
 218	this.last_leaf	= "minus.gif";
 219		
 220	// FIN DU PARAMETRAGE
 221
 222	//Manage hte keyboard shortcuts
 223	getKeyListener().add(37, "getCurrentTable().pageCourante = (getCurrentTable().pageCourante-1 >1) ? getCurrentTable().pageCourante-1 : 1 ;getCurrentTable().rebuild();", false, true, false);//Ctrl + Gauche
 224	getKeyListener().add(38, "getCurrentTable().pageCourante = 1; getCurrentTable().rebuild();", false, true, false);//Ctrl + Haut
 225	getKeyListener().add(39, "getCurrentTable().pageCourante = (getCurrentTable().pageCourante+1 < getCurrentTable().nbPages) ? getCurrentTable().pageCourante+1 : getCurrentTable().nbPages;getCurrentTable().rebuild();", false, true, false);//Ctrl+ Droite
 226	getKeyListener().add(40, "getCurrentTable().pageCourante = getCurrentTable().nbPages;getCurrentTable().rebuild();", false, true, false);//Ctrl + Bas
 227	getKeyListener().add(49, "getCurrentTable().sortAgain(0,(getCurrentTable().sens == 0)?1:0); getCurrentTable().rebuild();", false, true, false);
 228	getKeyListener().add(50, "getCurrentTable().sortAgain(1,(getCurrentTable().sens == 0)?1:0); getCurrentTable().rebuild();", false, true, false);
 229	getKeyListener().add(51, "getCurrentTable().sortAgain(2,(getCurrentTable().sens == 0)?1:0); getCurrentTable().rebuild();", false, true, false);
 230	getKeyListener().add(52, "getCurrentTable().sortAgain(3,(getCurrentTable().sens == 0)?1:0); getCurrentTable().rebuild();", false, true, false);
 231	getKeyListener().add(53, "getCurrentTable().sortAgain(4,(getCurrentTable().sens == 0)?1:0); getCurrentTable().rebuild();", false, true, false);
 232	getKeyListener().add(54, "getCurrentTable().sortAgain(5,(getCurrentTable().sens == 0)?1:0); getCurrentTable().rebuild();", false, true, false);		
 233	getKeyListener().add(55, "getCurrentTable().sortAgain(6,(getCurrentTable().sens == 0)?1:0); getCurrentTable().rebuild();", false, true, false);
 234	getKeyListener().add(56, "getCurrentTable().sortAgain(7,(getCurrentTable().sens == 0)?1:0); getCurrentTable().rebuild();", false, true, false);
 235	getKeyListener().add(57, "getCurrentTable().sortAgain(8,(getCurrentTable().sens == 0)?1:0); getCurrentTable().rebuild();", false, true, false);
 236
 237	
 238	this.divDOM.onmouseover = function(){
 239		this.model.hasFocus = true;
 240		for(var i = 0 ; i < manager.length; i++){
 241			if(manager[i]==this.model){
 242				manager[i].hasFocus = true;
 243				manager[i].divDOM.className = 'container hasFocus';
 244			}else{
 245				manager[i].hasFocus = false;
 246				manager[i].divDOM.className = 'container';
 247			}
 248		}
 249	};
 250	
 251	manager[manager.length] = this;
 252	ajax[this.divName] = new XMLHttpRequest();
 253  	ajax[this.divName].model = this;
 254	ajax[this.divName].onreadystatechange= this.readyToLoad;
 255}
 256
 257TreeTable.prototype.drawWaitInitWindow = function(){
 258	return '<h4><i>Tableau en cours d\'initialisation</i></h4>';
 259}
 260
 261TreeTable.prototype.initWaitDiv = function(){
 262	this.wait = new Wait(this.divName+'_TABLE', 'Tableau en cours de rafraichissement', 'wait',0 ,200);
 263}
 264
 265TreeTable.prototype.build = function(){
 266	this.getLogger().trace("build");
 267	//Déclaration HTML du tableau
 268	this.domTable = document.createElement("table");
 269	this.domTable.setAttribute("id", this.divName+"_TABLE");
 270	this.domTable.setAttribute("class", "treetable");
 271	
 272	this.drawHeaders();
 273	this.drawBody();
 274	this.drawFooters();
 275	
 276	this.divDOM.appendChild(this.domTable);
 277	
 278	//Init du wait
 279	this.initWaitDiv();
 280	
 281	//On init les gestionnaires d'evennements
 282	this.initSortButtons();//on init les boutons de tri
 283	this.refreshNavigateButtons(); // on init les boutons de navigations
 284	
 285	this.refreshDisplayBy(this.MAX_LINES);
 286	
 287	//TODO new Tooltip (this.gotoPage, true, 'Entrez un numéro de page');
 288}
 289
 290TreeTable.prototype.rebuild = function(){
 291	this.getLogger().trace("rebuild");
 292	if(this.waitActive)
 293		this.wait.mayShow();
 294	var deb = new Date();
 295	//On reinitialise le div contenant le tableau
 296	var tbody = this.divDOM.getElementsByTagName('tbody')[0];
 297	tbody.innerHTML = '';
 298	this.drawRows();		
 299	
 300	//On reinit les gestionnaires d'evennements
 301	this.refreshSortButtons();
 302	this.refreshNavigateButtons();
 303	this.refreshListPages();
 304	this.refreshDisplayBy(this.MAX_LINES);
 305	
 306	//alert(new Date() - deb);
 307	
 308	if(this.waitActive)
 309		this.wait.mayHide();
 310}
 311
 312/**
 313 * Crée l'ent?te du tableau permettant le tri et la ligne de filtrage
 314 * @param tab la liste des colonnes
 315 */
 316TreeTable.prototype.drawHeaders = function(){
 317	var domTHead = this.domTable.createTHead();
 318	
 319	var titleRow = document.createElement("tr");
 320		
 321	for(i = 0 ; i < this.columns.length ; i++){
 322
 323		var titleCell = document.createElement("td");
 324		titleCell.setAttribute("class", "footer");
 325		
 326		if(this.columns[i].isSorted)
 327			titleCell.appendChild(this.drawOneSortButton("asc", i));
 328			
 329		titleCell.appendChild(document.createTextNode(this.columns[i].name)) ;
 330		
 331		if(this.columns[i].isSorted)
 332			titleCell.appendChild(this.drawOneSortButton("desc", i));
 333			
 334		titleRow.appendChild(titleCell) ;
 335	}
 336	domTHead.appendChild(titleRow);
 337		
 338	var filterRow = document.createElement("tr");
 339	
 340	for(i = 0 ; i < this.columns.length ; i++){
 341		var filterCell = document.createElement("td");
 342		filterCell.setAttribute("class", "footer");
 343		
 344		if(this.columns[i].filter != '' ){
 345			if(this.filtreCourant[i]== undefined)
 346				this.filtreCourant[i] = "";
 347				
 348			var filter = document.createElement("input");
 349			filter.addAttributes([["name","Filter-"+this.columns[i].name],["id","Filter-"+this.columns[i].name],["type","text"],["length","20"],["value",this.filtreCourant[i]]]);
 350
 351			filter.model = this;
 352			filter.colNumber = i;
 353			filter.onkeypress = this.filterValidate;
 354			filter.onblur = this.filterAgain;
 355
 356			filterCell.appendChild(filter);
 357		}else{
 358			filterCell.appendChild(document.createTextNode("")) ;
 359		}
 360		filterRow.appendChild(filterCell) ;
 361	}
 362	domTHead.appendChild(filterRow);
 363}
 364TreeTable.prototype.drawFooters = function(){
 365	var domTFoot = this.domTable.createTFoot();
 366		
 367	var infoRow = document.createElement("tr");	
 368	
 369	var bigCell = infoRow.insertCell(0);
 370	bigCell.setAttribute("colspan", this.columns.length);
 371	bigCell.innerHTML=/*appendChild(document.createTextNode(*/this.rows.length+' lignes <div id="'+this.info+'"></div>'/*))*/;//TODO
 372	domTFoot.appendChild(infoRow);
 373	
 374	var footRow = document.createElement("tr");	
 375	var firstCell = footRow.insertCell(0);
 376	firstCell.setAttribute("class", "footer");
 377	firstCell.setAttribute("colspan", this.columns.length-3);
 378	firstCell.appendChild(this.drawListPages());
 379	var secondCell = footRow.insertCell(1);
 380	secondCell.setAttribute("class", "footer");
 381	secondCell.appendChild(this.drawNavigateButtons());
 382	var thirdCell = footRow.insertCell(2);
 383	thirdCell.setAttribute("class", "footer");
 384	thirdCell.setAttribute("colspan", this.columns.length-3);
 385	thirdCell.appendChild(this.getAfficheParComboBox());
 386
 387	domTFoot.appendChild(footRow);
 388}
 389
 390TreeTable.prototype.drawOneSortButton = function(sens, col){
 391	var b;
 392	if(sens == "desc" ){
 393		b = new PictureButton('desc_'+i+'_'+this.divName, this.repImg+'desc', 'gif', "Ctrl + "+(col+1), true, this, this.sortByButton);
 394	}else{
 395		b = new PictureButton('asc_'+i+'_'+this.divName, this.repImg+'asc', 'gif', "Ctrl + "+(col+1), true, this, this.sortByButton);
 396	}
 397	b.domBT.setAttribute("class", "sortButton");
 398	return b.getDom(); 
 399	//TODO  TOOLTIP <div class="tooltip" style="display:none;" id="TT_'+sens+'_'+col+'_'+this.divName+'"></div>';
 400}
 401
 402
 403TreeTable.prototype.initSortButtons = function(){
 404	this.descSortButtons = new Array();
 405	this.ascSortButtons = new Array();
 406	for(var i = 0 ; i < this.columns.length ; i++){
 407		if(this.columns[i].isSorted){
 408			this.descSortButtons[i] = document.getElementById('desc_'+i+'_'+this.divName).buttonModel;
 409			this.ascSortButtons[i] = document.getElementById('asc_'+i+'_'+this.divName).buttonModel;
 410		}
 411	}
 412	this.refreshSortButtons(); //TODO TO IMPROVE
 413}
 414
 415TreeTable.prototype.refreshSortButtons = function(){
 416	for(var i = 0 ; i < this.descSortButtons.length ; i++){
 417		if(this.sens==0){
 418			if(this.sortCol != i)
 419				this.descSortButtons[i].unselect();	
 420			else
 421				this.descSortButtons[i].select();	
 422			this.ascSortButtons[i].unselect(); 
 423		}
 424		if(this.sens==1){
 425			if(this.sortCol != i)
 426				this.ascSortButtons[i].unselect();
 427			else					
 428				this.ascSortButtons[i].select();
 429			this.descSortButtons[i].unselect(); 
 430		}
 431		
 432	}
 433}
 434TreeTable.prototype.drawBody = function(){
 435	this.getLogger().trace("drawBody");
 436	this.domTableBody = document.createElement("tBody");
 437	
 438	this.drawRows();
 439	
 440	this.domTable.appendChild(this.domTableBody);
 441}
 442/**
 443 *
 444 */
 445TreeTable.prototype.drawRows = function(){
 446	res = "";
 447	//Flush le tableau filtré
 448	this.filteredContent = new Array();
 449	
 450	//Boucle filtrant le tableau
 451	for(j = 0; j< this.rows.length  ; j++){
 452		
 453		if(this.isFiltreOK(this.rows[j])){
 454			this.filteredContent[this.filteredContent.length] = this.rows[j];	
 455			
 456		}
 457	}
 458	this.size = this.filteredContent.length;
 459	
 460	if(this.pageCourante > 1 && this.pageCourante > Math.ceil( this.size / this.MAX_LINES )){
 461		this.pageCourante = Math.ceil( this.size / this.MAX_LINES );
 462	}
 463	
 464	start = (this.pageCourante*this.MAX_LINES) - this.MAX_LINES; 
 465	//On ecrit les lignes du tableau
 466	writed = 0;
 467	for(k= start; k < this.size; k++){
 468	
 469		//Gestion de l'alternate background
 470		bgcolor = (writed%2 == 1)? this.alt_bgcolor2 : this.alt_bgcolor1 ;
 471				
 472		if( writed < this.MAX_LINES){
 473			//Write the first level row
 474			res += this.drawARow(this.filteredContent[k], k, bgcolor);
 475			//Write the first childs rows
 476			res += this.drawChildRows(this.filteredContent[k], k, bgcolor, this.filteredContent[k].expanded);
 477						
 478			writed++;
 479		}
 480	}
 481	if(writed==0){ //TODO columns length
 482		res += '<tr><td colspan="4">Aucunes lignes pour cette combinaison de filtre</td></tr>';
 483	}
 484
 485	return res;
 486}
 487
 488TreeTable.prototype.drawARow = function(row, idx, bgcolor){
 489	var domRow = document.createElement("tr");
 490	domRow.setAttribute("id", this.divName+'_row_'+idx);
 491	domRow.setAttribute("class", bgcolor);
 492	domRow.setAttribute("style", "cursor:pointer;");
 493	//domRow.onclick = this.toggleRow(domRow);
 494	domRow.onmouseover = this.toggleOver ;//Color(domRow, true);
 495	domRow.onmouseout = this.toggleOut ;//Color(domRow, false);
 496	
 497	for(var i = 0 ; i < this.columns.length ; i++){
 498		this.drawACell(domRow, row.getValueAt(i));
 499	}
 500
 501	this.domTableBody.appendChild(domRow);
 502}
 503/**
 504 * Recursive method
 505 */
 506TreeTable.prototype.drawChildRows = function(row, idRoot, bgcolor, rootExpanded){
 507	var res = '';	 
 508	for(r=0 ; r < row.children.length ; r++ ){
 509		//res += this.drawAChildRow(row.children[r],this.divName+'_row_'+idRoot, r, bgcolor, row.expanded && rootExpanded);
 510		//TODOres += this.drawChildRows(row.children[r], idRoot+'_'+r, bgcolor, (row.children[r].expanded && rootExpanded) );
 511	}
 512	return res;
 513}
 514
 515TreeTable.prototype.drawAChildRow = function(row, idxRoot, idx, bgcolor, visible){
 516	var display = (visible) ? '' : 'display:none;' ;	
 517	
 518	var res  = '<tr id='+idxRoot+'_'+idx+' class="'+bgcolor+'" style="cursor:pointer;'+display+'" ';
 519	res += 'onClick="document.getElementById(\''+this.divName+'\').model.toggleRow(this.id)" onMouseOver="document.getElementById(\''+this.divName+'\').model.toggleColor(this.id, true)" onMouseOut="document.getElementById(\''+this.divName+'\').model.toggleColor(this.id, false)">\n';
 520	for(var i = 0 ; i < this.columns.length ; i++){
 521		res += this.drawACell(row.getValueAt(i));
 522	}
 523	res +="\n</tr>\n";
 524
 525	return res;
 526}
 527
 528TreeTable.prototype.drawACell = function(domRow, value){
 529	//TODO <td><img src="'+this.repImg+this.tree_closed+'" ><a>'+this.filteredContent[k].nom+'</a></td>
 530	//return "<td>"+ value +"</td>";
 531	var domCell = document.createElement("td");
 532	domCell.appendChild(document.createTextNode(value));
 533	if(domRow instanceof HTMLTableRowElement && domRow.appendChild)
 534		domRow.appendChild(domCell);
 535	
 536}
 537
 538
 539TreeTable.prototype.updateMessage = function(message){
 540	
 541	document.getElementById(this.info).innerHTML = message;
 542
 543}
 544//-----------------------------------------------------------------------------
 545//Gestion de l'affichage du TreeTable
 546//-----------------------------------------------------------------------------
 547/**
 548 *
 549 *@param rowId Id long avec prefixe ex ==> table1_row_0_0_1_0
 550 */
 551TreeTable.prototype.getRowFromRowId = function(rowId){
 552	//rowId == this.divName_row_0_0_0
 553	var firstId = rowId.substring(5+this.divName.length); // == 0_0_0
 554	    firstId = firstId.substring(0, (firstId.indexOf('_')>0) ? firstId.indexOf('_') : firstId.length ); 
 555	//firstId == 0
 556	var childId = rowId.substr(5+this.divName.length+firstId.length+1 );
 557	//childId == 0_0
 558	var firstRow = this.filteredContent[parseInt(firstId)];
 559	
 560	return this.getRowFromId(firstRow, childId);
 561}
 562/**
 563 *@param row Ligne courante
 564 *@param childId Id court sans prefixe ex ==> 0_1_0
 565 */
 566TreeTable.prototype.getRowFromId = function(row, childId){
 567	if(childId.length == 0){
 568		return row;
 569	}
 570	//childId == 0_0
 571	var firstChildId = childId.substring(0, (childId.indexOf('_')>0)?childId.indexOf('_'):childId.length );
 572	var nextChildId = childId.substr(firstChildId.length+1);
 573	//firstChildId == 0  &&  nextChildId == 0
 574	if(row.children.length>0){
 575		var childRow = row.children[parseInt(firstChildId)];
 576		return this.getRowFromId(childRow, nextChildId);
 577	}
 578	return;		
 579}
 580TreeTable.prototype.toggleRow = function(rowToToggle){
 581	//alert(rowId);
 582	//var rowToToggle = this.getRowFromRowId(rowId);	
 583	
 584	for(i = 0 ; i<rowToToggle.children.length ;i++){
 585		if(document.getElementById(rowId+'_'+i).style.display == ''){
 586			document.getElementById(rowId+'_'+i).style.display = 'none';
 587			rowToToggle.expanded = false;
 588		}else{
 589			document.getElementById(rowId+'_'+i).style.display = '';
 590			rowToToggle.expanded = true;
 591		}
 592		this.revealChildren(rowToToggle.children[i], rowId+'_'+i, rowToToggle.expanded);
 593	}
 594}
 595TreeTable.prototype.revealChildren = function(row, rowId, visible){
 596	
 597	for(var i = 0 ; i < row.children.length; i++ ){
 598		if(visible && row.expanded){
 599			document.getElementById(rowId+'_'+i).style.display = '';
 600		}else{
 601			document.getElementById(rowId+'_'+i).style.display = 'none';
 602		}
 603		this.revealChildren(row.children[i], rowId+'_'+i, visible)
 604	}
 605	
 606}
 607
 608TreeTable.prototype.toggleAllVisibleRow = function(expand){
 609	//TODO Optimize only visible
 610	for(i = 0 ; i<this.filteredContent.length ;i++){
 611		for(j = 0 ; j<this.filteredContent[i].children.length ;j++){
 612			if(expand){
 613				document.getElementById(i+'_'+j).style.display = '';
 614				this.filteredContent[i].expanded = true;
 615			}else{
 616				document.getElementById(i+'_'+j).style.display = 'none';
 617				this.filteredContent[i].expanded = false;
 618			}
 619		}
 620	}
 621}
 622TreeTable.prototype.toggleAllRow = function(expand){
 623	
 624	row.prototype.expanded = expand;	
 625		
 626	this.rebuild();
 627}
 628
 629TreeTable.prototype.toggleColor = function(tr, mouseOver){
 630
 631	if(mouseOver){
 632		tr.oldClassName = tr.className; 
 633		tr.className = 'highlighted';
 634	}else{
 635		tr.className = tr.oldClassName;
 636	}
 637
 638}
 639TreeTable.prototype.toggleOver = function(){
 640		this.oldClassName = this.className; 
 641		this.className = 'highlighted';
 642}
 643TreeTable.prototype.toggleOut = function(){
 644		this.className = this.oldClassName;
 645}
 646
 647//-----------------------------------------------------------------------------
 648//Gestion du Tri
 649//-----------------------------------------------------------------------------
 650/**
 651 *
 652 * @param col numéo de la colonne ? trier
 653 * @param sens type du tri asc=0 desc=1
 654 */
 655TreeTable.prototype.sortByButton = function(){
 656	var infos = this.id.split("_");
 657	var sens = (infos[0]== "asc") ? 1 : 0;
 658	var col = infos[1];
 659	this.mainModel.sortAgain(col, sens);
 660}
 661/**
 662 *
 663 * @param col numéo de la colonne ? trier
 664 * @param sens type du tri asc=0 desc=1
 665 */
 666TreeTable.prototype.sortAgain = function(col , sens){
 667	
 668	if(col>=this.columns.length)	
 669		return;
 670	
 671	begin = new Date();
 672
 673	this.sens = sens;
 674	this.sortCol = col;
 675	row.prototype.sortIdx = col;
 676	this.rows.sort(this.columns[col].compare);
 677	
 678	//On inverse le tableau si le tri est de type desc
 679	if(this.sens == 1){
 680		this.rows.reverse()
 681	}
 682	
 683	this.rebuild();	
 684	this.updateMessage('Tableau trié en '+ (new Date()- begin)/1000 +' s' );
 685}
 686
 687//-----------------------------------------------------------------------------
 688//Gestion du Filtrage
 689//-----------------------------------------------------------------------------
 690TreeTable.prototype.filterValidate = function(e){
 691	if(navigator.appName == "Microsoft Internet Explorer"){
 692		
 693		if(window.event.keyCode == 13){
 694			this.model.filtreCourant[this.colNumber] = this.value;
 695			this.model.rebuild();
 696			//On remet le focus sur le filtre
 697			document.getElementById(this.id).focus();
 698		}else if(window.event.keyCode == 0) {
 699			this.model.filtreCourant[this.colNumber] = this.value;
 700			this.model.rebuild();
 701			//On met le focus sur le filtre suivant
 702			if(e.shiftKey){
 703				tabCol = (this.colNumber-1 < 0) ? this.model.columns.length-1: this.colNumber-1;
 704			}else{
 705				tabCol = (this.colNumber+2 > this.model.columns.length) ? 0: this.colNumber+1;
 706			}
 707			document.getElementById('Filter-'+this.model.columns[tabCol].name).focus();
 708		}
 709	
 710	}else{
 711		if(e.which == 13){
 712			this.model.filtreCourant[this.colNumber] = this.value;
 713			this.model.rebuild();
 714			//On remet le focus sur le filtre
 715			document.getElementById(this.id).focus();
 716		}else if(e.which == 0) {
 717			this.model.filtreCourant[this.colNumber] = this.value;
 718			this.model.rebuild();
 719			//On met le focus sur le filtre suivant
 720			if(e.shiftKey){
 721				tabCol = (this.colNumber-1 < 0) ? this.model.columns.length-1: this.colNumber-1;
 722			}else{
 723				tabCol = (this.colNumber+2 > this.model.columns.length) ? 0: this.colNumber+1;
 724			}
 725			document.getElementById('Filter-'+this.model.columns[tabCol].name).focus();
 726		}
 727	}
 728}
 729
 730/**
 731 *
 732 */
 733TreeTable.prototype.filterAgain = function(e){
 734	begin  = new Date();
 735	//On stocke le filtre courant
 736	if(this.value != this.model.filtreCourant[this.colNumber]){
 737		this.model.filtreCourant[this.colNumber] = this.value;
 738		
 739		//On reconstruit le tableau
 740		this.model.rebuild();
 741		
 742		this.model.updateMessage('Tableau filtré en '+ (new Date()- begin)/1000 +' s' );
 743		
 744		//On remet le focus sur le filtre
 745		document.getElementById(this.id).focus();
 746	}
 747}
 748
 749/**
 750 *
 751 */
 752TreeTable.prototype.isFiltreOK = function(row){
 753	
 754	//Pour chaque colonne
 755	for(var i = 0 ; i < this.columns.length ; i++  ){
 756		if(this.filtreCourant[i] == undefined){
 757			this.filtreCourant[i] = "";
 758		}
 759		if(this.columns[i].type == "String"){
 760			if( !( this.filtreCourant[i] == "" 
 761			   || row.cols[i].toLowerCase().indexOf(this.filtreCourant[i].toLowerCase())>-1  ) ){
 762				return false;
 763			}
 764		}else if(this.columns[i].type == "Number"){
 765			filtreEgal = (this.filtreCourant[i].substring(0,1) == "=" )? "="+this.filtreCourant[i] : this.filtreCourant[i] ;
 766			if( this.isSupInfEgalOK(this.filtreCourant[i]) 
 767			|| this.startWihtSupInfEgal(filtreEgal) && eval(row.cols[i]+filtreEgal)  ){
 768				//return true;
 769			}else{
 770				return false;
 771			}
 772		}
 773	}	
 774	return true;
 775
 776}
 777
 778/**
 779 * Gestion des tris spécifique au nombre
 780 * @return true si le filtre commencer par '=' , '>' ou'<'
 781 */ 
 782TreeTable.prototype.startWihtSupInfEgal = function(filter){
 783
 784	if(filter.substring(0,1) == "=" 
 785	|| filter.substring(0,1) == "<" 
 786	|| filter.substring(0,1) == ">")
 787		return true;
 788	
 789	return false;
 790}
 791
 792/**
 793 *
 794 */
 795TreeTable.prototype.isSupInfEgalOK = function(filter){
 796
 797if(filter=="" || filter==">" || filter=="<" || filter==">=" || filter=="<=" || filter=="=")
 798	return true;
 799else
 800	return false;
 801
 802}
 803
 804//-----------------------------------------------------------------------------
 805//Gestion de la pagination
 806//-----------------------------------------------------------------------------
 807
 808/**
 809 *
 810 */
 811TreeTable.prototype.pagineAgain= function(e){
 812	//Si le bouton est grisé on ne fait rien
 813	if(this.src.indexOf("_d") > 0 )
 814		return;	
 815		
 816	begin = new Date();
 817	switch(this.id){
 818		case "first_"+ this.mainModel.divName : this.mainModel.pageCourante = 1; break;
 819		case "prev_"+ this.mainModel.divName  : this.mainModel.pageCourante = this.mainModel.pageCourante-1; break;
 820		case "next_"+ this.mainModel.divName  : this.mainModel.pageCourante = this.mainModel.pageCourante+1; break;
 821		case "last_"+ this.mainModel.divName  : this.mainModel.pageCourante = this.mainModel.nbPages; break;
 822		case "goto_"+ this.mainModel.divName  : this.mainModel.pageCourante = (parseInt(this.value)>0 
 823					&& parseInt(this.value) <= this.mainModel.nbPages)?parseInt(this.value):1; break;
 824	}
 825	//On reconstruit le tableau
 826	this.mainModel.rebuild();
 827	
 828	if(this.id == "goto_"+ this.mainModel.divName){
 829		this.select();
 830	}
 831	
 832	this.mainModel.updateMessage('Page affiché en '+ (new Date()- begin)/1000 +' s' );
 833}
 834
 835/**
 836 * Retourne le text permettant de chosir une page
 837 */
 838TreeTable.prototype.drawListPages = function(){
 839	
 840	this.listPages = document.createElement("div");
 841	//On recupere le plus petit entier supérieur au rapport nombre/maxParPage
 842	this.nbPages = Math.ceil( this.size / this.MAX_LINES );
 843		
 844	this.listPages.setAttribute("id","pages_"+this.divName);
 845	this.listPages.setAttribute("style","text-align:left;display:inline");
 846	this.listPages.appendChild(document.createTextNode("Page Courante "+this.pageCourante+ "/"+this.nbPages));
 847	
 848	return this.listPages;
 849}
 850/**
 851 * 
 852 */
 853TreeTable.prototype.refreshListPages = function(){
 854	//On recupere le plus petit entier supérieur au rapport nombre/maxParPage
 855	this.nbPages = Math.ceil( this.size / this.MAX_LINES );
 856	this.listPages.innerHTML = 'Page Courante '+this.pageCourante+ '/'+this.nbPages ;	
 857
 858}
 859
 860TreeTable.prototype.drawNavigateButtons = function(){
 861	var res = document.createElement("div");
 862	res.setAttribute("id", "navigateButtons");
 863	
 864	res.appendChild(this.drawOneNavigateButton("first"));
 865	res.appendChild(this.drawOneNavigateButton("prev"));
 866	
 867	this.gotoPage = document.createElement("input");
 868	this.gotoPage.addAttributes([["type","text"],["size",1],["maxlength",4],["class","gotoInput"],["id","goto_"+ this.divName],["value",this.pageCourante]]);
 869	//vis = (this.nbPages>1)? '': 'disabled';
 870	//res += '" value="'+this.pageCourante+'" '+vis+'>';
 871	
 872	this.gotoPage.mainModel = this;
 873	this.gotoPage.onchange = this.pagineAgain;
 874	this.gotoPage.onkeypress = function(){
 875		if(isIE){
 876			if(window.event.keyCode == 13)
 877				this.blur();
 878		}
 879	}
 880	this.gotoPage.onfocus  = function(){
 881		this.select();
 882	}
 883	
 884	res.appendChild(this.gotoPage);
 885	
 886	res.appendChild(this.drawOneNavigateButton("next"));
 887	res.appendChild(this.drawOneNavigateButton("last"));
 888	
 889	return res;
 890}
 891
 892TreeTable.prototype.drawOneNavigateButton = function(name){		
 893	var b;
 894	switch(name){
 895		case "first":
 896			this.first = new PictureButton('first_'+ this.divName, this.repImg+'first', 'gif', "Ctrl + Haut", false, this, this.pagineAgain);
 897			b = this.first;
 898			break;
 899		case "prev":	
 900			this.prev = new PictureButton('prev_'+ this.divName, this.repImg+'prev', 'gif', "Ctrl + Gauche", false, this, this.pagineAgain );
 901			b = this.prev;
 902			break;
 903		case "next":
 904			this.next = new PictureButton('next_'+ this.divName, this.repImg+'next', 'gif', "Ctrl + Droite", false, this, this.pagineAgain);
 905			b = this.next;
 906			break;
 907		case "last":
 908			this.last = new PictureButton('last_'+ this.divName, this.repImg+'last', 'gif', "Ctrl + Bas", false, this, this.pagineAgain);
 909			b = this.last;
 910			break;
 911	}
 912	b.domBT.setAttribute("class", "navButton");
 913	
 914	return b.domBT;
 915}
 916/**
 917 *
 918 */
 919TreeTable.prototype.refreshNavigateButtons = function (){
 920	this.first.changeVisibility(this.pageCourante>2, this.displayDisabledIcon) ;
 921	this.prev.changeVisibility(this.pageCourante>1 , this.displayDisabledIcon) ; 
 922	this.next.changeVisibility(this.pageCourante<this.nbPages, this.displayDisabledIcon) ; 
 923	this.last.changeVisibility(this.pageCourante<this.nbPages-1, this.displayDisabledIcon) ; 
 924	
 925	this.gotoPage.value = this.pageCourante;
 926	this.gotoPage.disabled = !(this.nbPages>1);
 927}
 928
 929
 930
 931TreeTable.prototype.getAfficheParComboBox = function(){
 932	
 933	var content = document.createElement("div");
 934	
 935	content.appendChild(document.createTextNode("Affiché par "));
 936	
 937	this.cbb = document.createElement("select");
 938	this.cbb.setAttribute("id", 'displayBy' + this.divName);
 939	this.cbb.addOption([["value",2]],2);
 940	this.cbb.addOption([["value",5]],5);
 941	this.cbb.addOption([["value",10]],10);
 942	this.cbb.addOption([["value",25]],25);
 943	this.cbb.addOption([["value",50]],50);
 944	this.cbb.addOption([["value",100]],100);
 945	this.cbb.addOption([["value",200]],200);
 946	this.cbb.addOption([["value",500]],500);
 947	this.cbb.addOption([["value",1000]],1000);
 948	
 949	this.cbb.model = this;
 950	this.cbb.onchange = this.displayBy;
 951	
 952	content.appendChild(this.cbb);
 953	
 954	return content; 
 955}
 956
 957TreeTable.prototype.displayBy = function (){
 958	
 959	//var cbb = document.getElementById('displayBy'+ cbb.model.divName);
 960	//this == this.cbb
 961	this.model.MAX_LINES = this.options[this.selectedIndex].value;
 962	this.model.rebuild();
 963
 964}
 965
 966/**
 967 * This method will select the parameterized value in the parameterized combobox
 968 */
 969TreeTable.prototype.refreshDisplayBy = function (value){
 970	for(i = 0 ;i < this.cbb.options.length ; i++){	
 971		if(this.cbb.options[i].value == value ){
 972			this.cbb.selectedIndex =i;
 973			break;
 974		}
 975	}	
 976}
 977
 978/**
 979 *
 980 */
 981TreeTable.prototype.getSortMethodByName = function(name){
 982	switch(name){
 983		case 'loweredString': return this.compareLoweredString;
 984		case 'caseSensitiveString': return this.compareCaseSensitiveString;
 985		case 'number': ;
 986		default: return this.compareNumber ;
 987	}
 988}
 989/**
 990 *
 991 */	
 992TreeTable.prototype.compareLoweredString  = function(a,b){
 993	if(typeof(a.getSortValue()) == "string" && typeof(b.getSortValue()) == "string" ){
 994		if(a.getSortValue().toLowerCase() < b.getSortValue().toLowerCase()) return -1;
 995		if(a.getSortValue().toLowerCase() > b.getSortValue().toLowerCase()) return 1;
 996		return 0;	
 997	}
 998}
 999/**
1000 *
1001 */	
1002TreeTable.prototype.compareCaseSensitiveString = function(a,b){
1003	if(typeof(a.getSortValue()) == "string" && typeof(b.getSortValue()) == "string" ){
1004		if(a.getSortValue() < b.getSortValue()) return -1;
1005		if(a.getSortValue() > b.getSortValue()) return 1;
1006		return 0;	
1007	}
1008}
1009/**
1010 *
1011 */
1012TreeTable.prototype.compareNumber = function(a,b){
1013	if(isFinite(a.getSortValue()) && isFinite(b.getSortValue())){
1014		return b.getSortValue() - a.getSortValue();
1015	}
1016}
1017
1018/** 
1019 * CHARGEMENT DES DONNES
1020*/
1021
1022
1023
1024/**
1025 * Get an external File
1026 */
1027TreeTable.prototype.loadXMLFile = function(url){
1028	/*var xmlDoc;
1029	// code for IE
1030	if (window.ActiveXObject){
1031		xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
1032		xmlDoc.async=false;
1033		xmlDoc.load("data.xml");
1034		this.loadXML(xmlDoc);
1035	}else if (document.implementation && document.implementation.createDocument){
1036		// code for Mozilla, etc.
1037		xmlDoc= document.implementation.createDocument("","",null);
1038		xmlDoc.load(file);
1039		this.loadXML(xmlDoc);
1040	}else{
1041		alert('Your browser cannot handle this script');
1042	}	*/
1043	
1044	/*var oDomDoc = Sarissa.getDomDocument("","");
1045	oDomDoc.load(file);
1046	this.loadXML(oDomDoc);*/
1047	
1048	
1049  /*xmlhttp = new XMLHttpRequest();
1050  xmlhttp.onreadystatechange= this.readyToLoad;*/
1051
1052ajax[this.divName].open("GET", url, true);
1053ajax[this.divName].send(null);
1054
1055	/*xmlhttp.open("GET", url, true);
1056  	xmlhttp.send(null);*/
1057   
1058}
1059
1060TreeTable.prototype.readyToLoad = function() {
1061	var xmlhttp 
1062
1063	for(var id in ajax){
1064		xmlhttp = ajax[id];
1065		if (xmlhttp.readyState==4) {
1066			if (xmlhttp.status==200) {
1067			//if(xmlhttp.responseXML != null && xmlhttp.responseXML != undefined){
1068				xmlhttp.model.loadXML(xmlhttp.responseXML);
1069			//}
1070			}
1071		}
1072	}//end for
1073}
1074
1075TreeTable.prototype.loadXML = function(xml){
1076	var root = xml.getElementsByTagName("treetable")[0];		 
1077	var treetable = document.getElementById(root.getAttribute("id")).model;
1078	if(root.getAttribute("loadingMethod") == "xml" ){
1079		treetable.loadXMLData(root);
1080	}else if(root.getAttribute("loadingMethod") == "JSON" ){
1081		treetable.loadJSON(root.textContent);
1082	}else{
1083		alert('Error while retrieving AJAX data');
1084	}
1085}
1086
1087/** 
1088 * Load an xml object
1089 *@param xml an XML Object
1090 */
1091TreeTable.prototype.loadXMLData = function(xml){
1092	begin = new Date();
1093	//Parse Options
1094	var opts = new Array();
1095	var optNode = xml.getElementsByTagName("options")[0];
1096	
1097	for(var i = 0 ; i < optNode.getElementsByTagName("option").length ; i++){
1098		opts[optNode.getElementsByTagName("option")[i].getAttribute("name")] = optNode.getElementsByTagName("option")[i].getAttribute("value");
1099	}
1100	this.loadOptions(opts);
1101	
1102	//Parse Columns
1103	var cols = new Array();
1104	var colNode = xml.getElementsByTagName("cols")[0];
1105	for(var i = 0 ; i < colNode.getElementsByTagName("col").length ; i++){
1106				
1107		var c = colNode.getElementsByTagName("col")[i];
1108		cols[i] = new column(c.getAttribute("name"),c.getAttribute("type"), true, "input","10%" ,this.getSortMethodByName('loweredString'));
1109	}
1110	this.columns = cols;
1111	
1112	//Parse Rows
1113	var rows = new Array();
1114	var rowNode = xml.getElementsByTagName("rows")[0];
1115	for(var i = 0 ; i < rowNode.getElementsByTagName("row").length ; i++){
1116				
1117		var r = rowNode.getElementsByTagName("row")[i];
1118		var values = new Array();
1119		for(var j = 0 ; j < cols.length ; j++){
1120			values[j] = r.getAttribute(cols[j].name.toLowerCase());
1121		}
1122		rows[i] = new row(values, new Array());
1123	}
1124	this.rows = rows;
1125
1126	this.build();
1127	this.updateMessage('Tableau généré en '+ (new Date()- begin)/1000 +' s' );
1128}
1129
1130/**
1131 * Parse and load a JSON text
1132 *@param jsonTxt JSON text
1133 */
1134TreeTable.prototype.loadJSON = function(jsonTxt){
1135	begin = new Date();
1136	//Call the string method parseJSON added in the json.js file
1137	this.loadJSONVar(eval('(' + jsonTxt + ')'));
1138	//this.loadJSONVar(jsonTxt.parseJSON());
1139	this.updateMessage('Tableau généré en '+ (new Date()- begin)/1000 +' s' );
1140}
1141
1142/**
1143 * Load a JSON var
1144 *@param jsonVar JSON var
1145 */
1146TreeTable.prototype.loadJSONVar = function(jsonVar){
1147	if(jsonVar["options"] != null)
1148		this.loadOptions(jsonVar["options"]);	
1149	if(jsonVar["columns"] != null)
1150		this.loadColumns(jsonVar["columns"]);
1151	if(jsonVar["rows"] != null)
1152		this.loadRows(jsonVar["rows"]);
1153	this.build();
1154}
1155
1156/**
1157 * Load options of the table
1158 *@param options associative array
1159 */
1160TreeTable.prototype.loadOptions = function(options){
1161	for (var key in options) {
1162      this[key] = options[key];
1163	}
1164}
1165/**
1166 * Load columns of the table 
1167 *@param columns associative array
1168 */
1169TreeTable.prototype.loadColumns = function(columns){
1170	this.columns = new Array();
1171	for(i = 0 ; i < columns.length ; i++){
1172		this.columns.push(this.objectToColumn(columns[i]));
1173	}
1174}
1175/**
1176 * Convert an object to a column
1177 */
1178TreeTable.prototype.objectToColumn = function(obj){
1179	return new column(obj.name, obj.type, obj.isSorted, obj.filter,obj.width, this.getSortMethodByName(obj.sort));
1180}
1181/**
1182 * Load rows of the table 
1183 *@param rows associative array
1184 */
1185TreeTable.prototype.loadRows = function(rows){
1186	this.rows = new Array();
1187	for(i = 0 ; i < rows.length ; i++){
1188		this.rows.push(this.objectToRow(rows[i]));
1189	}
1190}
1191/**
1192 * Convert an object to a row
1193 */
1194TreeTable.prototype.objectToRow = function(obj){
1195	return new row(obj.cols,this.childrenToRows(obj.children));
1196}
1197/**
1198 * Convert an array of children into an array of rows and call recursively the objectToRow method
1199 */
1200TreeTable.prototype.childrenToRows = function(children){
1201	var rows = new Array();
1202	for(var i = 0 ; i < children.length ; i ++){
1203		rows[i] = this.objectToRow(children[i]);
1204	}
1205	return rows;
1206}
1207
1208/**
1209 * Load JSON var example to make a model of which text you may code
1210*/
1211TreeTable.prototype.loadJSONExample = function(){
1212	begin = new Date();
1213	
1214	jsonVar = {"columns":[{"name":"Colonne1","type":"String","isSorted":true,"filter":"input","width":"25%"},{"name":"Colonne2","type":"Number","isSorted":true,"filter":"select","width":"25%"},{"name":"Colonne3","type":"Number","isSorted":true,"filter":"number","width":"25%"},{"name":"Colonne4","type":"Number","isSorted":true,"filter":"","width":"25%"}],"rows":[{"cols":["POzzle Bubble",3,6,8],"expanded":false,"children":[{"cols":[" pbub",3,6,8],"expanded":false,"children":[],"sortIdx":0}],"sortIdx":0},{"cols":["Kid Bubble",356,20,1],"expanded":false,"children":[],"sortIdx":0},{"cols":["Daika Chi",36,20,1],"expanded":false,"children":[],"sortIdx":0},{"cols":["Super mario",6,2,41],"expanded":false,"children":[],"sortIdx":0},{"cols":["Pong",85,220,1],"expanded":false,"children":[],"sortIdx":0},{"cols":["Brexac",7,98,1],"expanded":false,"children":[],"sortIdx":0},{"cols":["Road rash",9,20,1],"expanded":false,"children":[],"sortIdx":0}]};
1215	this.loadJSONVar(jsonVar);
1216
1217	this.updateMessage('Tableau généré en '+ (new Date()- begin)/1000 +' s' );
1218}
1219
1220/**
1221 * Load example to test the render of the table
1222 */
1223TreeTable.prototype.loadExample = function(){
1224	begin = new Date();
1225	
1226	this.columns = new Array(
1227		new column("Nom", "String", true, 'input','100px',this.compareLoweredString),
1228		new column("Genre", "String", true, 'input','100px',this.compareCaseSensitiveString),
1229		new column("Taille", "Number", true, 'input','100px',this.compareNumber),
1230		new column("Note", "Number", true, 'input','100px',this.compareNumber)
1231		,new column("", "String", false, '', '100px',this.compareNumber)
1232	);
1233	
1234	this.rows = new Array(
1235		new row(["Blob","volley", 12 , 14 ,"<a>Get It</a>"],[new row(["|_lev2","volley1", 12 , 14 ],[]),new row(["|_lev2","volley2", 12 , 14 ],[new row([" |_lev3","", 12 , 14 ],[new row(["  |_lev4","", 12 , 14 ],[])])])]),
1236		new row(["MK4","baston 2D",54 , 19,"<a>Get It</a>"],[]),
1237		new row(["AVP2","shoot",650,17,"<a>Get It</a>"],[]),
1238		new row(["CS","shoot",1400,10,"<a>Get It</a>"],[]),
1239		new row(["Mario kart","course",100,18,"<a>Get It</a>"],[]),
1240		new row(["BF2","shoot",2500,19,"<a>Get It</a>"],[]),
1241		new row(["NFS","course",400,14,"<a>Get It</a>"],[]),
1242		new row(["Trackmania","course",500,16,"<a>Get It</a>"],[])
1243	);
1244
1245	for(i=0 ;i<=1000 ;i++){
1246		this.rows.push(new row(["jeu"+i,"course",10*i,16,"<a>Get It</a>"],[]));
1247	}
1248	
1249	row.prototype.sortIdx = 0;
1250	this.rows.sort(this.columns[0].compare);
1251	
1252	this.build();
1253	
1254	this.updateMessage('Tableau généré en '+ (new Date()- begin)/1000 +' s' );
1255}
1256
1257TreeTable.prototype.exportJSON = function(){
1258
1259	var o = new Object();
1260	o["options"] = this.options;
1261	o["columns"] = this.columns;
1262	o["rows"] = this.rows;
1263	
1264	document.getElementById('debug').innerHTML = o.toJSONString();
1265
1266}
1267TreeTable.prototype.exportXML = function(){
1268//todo FOR BENCHMARK
1269	var res = '';
1270	
1271	res +='<treetable id="table5" loadingMethod="xml">';
1272
1273	res +="<options>";
1274		//<option name="displayBy" value="25" />
1275	res +="</options><cols>";
1276	for(var i = 0 ; i < this.columns.length ; i++){
1277		res +='<col name="'+this.columns[i].name+'" type="'+this.columns[i].type+'" />';
1278	}
1279	res +="</cols><rows>";
1280	for(var i = 0 ; i < this.rows.length ; i++){
1281		res +='<row ';
1282		for(var j =0 ; j < this.columns.length ; j++){
1283			res += this.columns[j].name.toLowerCase()+'="'+this.rows[i].cols[j]+'" ';
1284		}
1285		res += '/>';
1286	}
1287	res +='</rows></treetable>';
1288
1289	document.getElementById('toto').innerHTML = escape(res);
1290
1291}
1292
1293TreeTable.prototype.getLogger = function (){
1294	if(!this.logger){
1295		this.logger = getLogger("TREETABLE");
1296		this.logger.setLevel(Logger.LEVEL_ALL);
1297	}
1298	this.logger.setCurrentID(this.divName);
1299	return this.logger;
1300}