- Timestamp:
- 2012-11-21T15:56:26+13:00 (11 years ago)
- File:
-
- 1 edited
Legend:
- Unmodified
- Added
- Removed
-
main/trunk/greenstone3/web/interfaces/default/js/debug_scripts.js
r26462 r26492 1 1 function DebugWidget() 2 2 { 3 //************************ 3 4 //Private member variables 5 //************************ 6 7 //Debugger state-keeping variables 4 8 var _debugOn = false; 5 9 var _pauseSelector = false; 6 10 var _elements = new Array(); 7 11 var _itemSelected = false; //Used to prevent multiple elements from being highlighted 12 13 //Page elements 8 14 var _mainDiv; 9 15 var _textDiv; 16 var _editingDiv; 10 17 var _unpauseButton; 18 var _closeEditorButtonButton; 19 var _xmlStatusBar; 20 var _saveButton; 21 22 //Editor state-keeping variables 23 var _currentFilepath; 24 var _currentNodename; 25 var _currentName; 26 var _currentMatch; 27 var _currentNamespace; 11 28 12 29 var createDebugDiv = function() 13 30 { 14 _mainDiv = $("<div>", {"id":"debugDiv" , "class":"ui-corner-all"});31 _mainDiv = $("<div>", {"id":"debugDiv"}); 15 32 _mainDiv.css( 16 33 { … … 18 35 "font-size":"0.7em", 19 36 "bottom":"0px", 20 "height":" 25%",21 "width":"100%", 37 "height":"300px", 38 "width":"100%", 22 39 "background":"white", 23 40 "border":"1px black solid", 24 "padding":"5px" 25 }); 26 41 "padding":"5px", 42 "z-index":100 43 }); 44 45 _editingDiv = $("<div>"); 27 46 var toolBarDiv = $("<div>"); 28 toolBarDiv.css({"height":"15%"}); 47 toolBarDiv.css({"height":"40px"}); 48 var buttonDiv = $("<div>"); 49 buttonDiv.css("float", "left"); 50 toolBarDiv.append(buttonDiv); 29 51 _textDiv = $("<div>"); 30 _textDiv.css({"overflow":"auto", "width":"100%", "height":"85%", "margin-top":"5px"}); 52 _textDiv.css({"overflow":"auto", "width":"100%", "height":"260px"}); 53 31 54 var pickElementButton = $("<input type=\"button\" value=\"Enable debugging\">"); 32 55 pickElementButton.click(function() … … 51 74 } 52 75 }); 76 53 77 _unpauseButton = $("<input type=\"button\" value=\"Select new element\" disabled=\"disabled\">"); 54 78 _unpauseButton.click(function() … … 61 85 }); 62 86 63 toolBarDiv.append(pickElementButton); 64 toolBarDiv.append(_unpauseButton); 87 _closeEditorButton = $("<input type=\"button\" value=\"Close editor\" disabled=\"disabled\">"); 88 _closeEditorButton.click(function() 89 { 90 if($(this).val() == "Close editor") 91 { 92 $(this).val("Open editor"); 93 _editingDiv.hide(); 94 _mainDiv.css("height", "300px"); 95 } 96 else 97 { 98 $(this).val("Close editor"); 99 _editingDiv.show(); 100 _mainDiv.css("height", "500px"); 101 } 102 }); 103 104 _xmlStatusBar = $("<span>"); 105 _xmlStatusBar.css("padding", "5px"); 106 107 //Check the XML for errors every 2 seconds 108 setInterval(function() 109 { 110 var editor = _editingDiv.find("textarea"); 111 if(editor.length) 112 { 113 var xmlString = editor.val(); 114 try 115 { 116 var xml = $.parseXML('<testContainer xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:java="http://xml.apache.org/xslt/java" xmlns:util="xalan://org.greenstone.gsdl3.util.XSLTUtil" xmlns:gslib="http://www.greenstone.org/skinning" xmlns:gsf="http://www.greenstone.org/greenstone3/schema/ConfigFormat">' + xmlString + "</testContainer>"); 117 } 118 catch(error) 119 { 120 console.log(error); 121 _xmlStatusBar.text("XML ERROR! (Mouse over for details)"); 122 _xmlStatusBar.css({"color":"white", "background":"red"}); 123 _xmlStatusBar.attr("title", error); 124 _saveButton.attr("disabled", "disabled"); 125 return; 126 } 127 128 _xmlStatusBar.text("XML OK!"); 129 _xmlStatusBar.css({"color":"white", "background": "green"}); 130 _xmlStatusBar.removeAttr("title"); 131 _saveButton.removeAttr("disabled"); 132 } 133 134 }, 2000); 135 136 _saveButton = $("<input type=\"button\" value=\"Save changes\" disabled=\"disabled\">"); 137 _saveButton.click(function() 138 { 139 var editor = _editingDiv.find("textarea"); 140 if(editor.length) 141 { 142 var xmlString = editor.val(); 143 try 144 { 145 var xml = $.parseXML('<testContainer xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:java="http://xml.apache.org/xslt/java" xmlns:util="xalan://org.greenstone.gsdl3.util.XSLTUtil" xmlns:gslib="http://www.greenstone.org/skinning" xmlns:gsf="http://www.greenstone.org/greenstone3/schema/ConfigFormat">' + xmlString + "</testContainer>"); 146 } 147 catch(error) 148 { 149 alert("Could not save as there is a problem with the XML."); 150 return; 151 } 152 153 var url = gs.xsltParams.library_name; 154 var parameters = {"a":"g", "rt":"r", "s":"SaveXMLTemplateToFile", "s1.filePath":_currentFilepath, "s1.namespace":_currentNamespace, "s1.nodename":_currentNodename, "s1.xml":xmlString}; 155 156 if(_currentName && _currentName.length > 0){parameters["s1.name"] = _currentName;} 157 if(_currentMatch && _currentMath.length > 0){parameters["s1.match"] = _currentMatch;} 158 159 $.post(url, parameters) 160 .success(function() 161 { 162 alert("The template has been saved successfully."); 163 }) 164 .error(function() 165 { 166 alert("There was an error sending the request to the server, please try again."); 167 }); 168 } 169 }); 170 171 var minimiseButton = $("<img>", {"src":gs.imageURLs.collapse}); 172 minimiseButton.css({"cursor":"pointer", "float":"right", "margin-right":"20px"}); 173 minimiseButton.click(function() 174 { 175 if($(this).attr("src") == gs.imageURLs.collapse) 176 { 177 _textDiv.hide(); 178 $(this).attr("src", gs.imageURLs.expand); 179 _mainDiv.css("height", (_mainDiv.height() - 260) + "px"); 180 } 181 else 182 { 183 _textDiv.show(); 184 $(this).attr("src", gs.imageURLs.collapse); 185 _mainDiv.css("height", (_mainDiv.height() + 260) + "px"); 186 } 187 }); 188 189 var clear = $("<span>"); 190 clear.css("clear", "both"); 191 192 toolBarDiv.append(minimiseButton); 193 toolBarDiv.append(clear); 194 195 buttonDiv.append(pickElementButton); 196 buttonDiv.append(_unpauseButton); 197 buttonDiv.append(_closeEditorButton); 198 buttonDiv.append(_xmlStatusBar); 199 buttonDiv.append(_saveButton); 200 _mainDiv.append(_editingDiv); 65 201 _mainDiv.append(toolBarDiv); 66 202 _mainDiv.append(_textDiv); … … 82 218 var leftBorderDiv = $("<div>"); 83 219 var rightBorderDiv = $("<div>"); 84 220 85 221 topBorderDiv.css({"position":"absolute", "top":e.offset().top + "px", "left":e.offset().left + "px", "height":"0px", "width":e.width() + "px", "border":"1px solid red"}); 86 222 bottomBorderDiv.css({"position":"absolute", "top":(e.offset().top + e.height()) + "px", "left":e.offset().left + "px", "height":"0px", "width":e.width() + "px", "border":"1px solid red"}); 87 223 leftBorderDiv.css({"position":"absolute", "top":e.offset().top + "px", "left":e.offset().left + "px", "height":e.height() + "px", "width":"0px", "border":"1px solid red"}); 88 224 rightBorderDiv.css({"position":"absolute", "top":e.offset().top + "px", "left":(e.offset().left + e.width()) + "px", "height":e.height() + "px", "width":"0px", "border":"1px solid red"}); 89 225 90 226 $("body").append(topBorderDiv, bottomBorderDiv, leftBorderDiv, rightBorderDiv); 91 227 92 228 _elements.push(topBorderDiv); 93 229 _elements.push(bottomBorderDiv); … … 96 232 } 97 233 234 var addMouseEventsToInfoContainer = function(infoContainer, filepath, nodename, namespace, name, match) 235 { 236 infoContainer.click(function() 237 { 238 _currentFilepath = filepath; 239 _currentNodename = nodename; 240 _currentNamespace = namespace; 241 _currentName = name; 242 _currentMatch = match; 243 244 var url = gs.xsltParams.library_name + "?a=g&rt=r&s=RetrieveXMLTemplateFromFile&s1.filePath=" + _currentFilepath + "&s1.namespace=" + _currentNamespace + "&s1.nodename=" + _currentNodename; 245 if(_currentName && _currentName.length > 0){url += "&s1.name=" + _currentName;} 246 if(_currentMatch && _currentMatch.length > 0){url += "&s1.match=" + _currentMatch;} 247 $.ajax(url) 248 .success(function(response) 249 { 250 var template; 251 if(response.search(/<requestedTemplate>/) != -1) 252 { 253 var startIndex = response.indexOf("<requestedTemplate>") + ("<requestedTemplate>").length; 254 var endIndex = response.indexOf("</requestedTemplate>"); 255 template = response.substring(startIndex, endIndex); 256 } 257 else 258 { 259 return; 260 } 261 262 var editArea = $("<textarea>"); 263 editArea.css({"width":"98%", "height":"180px"}); 264 editArea.val(template); 265 266 _editingDiv.empty(); 267 _editingDiv.append(editArea); 268 _editingDiv.css({"height":"190px"}); 269 270 _mainDiv.css({"height":"500px"}); 271 272 _closeEditorButton.removeAttr("disabled"); 273 }) 274 .error(function() 275 { 276 console.log("ERROR"); 277 }); 278 }); 279 infoContainer.mouseover(function() 280 { 281 $(this).data("background", $(this).css("background")); 282 $(this).css("background", "yellow"); 283 }); 284 infoContainer.mouseout(function() 285 { 286 $(this).css("background", $(this).data("background")); 287 }); 288 } 289 98 290 var addMouseEventsToDebugElements = function(debugElems) 99 291 { … … 111 303 if(_debugOn && !_pauseSelector) 112 304 { 113 var surroundingDiv= $("<div>");114 surroundingDiv.css("cursor","pointer");305 var infoContainer = $("<div>"); 306 infoContainer.css({"cursor":"pointer", "border":"1px dashed #AAAAAA", "margin":"5px"}); 115 307 var fromDIV = $("<div>"); 116 308 var elementDIV = $("<div>"); 117 elementDIV.css("margin-bottom", "0.6em"); 118 119 surroundingDiv.append(fromDIV); 120 surroundingDiv.append(elementDIV); 121 122 _elements.push(surroundingDiv); 123 124 surroundingDiv.click(function() 125 { 126 var editArea = $("<textarea>"); 127 $.ajax(); 128 }); 129 130 surroundingDiv.mouseover(function() 131 { 132 $(this).data("background", $(this).css("background")); 133 $(this).css("background", "yellow"); 134 }); 135 136 surroundingDiv.mouseout(function() 137 { 138 $(this).css("background", $(this).data("background")); 139 }); 309 310 elementDIV.css("font-size", "1.1em"); 311 fromDIV.css("font-size", "0.9em"); 312 313 infoContainer.append(fromDIV); 314 infoContainer.append(elementDIV); 315 316 _elements.push(infoContainer); 317 318 var filepath = $(this).attr("filename"); 319 var fullNodename = $(this).attr("nodename"); 320 var colonIndex = fullNodename.indexOf(":"); 321 var namespace = fullNodename.substring(0, colonIndex); 322 var nodename = fullNodename.substring(colonIndex + 1); 323 var name = $(this).attr("name"); 324 var match = $(this).attr("match"); 325 326 addMouseEventsToInfoContainer(infoContainer, filepath, nodename, namespace, name, match); 140 327 141 328 var nodeName = $(this).attr("nodename"); … … 156 343 elementDIV.text("<" + nodeName + " " + attrstr + ">"); 157 344 158 _textDiv.prepend( surroundingDiv);345 _textDiv.prepend(infoContainer); 159 346 160 347 if(!_itemSelected)
Note:
See TracChangeset
for help on using the changeset viewer.