window.onload=fillInRows;
function getWordListUpdate(pageU, startwordU, endwordU){
document.getElementById('waitingBox').style.display = "block";
new Ajax.Request('../jsonphp/dicolist-json.php',
  {
    method:'get',
	parameters: {dummy: new Date().getTime(), page: pageU, start: startWord, end: endword},
    onSuccess: function(transport){
	  wordlist = transport.responseText.evalJSON() || "no response text";
		hasLoaded = true;
		document.getElementById('waitingBox').style.display = "none";
		createWordTables(pageU, nbWordsPerPage);
		},
    onFailure: function(){ alert('Something went wrong...') }
  });
}

function displayComment(obj, wordlist, what, wordId){
if (what == 'wordComment') {
var objid = document.getElementById(obj.id).getAttribute('id');
var imgid = parseInt(objid);
var div_tip = document.createElement('div');
div_tip.setAttribute('id', 'div'+imgid);
var myWordContent = "";
var word = wordlist['freword'][imgid];
var com = wordlist['wordcom'][imgid];
if (com.blank()){com = "No comment";}
myWordContent += "<p>"+com+"</p>";
new Tip(objid, myWordContent,{className: 'orangetip',title: word,offset: {x:10, y:-100}});
}
if (what == 'expComment') {
var objid = document.getElementById(obj.id).getAttribute('id');
var imgid = parseInt(objid);
var div_tip = document.createElement('div');
div_tip.setAttribute('id', 'div'+imgid);
var myExpContent = "";
var top = wordlist['exptopic'][wordId][imgid];
if (top.blank()){top = "No associated topic";}
var ori = wordlist['expori'][wordId][imgid];
if (ori.blank()){ori = "No comment";}
myExpContent += "<p>"+ori+"</p>";
new Tip(objid, myExpContent,{className: 'orangetip',title: top,offset: {x:10, y:-100}});
}
}
function hideWaitingBox(){var box = document.getElementById('waitingBox');box.style.visibility = 'hidden';}
function fillInRows(){hasLoaded = true;}
function styleExp(myWord, myExp){
//We separate all the words seperated by spaces and store them into an array
var myTextArray = myExp.split(' ');
	//We loop through each array item and if we encounter the searched word we apply html style to the array item
	for (var i=0; i<myTextArray.length; i++){
	var textToLower = myTextArray[i].toLowerCase();
	var myWord = myWord.toLowerCase();
		if (textToLower.indexOf(myWord) != -1){
			myTextArray[i] = "<span style='color:#0000FF;font-weight:bold; font-style:italic'>"+myTextArray[i]+"</span>";
		}
	}
//We convert the array back into a string
var myNewTextArray = myTextArray.join(' ') ;
return myNewTextArray;
}
function createWordTables(currentPage, nbWdPerPage){
//We reset images at the top of the table and their booleans
swapImages('showfwordall', 'show', '.png','fwordAll');
swapImages('showewordall', 'show', '.png','ewordAll');
swapImages('showeexpall', 'show', '.png','eexpAll');
swapImages('showfexpall', 'show', '.png','fexpAll');
var eei = document.getElementById('eei');
replaceText(eei, hideeei);
var fei = document.getElementById('fei');
replaceText(fei, hidefei);
var ewi = document.getElementById('ewi');
replaceText(ewi, hideewi);
var fwi = document.getElementById('fwi');
replaceText(fwi, hidefwi);
//swapImages('fexpAll', 'plus', '.gif', 'ExpAll');
openAll = true;
fwordShowAll = false; 
ewordShowAll = false;
fexpShowAll = true;
eexpShowAll = true;
//We assign number of words to global variable wordNb
currentPage = currentPage;
wordNb = wordlist['freword'].length;
nbWords = wordNb;
if (nbWdPerPage >= nbWords){
	nbWordsPerPage = nbWords;
	} else {
		nbWordsPerPage =  nbWdPerPage;
		} 
nbPages = Math.ceil(nbWords/nbWordsPerPage);
//lastPage = nbPages;
startWord = 0;
endWord = startWord + nbWordsPerPage;
if (currentPage>1) {
startWord = currentPage*nbWordsPerPage - nbWordsPerPage;
endWord = startWord + nbWordsPerPage;
	if (endWord > nbWords){endWord = nbWords;}
}
//alert("Create table Page is : "+currentPage+" StartWord = "+startWord +" Endword = " + endWord + "Nb words = "+nbWords);
if (firstTimeLoaded){//alert("Call navList");
navList(10,nbPages);}
firstTimeLoaded = false;
//We asign default status array to swap +/- images when image clicked to add expression rows
for (b=0;b<wordNb;b++) {
expanded[b]=false;
fwordShow[b]=true;
ewordShow[b]=true;
fexpShow[b]=true;
eexpShow[b]=true;
}
var tablesContainer = document.getElementById('tablesContainer');
var tablesDiv = document.createElement('div');
tablesDiv.setAttribute("id", 'tables');
tablesContainer.style.fontSise = "8px";;

tablesContainer.appendChild(tablesDiv);
var tableDiv = document.getElementById("tables");
//adding word rows
for (i=startWord;i<endWord;i++){
	if (i%2 == 0){wordRowColour = wordRowColour2;} else {wordRowColour = wordRowColour1;}
//We display + pic if expressions associated with a word else o pic
dropDownPic = (wordlist['fexpword'][i].length< 2 && wordlist['fexpword'][i][0] == null?egalPic:plusPic);
if (dropDownPic == plusPic){dropDownPicTitle = plusPicTitle;}
if (dropDownPic == minusPic){dropDownPicTitle = minusPicTitle;}	
if (dropDownPic == egalPic){dropDownPicTitle = egalPicTitle;}	
	var frenchword;
	var frenchsound;
	if (i == 0){
		frenchword = wordlist['freword'][0];
		if (wordlist['fresound'][i] != null){
			frenchsound = wordlist['fresound'][i];} else {frenchsound = "";}
	}
	if (i == startWord){
		frenchword = wordlist['freword'][i];
		if (wordlist['fresound'][i] != null){
			frenchsound = wordlist['fresound'][i];} else {frenchsound = "";} 		
	}
	if (i > 0 && i != startWord) {if(wordlist['freword'][i-1].toLowerCase() == wordlist['freword'][i].toLowerCase()) {frenchword ="";frenchsound="";} 
		else {
			frenchword = wordlist['freword'][i]; 
			if (wordlist['fresound'][i] != null){
				frenchsound = wordlist['fresound'][i];} else {frenchsound = "";}
			} 
	}
		
	var table = document.createElement("table");
	table.setAttribute("id", "wordTable"+i);
	table.setAttribute("bgcolor", wordRowColour);
	var thead = document.createElement("thead");
	table.appendChild(thead);
	var tbody = document.createElement("tbody");
	
	var lastRow = table.rows.length;
	var row = table.insertRow(lastRow);
	/*********************************************** cell0 left border ************************************************/
	var cell0 = row.insertCell(0);
	cell0.setAttribute("width", "15px");
	cell0.setAttribute("height", "20px");
	cell0.setAttribute("padding", "0px");
	cell0.setAttribute("margin", "0px");
	cell0.style.backgroundColor = borderColour;
	var newText0 = document.createTextNode("");
	cell0.appendChild(newText0);
	/************************************ Cell1 show/hide.png freword ***********************************/
	var cell6 = row.insertCell(1);
	cell6.style.backgroundColor = wordRowColour;
	cell6.setAttribute("width", 20);
	cell6.setAttribute("height", 20);
	//cell6.setAttribute("text-align", "right");
	cell6.className = 'listLeftIcon';
	if (frenchword != ""){
		var imgEl2 = document.createElement('img');
		imgEl2.setAttribute('src', show);
		imgEl2.setAttribute('width', 10);
		imgEl2.setAttribute('height', 10);
		imgEl2.setAttribute('id', i+"showfr");
		imgEl2.setAttribute('title', showfwordTitle);
		imgEl2.setAttribute('alt', showfwordTitle);	
		Event.observe(imgEl2, 'click', function(e){Event.stop(e);displayText(this, wordlist, 'freword', '');}, false);
		cell6.appendChild(imgEl2);
	} else {
	var imgEl2 = document.createElement('span');
	imgEl2.setAttribute('id', i+"showfr");
	imgEl2.setAttribute('width', 10);
	imgEl2.setAttribute('height', 10);
	imgEl2.setAttribute('title', '');
	imgEl2.setAttribute('alt', '');	
	cell6.appendChild(imgEl2);	
	}
	/*********************************** cell1 french word ***************************************************/
	var cell1 = row.insertCell(2);
	cell1.setAttribute("width", "100px");
	cell1.setAttribute("height", "20px");
	cell1.setAttribute("padding", "0px");
	cell1.setAttribute("margin", "0px");
	cell1.style.backgroundColor = wordRowColour;
	var myNewText = frenchword;
	if (myNewText == ""){myNewText = ' No words '; cell1.style.color = wordRowColour;}
	var span1 = document.createElement('span');
	span1.setAttribute('id', wordlist['freword'][i]+String(i+300));
	span1.innerHTML =  myNewText;
	cell1.appendChild(span1);
	/******************************** cell2 sound button flash element ****************************************/
	var cell2 = row.insertCell(3);
	var sounddiv = document.createElement('div');
	if (frenchsound != ""){
	var divtitle = document.createTextNode('sound'+i);
	} else {var divtitle = document.createTextNode(' - ');sounddiv.style.color = wordRowColour;}
	sounddiv.setAttribute('id', 's'+wordlist['freword'][i]+String(i+300));
	sounddiv.appendChild(divtitle);
	cell2.setAttribute("padding", "0px");
	cell2.setAttribute("margin", "0px");
	cell2.setAttribute("width", "25px");
	cell2.setAttribute("height", "25px");
	cell2.className = 'flashBtn';
	cell2.style.backgroundColor = wordRowColour;
	cell2.appendChild(sounddiv);
	/********************************** Cell3 +-Image *********************************************/
	var cell3 = row.insertCell(4);
	cell3.style.backgroundColor = wordRowColour;
	cell3.setAttribute("width", 20);
	cell3.setAttribute("height", 20);
	cell3.setAttribute("text-align", "center");
	var imgEl = document.createElement('img');
	imgEl.setAttribute('src', dropDownPic);	
	imgEl.setAttribute('id', i+'icon');
	imgEl.setAttribute('title', dropDownPicTitle);
	imgEl.setAttribute('alt', dropDownPicTitle);
	if (dropDownPic != egalPic) {
		Event.observe(imgEl, 'click', function(e){Event.stop(e);updateTable(this, wordlist, 'expanded');}, false);
		}
	cell3.appendChild(imgEl);
	/***************************   Cell4 wordcategory ************************/
	var categorycontent = "";
	if (wordlist['wordcatcon'][i]) {
		
		categorycontent =  ' (' + wordlist['wordcatcon'][i] + ')';
	}
	var cell4 = row.insertCell(5);
	cell4.setAttribute("width", "250px");
	cell4.setAttribute("height", "20px");
	cell4.setAttribute("padding", "0px");
	cell4.setAttribute("margin", "0px");
	cell4.style.backgroundColor = wordRowColour;
	var newText3 = document.createTextNode(wordlist['wordcat'][i] + categorycontent);
	cell4.appendChild(newText3);
	/***************************** Cell5 comment.gif ****************************/
	var cell5 = row.insertCell(6);
	cell5.style.backgroundColor = wordRowColour;
	cell5.setAttribute("width", 20);
	cell5.setAttribute("height", 20);
	cell5.setAttribute("text-align", "center");
	var imgEl1 = document.createElement('img');
	imgEl1.setAttribute('src', comment);
	imgEl1.setAttribute('id', i+'com');	
	Event.observe(imgEl1, 'mouseover', function(e){Event.stop(e);displayComment(this, wordlist, 'wordComment', '');}, false);
	cell5.appendChild(imgEl1);
	/****************************** Cell7 englword **********************************/
	var cell7 = row.insertCell(7);
	cell7.setAttribute("width", "250px");
	cell7.setAttribute("height", "20px");
	cell7.setAttribute("padding", "0px");
	cell7.setAttribute("margin", "0px");
	cell7.setAttribute("text-align", "left");
	cell7.style.backgroundColor = wordRowColour;
	var newText4 = document.createTextNode(wordlist['englword'][i]);
	var span2 = document.createElement('span');
	span2.setAttribute('id', String(i+300)+wordlist['englword'][i]);
	span2.appendChild(newText4);
	cell7.appendChild(span2);
	/*********************************** Cell8 English word show/hide.png *****************************/
	var cell8 = row.insertCell(8);
	cell8.style.backgroundColor = wordRowColour;
	cell8.setAttribute("width", 20);
	cell8.setAttribute("height", 20);
	cell8.setAttribute("text-align", "center");
		var imgEl3 = document.createElement('img');
		imgEl3.setAttribute('src', show);
		imgEl3.setAttribute('width', 10);
		imgEl3.setAttribute('height', 10);
		imgEl3.setAttribute('id', i+"showeng");
		imgEl3.setAttribute('title', showewordTitle);
		imgEl3.setAttribute('alt', showewordTitle);
		Event.observe(imgEl3, 'click', function(e){Event.stop(e);displayText(this, wordlist, 'englword', '');}, false);
		cell8.appendChild(imgEl3);
	/***************************** cell 9 right border *************************************/
	var cell9 = row.insertCell(9);
	cell9.setAttribute("width", "15px");
	cell9.setAttribute("height", "20px");
	cell9.setAttribute("padding", "0px");
	cell9.setAttribute("margin", "0px");
	cell9.style.backgroundColor = borderColour;
	var newText5 = document.createTextNode("");
	cell9.appendChild(newText5);
	table.appendChild(tbody);
	tableDiv.appendChild(table);
	}
	
	if (!dicoLoaded){hideWaitingBox();}
	//Display flash buttons
	for (i=startWord;i<endWord;i++){ 
		if (i%2 == 0){wordRowColour = wordRowColour2;} else {wordRowColour = wordRowColour1;}
		var rfrenchsound;
		//rfrenchsound = wordlist['fresound'][i];
		if (i == 0){if(wordlist['fresound'][i] != null){rfrenchsound = wordlist['fresound'][0];}else{rfrenchsound = "";} }
		
		if (i == startWord){if(wordlist['fresound'][i] != null){rfrenchsound = wordlist['fresound'][i];}else{rfrenchsound = "";} }
		
		if (i > 0 && i != startWord) {if(wordlist['freword'][i-1].toLowerCase() == wordlist['freword'][i].toLowerCase()) {
			rfrenchsound="";} else {if(wordlist['fresound'][i] != null){rfrenchsound = wordlist['fresound'][i];}else{rfrenchsound = "";}} 
			}
		if (rfrenchsound != ""){
		var so = new SWFObject("../swf/playsound.swf", 'swf'+i, "25", "20", "8", wordRowColour);
		so.addVariable("frsound", rfrenchsound);
		so.write('s'+wordlist['freword'][i]+String(i+300));
		}
	}
	dicoLoaded = true;
}
// myRowObject is an object for storing information about the table rows
function myRowObject(one, two, three, four, five, six, seven, height, nine, ten)
{
	this.one = one; // image object
	this.two = two; // img + text  object
	this.three = three; // tet object
	this.four = four; // flash object
	this.five = five; // text object
	this.six = six; // text object
	this.seven = seven; // text object
	this.eight = height; // text object
	this.nine = nine;
	this.ten = ten;
}
function updateTable(obj, wordlist, imageStatus){ //Update expression tables
if (document.getElementById(obj.id).getAttribute('id')){
	var icon = document.getElementById(obj.id).getAttribute('id');
	var wordId = parseInt(icon);
	} else {
	var icon = obj;
	var wordId = parseInt(icon);
	}
var statusArray;
var image;
statusArray = expanded[wordId];
image = (statusArray==true?"plus":"minus");
swapImages(icon, image, '.gif', 'Pic');
	if (statusArray) {
		deleteRows(wordId);  
		expanded[wordId] = !statusArray;
		}
	if (!statusArray) {
		insertRows(wordId, wordlist);  
		expanded[wordId] = !statusArray;
		}
} 
function deleteRows(wordId){//Delete expression table rows
var tableId = String("wordTable"+wordId);
var checkedObjArray = new Array();
var cCount = 0;
var tbl = document.getElementById(tableId);
		for (var i=0; i<tbl.tBodies[0].rows.length; i++) {
			if (tbl.tBodies[0].rows[i].myRow){
			checkedObjArray[cCount] = tbl.tBodies[0].rows[i];
				cCount++;
			}
		}
		if (checkedObjArray.length > 0) {
			var rIndex = checkedObjArray[0].sectionRowIndex;
			for (var i=0; i<checkedObjArray.length; i++) {
				var rIndex = checkedObjArray[i].sectionRowIndex;
				checkedObjArray[i].parentNode.deleteRow(rIndex);
				}
			}
}
function insertRows(wordId, wordList){//Insert exp table rows
var expRowColour = '#98f39c';
var num;
var wordId = wordId;
var nbExp = wordList['fexpword'][wordId].length;
var tableId = String("wordTable"+wordId);
var tbl = document.getElementById(tableId);
var nextRow = tbl.tBodies[0].rows.length;
num = nextRow;		
var rowCount; 
for (j=0;j<wordNb;j++) {
fexpShow[j] = new Array();
eexpShow[j] = new Array();
	for (i=0;i<nbExp;i++) {
		fexpShow[j][i] = true;
		eexpShow[j][i] = true;
	}
}
rowCount = 0;		
//Now we get rid of duplicate expressions before inserting the rows
for (i=0;i<nbExp;i++) {
rowCount++;
	if (i>0) {
		if (wordList['fexpword'][wordId][i] == wordList['fexpword'][wordId][i-1]){
		rowCount--;
		continue;
		alert("We skip exp");
		}
	}
// add the row and set up the row color
		var row = tbl.tBodies[0].insertRow(num);
		row.style.backgroundColor = expRowColour;
		if (rowCount%2 == 0) {expRowColour = '#98f39c';} else {expRowColour = '#66FF66';}
		var fexpsound = wordList['fexpsound'][wordId][i]; 
//We add all the correponding cells
	/*********************************************** cell0 left border ************************************************/
	var cell0 = row.insertCell(0);
	cell0.setAttribute("width", "15px");
	cell0.setAttribute("height", "20px");
	cell0.setAttribute("padding", "0px");
	cell0.setAttribute("margin", "0px");
	cell0.style.backgroundColor = borderColour;
	var newText0 = document.createTextNode("");
	cell0.appendChild(newText0);
	/************************************ Cell6 show/hide.gif ***********************************/
	var cell61 = row.insertCell(1);
	cell61.style.backgroundColor = expRowColour;
	cell61.setAttribute("width", 20);
	cell61.setAttribute("height", 20);
	//cell61.setAttribute("text-align", "center");
	cell61.className = 'listLeftIcon';
	var imgEl21 = document.createElement('img');
	imgEl21.setAttribute('src', show);
	imgEl21.setAttribute('width', 10);
	imgEl21.setAttribute('height', 10);
	imgEl21.setAttribute('id', i+"showfexp"+wordList['fexpword'][wordId][i]+String(i+300));
	imgEl21.setAttribute('title', showfexpTitle);
	imgEl21.setAttribute('alt', showfexpTitle);	
	Event.observe(imgEl21, 'click', function(e){Event.stop(e);displayText(this, wordlist, 'fexpword', wordId);}, false);
	cell61.appendChild(imgEl21);
	/*********************************** cell1 french word ***************************************************/
	var cell11 = row.insertCell(2);
	cell11.setAttribute("width", "100px");
	cell11.setAttribute("height", "20px");
	cell11.setAttribute("padding", "0px");
	cell11.setAttribute("margin", "0px");
	cell11.style.backgroundColor = expRowColour;
	var newText1 = document.createTextNode("");
	cell11.appendChild(newText1);
	/******************************** cell2 sound button flash element ****************************************/
	var cell21 = row.insertCell(3);
	cell21.setAttribute("padding", "0px");
	cell21.setAttribute("margin", "0px");
	cell21.setAttribute("width", "25px");
	cell21.setAttribute("height", "25px");
	cell21.setAttribute("text-align", "center");
	cell21.className = 'flashBtn';
	cell21.style.backgroundColor = expRowColour;
	var sounddiv = document.createElement('div');
	if (fexpsound != ""){
	var divtitle = document.createTextNode(wordList['fexpword'][wordId][i]+i);
	} else {var divtitle = document.createTextNode('');}
	sounddiv.setAttribute('id', 's'+wordList['fexpword'][wordId][i]);
	sounddiv.appendChild(divtitle);
	cell21.appendChild(sounddiv);
	/********************************** Cell3 +-Image *********************************************/
	var cell3 = row.insertCell(4);
	cell3.style.backgroundColor = expRowColour;
	cell3.setAttribute("width", 20);
	cell3.setAttribute("height", 20);
	cell3.setAttribute("text-align", "center");
	newText3 = document.createTextNode("");
	cell3.appendChild(newText3);
	/***************************   Cell4 expression ************************/
	var cell4 = row.insertCell(5);
	cell4.setAttribute("width", "250px");
	cell4.setAttribute("height", "20px");
	cell4.setAttribute("padding", "0px");
	cell4.setAttribute("margin", "0px");
	cell4.style.backgroundColor = expRowColour;
	var newText4 = styleExp(wordList['freword'][wordId],wordList['fexpword'][wordId][i]);
	var span41 = document.createElement('span');
	span41.setAttribute('id', wordList['fexpword'][wordId][i]+String(i+300));
	cell4.appendChild(span41);
	var mySpan41 = document.getElementById(span41.getAttribute('id'));
	mySpan41.innerHTML = newText4;
	/***************************** Cell5 comment.gif ****************************/
	var cell5 = row.insertCell(6);
	cell5.style.backgroundColor = expRowColour;
	cell5.setAttribute("width", 20);
	cell5.setAttribute("height", 20);
	cell5.setAttribute("text-align", "center");
	var imgEl11 = document.createElement('img');
	imgEl11.setAttribute('src', comment);
	imgEl11.setAttribute('id', i+'ec'+wordList['fexpword'][wordId][i]);	
	Event.observe(imgEl11, 'mouseover', function(e){Event.stop(e);displayComment(this, wordlist, 'expComment', wordId);}, false);
	cell5.appendChild(imgEl11);
	/****************************** Cell7 eexpword **********************************/
	var cell7 = row.insertCell(7);
	cell7.setAttribute("width", "250px");
	cell7.setAttribute("height", "20px");
	cell7.setAttribute("padding", "0px");
	cell7.setAttribute("margin", "0px");
	cell7.setAttribute("text-align", "left");
	cell7.style.backgroundColor = expRowColour;
	var newText7 = document.createTextNode(wordList['eexpword'][wordId][i]);
	var span71 = document.createElement('span');
	span71.setAttribute('id', wordList['eexpword'][wordId][i]+String(i+300));
	span71.appendChild(newText7);
	cell7.appendChild(span71);
	/*********************************** Cell8 show hide .png eng exp *****************************/
	var cell8 = row.insertCell(8);
	cell8.style.backgroundColor = expRowColour;
	cell8.setAttribute("width", 20);
	cell8.setAttribute("height", 20);
	cell8.setAttribute("text-align", "center");
	var imgEl31 = document.createElement('img');
	imgEl31.setAttribute('src', show);
	imgEl31.setAttribute('width', 10);
	imgEl31.setAttribute('height', 10);
	imgEl31.setAttribute('id', i+"showeexp"+wordList['eexpword'][wordId][i]+String(i+300));
	imgEl31.setAttribute('title', showeexpTitle);
	imgEl31.setAttribute('alt', showeexpTitle);	
	Event.observe(imgEl31, 'click', function(e){Event.stop(e);displayText(this, wordlist, 'eexpword', wordId);}, false);
	cell8.appendChild(imgEl31);
	/***************************** cell 9 right border *************************************/
	var cell9 = row.insertCell(9);
	cell9.setAttribute("width", "15px");
	cell9.setAttribute("height", "20px");
	cell9.setAttribute("padding", "0px");
	cell9.setAttribute("margin", "0px");
	cell9.style.backgroundColor = borderColour;
	var newText9 = document.createTextNode("");
	cell9.appendChild(newText9);
	// Pass in the elements you want to reference later
	// Store the myRow object in each row
	row.myRow = new myRowObject(newText0, newText1, sounddiv, newText3, newText4, imgEl11, imgEl21, newText7, imgEl31 ,newText9);
	}
//Display flash buttons
rowCount = 0;		
//Now we get rid of duplicate expressions before inserting the rows
for (i=0;i<nbExp;i++) {
rowCount++;
	if (i>0) {
		if (wordList['fexpword'][wordId][i]	== wordList['fexpword'][wordId][i-1]){
			rowCount--;
			continue;
			}
		}
	if (rowCount%2 == 0) {expRowColour = '#98f39c';} else {expRowColour = '#66FF66';}
	if (wordList['fexpsound'][wordId][i] != ""){
	var so = new SWFObject("../swf/playsound.swf", 'swf'+wordList['fexpword'][wordId][i], "25", "20", "8", expRowColour);
		so.addVariable("frsound", wordList['fexpsound'][wordId][i]);
		so.write('s'+wordList['fexpword'][wordId][i]);
		}
	}
}
function swapImages(imgid, image, ext, suffix){
document.images[imgid].src = "../images/"+image+ext;
var imgTitle = eval(image+suffix+"Title"); 
var img = document.getElementById(imgid);
img.setAttribute('title', imgTitle);
img.setAttribute('alt', imgTitle);
}
function hideShowWords(spanid, showstatus){
if (showstatus == false){spanid.style.visibility = 'visible';}
if (showstatus == true){spanid.style.visibility = 'hidden';}
}
function removeTableElement(divId) {
 var d = document.getElementById('tablesContainer');var olddiv = document.getElementById(divId);d.removeChild(olddiv);}
function navList(nbItems, nbPages) {
//Public properties
this.nbItems = nbItems; 
this.nbPages = nbPages;
init();
//Public methods
	function init(W3CEvent){
	currentListItem = 1;
	currentListItemValue = 1;
	firstItemValue = 1;
	//We create the nav UL
	var botNavDiv = $('botNavDiv');
	var botNavUl = document.createElement('ul');
	botNavUl.setAttribute('id', 'botNavUl');
	botNavDiv.appendChild(botNavUl);
	var firstPageNode = document.createElement('li');
	var firstPageText = document.createTextNode('first Page');
	firstPageNode.setAttribute('id', 'firstPageLi');
	firstPageNode.appendChild(firstPageText);
	botNavUl.appendChild(firstPageNode);
	var prevnode = document.createElement('li');
	prevnode.setAttribute('id', 'bnli0');
	var prevtextnode = document.createTextNode('previous');
	prevnode.appendChild(prevtextnode);
	botNavUl.appendChild(prevnode);
	var prevdots = document.createElement('span');
	prevdots.setAttribute('id', 'prevDots');
	prevdots.innerHTML = ' ... ';
	botNavUl.appendChild(prevdots);
	if (this.nbPages > this.nbItems){
	//We create all the list items and next btn
		for (var i = 1; i <= this.nbItems; i++){
			var newnode = document.createElement('li');
			newnode.setAttribute('id', 'bnli'+ i);
			newnode.className = 'notselected';
			var newtextnode = document.createTextNode(i);
			newnode.appendChild(newtextnode);
			botNavUl.appendChild(newnode);
			}
		for ( var i=1 ; i<= this.nbItems; i++ ) {
			var navli = document.getElementById('bnli'+i);
			registerListener(navli,i);
		}
		var shownext = true;
	} else {
		for (var i = 1; i <= this.nbPages; i++){
			var newnode = document.createElement('li');
			newnode.setAttribute('id', 'bnli'+ i);
			newnode.className = 'notselected';
			var newtextnode = document.createTextNode(i);
			newnode.appendChild(newtextnode);
			botNavUl.appendChild(newnode);
			}
		for (var i=1 ; i<= this.nbPages ; i++ ) {
			var navli = document.getElementById('bnli'+i);
			registerListener(navli,i);
			}
	}
	
		var nextdots = document.createElement('span');
		nextdots.setAttribute('id', 'nextDots');
		nextdots.innerHTML = ' ... ';
		botNavUl.appendChild(nextdots);
		//var nblitems = this.nbItems+1;
		var nbl = parseInt(NBITEMS)+1;
		var nextnode = document.createElement('li');
		nextnode.setAttribute('id', 'bnli'+nbl);
		var nexttextnode = document.createTextNode('next');
		newnode.className = 'notselected';
		nextnode.appendChild(nexttextnode);
		botNavUl.appendChild(nextnode);
		var lastPageNode = document.createElement('li');
		var lastPageText = document.createTextNode('Last Page');
		lastPageNode.setAttribute('id', 'lastPageLi');
		lastPageNode.appendChild(lastPageText);
		botNavUl.appendChild(lastPageNode);

		registerListener('bnli'+nbl, nbl);
		registerListener('lastPageLi', 100);
		registerListener('firstPageLi', 99);
		var fp = document.getElementById('firstPageLi').style.visibility = 'hidden';
		var pb = document.getElementById('bnli0').style.visibility = 'hidden';
		var pd = document.getElementById('prevDots').style.visibility = 'hidden';
		if (!shownext){
		var lp = document.getElementById('lastPageLi').style.visibility = 'hidden';
		var nb = document.getElementById('bnli'+nbl).style.visibility = 'hidden';
		var nd = document.getElementById('nextDots').style.visibility = 'hidden';

			}
	//We set the class to the current list item
	$('bnli'+currentListItem).className = 'selected';
	
	}
	
	function registerListener(navli, i){
	Event.observe(navli, 'click', function(e){Event.stop(e);update(navli, i);}, false);
	}


	function update(navli, itemNb){
	var clickedItem = itemNb;
	prev = true; next = true;
		//First page
	if (clickedItem == 99){
		firstItemValue = 1;
		currentListItem = 1; 
		currentListItemValue = 1;
		nbitems = this.nbItems; 
		prev = false; 
		next = true;
		} else 
	//Last page
	if (clickedItem == 100){ //firstItemValue, currentListItem, currentListItemValue, nbitems, prev, next
		currentListItemValue = this.nbPages;
		nbitems =  (this.nbPages % this.nbItems); 
		firstItemValue = this.nbPages - nbitems + 1;
		currentListItem = nbitems; 
		prev = true; 
		next = false;
		//alert("Last page = "+ currentListItemValue + " at li number "+ currentListItem + "with first item value = "+firstItemValue + " for nb of items = "+nbitems);
		} else 

	if (clickedItem == parseInt(NBITEMS)+1) {
	remainingPages = this.nbPages - parseInt($('bnli'+this.nbItems).childNodes[0].nodeValue);
		if (currentListItem == this.nbItems){
			//If more than nbItems pages shift the last item to first value and keep next and previous btn
			if (remainingPages > this.nbItems){
				firstItemValue = parseInt($('bnli'+this.nbItems).childNodes[0].nodeValue)+1;
				currentListItem = 1;
				currentListItemValue = parseInt($('bnli'+this.nbItems).childNodes[0].nodeValue)+1;
				prev = true; next = true;
				nbitems = this.nbItems;
			} else if (remainingPages <= this.nbItems){
			var lastItemValue =  $('bnli'+this.nbItems).childNodes[0].nodeValue;
			// We shift the last item value to adequate position in nav and get rid of next btn and keeb prvious btn
			firstItemValue = parseInt(lastItemValue)+1;
			currentListItem = 1;
			currentListItemValue = firstItemValue;
			nbitems = parseInt(remainingPages);
			prev = true; next = true;
			if (currentListItemValue == this.nbPages){prev = true; next = false;}
			}
		} else {
		currentListItem++;
		currentListItemValue = parseInt($('bnli'+currentListItem).childNodes[0].nodeValue);
		if (currentListItemValue == this.nbPages){prev = true; next = false;}
		if (currentListItemValue == 1){prev = false; next = true;}
		}
	} else if (clickedItem == 0){
	currentListItemValue = parseInt($('bnli'+currentListItem).childNodes[0].nodeValue);
		if (parseInt(currentListItem) == 1){
			if (currentListItemValue >= this.nbItems ){
			firstItemValue = currentListItemValue - this.nbItems;
			currentListItem = this.nbItems;
			currentListItemValue = firstItemValue + this.nbItems - 1;
			if (nbitems < this.nbItems){remainingPages = nbitems;}
			nbitems = this.nbItems;	
			prev = true; next = true;
			if (parseInt(currentListItemValue) == 1){prev = false;}
			}	
		} else {
		currentListItem--;
		currentListItemValue = parseInt($('bnli'+currentListItem).childNodes[0].nodeValue);
		prev = true;
		if (parseInt(currentListItemValue) == 1){prev = false;}
		}
	} else {	
		var clickedItemValue = navli.childNodes[0].nodeValue;
		if (nbitems >= this.nbItems){remainingPages = this.nbPages - parseInt(clickedItemValue)-1;}else {remainingPages = 0;}
		if (remainingPages > 0){nbitems = this.nbItems} else {nbitems = this.nbPages - ($('bnli'+1).childNodes[0].nodeValue - 1) ; }
		currentListItem = clickedItem;
		currentListItemValue = clickedItemValue;
		firstItemValue = $('bnli'+1).childNodes[0].nodeValue;
		if (currentListItemValue == 1){prev = false;}
		if (currentListItemValue == this.nbPages){next = false;}
		
		
	}
	
	if (nbPages <= NBITEMS){prev = false; next = false; nbitems = nbPages;}
	displayNav(firstItemValue, currentListItem, currentListItemValue, nbitems, prev, next);
	}

	function displayNav(firstItemValue, currentListItem, currentListItemValue, nbitems, prev, next){
	removeTableElement('tables');	
	//alert("First item value  = "+firstItemValue+" Current list item ="+currentListItem+" Current LI Value = "+ currentListItemValue +" Nb ##items## = " + nbitems + "NBITEMS = "+NBITEMS +" next = "+next + " prev = "+prev); 

	createWordTables(parseInt(currentListItemValue), nbWordsPerPage);
	removeElement('botNavDiv', 'botNavUl');
	//We create the nav UL
	var botNavDiv = $('botNavDiv');
	var botNavUl = document.createElement('ul');
	botNavUl.setAttribute('id', 'botNavUl');
	botNavDiv.appendChild(botNavUl);
	var prevdots = document.createElement('span');prevdots.setAttribute('id', 'prevDots');prevdots.innerHTML = ' ... ';
	var nextdots = document.createElement('span');nextdots.setAttribute('id', 'nextDots');nextdots.innerHTML = ' ... ';
	
		var firstPageNode = document.createElement('li');
		firstPageNode.setAttribute('id', 'firstPageLi');
		var firstPageText = document.createTextNode('First Page');
		firstPageNode.appendChild(firstPageText);
		botNavUl.appendChild(firstPageNode);
		var prevnode = document.createElement('li');
		prevnode.setAttribute('id', 'bnli0');
		var prevtextnode = document.createTextNode('previous');
		prevnode.appendChild(prevtextnode);
		botNavUl.appendChild(prevnode);
		botNavUl.appendChild(prevdots);
		if (!prev){//We make the prev btns invisible
		var fp = document.getElementById('firstPageLi').style.visibility = 'hidden';
		var pb = document.getElementById('bnli0').style.visibility = 'hidden';
		var pd = document.getElementById('prevDots').style.visibility = 'hidden';
		}

	//We create all the list items and next btn
		var j = firstItemValue;
		for (var i = 1; i <= NBITEMS; i++){
			var newnode = document.createElement('li');
			newnode.setAttribute('id', 'bnli'+ i);
			newnode.className = 'notselected';
			var newtextnode = document.createTextNode(j);
			newnode.appendChild(newtextnode);
			botNavUl.appendChild(newnode);
			j++;
			if (i > nbitems) {document.getElementById('bnli'+i).style.visibility = 'hidden';}
			}
	//if (next){
		botNavUl.appendChild(nextdots);
		//var nblitems = nbitems+1;
		var bnl = parseInt(NBITEMS)+1;
		var nextnode = document.createElement('li');
		nextnode.setAttribute('id', 'bnli'+bnl);
		var nexttextnode = document.createTextNode('next');
		nextnode.appendChild(nexttextnode);
		botNavUl.appendChild(nextnode);
		var lastPageNode = document.createElement('li');
		lastPageNode.setAttribute('id', 'lastPageLi');
		var lastPageText = document.createTextNode('Last Page');
		lastPageNode.appendChild(lastPageText);
		botNavUl.appendChild(lastPageNode);
		//}
		if (!next){//We make the prev btns invisible
		var fp = document.getElementById('lastPageLi').style.visibility = 'hidden';
		var pb = document.getElementById('bnli'+bnl).style.visibility = 'hidden';
		var pd = document.getElementById('nextDots').style.visibility = 'hidden';
		}

		//We set the class to the current list item
		$('bnli'+currentListItem).className = 'selected';
		//We register each li
		//for (var i=(prev?0:1) ; i<= (next?nblitems:nbitems) ; i++ ) {
		for (var i = 1; i<= nbitems;i++){
		var navli = document.getElementById('bnli'+i);
		registerListener(navli,i);
		}
		registerListener('bnli0',0);
		registerListener('bnli'+bnl,bnl);
		registerListener('lastPageLi', 100);
		registerListener('firstPageLi', 99);
	}
}//End nav list object
function removeElement(parentId, childId) {
  var parentId = document.getElementById(parentId);
  var childId = document.getElementById(childId);
  parentId.removeChild(childId);
}
function displayText(obj, wordList, itemType, wordId){
	var expWordId = wordId;  //Condition if taken out  2 OCT 2007
if (obj) {
	var icon = document.getElementById(obj.id).getAttribute('id');
	var wordId = parseInt(icon);
	}
switch (itemType){
	case 'freword':
		var statusArray;
		var image;
		var wordSpanId = document.getElementById(wordList[''+itemType+''][wordId]+String(wordId+300));
		hideShowWords(wordSpanId,fwordShow[wordId]);
		statusArray = fwordShow[wordId];
		image = (statusArray==true?"hide":"show");
		fwordShow[wordId] = !fwordShow[wordId];
		swapImages(icon, image, '.png', 'fword');
		break;
	case 'englword':
		var statusArray;
		var image;
		var wordSpanId = document.getElementById(String(wordId+300)+wordList[''+itemType+''][wordId]);
		hideShowWords(wordSpanId,ewordShow[wordId]);
		statusArray = ewordShow[wordId];
		image = (statusArray==true?"hide":"show");
		swapImages(icon, image, '.png', 'eword');
		ewordShow[wordId] = !ewordShow[wordId];
		break;
	case 'fexpword':
		var statusArray;
		var image;
		var wordSpanId = document.getElementById(wordList[''+itemType+''][expWordId][wordId]+String(wordId+300));
		hideShowWords(wordSpanId,fexpShow[expWordId][wordId]);
		statusArray = fexpShow[expWordId][wordId];
		image = (statusArray==true?"hide":"show");
		fexpShow[expWordId][wordId] = !fexpShow[expWordId][wordId];
		swapImages(icon, image, '.png', 'fexp');
		break;
	case 'eexpword':
		var statusArray;
		var image;
		var wordSpanId = document.getElementById(wordList[''+itemType+''][expWordId][wordId]+String(wordId+300));
		hideShowWords(wordSpanId,eexpShow[expWordId][wordId]);
		statusArray = eexpShow[expWordId][wordId];
		image = (statusArray==true?"hide":"show");
		eexpShow[expWordId][wordId] = !eexpShow[expWordId][wordId];
		swapImages(icon, image, '.png', 'eexp');
		break;
	case 'frwordall':
	fwordShowAll = !fwordShowAll;
		for (i=startWord; i< endWord; i++){
			var frenchword;
			if (fwordShowAll && !fwordShow[i]){fwordShow[i] = !fwordShow[i];}
			if (!fwordShowAll && fwordShow[i]){fwordShow[i] = !fwordShow[i];}
					if (i > 0 && i != startWord) {
						if(wordlist['freword'][i-1].toLowerCase() == wordlist['freword'][i].toLowerCase()) {
							continue;
							}	
					}		
					var icon = document.getElementById(i+"showfr").getAttribute('id');
					var wordSpanId = document.getElementById(wordList['freword'][i]+String(i+300));
					var statusArray;
					var image;
					hideShowWords(wordSpanId,fwordShow[i]);
					statusArray = fwordShow[i];
					image = (fwordShowAll==true?"hide":"show");
					fwordShow[i] = !fwordShow[i];
					swapImages(icon, image, '.png', 'fword');
					swapImages('showfwordall', image, '.png','fwordAll');
				}
			var fwi = document.getElementById('fwi');
			var titleArr = (fwordShowAll==false?"hide":"show");
			var newText = eval(titleArr+'fwi');
			replaceText(fwi, newText);
			break;
			case 'ewordall':
			ewordShowAll = !ewordShowAll;
			for (i=startWord; i< endWord; i++){
				if (ewordShowAll && !ewordShow[i]){ewordShow[i] = !ewordShow[i];}
				if (!ewordShowAll && ewordShow[i]){ewordShow[i] = !ewordShow[i];}
				var icon = document.getElementById(i+"showeng").getAttribute('id');
				var wordSpanId = document.getElementById(String(i+300)+wordlist['englword'][i]);
				var statusArray;
				var image;
				hideShowWords(wordSpanId,ewordShow[i]);
				statusArray = ewordShow[i];
				image = (ewordShowAll==true?"hide":"show");
				ewordShow[i] = !ewordShow[i];
				swapImages(icon, image, '.png', 'eword');
				swapImages('showewordall', image, '.png','ewordAll');
			}
			var ewi = document.getElementById('ewi');
			var titleArr = (ewordShowAll==false?"hide":"show");
			var newText = eval(titleArr+'ewi');
			replaceText(ewi, newText);
			break;
			case 'fexpall':
			var statusArray;
			var expImg = 'showfexpall';
			var expArr;
			var image;
			for (h=startWord; h< endWord; h++){
				if (wordlist['fexpword'][h][0] == "" ) {continue;}
					for (g=0;g<wordlist['fexpword'][h].length;g++){
						if (!document.getElementById(g+"showfexp"+wordList['fexpword'][h][g]+String(g+300))){continue;}
						if (g > 0 && wordlist['fexpword'][h][g] == wordlist['fexpword'][h][g-1]){continue;}
						if (fexpShowAll && !fexpShow[h][g]){fexpShow[h][g] = !fexpShow[h][g];}
						if (!fexpShowAll && fexpShow[h][g]){fexpShow[h][g] = !fexpShow[h][g];}
						var expSpanId = document.getElementById(wordList['fexpword'][h][g]+String(g+300));
						var icon = document.getElementById(g+"showfexp"+wordList['fexpword'][h][g]+String(g+300)).getAttribute('id');
						statusArray = fexpShowAll;
						image = (statusArray==true?"hide":"show");
						hideShowWords(expSpanId,statusArray);
						if (fexpShowAll){fexpShow[h][g] = false;swapImages(icon, image, '.png', 'fexpAll')};
						if (!fexpShowAll){fexpShow[h][g] = true;swapImages(icon, image, '.png', 'fexpAll')};
					}
				}
			expArr = (fexpShowAll==true?"hide":"show");
			swapImages(expImg, expArr, '.png', 'fexpAll');
			var fei = document.getElementById('fei');
			var titleArr = (fexpShowAll==false?"hide":"show");
			var newText = eval(titleArr+'fei');
			replaceText(fei, newText);
			fexpShowAll = !fexpShowAll;
			break;
	case 'eexpall':
	var statusArray;
			var expImg = 'showeexpall';
			var expArr;
			var image;
			for (h=startWord; h< endWord; h++){
				if (wordlist['eexpword'][h][0] == "" ) {continue;}
					for (g=0;g<wordlist['eexpword'][h].length;g++){
						if (!document.getElementById(g+"showeexp"+wordList['eexpword'][h][g]+String(g+300))){continue;}
						if (g > 0 && wordlist['eexpword'][h][g] == wordlist['eexpword'][h][g-1]){continue;}
						if (eexpShowAll && !eexpShow[h][g]){eexpShow[h][g] = !eexpShow[h][g];}
						if (!eexpShowAll && eexpShow[h][g]){eexpShow[h][g] = !eexpShow[h][g];}
						var expSpanId = document.getElementById(wordList['eexpword'][h][g]+String(g+300));
						var icon = document.getElementById(g+"showeexp"+wordList['eexpword'][h][g]+String(g+300)).getAttribute('id');
						statusArray = eexpShowAll;
						image = (statusArray==true?"hide":"show");
						hideShowWords(expSpanId,statusArray);
						if (eexpShowAll){eexpShow[h][g] = false;swapImages(icon, image, '.png', 'eexpAll')};
						if (!eexpShowAll){eexpShow[h][g] = true;swapImages(icon, image, '.png', 'eexpAll')};
				}
					}
			expArr = (eexpShowAll==true?"hide":"show");
			swapImages(expImg, expArr, '.png', 'eexpAll');
			var eei = document.getElementById('eei');
			var titleArr = (eexpShowAll==false?"hide":"show");
			var newText = eval(titleArr+'eei');
			replaceText(eei, newText);
			eexpShowAll = !eexpShowAll;
			break;
			default : alert("No words to be displayed");
	}//end switch
}
function hideShowAll(what){
displayText('', wordlist, what, '');
}
function hideShowExpAll(what){
displayText('', wordlist, what, '');
}