/**
 * @author amore
 */
 
// total count of the notecards created on the dom
var cnt = null;
// store the current id of the notecard
var currentNotecard; 
//to store the ids of the draggable notecards
var notes = new Array();
//reference to store the notecard info popup
var oPanel
//store the reference to set timeout function for notecard
var t;
//store the reference to set timeout function for pile
var tt;
//to store temporary notecard id
var note;
var pname;
//to store left value of the individual notecard
var popupCorner;
//to store top value of the individual notecard
var elemCorner;

var c1;
var c2;

var chkLeft = "";
var chkRight= "";
var chkTop = "";
var chkBottom = "";

//to store the ids of the draggable piles
var pile = new Array();

// store value of dragged element
var draggedEl = null;

// var to store pile number
var pCnt = 1;

// var to store pile number globally
var currentPile;

// store the value of dragged item
var posXY;

/* store the information of new Notecard item
 *  notecardID[0][0] = id
 *  notecardID[0][1] = left pos
 *  notecardID[0][2] = right pos
 *  notecardID[0][3] = moved by which pile
 *  notecardID[0][4] = title
 *  notecardID[0][5] = selected
 *  notecardID[0][6] = block/none
 */	
var notecardID = new Array();

// store the ID of new Pile item
var PileID = new Array();

// Array to store pile id and notecard id
var pileNotecard = new Array();

// store value of dragged element
var overElement;

// store the value of element over which overElement was dragged
var underElement;

var divId = null;
// variable to store the value of ctrl pressed
var ctrlPressed= false;

// variable to store the value of alt pressed
var altPressed=0;

// variable to store the value of shift pressed
var shiftPressed=0;

// variable to store the insert key
var insertPressed= false;

// variable to store the delete key
var deletePressed= false;

// variable to store the global http object
var httpObject;

// flag set to remove mouseout event of the notecard
var mout = 0;

var left = "";
var top = "";
var bottom = "";
var right = "";

var tr = "";
var tl = "";
var br = "";
var bl = "";

// increment time for existing pile
var k =0;

//store notecard name and position for expanded pile
var notecardInExpandedPileArray = new Array();

//store notecard name and position for expanded pile
var expandedPileArray = new Array();
/* store the ID of new Pile item
 *  pileID[0][0] = id
 *  pileID[0][1] = left pos
 *  pileID[0][2] = right pos
 *  pileID[0][3] = moved by which pile
 *  pileID[0][4] = title
 *  pileID[0][5] = hidden/visible
 *  pileID[0][6] = selected
 */	
var pileID = new Array();
var z = 0;

var elemLeft;
var elemTop;
var elemBottom;
var elemRight;

var ajaxReq;

//array of notecard data retrieved from the database
var data = new Array();

//array of notecard ids retrieved from the database
var noteID = new Array();

//to store the value of the current popup displayed (div id)
var currPopup;

var hideTimer;

//counter for the notecard data array
var dataCnt = 1;

//flag to determine whether summary popup for notecard/pile is open
//notePile = 0 summary popup for the notecard is open
//notePile = 1 summary popup for the pile is open
var notePile = 0;

//to store the current ID of the popup open to be referred from edit notecard
var editNoteID;

//array to store the values of notecard ids when split using _
var arrVal = new Array();

// stores the outline element in editable mode
var itemInEditMode = null;

// stores the notecard in editable mode
var noteInEditMode = null;

// stores the li notecard in editable mode
var liNoteInEditMode = null;

// global variable for user id
var NB_USER_ID = null;

// global variable for project id
var NB_PROJECT_ID = null;

// starting counter for li item and ol item 
var itemCnt=0;
var listCnt=0;

YAHOO.namespace("notecards.popup");
YAHOO.namespace("example.container");

var outOfBound = false;

// stores the element in editable mode
var enableBackSpace = false;

// store the presence of notecards in the outline
var notecardsOutline = new Array();

// store all the projects of that user
var projects = null;

// store the element id that is right clicked in outline
var rClickOutlineItme = null;

// global var to store all the windows
var openwindows = new Ext.WindowGroup();
var openBubbles = new Ext.WindowGroup();
var newEditWindows = new Ext.WindowGroup();
var gridWinGrp = new Ext.WindowGroup();
// variable to store the name of the pile in edit mode
var pileInEditMode = null;

// variable to store all the tags related to the project
var allTags = new Array();

// array to store notecard + cues relationship
var noteCues = new Array();

// array to store notecard + color relationship
var noteColor = new Array();

// global var to store the comment in edit mode
var commInEditMode = "";

// global variable to check whether a notecard is being deleted or not
var deletingNotecard = 0;


// global var to decide whether to show the popup or not
var displayPopup = true;
/*
 * function to create notecard on the tabletop
 */
function createNotecard(title, cnt, pileid){
	title = title.toString();
	var projectID = document.getElementById('projectID').value;
	//function called on success
	
	var noteCard = new NoteCardTemplate('Notecard_' + cnt, title);
	notes[cnt] = new YAHOO.example.DDNotecard("Notecard_" + cnt, "", {
		cont: 'tabletop'
	});
	notes[cnt].on('dragEvent', function(ev){
		hideCurrPopup();
	}, notes[cnt], true);
	var div = document.createElement("div");
	div.innerHTML = noteCard.toHTML();
	document.getElementById("tabletop").appendChild(div.firstChild);
	if (navigator.appName == "Microsoft Internet Explorer") {
		YAHOO.util.Dom.setXY('Notecard_' + cnt, [22, 270]);
	}
	else {
		YAHOO.util.Dom.setXY('Notecard_' + cnt, [20, 265]);
	}
	document.getElementById("Notecard_" + cnt).style.display = "none";
	
	var leftTop = getLeftTopInTabletop('Notecard_' + cnt);
	
	createNotecardThumb('Notecard_' + cnt);
	if (pileid == null || pileid == "0" || pileid == "") {
		var zoneNoteCard = new zoneNotesLi('Notecard_' + cnt, title);
		var ol = document.createElement("ol");
		ol.innerHTML = zoneNoteCard.toHTML();
		document.getElementById('zoneList').appendChild(ol.firstChild);
		var parentEl = Ext.get("zoneList");
		var childEl = Ext.get('li_Notecard_' + cnt);
		parentEl.insertFirst(childEl);
		notecardID[notecardID.length] = ['Notecard_' + cnt, leftTop[0], leftTop[1], "", title, false, "none", "zone"];
	}else{
		pileNotecard[pileNotecard.length]=["Pile_"+pileid, "Notecard_"+cnt];
		notecardID[notecardID.length] = ['Notecard_' + cnt, leftTop[0], leftTop[1], "", title, false, "none", "tabletop"];
	}
	//call to the help bubbles
	if(notecardID.length<=2 && document.getElementById('help').value == "1")
	{
		bubble_notecardRegion(notecardID.length);
	}
	shakeMe("li_Notecard_" + cnt);
	loadTags();
	function success(o){
			if((Trim(o.responseText)).match("ERROR_MULTIPLE") || (Trim(o.responseText)).match("ERROR_NOID"))
			{			
				showNotesSessionError(Trim(o.responseText));
				return false;
			}
		}
	function failure(o){
			alert(o.responseText);
		}
	//ajax call to the server to update notecard position
	Ext.Ajax.request({
   		url: '../notecards/_includes/notecardOperations.php',
   		method: 'POST',
   		success: success,				   
   		failure: failure,
		params : 'toggle=updateNotePos&projectID='+projectID+'&noteId='+cnt+'&leftPos='+leftTop[0]+'&topPos='+leftTop[1] 
	});	
	
	
}

/*
 * function to hide pile/notecards summ popup on drag
 */
function hidePopupOnDrag()
{
	//nullify timer for the notecard
	if(t!=null)
	{
		window.clearTimeout(t);
	}
	//nullify timer for the pile
	if(tt != null)
	{
		window.clearTimeout(tt);
	}	
	var activeWind = (openwindows.getActive());
	//alert(activeWind);
	if(activeWind != null){
		activeWind.close();
		hidePopupOnDrag()
	}			
}

/*
 * function to blink notecard 2-3 times
 */
function totalNotecards()
{
	return cnt;
}

/*
*function to open popup after a specified interval
*/
function invokePopup(val)
{
	note = val;
	t = window.setTimeout('showInfoPopup(note)',500);
}

/*
 * function to show notecard information in popup
 */
function showInfoPopup(val)
{
	//determine if the popup request is coming from notecards in expanded pile
	arrVal = val.split("_");
	//retrieve the element region here
	var element = YAHOO.util.Dom.getRegion(val);
	elemLeft = element.left;
	elemTop = element.top;
	elemBottom = element.bottom;
	elemRight = element.right;	
	
	/*determine if the popup request is coming from notecards in expanded pile
	then show popup to the right hand side of the notecard*/
	if(arrVal[0] == "li")
	{
		notePile = 0;
		if(navigator.appName == "Microsoft Internet Explorer")
		{
			showInfoPopupxy(val,(elemRight-30),(elemTop-10),"panelRightBottom");
		}
		else
		{
			showInfoPopupxy(val,(elemRight-30),elemTop,"panelRightBottom");
		}
	}
	else
	{
		notePile = 0;
		var i;
		tr = "";
		tl = "";
		br = "";
		bl = "";
				
		//determine if tabletopContainer and the imaginary point intersects				
		var tid = document.getElementById("tabletopContainer");
		var trg = YAHOO.util.Region.getRegion(tid);
		
		var factx = (elemRight-elemLeft)/2;
		var facty = (elemBottom-elemTop)/2;  				
		
		//calculate the top imaginary point		
		var et = new YAHOO.util.Point((elemLeft+factx),(elemTop-150));
		
		//calculate the left imaginery point		
		var el = new YAHOO.util.Point((elemLeft-150),(elemTop+facty));
		
		//calculate the right imaginary point
		var er = new YAHOO.util.Point((elemRight+150),(elemTop+facty));
		
		//calculate the bottom imaginary point
		var eb = new YAHOO.util.Point((elemLeft+factx),(elemBottom+150));
		
		//left corner
		if(trg.intersect(el) == null && trg.intersect(et) != null && trg.intersect(er) != null && trg.intersect(eb) != null)		
		{
			if(navigator.appName == "Microsoft Internet Explorer")
			{
				showInfoPopupxy(val,(elemRight-30),(elemTop-10),"panelRightBottom");
			}	
			else
			{
				showInfoPopupxy(val,(elemRight-30),elemTop,"panelRightBottom");
			}								
		}
		//left top corner
		else if(trg.intersect(el) == null && trg.intersect(et) == null && trg.intersect(er) != null && trg.intersect(eb) != null)
		{
			if(navigator.appName == "Microsoft Internet Explorer")
			{
				showInfoPopupxy(val,(elemRight-30),(elemTop-10),"panelRightBottom");
			}
			else
			{
				showInfoPopupxy(val,(elemRight-30),elemTop,"panelRightBottom");
			}			
		}
		//top corner
		else if(trg.intersect(el) != null && trg.intersect(et) == null && trg.intersect(er) != null && trg.intersect(eb) != null)
		{
			var toolbar = document.getElementById("tabletophdrWrapper");
			var barReg = YAHOO.util.Dom.getRegion(toolbar);
			if(element.intersect(barReg))
			{
				
			}
			else
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop-10),"panelRightBottom");
				}
				else
				{
					showInfoPopupxy(val,(elemRight-30),elemTop,"panelRightBottom");
				}				
			}
		}
		//top right corner
		else if(trg.intersect(el) != null && trg.intersect(et) == null && trg.intersect(er) == null && trg.intersect(eb) != null)
		{
			if(navigator.appName == "Microsoft Internet Explorer")
			{
				showInfoPopupxy(val,(elemLeft-230),(elemTop-10),"panelLeftBottom");
			}
			else
			{
				showInfoPopupxy(val,(elemLeft-230),elemTop,"panelLeftBottom");
			}			
		}
		//right corner
		else if(trg.intersect(el) != null && trg.intersect(et) != null && trg.intersect(er) == null && trg.intersect(eb) != null)
		{
			if(navigator.appName == "Microsoft Internet Explorer")
			{
				showInfoPopupxy(val,(elemLeft-230),(elemTop-10),"panelLeftBottom");
			}
			else
			{
				showInfoPopupxy(val,(elemLeft-230),elemTop,"panelLeftBottom");
			}			
		}
		//bottom right corner
		else if(trg.intersect(el) != null && trg.intersect(et) != null && trg.intersect(er) == null && trg.intersect(eb) == null)
		{
			if(navigator.appName == "Microsoft Internet Explorer")
			{
				showInfoPopupxy(val,(elemLeft-230),(elemTop-150),"panelLeftTop");
			}
			else
			{
				showInfoPopupxy(val,(elemLeft-230),(elemTop-140),"panelLeftTop");
			}			
		}
		//bottom corner
		else if(trg.intersect(el) != null && trg.intersect(et) != null && trg.intersect(er) != null && trg.intersect(eb) == null)
		{
			if(navigator.appName == "Microsoft Internet Explorer")
			{
				showInfoPopupxy(val,(elemRight-30),(elemTop-150),"panelRightTop");
			}
			else
			{
				showInfoPopupxy(val,(elemRight-30),(elemTop-140),"panelRightTop");
			}			
		}
		//left bottom corner
		else if(trg.intersect(el) == null && trg.intersect(et) != null && trg.intersect(er) != null && trg.intersect(eb) == null)
		{
			if(navigator.appName == "Microsoft Internet Explorer")
			{
				showInfoPopupxy(val,(elemRight-30),(elemTop-150),"panelRightTop");
			}
			else
			{
				showInfoPopupxy(val,(elemRight-30),(elemTop-140),"panelRightTop");
			}
			
		}
		//none of the corners										
		else if(trg.intersect(el) != null && trg.intersect(et) != null && trg.intersect(er) != null && trg.intersect(eb) != null)
		{
			setOverlap(val);

			if(tl == "y" && tr == "" && br == "" && bl == "")
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop-10),"panelRightBottom");
				}
				else
				{
					showInfoPopupxy(val,(elemRight-30),elemTop,"panelRightBottom");
				}				
			}
			if(tl == "" && tr == "y" && br == "" && bl == "")
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemLeft-230),(elemTop-10),"panelLeftBottom");
				}
				else
				{
					showInfoPopupxy(val,(elemLeft-230),elemTop,"panelLeftBottom");
				}				
			}
			if(tl == "" && tr == "" && br == "y" && bl == "")
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemLeft-230),(elemTop-10),"panelLeftBottom");
				}
				else
				{
					showInfoPopupxy(val,(elemLeft-230),elemTop,"panelLeftBottom");
				}				
			}
			if(tl == "" && tr == "" && br == "" && bl == "y")
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop-10),"panelRightBottom");
				}
				else
				{
					showInfoPopupxy(val,(elemRight-30),elemTop,"panelRightBottom");
				}				
			}
			
			if(tl == "y" && tr == "y" && br == "" && bl == "")
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop+10),"panelRightBottom");
				}
				else
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop+20),"panelRightBottom");
				}
				
			}
			if(tl == "y" && tr == "" && br == "y" && bl == "")
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop-160),"panelRightTop");
				}
				else
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop-160),"panelRightTop");
				}				
			}
			if(tl == "y" && tr == "" && br == "" && bl == "y")
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop-10),"panelRightBottom");
				}
				else
				{
					showInfoPopupxy(val,(elemRight-30),elemTop,"panelRightBottom");
				}				
			}
			
			if(tl == "" && tr == "y" && br == "y" && bl == "")
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemLeft-230),(elemTop-10),"panelLeftBottom");
				}
				else
				{
					showInfoPopupxy(val,(elemLeft-230),elemTop,"panelLeftBottom");
				}				
			}
			if(tl == "" && tr == "y" && br == "" && bl == "y")
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop+10),"panelRightBottom");
				}
				else
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop+20),"panelRightBottom");
				}				
			}

			if(tl == "" && tr == "" && br == "y" && bl == "y")
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop-160),"panelRightTop");
				}
				else
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop-160),"panelRightTop");
				}				
			}
						
			if(tl == "y" && tr == "y" && br == "y" && bl == "")
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemLeft-230),(elemTop+10),"panelLeftBottom");
				}
				else
				{
					showInfoPopupxy(val,(elemLeft-230),(elemTop+20),"panelLeftBottom");
				}				
			}
			if(tl == "y" && tr == "y" && br == "" && bl == "y")
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop+10),"panelRightBottom");
				}
				else
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop+20),"panelRightBottom");
				}				
			}
			if(tl == "y" && tr == "" && br == "y" && bl == "y")
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop-160),"panelRightTop");
				}
				else
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop-160),"panelRightTop");
				}				
			}
			if(tl == "" && tr == "y" && br == "y" && bl == "y")
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemLeft-230),(elemTop-160),"panelLeftTop");
				}
				else
				{
					showInfoPopupxy(val,(elemLeft-230),(elemTop-160),"panelLeftTop");
				}				
			}
			
			if(tl == "y" && tr == "y" && br == "y" && bl == "y")
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop-160),"panelRightTop");
				}
				else
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop-160),"panelRightTop");
				}				
			}
			
			if(tl == "" && tr == "" && br == "" && bl == "")
			{
				if(navigator.appName == "Microsoft Internet Explorer")
				{
					showInfoPopupxy(val,(elemRight-30),(elemTop-10),"panelRightBottom");
				}
				else
				{
					showInfoPopupxy(val,(elemRight-30),elemTop,"panelRightBottom");
				}				
			}
		}
	}
}

/*
* function to show information popup on a specified location
*/
function showInfoPopupxy(val, x, y, popupID) 
{
	hidePopupOnDrag();
	var arr = val.split("_");	
	
	//retrieve the pile id
	if(arr[0] == "li")
	{
		
		for(i=0;i<pileNotecard.length;i++)
		{
			if("Notecard_"+arr[2] == pileNotecard[i][1])
			{				
				pid = (pileNotecard[i][0]).split("_")[1];
				break;				
			}
		}
		id = arr[1]+"_"+arr[2];
		editNoteID = arr[2];
	}
	else if(arr[0] == "Notecard") 
	{
		id = arr[0]+"_"+arr[1];
		editNoteID = arr[1];
	}
	function handleSuccess (o) 
	{			
		if((Trim(o.responseText)).match("ERROR_MULTIPLE") || (Trim(o.responseText)).match("ERROR_NOID"))
		{			
			showNotesSessionError(Trim(o.responseText));
			return false;
		}

		var noteData = null;
		var title;
		var src;		
		var url;
		var quote;				

		try
		{
			noteData = Ext.decode(o.responseText);
		}
		catch(e)
		{
			alert(e);
		}
		
		if(noteData != null)
		{
			title = noteData[0];
			src = noteData[1];
			//url = noteData[2];
			quote = noteData[3];
			if(noteData[4]!=null)
			{
				tags = noteData[4];
			}
			else
			{
				tags = "";
			}			
		}
		var url = "";
		if (title.length > 20) 
		{
			title = title.substr(0, 40) + "...";
		}
		if (src.length > 16) 
		{
			src = Trim(src.substring(0, 40) + "..");
		}
		if(noteData[2] != "")
		{
			url = "<a href='"+noteData[2]+"' style=margin-left:5px; target='_blank'>Web link</a>";
		}		
		if (quote.length > 100) 
		{
			quote = quote.substring(0, 100) + "..";
		}
		if(isTeacher != "1"){
			var button = "<tr><td align=center class=imgCont><span class=popupLinks onclick=notecardDetail('"+editNoteID+"') >View Details</span> | <span class=popupLinks onclick='editNotecard();'>Edit</span> | <span class=popupLinks onclick='deleteConfirmDgNotecard();'>Delete</span></td></tr>";
			var liButton = "<tr><td align=center class='imgCont'><span class=popupLinks onclick=notecardDetail('"+editNoteID+"')>View Details</span> | <span class=popupLinks onclick='editNotecard();'>Edit</span> | <span class=popupLinks onclick='deleteConfirmDgNotecard();'>Delete</span></td></tr>";
		}else{
			var button = "<tr><td align=center class=imgCont><span class=popupLinks onclick=notecardDetail('"+editNoteID+"') >View and Add Comments</span></td></tr>";
			var liButton = "<tr><td align=center class='imgCont'><span class=popupLinks onclick=notecardDetail('"+editNoteID+"')>View and Add Comments</span></tr>";
		}
		if (popupID == "panelRightTop") 
		{
			var popupHtml = "<div id=popup_"+editNoteID+"><table cellspacing=0 cellpadding=0>";
				popupHtml = popupHtml+"<tr><td class=prthdrLeft></td><td width=200 class=prthdrMiddle></td><td class=prthdrRight></td></tr>";
				popupHtml = popupHtml+"<tr><td valign=bottom class=prtbdLeft><img src=../notecards/_images/img/panelRightTop/corner-middle-left.png>";
				popupHtml = popupHtml+"</td><td valign=top class=prtbdMiddle>";
				popupHtml = popupHtml+"<table width=200 cellspacing=0 cellpadding=0>";
				popupHtml = popupHtml+"<tr><td class='imgCont'><img src=../notecards/_images/weblink.png>"+url+"</td></tr>";
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";				
				popupHtml = popupHtml+"<tr><td height=10 class=titlert>"+title+"</td></tr>";
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";
				popupHtml = popupHtml+"<tr><td height=10 class=sourcert>"+src+"</td></tr>";
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";
				popupHtml = popupHtml+"<tr><td height=20 class=sourcert>Tags: "+tags+"</td></tr>";				
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";
				popupHtml = popupHtml+"<tr><td height=50 class=quotert>Quote:"+quote+"</td></tr>";
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";
				popupHtml = popupHtml+button;
				popupHtml = popupHtml+"</table>";
				popupHtml = popupHtml+"</td><td height=170 class=prtbdRight></td></tr>";
				popupHtml = popupHtml+"<tr><td class=prtftLeft></td><td width=200 class=prtftMiddle></td><td class=prtftRight></td></tr>";
				popupHtml = popupHtml+"</table></div>";			
		}
		if (popupID == "panelRightBottom") 
		{
			var popupHtml = "<div id=popup_"+editNoteID+"><table cellspacing=0 cellpadding=0>";
				popupHtml = popupHtml+"<tr><td class=prbhdrLeft></td><td width=200 class=prbhdrMiddle></td><td class=prbhdrRight></td></tr>";
				popupHtml = popupHtml+"<tr><td valign=top class=prbbdLeft><img src=../notecards/_images/img/panelRightBottom/corner-middle-left.png>";
				popupHtml = popupHtml+"</td>";
				popupHtml = popupHtml+"<td valign=top class=prbbdMiddle>";
				popupHtml = popupHtml+"<table width=200 cellspacing=0 cellpadding=0>";
				popupHtml = popupHtml+"<tr><td class='imgCont'><img src=../notecards/_images/weblink.png>"+url+"</td></tr>";
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";
				popupHtml = popupHtml+"<tr><td height=10 valign=top class=titlert>"+title+"</td></tr>";
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";
				popupHtml = popupHtml+"<tr><td height=10 class=sourcert>"+src+"</td></tr>";
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";
				popupHtml = popupHtml+"<tr><td height=20 class=sourcert>Tags: "+tags+"</td></tr>";				
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";
				popupHtml = popupHtml+"<tr><td height=50 valign=top class=quotert>Quote:"+quote+"</td></tr>";
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";
				if(arr[0] == "li")
				{
					popupHtml = popupHtml+liButton;	
				}
				else
				{					
					popupHtml = popupHtml+button;
				}
				popupHtml = popupHtml+"</table>";
				popupHtml = popupHtml+"</td><td class=prbbdRight></td></tr>";
				popupHtml = popupHtml+"<tr><td class=prbftLeft></td><td width=200 class=prbftMiddle></td><td class=prbftRight></td></tr>";
				popupHtml = popupHtml+"</table></div>";				
		}
		if (popupID == "panelLeftBottom") 
		{
			var popupHtml = "<div id=popup_"+editNoteID+"><table cellspacing=00 cellpadding=00>";
				popupHtml = popupHtml+"<tr><td class=plbhdrLeft></td><td width=200 class=plbhdrMiddle></td><td class=plbhdrRight></td></tr>";
				popupHtml = popupHtml+"<tr><td height=170 class=plbbdLeft></td><td valign=top class=plbbdMiddle>";
				popupHtml = popupHtml+"<table width=200 cellspacing=0 cellpadding=0>";
				popupHtml = popupHtml+"<tr><td class='imgCont'><img src=../notecards/_images/weblink.png>"+url+"</td></tr>";
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";				
				popupHtml = popupHtml+"<tr><td height=10 valign=top class=titlert>"+title+"</td></tr>";
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";
				popupHtml = popupHtml+"<tr><td height=10 class=sourcert>"+src+"</td></tr>";
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";
				popupHtml = popupHtml+"<tr><td height=20 class=sourcert>Tags: "+tags+"</td></tr>";				
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";
				popupHtml = popupHtml+"<tr><td height=50 valign=top class=quotert>Quote:"+quote+"</td></tr>";
				popupHtml = popupHtml+button;
				popupHtml = popupHtml+"</table>";
				popupHtml = popupHtml+"</td><td valign=top class=plbbdRight><img src=../notecards/_images/img/panelLeftBottom/corner-middle-right.png>";
				popupHtml = popupHtml+"</td></tr>";
				popupHtml = popupHtml+"<tr><td class=plbftLeft></td><td class=plbftMiddle></td><td class=plbftRight></td></tr>";
				popupHtml = popupHtml+"</table></div>";				
		}
		if (popupID == "panelLeftTop") 
		{
			var popupHtml = "<div id=popup_"+editNoteID+"><table cellspacing=00 cellpadding=00>";
				popupHtml = popupHtml+"<tr><td class=plthdrLeft></td><td width=200 class=plthdrMiddle></td><td class=plthdrRight></td></tr>";
				popupHtml = popupHtml+"<tr><td height=170 class=pltbdLeft></td><td valign=top class=pltbdMiddle>";
				popupHtml = popupHtml+"<table width=200 cellspacing=0 cellpadding=0>";
				popupHtml = popupHtml+"<tr><td class='imgCont'><img src=../notecards/_images/weblink.png>"+url+"</td></tr>";
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";				
				popupHtml = popupHtml+"<tr><td height=10 valign=top class=titlert>"+title+"</td></tr>";
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";
				popupHtml = popupHtml+"<tr><td height=10 class=sourcert>"+src+"</td></tr>";
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";
				popupHtml = popupHtml+"<tr><td height=20 class=sourcert>Tags: "+tags+"</td></tr>";				
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";				
				popupHtml = popupHtml+"<tr><td height=50 valign=top class=quotert>Quote:"+quote+"</td></tr>";
				popupHtml = popupHtml+"<tr><td height=3></td></tr>";
				popupHtml = popupHtml+button;
				popupHtml = popupHtml+"</table>";
				popupHtml = popupHtml+"</td><td valign=bottom class=pltbdRight><img src=../notecards/_images/img/panelLeftTop/corner-middle-right.png>";
				popupHtml = popupHtml+"</td></tr>";
				popupHtml = popupHtml+"<tr><td class=pltftLeft></td><td width=200 class=pltftMiddle></td><td class=pltftRight></td></tr>";
				popupHtml = popupHtml+"</table></div>";							
		}


		if (displayPopup) {
			var popupWin = new Ext.Window({
				layout: 'fit',
				baseCls: 'summPopup',
				pageX: x,
				pageY: y,
				shadow: false,
				html: popupHtml,
				manager: openwindows,
				closable: false,
				resizable: false,
				plain: true,
				border: false,
				listeners: {
					'beforeshow': {
						fn: function(cmp){
							hideMe();
							endEditLiNotTitle();
							pileHideMe();
						}
					}
				}
			});
			
			//if(displayPopup){
			popupWin.show();
			//}
			
			setTimeout(function(){
				// This simulates a long-running operation like a database
				// save or XHR call.
				// In real code, this would be in a callback function.
				closePopup();
			}, 500);
			
			function closePopup(){
				//retrieve the mouse point region			
				var creg = new YAHOO.util.Point(mousex, mousey);
				
				//retrieve the popup region
				var popID = "popup_" + editNoteID;
				var popReg = YAHOO.util.Dom.getRegion(popID);
				
				//retrieve the notecard region
				var noteReg = YAHOO.util.Dom.getRegion(val);
				
				if (creg.intersect(popReg) || creg.intersect(noteReg)) {
					var ntask = new Ext.util.DelayedTask(function(){
						closePopup();
					});
					ntask.delay(500);
				/*setTimeout(function() {
			 closePopup();
			 }, 500);*/
				}
				else {
					popupWin.close();
				}
			}
		}		
	}
	// function called on failure
	function handleFailure (o) 
	{

	};

	//ajax call to the server to load notecard data
	Ext.Ajax.request({
   		url: '../notecards/_includes/notecardOperations.php',
   		method: 'POST',
   		success: handleSuccess,				   
   		failure: handleFailure,
		params : 'toggle=ret&notecardID='+editNoteID   		
	});	

		
}

/*
 * function to invoke summ popup for the pile
 */
function invokePilePopup(pile)
{
	pname = pile;
	tt = window.setTimeout('showPilePopup(pname)',500);
}

/*
 * function to decide location of the summ popup for pile
 */
function showPilePopup(pile)
{
	arrVal = pile.split("_");
	//retrieve the element region here
	var element = YAHOO.util.Dom.getRegion(pile);
	elemLeft = element.left;
	elemTop = element.top;
	elemBottom = element.bottom;
	elemRight = element.right;	
	
	var i;
	tr = "";
	tl = "";
	br = "";
	bl = "";
				
	//determine if tabletopContainer and the imaginary point intersects				
	var tid = document.getElementById("tabletopContainer");
	var trg = YAHOO.util.Region.getRegion(tid);
	
	var factx = (elemRight-elemLeft)/2;
	var facty = (elemBottom-elemTop)/2;  				
	
	//calculate the top imaginary point		
	var et = new YAHOO.util.Point((elemLeft+factx),(elemTop-150));
	
	//calculate the left imaginery point		
	var el = new YAHOO.util.Point((elemLeft-150),(elemTop+facty));
	
	//calculate the right imaginary point
	var er = new YAHOO.util.Point((elemRight+150),(elemTop+facty));
	
	//calculate the bottom imaginary point
	var eb = new YAHOO.util.Point((elemLeft+factx),(elemBottom+150));
		
	//left corner
	if(trg.intersect(el) == null && trg.intersect(et) != null && trg.intersect(er) != null && trg.intersect(eb) != null)		
	{
		showPilePopupxy(pile,(elemRight-30),elemTop,"panelRightBottom");			
	}
	//left top corner
	else if(trg.intersect(el) == null && trg.intersect(et) == null && trg.intersect(er) != null && trg.intersect(eb) != null)
	{
		showPilePopupxy(pile,(elemRight-30),elemTop,"panelRightBottom");
	}
	//top corner
	else if(trg.intersect(el) != null && trg.intersect(et) == null && trg.intersect(er) != null && trg.intersect(eb) != null)
	{
		showPilePopupxy(pile,(elemRight-30),elemTop,"panelRightBottom");
	}
	//top right corner
	else if(trg.intersect(el) != null && trg.intersect(et) == null && trg.intersect(er) == null && trg.intersect(eb) != null)
	{
		showPilePopupxy(pile,(elemLeft-235),elemTop,"panelLeftBottom");
	}
	//right corner
	else if(trg.intersect(el) != null && trg.intersect(et) != null && trg.intersect(er) == null && trg.intersect(eb) != null)
	{
		showPilePopupxy(pile,(elemLeft-235),elemTop,"panelLeftBottom");
	}
	//bottom right corner
	else if(trg.intersect(el) != null && trg.intersect(et) != null && trg.intersect(er) == null && trg.intersect(eb) == null)
	{
		showPilePopupxy(pile,(elemLeft-235),(elemTop-140),"panelLeftTop");
	}
	//bottom corner
	else if(trg.intersect(el) != null && trg.intersect(et) != null && trg.intersect(er) != null && trg.intersect(eb) == null)
	{
		showPilePopupxy(pile,(elemRight-30),(elemTop-140),"panelRightTop");
	}
	//left bottom corner
	else if(trg.intersect(el) == null && trg.intersect(et) != null && trg.intersect(er) != null && trg.intersect(eb) == null)
	{
		showPilePopupxy(pile,(elemRight-30),(elemTop-140),"panelRightTop");		
	}
	//none of the corners										
	else if(trg.intersect(el) != null && trg.intersect(et) != null && trg.intersect(er) != null && trg.intersect(eb) != null)
	{
		setOverlap(pile);

		if(tl == "y" && tr == "" && br == "" && bl == "")
		{
			showPilePopupxy(pile,(elemRight-30),elemTop,"panelRightBottom");
		}
		if(tl == "" && tr == "y" && br == "" && bl == "")
		{
			showPilePopupxy(pile,(elemLeft-235),elemTop,"panelLeftBottom");
		}
		if(tl == "" && tr == "" && br == "y" && bl == "")
		{
			showPilePopupxy(pile,(elemLeft-235),elemTop,"panelLeftBottom");
		}
		if(tl == "" && tr == "" && br == "" && bl == "y")
		{
			showPilePopupxy(pile,(elemRight-30),elemTop,"panelRightBottom");
		}
		
		if(tl == "y" && tr == "y" && br == "" && bl == "")
		{
			showPilePopupxy(pile,(elemRight-30),(elemTop+20),"panelRightBottom");
		}
		if(tl == "y" && tr == "" && br == "y" && bl == "")
		{
			showPilePopupxy(pile,(elemRight-30),(elemTop-70),"panelRightTop");
		}
		if(tl == "y" && tr == "" && br == "" && bl == "y")
		{
			showPilePopupxy(pile,(elemRight-30),elemTop,"panelRightBottom");
		}
		
		if(tl == "" && tr == "y" && br == "y" && bl == "")
		{
			showPilePopupxy(pile,(elemLeft-235),elemTop,"panelLeftBottom");
		}
		if(tl == "" && tr == "y" && br == "" && bl == "y")
		{
			showPilePopupxy(pile,(elemRight-30),(elemTop+20),"panelRightBottom");
		}

		if(tl == "" && tr == "" && br == "y" && bl == "y")
		{
			showPilePopupxy(pile,(elemRight-30),(elemTop-140),"panelRightTop");
		}
						
		if(tl == "y" && tr == "y" && br == "y" && bl == "")
		{
			showPilePopupxy(pile,(elemLeft-235),(elemTop+20),"panelLeftBottom");
		}
		if(tl == "y" && tr == "y" && br == "" && bl == "y")
		{
			showPilePopupxy(pile,(elemRight-30),(elemTop+20),"panelRightBottom");
		}
		if(tl == "y" && tr == "" && br == "y" && bl == "y")
		{
			showPilePopupxy(pile,(elemRight-30),(elemTop-140),"panelRightTop");
		}
		if(tl == "" && tr == "y" && br == "y" && bl == "y")
		{
			showPilePopupxy(pile,(elemLeft-235),(elemTop-140),"panelLeftTop");
		}
		
		if(tl == "y" && tr == "y" && br == "y" && bl == "y")
		{
			showPilePopupxy(pile,(elemRight-30),(elemTop-140),"panelRightTop");
		}
		
		if(tl == "" && tr == "" && br == "" && bl == "")
		{
			showPilePopupxy(pile,(elemRight-30),elemTop,"panelRightBottom");
		}
	}
}

/*
 * function to display summ popup for pile
 */
function showPilePopupxy(val, x, y, panel)
{
	//retrieve the current project ID here
	var projectID = document.getElementById("projectID").value;
	var activeWind = (openwindows.getActive());
	if(activeWind != null)
	{
		activeWind.close();
	}
	var arr = val.split("_");
	editNoteID = arr[1];	
	
	function handleSuccess (o)
	{		
		if((Trim(o.responseText)).match("ERROR_MULTIPLE") || (Trim(o.responseText)).match("ERROR_NOID"))
		{			
			showNotesSessionError(Trim(o.responseText));
			return false;
		}
		
		var pileData;
		var pileTitle;
		
		try {
			pileData = Ext.decode(o.responseText);
		} 
		catch (e) {
			alert(e);
		}
		
		if (pileData != null) {
			pileTitle = pileData[0];
			
			if (pileTitle.length > 30) {
				pileTitle = pileTitle.substring(0, 30) + "...";
			}
			
			var arrTitles = pileData[1].split(",");
			
			var notes = "";
			for (i = 0; i < arrTitles.length; i++) {
				if (i % 3 == 0) {
					notes = notes + "<br>" + arrTitles[i];
				}
				else {
					notes = notes + "," + arrTitles[i];
				}
			}
		}
		if (isTeacher != "1") {
			var button = "<tr><td class=imgCont><span class=popupLinks onclick='pileDetails(" + arr[1] + ")'>View Details</span> | <span class=popupLinks onclick=animatePile('Pile_" + editNoteID + "')>Expand</span> | <span class=popupLinks onclick=deleteConfirmDgPile('Pile_" + editNoteID + "')>Delete</span></td></tr>";
		}
		else {
			var button = "<tr><td class=imgCont><span class=popupLinks onclick='pileDetails(" + arr[1] + ")'>View and Add Comments</span> | <span class=popupLinks onclick=animatePile('Pile_" + editNoteID + "')>Expand</span></td></tr>";
		}
		if (panel == "panelRightTop") {
			var popupHtml = "<div id=popup_" + editNoteID + "><table cellspacing=0 cellpadding=0>";
			popupHtml = popupHtml + "<tr><td class=prthdrLeft></td><td width=200 class=prthdrMiddle></td><td class=prthdrRight></td></tr>";
			popupHtml = popupHtml + "<tr><td valign=bottom class=prtbdLeft><img src=../notecards/_images/img/panelRightTop/corner-middle-left.png>";
			popupHtml = popupHtml + "</td><td valign=top class=prtbdMiddle>";
			popupHtml = popupHtml + "<table width=200 cellspacing=0 cellpadding=0>";
			popupHtml = popupHtml + "<tr><td height=40 valign=top class=titlert>" + pileTitle + "</td></tr>";
			popupHtml = popupHtml + "<tr><td height=5></td></tr>";
			popupHtml = popupHtml + "<tr><td height=75 valign=top class=quotert>" + notes + "</td></tr>";
			popupHtml = popupHtml + "<tr><td height=5></td></tr>";
			popupHtml = popupHtml + button;
			popupHtml = popupHtml + "</table>";
			popupHtml = popupHtml + "</td><td height=156 class=prtbdRight></td></tr>";
			popupHtml = popupHtml + "<tr><td class=prtftLeft></td><td width=200 class=prtftMiddle></td><td class=prtftRight></td></tr>";
			popupHtml = popupHtml + "</table></div>";
		}
		if (panel == "panelRightBottom") {
			var popupHtml = "<div id=popup_" + editNoteID + "><table cellspacing=00 cellpadding=00>";
			popupHtml = popupHtml + "<tr><td class=prbhdrLeft></td><td width=200 class=prbhdrMiddle></td><td class=prbhdrRight></td></tr>";
			popupHtml = popupHtml + "<tr><td valign=top class=prbbdLeft><img src=../notecards/_images/img/panelRightBottom/corner-middle-left.png>";
			popupHtml = popupHtml + "</td>";
			popupHtml = popupHtml + "<td width=200 valign=top class=prbbdMiddle>";
			popupHtml = popupHtml + "<table width=200 cellspacing=0 cellpadding=0>";
			popupHtml = popupHtml + "<tr><td height=40 valign=top class=titlert>" + pileTitle + "</td></tr>";
			popupHtml = popupHtml + "<tr><td height=5></td></tr>";
			popupHtml = popupHtml + "<tr><td height=75 valign=top class=quotert>" + notes + "</td></tr>";
			popupHtml = popupHtml + "<tr><td height=5></td></tr>";
			popupHtml = popupHtml + button;
			popupHtml = popupHtml + "</table>";
			popupHtml = popupHtml + "</td><td height=156 class=prbbdRight></td></tr>";
			popupHtml = popupHtml + "<tr><td class=prbftLeft></td><td width=200 class=prbftMiddle></td><td class=prbftRight></td></tr>";
			popupHtml = popupHtml + "</table></div>";
		}
		if (panel == "panelLeftBottom") {
			var popupHtml = "<div id=popup_" + editNoteID + "><table cellspacing=00 cellpadding=00>";
			popupHtml = popupHtml + "<tr><td class=plbhdrLeft></td><td width=200 class=plbhdrMiddle></td><td class=plbhdrRight></td></tr>";
			popupHtml = popupHtml + "<tr><td height=156 class=plbbdLeft></td><td valign=top class=plbbdMiddle>";
			popupHtml = popupHtml + "<table width=200 cellspacing=0 cellpadding=0>";
			popupHtml = popupHtml + "<tr><td height=40 valign=top class=titlert>" + pileTitle + "</td></tr>";
			popupHtml = popupHtml + "<tr><td height=5></td></tr>";
			popupHtml = popupHtml + "<tr><td height=75 valign=top class=quotert>" + notes + "</td></tr>";
			popupHtml = popupHtml + "<tr><td height=5></td></tr>";
			popupHtml = popupHtml + button;
			popupHtml = popupHtml + "</table>";
			popupHtml = popupHtml + "</td><td valign=top class=plbbdRight><img src=../notecards/_images/img/panelLeftBottom/corner-middle-right.png>";
			popupHtml = popupHtml + "</td></tr>";
			popupHtml = popupHtml + "<tr><td class=plbftLeft></td><td class=plbftMiddle></td><td class=plbftRight></td></tr>";
			popupHtml = popupHtml + "</table></div>";
		}
		if (panel == "panelLeftTop") {
			var popupHtml = "<div id=popup_" + editNoteID + "><table cellspacing=00 cellpadding=00>";
			popupHtml = popupHtml + "<tr><td class=plthdrLeft></td><td width=200 class=plthdrMiddle></td><td class=plthdrRight></td></tr>";
			popupHtml = popupHtml + "<tr><td height=156 class=pltbdLeft></td><td valign=top class=pltbdMiddle>";
			popupHtml = popupHtml + "<table width=200 cellspacing=0 cellpadding=0>";
			popupHtml = popupHtml + "<tr><td height=40 valign=top class=titlert>" + pileTitle + "</td></tr>";
			popupHtml = popupHtml + "<tr><td height=5></td></tr>";
			popupHtml = popupHtml + "<tr><td height=75 valign=top class=quotert>" + notes + "</td></tr>";
			popupHtml = popupHtml + "<tr><td height=5></td></tr>";
			popupHtml = popupHtml + button;
			popupHtml = popupHtml + "</table>";
			popupHtml = popupHtml + "</td><td valign=bottom class=pltbdRight><img src=../notecards/_images/img/panelLeftTop/corner-middle-right.png>";
			popupHtml = popupHtml + "</td></tr>";
			popupHtml = popupHtml + "<tr><td class=pltftLeft></td><td width=200 class=pltftMiddle></td><td class=pltftRight></td></tr>";
			popupHtml = popupHtml + "</table></div>";
		}
		
		if (displayPopup) {
			var popupWin = new Ext.Window({
				layout: 'fit',
				baseCls: 'summPopup',
				pageX: x,
				pageY: y,
				shadow: false,
				html: popupHtml,
				manager: openwindows,
				closable: false,
				resizable: false,
				plain: true,
				border: false,
				listeners: {
					'beforeshow': {
						fn: function(cmp){
							hideMe();
							endEditLiNotTitle();
							pileHideMe();
						}
					}
				}
			});
			
			// if(displayPopup){
			popupWin.show();
			//}
			
			setTimeout(function(){
				// This simulates a long-running operation like a database
				// save or XHR call.
				// In real code, this would be in a callback function.
				closePopup();
			}, 500);
			
			function closePopup(){
				//retrieve the mouse point region			
				var creg = new YAHOO.util.Point(mousex, mousey);
				
				//retrieve the popup region
				var popID = "popup_" + editNoteID;
				var popReg = YAHOO.util.Dom.getRegion(popID);
				
				//retrieve the notecard region
				var noteReg = YAHOO.util.Dom.getRegion(val);
				
				if (creg.intersect(popReg) || creg.intersect(noteReg)) {
					var ptask = new Ext.util.DelayedTask(function(){
						closePopup();
					});
					ptask.delay(500);
					
				/*setTimeout(function() {
			 closePopup();
			 }, 500);*/
				}
				else {
					popupWin.close();
				}
			}			
		}		
	}
	// function called on failure
	function handleFailure (o){
	
	};
	var pileData = Ext.encode(pileNotecard);
	// ajax call to the server to retrieve notecard data
	Ext.Ajax.request({
   		url: '../notecards/_includes/notecardOperations.php',
   		method: 'POST',
   		success: handleSuccess,				   
   		failure: handleFailure,
		params : 'toggle=retPileDet&projectID='+projectID+'&pileID='+arr[1]+'&pileData='+pileData   		
	});	
	
}

/*
 * function to hide summary popup for pile
 */
function hidePilePopup()
{
	window.clearTimeout(tt);
}

/*
 * function to set overlap parameters for the notecard
 */
function setOverlap(val)
{
	var div = document.createElement("div");
	div.innerHTML = "<div id=region></div>";
	document.getElementById("tabletopContainer").appendChild(div.firstChild);
	
	//retrieve the element region here
	var element = YAHOO.util.Dom.getRegion(val);
	elemLeft = element.left;
	elemTop = element.top;
	elemBottom = element.bottom;
	elemRight = element.right;

	//array of total number of elements in the dom
	var arrTotNotes = YAHOO.util.Dom.getElementsByClassName( "notecard" , "div" , "tabletop" , "" );
	
	//array of total number of elements in the dom minus the node itself on which the event is fired
	var arrNotes = new Array();
	for(i=0;i<arrTotNotes.length;i++)
	{
		if(arrTotNotes[i].id != val)
		{
			arrNotes[arrNotes.length] = arrTotNotes[i];
		}
	}
	
	//create a region to the top right corner of the element
	YAHOO.util.Dom.setXY('region', [element.right,element.top-120]);
	
	var moveReg = YAHOO.util.Dom.getRegion('region');

	for(i=0;i<arrNotes.length;i++)
	{
		regToTest = YAHOO.util.Dom.getRegion(arrNotes[i]);
		retReg = moveReg.intersect(regToTest);
		if(retReg)
		{
			tr = "y";
			break;
		}
	}
	
	//create a region to the bottom right corner
	YAHOO.util.Dom.setXY('region', [element.right,element.top+34]);
	
	var moveReg = YAHOO.util.Dom.getRegion('region');

	for(i=0;i<arrNotes.length;i++)
	{
		regToTest = YAHOO.util.Dom.getRegion(arrNotes[i]);
		retReg = moveReg.intersect(regToTest);
		if(retReg)
		{
			br = "y";
			break;
		}
	}
	
	//create a region to the top left corner
	YAHOO.util.Dom.setXY('region', [element.left-150,element.top-120]);
	
	var moveReg = YAHOO.util.Dom.getRegion('region');

	for(i=0;i<arrNotes.length;i++)
	{
		regToTest = YAHOO.util.Dom.getRegion(arrNotes[i]);
		retReg = moveReg.intersect(regToTest);
		if(retReg)
		{
			tl = "y";
			break;
		}
	}

	//create a region to the bottom left corner
	YAHOO.util.Dom.setXY('region', [element.left-150,element.top+34]);
	
	var moveReg = YAHOO.util.Dom.getRegion('region');
	
	for(i=0;i<arrNotes.length;i++)
	{
		regToTest = YAHOO.util.Dom.getRegion(arrNotes[i]);
		retReg = moveReg.intersect(regToTest);
		if(retReg)
		{
			bl = "y";
			break;
		}
	}
	
	var node = document.getElementById("region");
	document.getElementById("tabletopContainer").removeChild(node);
}

/*
 * function to hide the summary popup onclick of the close button
 */
function hideCurrPopup()
{
	window.clearTimeout(t);
}

/*
 * function to hide the summary popup
 */
function hideInfoPopup()
{
	window.clearTimeout(t);
}

/*
 * function to create pile on the tabletop
 */
function createPile(leftTop, pileTitle)
{
	var projectID = document.getElementById('projectID').value;
	function handleSuccess(o)
	{
		if((Trim(o.responseText)).match("ERROR_MULTIPLE") || (Trim(o.responseText)).match("ERROR_NOID"))
		{			
			showNotesSessionError(Trim(o.responseText));
			return false;
		}
		this.leftTop = leftTop
		pCnt = Trim(o.responseText);
		var newPile = new PileTemplate("Pile_"+pCnt, pileTitle);
		pile[pCnt] = new YAHOO.example.DDPile("Pile_" + pCnt);
		var div = document.createElement("div");
		div.innerHTML = newPile.toHTML();
		document.getElementById("tabletop").appendChild(div.firstChild);
		setLeftTopInTabletop("Pile_"+pCnt, this.leftTop)
		pileNotecard[pileNotecard.length] = ["Pile_"+pCnt,underElement];
		pileNotecard[pileNotecard.length] = ["Pile_"+pCnt,overElement];
		//inserPileNoteRelation("Pile_"+pCnt,underElement);
		//inserPileNoteRelation("Pile_"+pCnt,overElement);
		var xPos = this.leftTop[0];
		var yPos = this.leftTop[1];
		pileID[pileID.length] = ['Pile_'+pCnt,xPos,yPos,"",pileTitle.toString(), "block", false, "tabletop"];
		updateCountInPile();
		updateNotecards();
		shakeMe('Pile_'+pCnt);
		updatePileNoteRelInDatabase();
		createPileThumb('Pile_'+pCnt);
		setLeftTopInBirdsEyeView('Pile_'+pCnt, getLeftTopInTabletop('Pile_'+pCnt));
		
        function success(o){
			if((Trim(o.responseText)).match("ERROR_MULTIPLE") || (Trim(o.responseText)).match("ERROR_NOID"))
			{			
				showNotesSessionError(Trim(o.responseText));
				return false;
			}
        }
        function failure(o){
        }		
		//ajax call to the server to update notecard position
        Ext.Ajax.request({
            url: '../notecards/_includes/notecardOperations.php',
            method: 'POST',
            success: success,
            failure: failure,
			params : 'toggle=updatePilePos&projectID='+projectID+'&pileId='+pCnt+'&leftPos='+this.leftTop[0]+'&topPos='+this.leftTop[1]
        });
	};
	//function called on failure
	function handleFailure (o)
	{
	};
	
    //ajax call to the server to insert notecard data
    Ext.Ajax.request({
        url: '../notecards/_includes/notecardOperations.php',
        method: 'POST',
        success: handleSuccess,
        failure: handleFailure,
		params : 'toggle=insertNewPile&projectID='+projectID+'&title='+pileTitle
    });
}

/*
 * function to merge piles
 */
function mergePiles(pileId1, pileId2)
{
	var i=0;
	for(i=0;i<pileNotecard.length;i++)
	{
		if(pileNotecard[i][0] == pileId1)
		{
			pileNotecard[i][0] = pileId2;
		}
	}
	updatePileNoteRelInDatabase();
	updateCountInPile();
	updateNotecards();
	return true;
}

/*
 * function to calculate number of notecards in a pile
 */
function notecardCountInPile(pileId)
{
   
    var i=0;
    var countNotes = 0;
    var selectedNotes = 0;
    var countString = null;
    for(i=0;i<pileNotecard.length;i++)
    {
        if(pileNotecard[i][0] == pileId)
        {
            for(j=0;j<notecardID.length;j++)
		    {
		        if(notecardID[j][0] == pileNotecard[i][1])
		        {
		            if(document.getElementById(notecardID[j][0]).className == 'notecardYellow')
		            {
						notecardID[j][5] = true;
		                selectedNotes++;
		            }
		            countNotes++
		        }
		    }
        }
    }
	// string that displays the count if there are some selected notecards in the pile
    if(selectedNotes > 0)
    {
        countString = "<font color='#BFA762'>" + selectedNotes + "</font><font color='black'> / " + countNotes + "</font>";
		document.getElementById(pileId).className = "pileYellow";
    }
    else
    {
        countString = "<font color='black'>" + countNotes + "</font>";
		document.getElementById(pileId).className = "pile";
    }
	
    return countString;
}

/*
 * function to show shake effect 
 */
function shakeMe(element)
{
	
	// check if any notecard in pile is yellow, and change the class of pile 
	for(i=0;i<pileNotecard.length;i++)
	{
		if(pileNotecard[i][0] == element)
		{
			for(a=0;a<pileID.length;a++)
			{
				if(pileID[a][0] == element)
				{
					pileID[a][5] = "block";
				}
			}
			if(document.getElementById(pileNotecard[i][1]).className == "notecardYellow")
			{
				var el = new YAHOO.util.Element(element);
				el.replaceClass('pile', 'pileYellow');
				for (j = 0; j < pileID.length; j++) {
					if (pileID[j][0] == element) {
						pileID[j][6] = true;
					}
				}
				break;
			}
			else
			{
				var el = new YAHOO.util.Element(element);
				el.replaceClass('pileYellow', 'pile');
				for (j = 0; j < pileID.length; j++) {
					if (pileID[j][0] == element) {
						pileID[j][6] = false;
					}
				}
			}
		}
	}
	var attribute = {delay: true };
	var ele = new YAHOO.widget.Effects.ShakeLR(element,attribute);
	ele.animate();
	updateCountInPile();
	var el = Ext.get(element);
	//el.frame("C3DAF9", 1, { duration: .5 });
}

/*
 * function to capture the ctrl shift alt event
 */
function checkKeyPressed(e)
{
	
	//alert("yes");
	var evt = navigator.appName=="Netscape" ? e:event;
	if(Ext.isMac){
		if(evt.keyCode == 224){
			//alert("is mac : "+evt.keyCode)
			ctrlPressed = true;
		}
	}
	
	if (parseInt(navigator.appVersion)>3) 
	{
		var evt = navigator.appName=="Netscape" ? e:event;
	
		if (navigator.appName=="Netscape" && parseInt(navigator.appVersion)<=4) 
		{
		 	// NETSCAPE 4 CODE
			var mString =(e.modifiers+32).toString(2).substring(3,6);
			shiftPressed=(mString.charAt(0)=="1");
			ctrlPressed =(mString.charAt(1)=="1");
			altPressed  =(mString.charAt(2)=="1");
			
			
		}
		else
		{
			// suspend all key strokes if any popup is in position
			
			var activeWind = (openwindows.getActive());
			
			var overlayDisplay = false;
			overlayDisplay = Ext.Msg.isVisible();
			if (evt.keyCode == 46) {
				deletePressed = true;
			}
			if (evt.keyCode == 45) {
				insertPressed = true
			}
			if(activeWind == null && !overlayDisplay)
			{
				// handle eneter key
				if (evt.keyCode == 13) {
					//console.log("enter pressed");
					var el = YAHOO.util.Dom.getElementsByClassName('selected');
					if (el.length > 0) {
						if (!el[0].id.match("Note")) {
							var div_id = el[0].id.substr(8);
							if (document.getElementById(div_id.substr(4)).className != "li_notecard_outline" && document.getElementById(div_id.substr(4)).className != "li_notecard_outline_selected") {
								if (itemInEditMode != null) {
									outlineTxtHideMe();
								}
								else {
									addSiblingNode();
								}
							}
						}
					}
					if (noteInEditMode != null) {
						hideMe();
					}
					if (pileInEditMode) {
						pileHideMe();
						this.success = true;
					}
					if (liNoteInEditMode != null) {
						endEditLiNotTitle();
					}
					if(itemInEditMode){
						outlineTxtHideMe();
					}
				}
				// handle right arrow key
				if (evt.keyCode == 39 && ctrlPressed == true) {
					var el = YAHOO.util.Dom.getElementsByClassName('selected');
					if (el.length > 0) {
						if (!el[0].id.match("Notecard")) {
							var div_id = el[0].id.substr(8);
							if (document.getElementById(el[0].id.substr(12)).className != "li_notecard_outline" && document.getElementById(el[0].id.substr(12)).className != "li_notecard_outline_selected") {
								if (itemInEditMode == null) {
									var el1 = YAHOO.util.Dom.getElementsByClassName('selected');
									if (el1.length > 0) {
										if (itemInEditMode != null) {
											var val = document.getElementById('txt_' + div_id.substr(4)).value;
											document.getElementById('content_' + div_id).innerHTML = val;
											document.getElementById(div_id).style.display = "none";
											document.getElementById('content_' + div_id).style.display = "block";
											document.getElementById('content_' + div_id).className = "selected";
											itemInEditMode = null;
										}
										IndentItemRight();
									}
								}
							}
						}
						else {
							//alert("Notecards can be moved around in the outline using drag-and-drop.");
						}
					}
				}
				// handle left arrow key
				if (evt.keyCode == 37 && ctrlPressed == true) {
					var el = YAHOO.util.Dom.getElementsByClassName('selected');
					if (el.length > 0) {
						if (!el[0].id.match("Notecard")) {
							var div_id = el[0].id.substr(8);
							if (document.getElementById(el[0].id.substr(12)).className != "li_notecard_outline" && document.getElementById(el[0].id.substr(12)).className != "li_notecard_outline_selected") {
								if (itemInEditMode == null) {
									var el1 = YAHOO.util.Dom.getElementsByClassName('selected');
									if (el1.length > 0) {
										if (itemInEditMode != null) {
											var val = document.getElementById('txt_' + div_id.substr(4)).value;
											document.getElementById('content_' + div_id).innerHTML = val;
											document.getElementById(div_id).style.display = "none";
											document.getElementById('content_' + div_id).style.display = "block";
											document.getElementById('content_' + div_id).className = "selected";
											itemInEditMode = null;
										}
										IndentItemLeft();
									}
								}
							}
						}
						else {
							//alert("Notecards can be moved around in the outline using drag-and-drop.");
						}
					}
				}
				
				// handle up arrow key
				if (evt.keyCode == 38 && ctrlPressed == true) {
					moveUp();
				}
				
				// handle down arrow key
				if (evt.keyCode == 40 && ctrlPressed == true) {
					moveDown();
				}
				// handle delete key
				if (deletePressed) {
					var el = YAHOO.util.Dom.getElementsByClassName('selected');
					if (el.length > 0) {
						var div_id = el[0].id.substr(8);
						if (!el[0].id.match("Notecard")) {
							if (document.getElementById(el[0].id.substr(12)).className != "li_notecard_outline" && document.getElementById(el[0].id.substr(12)).className != "li_notecard_outline_selected") {
								if (itemInEditMode == null) {
									var el1 = YAHOO.util.Dom.getElementsByClassName('selected');
									if (el1.length > 0) {
										if (itemInEditMode != null) {
											var val = document.getElementById('txt_' + div_id.substr(4)).value;
											document.getElementById('content_' + div_id).innerHTML = val;
											document.getElementById(div_id).style.display = "none";
											document.getElementById('content_' + div_id).style.display = "block";
											document.getElementById('content_' + div_id).className = "selected";
											itemInEditMode = null;
										}
										DeleteItem();
									}
								}
							}
						}
						else {
							DeleteItem();
						}
					}
				}
				// handle insert key
				if (insertPressed) {
					var el = YAHOO.util.Dom.getElementsByClassName('selected');
					if (el.length > 0) {
						var div_id = el[0].id.substr(8);
						if (document.getElementById(el[0].id.substr(12)).className != "li_notecard_outline" && document.getElementById(el[0].id.substr(12)).className != "li_notecard_outline_selected") {
							if (itemInEditMode == null) {
								var el1 = YAHOO.util.Dom.getElementsByClassName('selected');
								if (el1.length > 0) {
									if (itemInEditMode != null) {
										var val = document.getElementById('txt_' + div_id.substr(4)).value;
										document.getElementById('content_' + div_id).innerHTML = val;
										document.getElementById(div_id).style.display = "none";
										document.getElementById('content_' + div_id).style.display = "block";
										document.getElementById('content_' + div_id).className = "selected";
										itemInEditMode = null;
									}
									addNode();
								}
							}
						}
					}
				}
			}
			else
			{
				// handle eneter key
				if (evt.keyCode == 13) {
					if (commInEditMode != null) {
						endEditCommentText();
					}
				}
			}
			
			// NEWER BROWSERS [CROSS-PLATFORM]
			if(evt.shiftKey || evt.ctrlKey){
				ctrlPressed = true;
			}
			//shiftPressed=evt.shiftKey;
			altPressed  =evt.altKey;
			
		}
		
	}
	
	return true;
}


/*
 * function to set ctrl key attribute false
 */
function setCtrlFalse(e,t)
{
	if(e.keyCode == 17 || e.keyCode == 16){
		ctrlPressed = false;
	}
	insertPressed = false;
	deletePressed = false;
	
}
Ext.getBody().on('onkeyup', setCtrlFalse);

/*
 * remove selection in outline
 */
function removeSelection()
{
	var el = YAHOO.util.Dom. getElementsByClassName('selected');
	if(el.length>0)
	{
		if(document.getElementById('txt_outline').style.visibility == "visible")
		{
			document.getElementById(el[0].id).innerHTML = document.getElementById('txt_outline').value;
			document.getElementById('txt_outline').style.visibility = "hidden";
			document.getElementById(el[0].id).className = "";
		}
		else
		{
			document.getElementById(el[0].id).className = "";
		}
	}
}
/*
 * function to highlight the notecards on mouseover and on mouseclick
 */
function highlightMe(divId, mouseAction){
	hidePopupOnDrag();
	
	if(Ext.menu.MenuMgr.get('mainMenu') != null){
		Ext.menu.MenuMgr.get('mainMenu').hide(true);
	}
	if (mouseAction == "click") {
		if (divId.substr(0, 3) == "Not") {
			if (ctrlPressed == true) {
				if (document.getElementById(divId) == null) {
				
				}
				else {
				
					if (document.getElementById(divId).className == "notecard") {
						document.getElementById(divId).className = "notecardYellow";
						for (i = 0; i < notecardID.length; i++) {
							if (notecardID[i][0] == divId) {
								notecardID[i][5] = true;
							}
						}
						for (i = 0; i < notecardsOutline.length; i++) {
							if (notecardsOutline[i][0] == divId) {
								document.getElementById(notecardsOutline[i][1]).className = "li_notecard_outline_selected";
							}
						}
					}
					else 
						if (document.getElementById(divId).className = "notecardYellow") {
							document.getElementById(divId).className = "notecard";
							for (i = 0; i < notecardID.length; i++) {
								if (notecardID[i][0] == divId) {
									notecardID[i][5] = false;
								}
								for (j in notecardsOutline) {
									if (notecardsOutline[j][0] == divId) {
										document.getElementById(notecardsOutline[j][1]).className = "li_notecard_outline";
									}
								}
							}
						}
				}
			}
		}
		if (divId.substr(0, 3) == "li_") {
			if (ctrlPressed == true) {
				if (document.getElementById(divId).className == "noteli") {
					document.getElementById(divId).className = "noteliYellow";
					document.getElementById("div_" + divId.substr(3) + "_content").className = "noteliYellowContent";
					document.getElementById(divId.substr(3)).className = "notecardYellow";
					
					for(i=0;i<notecardID.length;i++)
					{
						if(notecardID[i][0] == divId.substr(3))
						{
							notecardID[i][5] = true;
						}
					}
					for(i=0;i<notecardsOutline.length;i++)
					{
						if(notecardsOutline[i][0] == divId.substr(3))
						{
							document.getElementById(notecardsOutline[i][1]).className = "li_notecard_outline_selected";
						}
					}
					
				}
				else if (document.getElementById(divId).className == "noteliYellow") {
					document.getElementById(divId).className = "noteli";
					document.getElementById("div_" + divId.substr(3) + "_content").className = "noteliContent";
					document.getElementById(divId.substr(3)).className = "notecard";
					
					for(i=0;i<notecardID.length;i++)
					{
						if(notecardID[i][0] == divId.substr(3))
						{
							notecardID[i][5] = false;
						}
					}
					for(j in notecardsOutline)
					{
						if(notecardsOutline[j][0] == divId.substr(3))
						{
							document.getElementById(notecardsOutline[j][1]).className = "li_notecard_outline";
						}
					}
				}
			}
		}
	}
}	

/*
 * function to animate the pile
 */
function animatePile(pileId){
    if (expandedPileArray.length > 1) {
        Ext.MessageBox.alert("Alert", "More than two piles cannot be opened simultaneously");
    }
    else {
        hidePopupOnDrag();
        // create expanded file html
        createExpPile(pileId);
        //YAHOO.util.Dom.setStyle('exp_'+pileId, "opacity", "0");
        
        // hide the pile
        YAHOO.util.Dom.setStyle(pileId, "display", "none");
        
        // se the position of new expanded pile equal to the minimal pile
        //YAHOO.util.Dom.setXY('exp_'+pileId, YAHOO.util.Dom.getXY(pileId));
        
        YAHOO.util.Dom.setStyle('exp_' + pileId, "position", "");
        // fix the position of the pile
        var xy = getLeftTopInTabletop(pileId);
        for (i = 0; i < pileID.length; i++) {
            if (pileID[0][0] == pileId) {
                pileID[0][1] = xy[0];
                pileID[0][2] = xy[1];
            }
        }
        // call the animation to move overlapped notecards away
        moveElementsAway('exp_' + pileId);
    }
}

/*
 * function to create an expanded pile
 */
function createExpPile(pileId)
{
	var expPile = new expandedPileTemplate(pileId);
	
	var div = document.createElement("span");
	div.innerHTML = expPile.toHTML();
	document.getElementById("tabletop").appendChild(div.firstChild);
	var leftTop = getLeftTopInTabletop(pileId);
	setLeftTopInTabletop("exp_"+pileId, leftTop);
       
	if((Number(leftTop[0])+350) > 3000)
	{
		var diff = 3000 - (Number(leftTop[0])+350);
		leftTop[0] = Number(leftTop[0]) + Number(diff);
		outOfBound = true;
	}
	if((Number(leftTop[1])+300) > 1500)
	{
		var diff = 1500 - (Number(leftTop[1])+350);
		leftTop[1] = Number(leftTop[1]) + Number(diff);
		outOfBound = true;
	}
	setLeftTopInTabletop("exp_"+pileId, leftTop);
	expandedPileArray[expandedPileArray.length] = ["exp_"+pileId,"", leftTop[0], leftTop[1]];
}


/*
 * function to animate the movement of overlapped notecards
 */
function flyElementsAway(elementId, direction, region_notecard, pile_region){
    var tabletopRegion = Ext.get("tabletop").getRegion();
    // alert((pile_region.right+100) + " : " + tabletopRegion.right);
    if (elementId.match("Note")) {
    
        if ((pile_region.right + 100) > tabletopRegion.right) {
            direction = "left";
        }
        else {
            direction = "right";
        }
        // if notecard is to move left
        if (direction == "left") {
            var coordinateX = pile_region.left - 100;
            var coordinateY = YAHOO.util.Dom.getY(elementId);
        }
        // if notecard is to move right
        if (direction == "right") {
            var coordinateX = pile_region.right + 30;
            var coordinateY = YAHOO.util.Dom.getY(elementId);
        }
    }
    else 
        if (elementId.match("ex")) {
            if ((pile_region.right + 350) > tabletopRegion.right) {
                direction = "left";
            }
            else {
                direction = "right";
            }
            // if notecard is to move left
            if (direction == "left") {
                var coordinateX = pile_region.left - 450;
                var coordinateY = YAHOO.util.Dom.getY(elementId);
            }
            // if notecard is to move right
            if (direction == "right") {
                var coordinateX = pile_region.right + 30;
                var coordinateY = YAHOO.util.Dom.getY(elementId);
            }
        }
        else 
            if (elementId.match("Pile")) {
                if ((pile_region.right + 100) > tabletopRegion.right) {
                    direction = "left";
                }
                else {
                    direction = "right";
                }
                // if notecard is to move left
                if (direction == "left") {
                    var coordinateX = pile_region.left - 100;
                    var coordinateY = YAHOO.util.Dom.getY(elementId);
                }
                // if notecard is to move right
                if (direction == "right") {
                    var coordinateX = pile_region.right + 30;
                    var coordinateY = YAHOO.util.Dom.getY(elementId);
                }
            }
    var attributes_outer = {
        points: {
            to: [coordinateX, coordinateY]
        }
    };
    var flyToPosition_outer = new YAHOO.util.Motion(elementId, attributes_outer);
    flyToPosition_outer.method = YAHOO.util.Easing.easeOut;
    flyToPosition_outer.duration = 0;
    flyToPosition_outer.animate();
    flyToPosition_outer.onComplete.subscribe(function(){
        var el = elementId.substr(0, 2);
        if (el == "ex") {
            moveElementsAway(elementId);
        }
    });
    
}
/*
 * function to animate the movement of notecards back to original position
 */
function flyElementsBack(pileId)
{
	if(endEditLiNotTitle()){
		this.PileId = pileId;
		var tabletop = YAHOO.util.Dom.get('tabletop');
		var expPile = YAHOO.util.Dom.get('exp_'+pileId);
		var pile_id = YAHOO.util.Dom.get(pileId);
		var notecardCount = 0;
		// loop to calculate the number of notecards in the pile
		for(i=0;i<pileNotecard.length;i++)
		{
			if(pileNotecard[i][0] == pileId)
			{
				notecardCount++;		
			}
		}
		
		if(notecardCount > 1)
		{
			for(j=0;j<expandedPileArray.length;j++){
				if(expandedPileArray[j][0] == 'exp_'+pileId){				
					expandedPileArray.splice(j,1);
				}
			}
			// remove the entry of the pile
			for(i=0;i<expandedPileArray.length;i++)
			{
				if(expandedPileArray[i] == 'exp_'+pileId)
				{
					expandedPileArray.splice(i,1);
				}
			}
			// get the notecards left in the pile in exactly the same order
			var ul_child = YAHOO.util.Dom.getChildren("li_"+this.PileId);
			for(i=0;i<pileNotecard.length;i++)
			{
				if(pileNotecard[i][0] == this.PileId)
				{
					pileNotecard[i][1] = ul_child[0].id.substr(3);
					// set the dispaly as block of the pile
					document.getElementById(pileNotecard[i][0]).style.display = "block";
					ul_child.splice(0,1);
				}
			}
			// remove the expanded pile from DOM
			tabletop.removeChild(expPile);
			updateCountInPile();
			shakeMe(pileId);
		}
		// move all the elements back to their position
		if(expandedPileArray.length == 0){
			for(k=0;k<notecardID.length;k++){
				var pos = [notecardID[k][1],notecardID[k][2]];
				setLeftTopInTabletop(notecardID[k][0], pos);
			}
			for(j=0;j<pileID.length;j++){
				var pos = [pileID[j][1],pileID[j][2]];
				setLeftTopInTabletop(pileID[j][0], pos);
			}
		}
	}
	if (isTeacher != "1") {
		function success(o){
			if ((Trim(o.responseText)).match("ERROR_MULTIPLE") || (Trim(o.responseText)).match("ERROR_NOID")) {
				showNotesSessionError(Trim(o.responseText));
				return false;
			}
		}
		function fail(o){
		
		};
		var projectID = document.getElementById("projectID").value;
		var pileData = Ext.encode(pileNotecard);
		
		Ext.Ajax.request({
			url: '../notecards/_includes/notecardOperations.php',
			method: 'POST',
			success: success,
			failure: fail,
			params: 'toggle=changeOrder&projectId=' + projectID + '&pileData=' + pileData
		});
	}	
	
}
/*
 * function to animate the movement of elements away to prevent overlap with expanded view
 */
function moveElementsAway(exp_pileId){
	
	// store all the elements of the tabletop in an array
	this.children = YAHOO.util.Dom.getChildren('tabletop');
	// store the region of expanded pile
	this.pile_region = YAHOO.util.Dom.getRegion(exp_pileId);
	
	this.pileId = exp_pileId.substr(4);
	// variable to store the direction in which overlapped item should move
	var direction;
	// loop to travaerse e ach and every element in the dom
	for (i = 0; i < this.children.length; i++) {
		// flag to check notecard is from pile or external
		this.flag = false;
		this.element_id = this.children[i].id;
		this.element_type = this.element_id.substr(0, 3);
		var display = YAHOO.util.Dom.getStyle(this.element_id, 'display');
		// check is the element is a notecard
		if (this.element_type == "Not" && display == "block") {
			// Loop to determine whether its a part of the current pile
			/*for (m = 0; m < pileNotecard.length; m++) {
					if (pileNotecard[m][1] == this.element_id) {
						this.flag = true;
					}
			}*/
			//if (this.flag == false) {
				// store the region of the notecard
				this.region_notecard = YAHOO.util.Dom.getRegion(this.element_id);
				// store the region of overlapping
				this.intersect_region = this.region_notecard.intersect(this.pile_region);
				// condition if it does not overlap
				if (this.intersect_region != null) {
					// check if its more close to left or right
					if ((Math.abs(this.region_notecard.left - this.pile_region.left)) < (Math.abs(this.region_notecard.right - this.pile_region.right))) {
						
						if(outOfBound == true)
						{
							direction = "left";
						}else direction = "right";
						// get the position of notecard in notecard array
						for(z=0;z<notecardID.length;z++)
						{
							if(notecardID[z][0] == this.element_id)
							{
								notecardID[z][3] = exp_pileId;
							}
						}						
						// call the function to move notecard
						flyElementsAway(this.element_id, direction, this.region_notecard, this.pile_region);
					}
					else {
						if(outOfBound == true)
						{
							direction = "left";
						}else direction = "right";
						// get the position of notecard in notecard array
						for(z=0;z<notecardID.length;z++)
						{
							if(notecardID[z][0] == this.element_id)
							{
								notecardID[z][3] = exp_pileId;
							}
						}
						// call the function to move notecard
						flyElementsAway(this.element_id, direction, this.region_notecard, this.pile_region);
					}
				}
			//}
		}
		// check is the element is a Pile
		if (this.element_type == "Pil" && display == "block") {
			// get the position of pile in pile array
				for(z=0;z<pileID.length;z++)
				{
					if(pileID[z][0] == this.element_id)
					{
						this.count = z;
					}
				}
			// store the region of the pile
			this.region_pile_min = YAHOO.util.Dom.getRegion(this.element_id);
			// store the region of overlapping
			this.intersect_region = this.region_pile_min.intersect(this.pile_region);
			// condition if it overlaps
			if (this.intersect_region != null) {
				// check if the element is hidden
				this.style = YAHOO.util.Dom.getStyle(this.element_id, "display");
				// check if its more close to left or right
				if ((Math.abs(this.region_pile_min.left - this.pile_region.left)) < (Math.abs(this.region_pile_min.right - this.pile_region.right)) && this.style == "block") {
					if(outOfBound == true)
					{
						direction = "left";
					}else direction = "right";
					
					pileID[this.count][3] = exp_pileId;
					// call the function to move pile
					flyElementsAway(this.element_id, direction, this.region_pile_min, this.pile_region);
				}
				else if(this.style == "block") {
					if(outOfBound == true)
					{
						direction = "left";
					}else direction = "right";
					pileID[this.count][3] = exp_pileId;
					// call the function to move notecard
					flyElementsAway(this.element_id, direction, this.region_pile_min, this.pile_region);
				}
			}
		}
		
		// check is the element is a expanded pile
		if (this.element_type == "exp" && this.children[i].id != exp_pileId) {
			//alert("3");
			// store the region of the notecard
			this.region_pile_min = YAHOO.util.Dom.getRegion(this.element_id);
			// store the region of overlapping
			this.intersect_region = this.region_pile_min.intersect(this.pile_region);
			// condition if it does not overlap
			if (this.intersect_region != null) {
				// check if the element is hidden
				this.style = YAHOO.util.Dom.getStyle(this.element_id, "display");
				// check if its more close to left or right
			for(z=0;z<expandedPileArray.length;z++)
			{
				if(expandedPileArray[z][0] == this.element_id)
				{
					expandedPileArray[z][1] = exp_pileId;
				}
			}
				if(outOfBound == true)
					{
						direction = "left";
					}else direction = "right";
				// call the function to move pile
				flyElementsAway(this.element_id, direction, this.region_pile_min, this.pile_region);
										
			}
		}
	}
	outOfBound = false;
}

/*
 * function to get the left and top of an element
 */

function getLeftTopInTabletop(elementId)
{
	var myLeft = document.getElementById(elementId).style.left;
	myLeft = myLeft.substr(0,myLeft.length-2);
	var myTop = YAHOO.util.Dom.getStyle(elementId, "top");
	myTop = myTop.substr(0,myTop.length-2);
	var result = new Array();	
	result = [myLeft,myTop];
	return result;
}

/*
 * function to set the left and top of an element
 */

function setLeftTopInTabletop(elementId, result)
{
	var myLeft = result[0] + "px";
	var myTop  = result[1] + "px";
	YAHOO.util.Dom.setStyle(elementId, "left", myLeft);
	YAHOO.util.Dom.setStyle(elementId, "top", myTop);
	var ab = YAHOO.util.Dom.getRegion('outer_hawk_eye');
	var elementReg = YAHOO.util.Dom.getRegion(elementId);
	if (ab.intersect(elementReg) != null) {
		myLeft = Number(result[0]) + 250;
		YAHOO.util.Dom.setStyle(elementId, "left", myLeft + "px");
		if (elementId.match("Note")) {
			for (i = 0; i < notecardID.length; i++) {
				if (notecardID[i][0] == elementId) {
					notecardID[i][1] = myLeft;
					notecardID[i][2] = result[1];
				}
			}
		}
		if (elementId.match("Pil")) {
			for (i = 0; i < pileID.length; i++) {
				if (pileID[i][0] == elementId) {
					pileID[i][1] = myLeft;
					pileID[i][2] = result[1];
				}
			}
		}
	}
	else {
		if (elementId.match("Note")) {
			for (i = 0; i < notecardID.length; i++) {
				if (notecardID[i][0] == elementId) {
					notecardID[i][1] = result[0];
					notecardID[i][2] = result[1];
				}
			}
		}
		
		if (elementId.match("Pil")) {
			for (i = 0; i < pileID.length; i++) {
				if (pileID[i][0] == elementId) {
					pileID[i][1] = result[0];
					pileID[i][2] = result[1];
				}
			}
		}
	}
	
}

/*
 * function to set the left and top of the thumbnail
 */

function setLeftTopInBirdsEyeView(elementId, result)
{
	this.myLeft = result[0]/12;
	this.myLeft = this.myLeft+"px";
	this.myTop = result[1]/12;
	this.myTop=this.myTop+"px";	
	YAHOO.util.Dom.setStyle("thumb_"+elementId, "left", this.myLeft)
	YAHOO.util.Dom.setStyle("thumb_"+elementId, "top", this.myTop);
}

/*
 * function to delete the selected notecard
 */
function deleteNotecard()
{
	//hide summ popups
	hidePopupOnDrag();
	if (stopEditingonTabletop()) {
		var arrSelNotes1 = YAHOO.util.Dom.getElementsByClassName("notecardYellow", "div", "tabletop", "");
		if (arrSelNotes1.length > 0) {
			// Instantiate the Dialog
			Ext.MessageBox.confirm('Confirm', 'Are you sure you want to delete the selected notecards?', showResult);
		}
		else {
			showAlertBox("Please select (ctrl-click) notecard(s) to delete.", "tabletop")
		}
	}
	function showResult(btn){
		if(btn == "yes")
		{
			prepareLoadMask();
			deleteMultipleNotecardsFromDom();
			
		}
	}
}

/*
 * function to remove existance of notecards from the DOM
 */
function removeNotesFromDom()
{
	updatePileNotPos();
	//retrieve all the selected notecards here
	var arrSelNotes = YAHOO.util.Dom.getElementsByClassName("notecardYellow", "div", "tabletop", "");
	var ttop = document.getElementById('tabletop');
		
	var callback =
	{
		success:handleSuccess,
		failure:handleFailure		
	};
	var handleFailure = function(o)
	{
		
	};
	var handleSuccess = function(o)
	{
		if((Trim(o.responseText)).match("ERROR_MULTIPLE") || (Trim(o.responseText)).match("ERROR_NOID"))
		{			
			showNotesSessionError(Trim(o.responseText));
			return false;
		}
	};
	var arrSelNotesData = new Array();
	for(i=0;i<arrSelNotes.length;i++)
	{
		arrSelNotesData[arrSelNotesData.length] = arrSelNotes[i].id;
	}
	arrSelNotesData1 = YAHOO.lang.JSON.stringify(arrSelNotesData);
	
	//ajax call to the server to insert notecard data
	YAHOO.util.Connect.asyncRequest('POST', '../notecards/_includes/notecardOperations.php', callback, "toggle=delNotecards&arrSelNotesData="+arrSelNotesData1);
	
	//delete the notecard by looping through them
	for (this.iCount = 0; this.iCount<arrSelNotes.length;this.iCount++) {	
		// remove the entry of notecard from notecard array
		for (counter1 = 0; counter1 < notecardID.length; counter1++) {
			if (notecardID[counter1][0] == arrSelNotes[this.iCount].id) {
				var parentEl = document.getElementById('outer_hawk_eye');
				var childEl = document.getElementById("thumb_" + notecardID[counter1][0]);
				parentEl.removeChild(childEl);
				notecardID.splice(counter1, 1);
				var notecard_id = document.getElementById(arrSelNotes[this.iCount].id);
				ttop.removeChild(notecard_id);
			}
		}
		 // remove the entry of notecard from the pile notecard array
		for (counter2 = 0; counter2 < pileNotecard.length; counter2++) {
			if (pileNotecard[counter2][1] == arrSelNotes[this.iCount].id) {
				if (document.getElementById("li_" + pileNotecard[counter2][1])) {
					var parentEl = document.getElementById("li_" + pileNotecard[counter2][0]);
					var childEl = document.getElementById("li_" + pileNotecard[counter2][1]);
					parentEl.removeChild(childEl);
				}
				pileNotecard.splice(counter2, 1);
			}
			
		}
		// remove the entry of notecard from the outline notecard array
		for (counter = 0; counter < notecardsOutline.length; counter++) {
			if (notecardsOutline[counter][0] == arrSelNotes[this.iCount].id) {
				var parentEl = YAHOO.util.Dom.getAncestorByTagName(notecardsOutline[counter][1], "ol");
				var childEl = document.getElementById(notecardsOutline[counter][1])
				parentEl.removeChild(childEl);
				notecardsOutline.splice(counter, 1);
				arrLength = notecardsOutline.length;
				counter = -1;
			}
		}
	}
}
/*
 * function to remove any kind of selection
 */
function removeSelection()
{
	var el = YAHOO.util.Dom.getElementsByClassName('selected');
	if(el.length > 0)
	{
		if(itemInEditMode != null)
		{
			outlineTxtHideMe()
			document.getElementById(el[0].id).className = "";
		}
	}
}
/*
 * function to remove any kind of selection
 */
function inserPileNoteRelation(pileId,NoteId)
{
	this.exists = false;
	this.inserted = false;
	for(j=0;j<pileNotecard.length;j++){
		if(pileNotecard[j][1] == NoteId){
			this.exists = true;
		}
	}
	if(!this.exists){
		pileNotecard[pileNotecard.length] = [pileId, NoteId];
		this.inserted = true;
	}else{
		for(k=0;k<pileNotecard.length;k++){
			if(pileNotecard[k][1] == NoteId){
				pileNotecard[k][0] = pileId; 
			}
		}
	}
	var projectID = document.getElementById('projectID').value;
	return this.inserted;
}

/*
 * function to refresh pile notecard relation
 */
function refreshPileNoteRelation(){
	var projectID = document.getElementById('projectID').value;
	function handleFailure (o)
	{
		
	};
	function handleSuccess (o)
	{
		if((Trim(o.responseText)).match("ERROR_MULTIPLE") || (Trim(o.responseText)).match("ERROR_NOID"))
		{			
			showNotesSessionError(Trim(o.responseText));
			return false;
		}
	};
	
	
	pileNoteData = YAHOO.lang.JSON.stringify(pileNotecard);
	//ajax call to the server to insert notecard data
	Ext.Ajax.request({
   		url: '../notecards/_includes/notecardOperations.php',
   		method: 'POST',
   		success: handleSuccess,				   
   		failure: handleFailure,
		params : 'toggle=flushPileNoteRel&projectID='+projectID+'&data='+pileNoteData  		
	});	
}
/*
 * function to save positions of elements in tabletop
 */
function updatePileNotPos(){
	var projectID = document.getElementById('projectID').value;
	function handleFailure (o)
	{
	};
	function handleSuccess (o)
	{
		if((Trim(o.responseText)).match("ERROR_MULTIPLE") || (Trim(o.responseText)).match("ERROR_NOID"))
		{			
			showNotesSessionError(Trim(o.responseText));
			return false;
		}
		refreshTabletop();
	};
	
	var notedata = YAHOO.lang.JSON.stringify(notecardID);
	var piledata = YAHOO.lang.JSON.stringify(pileID);
	//ajax call to the server to insert notecard data
	Ext.Ajax.request({
   		url: '../notecards/_includes/notecardOperations.php',
   		method: 'POST',
   		success: success,				   
   		failure: failure,
		params : 'toggle=updatePileNotPos&projectID='+projectID+'&noteData='+notedata+'&pileData='+piledata
	});	
	
}

function refreshTabletop()
{
	var el  = YAHOO.util.Dom.getChildren('tabletop');
	for(i=0;i<el.length;i++)
	{
		if(el[i].id.match("Not") || el[i].id.match("Pil") || el[i].id.match("exp"))
		{
			var tabletop = new YAHOO.util.Element("tabletop");
			tabletop.removeChild(el[i]);
			document.getElementById('zoneList').innerHTML = "";
			var birdsEyeView = new YAHOO.util.Element("outer_hawk_eye");
			if(!el[i].id.match("exp"))
			{
				var thumb = Ext.get("thumb_"+el[i].id);
				if(thumb!=null){
					thumb.remove();
				}
			}
		}
	}
	notecardID = [];
	pileID = [];
	pileNotecard = [];
	saveHTMLTree();
	loadNotecardDetailFromDatabase();
	hidePopupOnDrag();
}


Array.prototype.findIndexByCol = function(value, cIdx){
	var ctr = "";
	for (var i = 0; i < this.length; i++) {
		// use === to check for Matches. ie., identical (===), ;
		if (this[i][cIdx] == value) {
			//alert(this[i][cIdx]+"===="+value);
			return i;
		}
	}
	return ctr;
};
Array.prototype.findIndex = function(value){
	var ctr = "";
	for (var i = 0; i < this.length; i++) {
		// use === to check for Matches. ie., identical (===), ;
		if (this[i] == value) {
			return i;
		}
	}
	return ctr;
};

// function to prepare mask window
function prepareMask(callback){
	hidePopupOnDrag();
	 var maskWin = new Ext.Window({
        layout:'fit',
		manager: openwindows,
		baseCls: 'summPopup',
        closable: false,
        resizable: false,
        plain: true,
        border: false,
        shadow:false,
        html: "<img src = '../notecards/_images/ajax-loader.gif'> Loading...",
		modal: true
	});
	maskWin.show();
	
	setTimeout(function() {
					// This simulates a long-running operation like a database
					// save or XHR call.
					// In real code, this would be in a callback function.
					callback();

				}, 2000);
}

// function to prepare simple load mask window
function prepareLoadMask(){
	
	hidePopupOnDrag();
	 var maskWin = new Ext.Window({
        layout:'fit',
		manager: openwindows,
		baseCls: 'summPopup',
        closable: false,
        resizable: false,
        plain: true,
        border: false,
        shadow:false,
        html: "<img src = '../notecards/_images/ajax-loader.gif'> Deleting...",
		modal: true
	});
	maskWin.show();
	
}

// prepare loading mask for Bib Section

function prepareMaskBib(){
	hidePopupOnDrag();
	 var maskWin = new Ext.Window({
        layout:'fit',
		manager: openwindows,
		baseCls: 'summPopup',
        closable: false,
        resizable: false,
        plain: true,
        border: false,
        shadow:false,
        html: "<img src = '../notecards/_images/ajax-loader.gif'> Loading...",
		modal: true
	});
	maskWin.show();
}

function prepareMaskNote(){
	hidePopupOnDrag();
	 var maskWin = new Ext.Window({
        layout:'fit',
		manager: openwindows,
		baseCls: 'summPopup',
        closable: false,
        resizable: false,
        plain: true,
        border: false,
        shadow:false,
        html: "<img src = '../notecards/_images/ajax-loader.gif'> Loading...",
		modal: true
	});
	maskWin.show();
}