Index: /main/trunk/greenstone3/web/interfaces/default/js/debug_scripts.js
===================================================================
--- /main/trunk/greenstone3/web/interfaces/default/js/debug_scripts.js	(revision 27109)
+++ /main/trunk/greenstone3/web/interfaces/default/js/debug_scripts.js	(revision 27110)
@@ -4,4 +4,7 @@
 	//Private member variables
 	//************************
+	
+	//The this variable
+	var _greenbug = this;
 	
 	//Debugger state-keeping variables
@@ -19,4 +22,6 @@
 	var _vEditor;
 	
+	var _navArea;
+	var _fileSelector;
 	var _templateSelector;
 	var _editor;
@@ -29,5 +34,6 @@
 	
 	//Editor state-keeping variables
-	var _currentFilepath;
+	var _currentFileName;
+	var _currentLocation;
 	var _currentNodename;
 	var _currentName;
@@ -86,35 +92,12 @@
 	}
 	
-	var createDebugDiv = function()
-	{
-		_mainDiv = $("<div>", {"id":"debugDiv"});
-		_mainDiv.css(
-		{
-			"position":"fixed",
-			"font-size":"0.8em",
-			"bottom":"0px",
-			"width":"100%",
-			"background":"white",
-			"border":"1px black solid",
-			"padding":"5px",
-			"z-index":100
-		});
-
-		_editingDiv = $("<div>");
-		var toolBarDiv = $("<div>");
-		toolBarDiv.css({"height":"40px"});
-
-		var buttonDiv = $("<div>");
-		toolBarDiv.append(buttonDiv);
-
-		_templateSelector = $("<div>", {"id":"templateSelector"});
-		_templateSelector.css({"overflow":"auto", "width":"100%"});
-
-		var pickElementButton = $("<button>Enable debugging</button>");
+	var createButtonDiv = function(buttonDiv)
+	{
+		var pickElementButton = $("<button>Enable selector</button>");
 		pickElementButton.click(function()
 		{
 			if(!_debugOn)
 			{
-				pickElementButton.button("option", "label", "Disable debugging");
+				pickElementButton.button("option", "label", "Disable selector");
 				$("a").click(function(e)
 				{
@@ -125,5 +108,5 @@
 			else
 			{
-				pickElementButton.button("option", "label", "Enable debugging");
+				pickElementButton.button("option", "label", "Enable selector");
 				$("a").off("click");
 				clearAll();
@@ -191,5 +174,5 @@
 				
 				var url = gs.xsltParams.library_name;
-				var parameters = {"a":"g", "rt":"r", "s":"SaveXMLTemplateToFile", "s1.filePath":_currentFilepath, "s1.namespace":_currentNamespace, "s1.nodename":_currentNodename, "s1.xml":xmlString};
+				var parameters = {"a":"g", "rt":"r", "s":"SaveXMLTemplateToFile", "s1.locationName":_currentLocation, "s1.fileName":_currentFileName, "s1.interfaceName":gs.xsltParams.interface_name, "s1.siteName":gs.xsltParams.site_name, "s1.collectionName":gs.cgiParams.c, "s1.namespace":_currentNamespace, "s1.nodename":_currentNodename, "s1.xml":xmlString};
 
 				if(_currentName && _currentName.length > 0){parameters["s1.name"] = _currentName;}
@@ -284,5 +267,15 @@
 		});
 		_styleFunctions.push(function(){undoButton.button({icons:{primary:"ui-icon-arrowreturnthick-1-w"}})});
-
+		
+		buttonDiv.append(pickElementButton);
+		buttonDiv.append(_unpauseButton);
+		buttonDiv.append(_closeEditorButton);
+		buttonDiv.append(_saveButton);
+		buttonDiv.append(_swapEditorButton);
+		buttonDiv.append(undoButton);
+	}
+	
+	var createXMLStatusBar = function(buttonDiv)
+	{
 		_xmlStatusBar = $("<span>");
 		_xmlStatusBar.css("padding", "5px");
@@ -327,16 +320,131 @@
 			
 		}, 2000);
-		
-		var clear = $("<span>");
-		clear.css("clear", "both");
-		toolBarDiv.append(clear);
-		
-		buttonDiv.append(pickElementButton);
-		buttonDiv.append(_unpauseButton);
-		buttonDiv.append(_closeEditorButton);
-		buttonDiv.append(_saveButton);
-		buttonDiv.append(_swapEditorButton);
-		buttonDiv.append(undoButton);
 		buttonDiv.append(_xmlStatusBar);
+	}
+	
+	var createDebugDiv = function()
+	{
+		_mainDiv = $("<div>", {"id":"debugDiv"});
+		_mainDiv.css(
+		{
+			"position":"fixed",
+			"font-size":"0.8em",
+			"bottom":"0px",
+			"width":"100%",
+			"background":"white",
+			"border":"1px black solid",
+			"padding":"5px",
+			"z-index":100
+		});
+
+		_editingDiv = $("<div>");
+		var toolBarDiv = $("<div>");
+		toolBarDiv.css({"height":"40px"});
+		toolBarDiv.append("<div>", {style:"clear:both;"});
+
+		var buttonDiv = $("<div>");
+		toolBarDiv.append(buttonDiv);
+		createButtonDiv(buttonDiv);
+		createXMLStatusBar(buttonDiv);
+		
+		_navArea = $("<div>", {"id":"veNavArea"});
+		_templateSelector = $("<div>", {"id":"veTemplateSelector"});
+		_fileSelector = $("<div>", {"id":"veFileSelector", "class":"ui-state-default ui-corner-all"});
+		_navArea.append(_fileSelector);
+		_navArea.append(_templateSelector);
+		_navArea.append("<div>", {style:"clear:both;"});
+		
+		//Populate the file selector
+		var url = gs.xsltParams.library_name + "?a=g&rt=r&s=GetXSLTFilesForCollection&s1.interfaceName=" + gs.xsltParams.interface_name + "&s1.siteName=" + gs.xsltParams.site_name + "&s1.collectionName=" + gs.cgiParams.c;
+		$.ajax(url)
+		.success(function(response)
+		{
+			var listStartIndex = response.indexOf("<fileListJSON>") + "<fileListJSON>".length;
+			var listEndIndex = response.indexOf("</fileListJSON>");
+			
+			var listString = response.substring(listStartIndex, listEndIndex).replace(/&quot;/g, "\"").replace(/\\/g, "/");
+			var list = eval(listString);
+			
+			var selectBox = $("<select>");
+			selectBox.append($("<option>-- Select a file --</option>", {value:"none"}));
+			_fileSelector.append("<span>Files: </span>");
+			_fileSelector.append(selectBox);
+			for(var i = 0; i < list.length; i++)
+			{
+				var item = list[i];
+				var option = $("<option>" + item.path + " (" + item.location + ")</option>", {value:item.path});
+				option.data("fileItem", item);
+				selectBox.append(option);
+			}
+
+			selectBox.change(function()
+			{
+				var selectedItem = selectBox.find(":selected");
+				
+				var getURL = gs.xsltParams.library_name + "?a=g&rt=r&s=GetTemplateListFromFile&s1.fileName=" + selectedItem.data("fileItem").path + "&s1.locationName=" + selectedItem.data("fileItem").location + "&s1.interfaceName=" + gs.xsltParams.interface_name + "&s1.siteName=" + gs.xsltParams.site_name + "&s1.collectionName=" + gs.cgiParams.c;
+				$.ajax(getURL)
+				.success(function(templateResponse)
+				{
+					var templateListStart = templateResponse.indexOf("<templateList>") + "<templateList>".length;
+					var templateListEnd = templateResponse.indexOf("</templateList>");
+					var templateListString = templateResponse.substring(templateListStart, templateListEnd).replace(/&quot;/g, "\"");
+					var templateList = eval(templateListString);
+					
+					clearAll();
+					
+					for(var i = 0; i < templateList.length; i++)
+					{
+						var fileName = selectedItem.data("fileItem").path;
+						var location = selectedItem.data("fileItem").location;
+						var namespace = templateList[i].namespace;
+						var nodename = "template";
+						var name = templateList[i].name;
+						var match = templateList[i].match;
+						
+						if(name)
+						{
+							name = templateList[i].name.replace(/&apos;/g, "'").replace(/&quot;/g, "\"").replace(/&amp;/g, "&");
+						}
+						if(match)
+						{
+							match = templateList[i].match.replace(/&apos;/g, "'").replace(/&quot;/g, "\"").replace(/&amp;/g, "&");
+						}
+						
+						var infoContainer = $("<div>", {"class":"gbTemplateContainer ui-state-default ui-corner-all"});
+						
+						_elements.push(infoContainer);
+						
+						addMouseEventsToInfoContainer(infoContainer, fileName, location, nodename, namespace, name, match);
+						
+						if(name && name.length > 0)
+						{
+							infoContainer.text(name);
+						}
+						if(match && match.length > 0)
+						{
+							infoContainer.text(match);
+						}
+						
+						if(_templateSelector.children("div").length > 0)
+						{/*
+							var spacer = $("<div>&gt;&gt;</div>");
+							spacer.addClass("gbSpacer");
+
+							_templateSelector.prepend(spacer);
+							_elements.push(spacer);
+							*/
+						}
+						
+						_templateSelector.prepend(infoContainer);
+						
+						//resizeContainers();
+					}
+				});
+			});
+		})
+		.error(function()
+		{
+			console.log("Error retrieving XSLT files");
+		});
 		
 		_styleFunctions.push(function(){$(".ui-button").css({"margin-right":"0.5em"});});
@@ -344,6 +452,5 @@
 		_mainDiv.append(toolBarDiv);
 		_mainDiv.append(_editingDiv);
-		_mainDiv.append("<div>Templates:</div>");
-		_mainDiv.append(_templateSelector);
+		_mainDiv.append(_navArea);
 	}
 	
@@ -377,5 +484,79 @@
 	}
 	
-	var addMouseEventsToInfoContainer = function(infoContainer, filepath, nodename, namespace, name, match)
+	this.changeCurrentTemplate = function(location, fileName, nodename, namespace, name, match)
+	{
+		var responseName = "requestedNameTemplate";
+		
+		var url = gs.xsltParams.library_name + "?a=g&rt=r&s=GetXMLTemplateFromFile&s1.fileName=" + fileName + "&s1.interfaceName=" + gs.xsltParams.interface_name + "&s1.siteName=" + gs.xsltParams.site_name + "&s1.collectionName=" + gs.cgiParams.c + "&s1.locationName=" + location + "&s1.namespace=" + namespace + "&s1.nodename=" + nodename;
+		if(match && match.length > 0){url += "&s1.match=" + match; responseName = "requestedMatchTemplate";}
+		if(name && name.length > 0){url += "&s1.name=" + name;}
+
+		$.ajax(url)
+		.success(function(response)
+		{
+			var template;
+			if(response.search(responseName) != -1)
+			{
+				var startIndex = response.indexOf("<" + responseName + ">") + responseName.length + 2;
+				var endIndex = response.indexOf("</" + responseName + ">");
+				template = response.substring(startIndex, endIndex);
+			}
+			else
+			{
+				return;
+			}
+		
+			_textEditor = $("<div>", {"id":"textEditor"});
+			_textEditor.css({"width":"100%", "height":"300px"});
+			_textEditor.val(template);
+			
+			if(_isVisualEditor)
+			{
+				_textEditor.hide();
+			}
+			
+			_editingDiv.empty();
+			_editingDiv.append($("<p>Location: " + location + " <br/>Filename: " + fileName + "</p>"));
+			_editingDiv.append(_textEditor);
+			
+			_vEditor = new visualXMLEditor(template);
+			_editingDiv.append(_vEditor.getMainDiv());
+			_vEditor.setGreenbug(_greenbug);
+			_vEditor.selectRootElement();
+			
+			if(!_isVisualEditor)
+			{
+				_vEditor.getMainDiv().hide();
+			}
+			
+			_editor = ace.edit("textEditor");
+			_editor.getSession().setMode("ace/mode/xml");
+			_editor.getSession().setUseSoftTabs(false);
+			_editor.setValue(template);
+			_editor.clearSelection();
+			var UndoManager = require("ace/undomanager").UndoManager;
+			_editor.getSession().setUndoManager(new UndoManager());
+			
+			_textEditor.css({"min-height":"200px", "border-top":"5px solid #444"});
+			_textEditor.resizable({handles: 'n', resize:function()
+			{
+				_textEditor.css({top:"0px"});
+				_editor.resize();
+			}});
+
+			_closeEditorButton.button("option", "disabled", false);
+			if(_closeEditorButton.button("option", "label") == "Open editor")
+			{
+				_closeEditorButton.button("option", "label", "Close editor");
+				_editingDiv.show();
+			}
+		})
+		.error(function()
+		{
+			console.log("ERROR");
+		});
+	}
+	
+	var addMouseEventsToInfoContainer = function(infoContainer, fileName, location, nodename, namespace, name, match)
 	{
 		infoContainer.click(function()
@@ -389,5 +570,6 @@
 			_selectedTemplate.css("border", "red 1px solid");
 		
-			_currentFilepath = filepath;
+			_currentFileName = fileName;
+			_currentLocation = location;
 			_currentNodename = nodename;
 			_currentNamespace = namespace;
@@ -395,81 +577,15 @@
 			_currentMatch = match;
 		
-			var responseName = "requestedNameTemplate";
-		
-			var url = gs.xsltParams.library_name + "?a=g&rt=r&s=RetrieveXMLTemplateFromFile&s1.filePath=" + _currentFilepath + "&s1.namespace=" + _currentNamespace + "&s1.nodename=" + _currentNodename;
-			if(_currentMatch && _currentMatch.length > 0){url += "&s1.match=" + _currentMatch; responseName = "requestedMatchTemplate";}
-			if(_currentName && _currentName.length > 0){url += "&s1.name=" + _currentName;}
-			$.ajax(url)
-			.success(function(response)
-			{
-				var template;
-				if(response.search(responseName) != -1)
-				{
-					var startIndex = response.indexOf("<" + responseName + ">") + responseName.length + 2;
-					var endIndex = response.indexOf("</" + responseName + ">");
-					template = response.substring(startIndex, endIndex);
-				}
-				else
-				{
-					return;
-				}
-			
-				_textEditor = $("<div>", {"id":"textEditor"});
-				_textEditor.css({"width":"100%", "height":"300px"});
-				_textEditor.val(template);
-				
-				if(_isVisualEditor)
-				{
-					_textEditor.hide();
-				}
-				
-				_editingDiv.empty();
-				_editingDiv.append($("<p>" + filepath + "</p>"));
-				_editingDiv.append(_textEditor);
-				
-				_vEditor = new visualXMLEditor(template);
-				_editingDiv.append(_vEditor.getMainDiv());
-				_vEditor.selectRootElement();
-				
-				if(!_isVisualEditor)
-				{
-					_vEditor.getMainDiv().hide();
-				}
-				
-				_editor = ace.edit("textEditor");
-				_editor.getSession().setMode("ace/mode/xml");
-				_editor.getSession().setUseSoftTabs(false);
-				_editor.setValue(template);
-				_editor.clearSelection();
-				var UndoManager = require("ace/undomanager").UndoManager;
-				_editor.getSession().setUndoManager(new UndoManager());
-				
-				_textEditor.css({"min-height":"200px", "border-top":"5px solid #444"});
-				_textEditor.resizable({handles: 'n', resize:function()
-				{
-					_textEditor.css({top:"0px"});
-					_editor.resize();
-				}});
-
-				_closeEditorButton.button("option", "disabled", false);
-				if(_closeEditorButton.button("option", "label") == "Open editor")
-				{
-					_closeEditorButton.button("option", "label", "Close editor");
-					_editingDiv.show();
-				}
-			})
-			.error(function()
-			{
-				console.log("ERROR");
-			});
+			_greenbug.changeCurrentTemplate(location, fileName, nodename, namespace, name, match);
 		});
 		infoContainer.mouseover(function()
 		{
-			$(this).data("background", $(this).css("background"));
-			$(this).css("background", "yellow");
+			$(this).removeClass("ui-state-default");
+			$(this).addClass("ui-state-active");
 		});
 		infoContainer.mouseout(function()
 		{
-			$(this).css("background", $(this).data("background"));
+			$(this).addClass("ui-state-default");
+			$(this).removeClass("ui-state-active");
 		});
 	}
@@ -490,4 +606,6 @@
 			if(_debugOn && !_pauseSelector)
 			{
+				_fileSelector.find("select").val("none");
+			
 				var nodes = new Array();
 				if($(this).is("table, tr"))
@@ -518,5 +636,5 @@
 					nodes.push(this);
 				}
-				
+
 				$(nodes).each(function()
 				{
@@ -528,30 +646,34 @@
 					var name = $(this).attr("name");
 					var match = $(this).attr("match");
-					
-					var infoContainer = $("<div>");
-					infoContainer.addClass("gbTemplateContainer");
-					
+
+					var location;
+					var fileName;
+					if(filepath.search(/[\/\\]interfaces[\/\\]/) != -1)
+					{
+						location = "interface";
+						fileName = filepath.replace(/.*[\/\\]transform[\/\\]/, "");
+					}
+					else if(filepath.search(/[\/\\]sites[\/\\].*[\/\\]collect[\/\\].*[\/\\]etc[\/\\]/) != -1)
+					{
+						location = "collectionConfig";
+						fileName = filepath.replace(/.*[\/\\]sites[\/\\].*[\/\\]collect[\/\\].*[\/\\]etc[\/\\]/, "");
+					}
+					else if(filepath.search(/[\/\\]sites[\/\\].*[\/\\]collect[\/\\].*[\/\\]transform[\/\\]/) != -1)
+					{
+						location = "collection";
+						fileName = filepath.replace(/.*[\/\\]sites[\/\\].*[\/\\]collect[\/\\].*[\/\\]transform[\/\\]/, "");
+					}
+					else if(filepath.search(/[\/\\]sites[\/\\].*[\/\\]transform[\/\\]/) != -1)
+					{
+						location = "site";
+						fileName = filepath.replace(/.*[\/\\]sites[\/\\].*[\/\\]transform[\/\\]/, "");
+					}
+
+					var infoContainer = $("<div>", {"class":"gbTemplateContainer ui-state-default ui-corner-all"});
+
 					_elements.push(infoContainer);
-					
-					addMouseEventsToInfoContainer(infoContainer, filepath, nodename, namespace, name, match);
-					
-					/*
-					var attrstr = "";
-					var illegalNames = ["nodename", "filename", "style", "debug", "id", "class"];
-
-					var attributes = ((this.tempAttrs) ? this.tempAttrs : this.attributes);
-					
-					$(attributes).each(function()
-					{
-						for(var i = 0; i < illegalNames.length; i++)
-						{
-							if(this.name == illegalNames[i]){return;}
-						}
-						attrstr += this.name + "=\"" + this.value + "\" ";
-					});
-
-					infoContainer.text("<" + fullNodename + " " + attrstr + ">");
-					*/
-					
+
+					addMouseEventsToInfoContainer(infoContainer, fileName, location, nodename, namespace, name, match);
+
 					if(name && name.length > 0)
 					{
@@ -562,7 +684,8 @@
 						infoContainer.text(match);
 					}
-					
+
 					if(_templateSelector.children("div").length > 0)
 					{
+						/*
 						var spacer = $("<div>&gt;&gt;</div>");
 						spacer.addClass("gbSpacer");
@@ -570,9 +693,10 @@
 						_templateSelector.prepend(spacer);
 						_elements.push(spacer);
-					}
-					
+						*/
+					}
+
 					_templateSelector.prepend(infoContainer);
-					
-					resizeContainers();
+
+					//resizeContainers();
 				});
 				
@@ -626,11 +750,12 @@
 				var url = document.URL;
 				url = url.replace("debug=0", "");
-				if(url.indexOf("?") != -1)
+
+				if(url.indexOf("?") == url.length - 1)
+				{
+					document.location.href = url += "debug=1";
+				}
+				else if(url.indexOf("?") != -1)
 				{
 					document.location.href = url += "&debug=1";
-				}
-				else if(url.indexOf("?") == url.length - 1)
-				{
-					document.location.href = url += "debug=1";
 				}
 				else
Index: /main/trunk/greenstone3/web/interfaces/default/js/visual-xml-editor.js
===================================================================
--- /main/trunk/greenstone3/web/interfaces/default/js/visual-xml-editor.js	(revision 27109)
+++ /main/trunk/greenstone3/web/interfaces/default/js/visual-xml-editor.js	(revision 27110)
@@ -6,5 +6,6 @@
 function visualXMLEditor(xmlString)
 {
-	var thisEditor = this;
+	var _thisEditor = this;
+	var _greenbug;
 
 	var _globalID = 0;
@@ -89,4 +90,9 @@
 	};
 	
+	this.setGreenbug = function(gb)
+	{
+		_greenbug = gb;
+	}
+	
 	this.getXML = function()
 	{
@@ -243,5 +249,5 @@
 	var retrieveGSLIBTemplates = function(callback)
 	{
-		var url = gs.xsltParams.library_name + "?a=g&rt=r&s=GetGSLIBElementsFromFile&s1.interfaceName=" + gs.xsltParams.interface_name;
+		var url = gs.xsltParams.library_name + "?a=g&rt=r&s=GetTemplateListFromFile&s1.locationName=interface&s1.interfaceName=" + gs.xsltParams.interface_name + "&s1.fileName=gslib.xsl";
 
 		$.ajax(url)
@@ -253,6 +259,16 @@
 			var listString = response.substring(startIndex, endIndex);
 			var list = eval(listString.replace(/&quot;/g, "\""));
-			
-			_elemList["gslib"] = list;
+			var modifiedList = new Array();
+			
+			for(var i = 0; i < list.length; i++)
+			{
+				var current = list[i];
+				if(current.name)
+				{
+					modifiedList.push(current.name);
+				}
+			}
+			
+			_elemList["gslib"] = modifiedList;
 			
 			if(callback)
@@ -569,9 +585,7 @@
 	
 		var _textEditor = $("<div>");
-		var _textTitle = $("<div>Text:</div>");
 		var _nodeText = $("<div>");
 		_nodeText.text(_xmlNode.nodeValue);
 
-		_textEditor.append(_textTitle);
 		_textEditor.append(_nodeText);
 		
@@ -1068,21 +1082,23 @@
 		this.populateInformationDiv = function()
 		{
-			thisEditor.savePendingEdits();
+			_thisEditor.savePendingEdits();
 			_infoDiv.empty();
 
-			var nameElement = $("<p>");
 			if(_xmlNode.nodeType == 1)
 			{
-				nameElement.text("Name: " + _xmlNode.nodeName);
+				var nameElementTitle = $("<div>", {"class":"ui-state-default ui-corner-all veInfoDivTitle"}).text("Element name:");
+				_infoDiv.append(nameElementTitle);
+				_infoDiv.append($("<p>").text(_xmlNode.nodeName));
 			}
 			else
 			{
-				nameElement.text("[text node]");
-			}
-			_infoDiv.append(nameElement);
+				var textElementTitle = $("<div>", {"class":"ui-state-default ui-corner-all veInfoDivTitle"}).text("Text node:");
+				_infoDiv.append(textElementTitle);
+			}
 
 			if(_xmlNode.nodeType == 1)
 			{
-				var attributeTableTitle = $("<p>Attributes:<p/>");
+				var attributeTableTitle = $("<div>", {"class":"ui-state-default ui-corner-all veInfoDivTitle"});
+				attributeTableTitle.text("Attributes:");
 				var attributeTable = $("<table>");
 				attributeTable.addClass("veAttributeTableContainer");
@@ -1099,4 +1115,5 @@
 				_infoDiv.append(attributeTable);
 				
+				var addDiv = $("<div>", {"class":"veInfoDivTitle"});
 				var addSelect = $("<select>");
 				addSelect.append("<option>[blank]</option>", {value:"[blank]"});
@@ -1149,7 +1166,75 @@
 					_transactions.push({type:"addAttr", row:row})
 				});
-				_infoDiv.append(addSelect);
-				_infoDiv.append(addButton);
+				addDiv.append(addSelect);
+				addDiv.append(addButton);
+				_infoDiv.append(addDiv);
 				addButton.button();
+				
+				/*
+				if(_xmlNode.tagName == "xsl:call-template" && _xmlNode.getAttribute("name").length > 0)
+				{
+					var extraOptionsTitle = $("<div>", {"class":"ui-state-default ui-corner-all veInfoDivTitle"}).text("Additional options:");
+					var visitTemplateOption = $("<button>View called template</button>");
+					
+					_infoDiv.append(extraOptionsTitle);
+					_infoDiv.append(visitTemplateOption);
+					
+					visitTemplateOption.button();
+					visitTemplateOption.click(function()
+					{
+						var template = "";
+						template += '<xsl:template match="/">';
+						template +=   '<calledTemplate>';
+						var params = $(_xmlNode).children("xsl\\:with-param");
+						if(!params.length)
+						{
+							template += '<xsl:call-template name="' + _xmlNode.getAttribute("name") + '"/>';
+						}
+						else
+						{
+							template += '<xsl:call-template name="' + _xmlNode.getAttribute("name") + '">';
+							for(var i = 0; i < params.length; i++)
+							{
+								var param = params.eq(i);
+								template += "<xsl:with-param";
+								for(var j = 0; j < param[0].attributes.length; j++)
+								{
+									var attr = param[0].attributes[j];
+									template += " " + attr.name + "=\"" + attr.value + "\"";
+								}
+								template += "/>";
+							}
+							template += '</xsl:call-template>';
+						}
+						template +=   '</calledTemplate>';
+						template += '</xsl:template>';
+						template = template.replace(" ", "%20");
+						
+						var url = document.URL;
+						if(url.indexOf("?") == url.length - 1)
+						{
+							url += "ilt=" + template;
+						}
+						else if(url.indexOf("?") != -1)
+						{
+							url += "&ilt=" + template;
+						}
+						else
+						{
+							url += "?ilt=" + template;
+						}
+						
+						$.ajax(url)
+						.success(function(response)
+						{
+							var xml = $.parseXML(response);
+							var debug = $(xml).find("calledTemplate debug");
+
+							_greenbug.changeCurrentTemplate(debug[0].getAttribute("filename"), "template", "xsl", debug[0].getAttribute("name"), null);
+							$(".gbTemplateContainer").css("border", "1px dashed #AAAAAA");
+						});
+					});
+				}
+				*/
 			}
 
@@ -1159,21 +1244,4 @@
 				_infoDiv.append(textNode.getDiv());
 			}
-		}
-		
-		this.remove = function()
-		{
-			var divParent = _div.parents(".veElement");
-			_transactions.push({type:"remMvElem", vElemParent:_div.parent(), vElemPos:_div.index(), vElem:_div});
-			_div.data("expanded", "normal");
-			$(_xmlNode).remove();
-			_div.detach();
-			_infoDiv.empty();
-			
-			if(divParent.length)
-			{
-				divParent.first().trigger("click");
-			}
-			
-			$("#veTrash").children("img").attr("src", gs.imageURLs.trashFull);
 		}
 
@@ -1247,4 +1315,21 @@
 			return false;
 		}
+		
+		this.remove = function()
+		{
+			var divParent = _div.parents(".veElement");
+			_transactions.push({type:"remMvElem", vElemParent:_div.parent(), vElemPos:_div.index(), vElem:_div});
+			_div.data("expanded", "normal");
+			$(_xmlNode).remove();
+			_div.detach();
+			_infoDiv.empty();
+			
+			if(divParent.length)
+			{
+				divParent.first().trigger("click");
+			}
+			
+			$("#veTrash").children("img").attr("src", gs.imageURLs.trashFull);
+		}
 
 		this.expand = function()
Index: /main/trunk/greenstone3/web/interfaces/default/style/core.css
===================================================================
--- /main/trunk/greenstone3/web/interfaces/default/style/core.css	(revision 27109)
+++ /main/trunk/greenstone3/web/interfaces/default/style/core.css	(revision 27110)
@@ -897,8 +897,10 @@
 	float:left;
 	cursor:pointer;
-	border:1px dashed #AAAAAA;
-	margin:0;
+	margin:0 1em;
 	font-size:1.1em;
 	text-align:center;
+	overflow:hidden;
+	min-width:4em;
+	padding: 0.5em;
 }
 
@@ -914,4 +916,18 @@
 	margin:0;
 	padding:0;
+}
+
+#veNavArea{
+	width:100%;
+}
+
+#veTemplateSelector{
+	width:75%;
+	float:right;
+}
+
+#veFileSelector{
+	float:left;
+	padding:0.5em;
 }
 
@@ -1010,8 +1026,13 @@
 }
 
+.veInfoDivTitle{
+	text-align:center;
+	margin-bottom:1em;
+}
+
 .veAttributeTableContainer{
 	text-align:center;
 	width:100%;
-	margin-bottom:2em;
+	margin-bottom:1em;
 }
 
