/IZWebFileManager/resources/FolderTree.js

http://izwebfilemanager.googlecode.com/ · JavaScript · 314 lines · 272 code · 42 blank · 0 comment · 74 complexity · 34febdf9c6f60508b8462205c32b48a6 MD5 · raw file

  1. FolderTree = function (controllerId, clientId, uniqueId, expandImage, collapseImage, noExpandImage) {
  2. this._clientId = clientId;
  3. this._uniqueId = uniqueId;
  4. this._expandImage = expandImage;
  5. this._collapseImage = collapseImage;
  6. this._noExpandImage = noExpandImage;
  7. this._selectedNode = null;
  8. this._controller = eval('WFM_' + controllerId);
  9. }
  10. FolderTree.prototype = {
  11. getController : function() {return this._controller;},
  12. ToggleExpand : function (nodeId) {
  13. this._ToggleExpand(nodeId, this.PopulateCallback, null, this.PopulateError);
  14. },
  15. _ToggleExpand : function (nodeId, eventCallback, externalContext, errorCallback) {
  16. var node = this._getNode (nodeId);
  17. if(!node) return true;
  18. var nodeSpan = this._getChildNodesSpan (nodeId);
  19. var expand = node._expand || node._refresh || nodeSpan.style.display == "none";
  20. if(expand && node._populating) return false;
  21. if (node._refresh || (nodeSpan.style.display == "none" && nodeSpan.innerHTML.length == 0)) {
  22. node._populating = true;
  23. var nodePath = node.attributes["nodepath"].value;
  24. this.PopulateNode (nodePath, eventCallback, {'folderTree':this,'node':node,'nodeSpan':nodeSpan,'nodeId':nodeId,'nodePath':nodePath,'externalContext':externalContext}, errorCallback);
  25. return false;
  26. }
  27. node._expand = false;
  28. var image = this._getNodeImg (nodeId);
  29. if(nodeSpan.innerHTML == "*") {
  30. image.src = this._noExpandImage;
  31. nodeSpan.style.display = "none";
  32. } else {
  33. nodeSpan.style.display = expand ? "block" : "none";
  34. image.src = expand ? this._collapseImage : this._expandImage;
  35. }
  36. return true;
  37. },
  38. PopulateError : function (data, ctx){
  39. ctx.folderTree.PopulateCallback (data, ctx);
  40. },
  41. PopulateCallback : function (data, ctx)
  42. {
  43. ctx.node._refresh = false;
  44. ctx.node._populating = false;
  45. if(data == "*")
  46. ctx.nodeSpan.style.display = "none";
  47. ctx.nodeSpan.innerHTML = data;
  48. ctx.folderTree._ToggleExpand (ctx.nodeId, null, null, null);
  49. },
  50. Navigate : function (nodes, n) {
  51. for(var i=n; i<nodes.length-1; i++) {
  52. var node = this._getNode (nodes[i]);
  53. if (!node) return;
  54. if(!node._refresh) {
  55. var nodeSpan = this._getChildNodesSpan (nodes[i]);
  56. if (nodeSpan.style.display == "block") continue;
  57. if (nodeSpan.innerHTML == "*") return;
  58. }
  59. if(!this._ToggleExpand(nodes[i], this.NavigateCallback, {'nodes':nodes,'index':i}, this.PopulateError)) return;
  60. }
  61. var nodeId = nodes[nodes.length-1];
  62. var node = this._getNode (nodeId);
  63. if(!node) return;
  64. this.SelectNode (nodeId);
  65. if(node._refresh)
  66. this.Refresh (nodeId);
  67. },
  68. NavigateCallback : function (data, ctx)
  69. {
  70. ctx.folderTree.PopulateCallback (data, ctx);
  71. var interval = window.setInterval(function() {
  72. window.clearInterval(interval);
  73. ctx.folderTree.Navigate (ctx.externalContext.nodes, ctx.externalContext.index);
  74. }, 0);
  75. },
  76. Refresh : function (nodeId) {
  77. var node = this._getNode (nodeId);
  78. if(!node) return;
  79. var nodeSpan = this._getChildNodesSpan (nodeId);
  80. var expand = nodeSpan.style.display == "block" || nodeSpan.innerHTML == "*";
  81. if(expand) {
  82. node._expand = true;
  83. node._refresh = true;
  84. this.ToggleExpand (nodeId);
  85. } else {
  86. nodeSpan.innerHTML = "";
  87. nodeSpan.style.display = "none"
  88. }
  89. },
  90. RequireRefresh : function (nodes) {
  91. for(var i=0; i<nodes.length; i++) {
  92. var node = this._getNode (nodes[i]);
  93. if(!node) continue;
  94. node._expand = true;
  95. node._refresh = true;
  96. }
  97. },
  98. _getNode : function (nodeId) {
  99. var id = this._clientId + "_" + nodeId + "_node";
  100. return WebForm_GetElementById (id);
  101. },
  102. _getNodeImg : function (nodeId) {
  103. var imgId = this._clientId + "_" + nodeId + "_img";
  104. return WebForm_GetElementById (imgId);
  105. },
  106. _getChildNodesSpan : function (nodeId) {
  107. var spanId = this._clientId + "_" + nodeId + "_span";
  108. return WebForm_GetElementById (spanId);
  109. },
  110. _getNodeLink : function (node) { return node.childNodes[node.childNodes.length - 1]; },
  111. _getImageLink : function (node) { return node.previousSibling.childNodes[node.childNodes.length - 1]; },
  112. SelectNode : function (nodeId) {
  113. var node = this._getNode (nodeId);
  114. if(!node) return;
  115. if(node === this._selectedNode)
  116. return;
  117. if(this._selectedNode !== null)
  118. this._restoreStyle (this._selectedNode);
  119. this._selectedNode = node;
  120. this._appendStyle (node, this._selectedClass, this._selectedLinkClass);
  121. },
  122. HoverNode : function (div, e) {
  123. var e = e || window.event;
  124. var node = WebForm_GetElementById (div.id+"_node");
  125. if(this.getController().isDragging()) {
  126. var ftNode = this._getFolderTreeNode (div);
  127. ftNode.onDragInTarget(e);
  128. }
  129. else {
  130. if(node === this._selectedNode)
  131. return;
  132. this._appendStyle (node, this._hoverClass, this._hoverLinkClass);
  133. }
  134. },
  135. UnhoverNode : function (div) {
  136. var node = WebForm_GetElementById (div.id+"_node");
  137. if(this.getController().isDragging()) {
  138. var ftNode = this._getFolderTreeNode (div);
  139. ftNode.onDragLeaveTarget();
  140. }
  141. else {
  142. if(node === this._selectedNode)
  143. return;
  144. this._restoreStyle (node);
  145. }
  146. },
  147. _getFolderTreeNode : function(div) {
  148. if(!div._folderTreeNode) {
  149. div._folderTreeNode = new FolderTreeNode (this, div);
  150. }
  151. return div._folderTreeNode;
  152. },
  153. _appendStyle : function (node, nodeClass, nodeLinkClass) {
  154. if (nodeClass) {
  155. if (!node._normalClass)
  156. node._normalClass = node.className;
  157. node.className = node._normalClass + " " + nodeClass;
  158. }
  159. if (nodeLinkClass) {
  160. var nodeLink = this._getNodeLink(node);
  161. if(!nodeLink) return;
  162. if (!nodeLink._normalClass)
  163. nodeLink._normalClass = nodeLink.className;
  164. nodeLink.className = nodeLink._normalClass + " " + nodeLinkClass;
  165. }
  166. },
  167. _restoreStyle : function (node) {
  168. if (node._normalClass)
  169. node.className = node._normalClass;
  170. var nodeLink = this._getNodeLink(node);
  171. if (nodeLink && nodeLink._normalClass)
  172. nodeLink.className = nodeLink._normalClass;
  173. }
  174. }
  175. FolderTreeNode = function(owner, div) {
  176. this._owner = owner;
  177. this._div = div;
  178. this._node = WebForm_GetElementById (div.id+"_node");
  179. var mouseUp = this._mouseUp;
  180. var mouseMove = this._mouseMove;
  181. var instance = this;
  182. div.onmouseup = function(e) {
  183. e = e || window.event;
  184. mouseUp.call(instance, e);
  185. }
  186. div.onmousemove = function(e) {
  187. e = e || window.event;
  188. mouseMove.call(instance, e);
  189. }
  190. }
  191. FolderTreeNode.prototype._owner = null;
  192. FolderTreeNode.prototype._div = null;
  193. FolderTreeNode.prototype._dropMove = true;
  194. FolderTreeNode.prototype._node = null;
  195. FolderTreeNode.prototype._highlight = false;
  196. FolderTreeNode.prototype._cursor = null;
  197. FolderTreeNode.prototype.getFullPath = function() {
  198. var nodePath = "" + this._node.attributes["nodepath"].value;
  199. var index = nodePath.indexOf("|");
  200. return nodePath.substring(index+1, nodePath.length);
  201. }
  202. FolderTreeNode.prototype.isSelected = function() {
  203. return this._node === this._owner._selectedNode;
  204. }
  205. FolderTreeNode.prototype.canDrop = function() {
  206. return !this.isSelected();
  207. }
  208. FolderTreeNode.prototype.getController = function() {return this._owner.getController();}
  209. FolderTreeNode.prototype.highlight = function (bool) {
  210. if(this._highlight == bool) return;
  211. this._highlight = bool;
  212. if(bool) this._owner._appendStyle (this._node, this._owner._selectedClass, this._owner._selectedLinkClass);
  213. else this._owner._restoreStyle (this._node);
  214. }
  215. FolderTreeNode.prototype.setCursor = function (cursor) {
  216. if(this._cursor == cursor) return;
  217. this._cursor = cursor;
  218. this._div.style.cursor = cursor;
  219. var nodeLink = this._owner._getNodeLink(this._node);
  220. if(nodeLink){
  221. nodeLink.style.cursor = cursor;
  222. }
  223. var imgLink = this._owner._getImageLink(this._node);
  224. if(imgLink){
  225. imgLink.style.cursor = cursor;
  226. }
  227. }
  228. FolderTreeNode.prototype._mouseUp = function(ev) {
  229. if(ev.preventDefault) ev.preventDefault();
  230. ev.returnValue = false;
  231. if(this.getController().isDragging())
  232. this.onDrop();
  233. return false;
  234. }
  235. FolderTreeNode.prototype._mouseMove = function(ev) {
  236. if(ev.preventDefault) ev.preventDefault();
  237. ev.returnValue = false;
  238. if(this.getController().isDragging())
  239. this.onDragInTarget(ev);
  240. return false;
  241. }
  242. FolderTreeNode.prototype.onDragInTarget = function (ev){
  243. if(this.canDrop()){
  244. this._dropMove = !ev.ctrlKey && !ev.shiftKey;
  245. this.getController()._dropTarget = this;
  246. this.highlight(true);
  247. if(this._dropMove)
  248. this.setCursor(this.getController()._dropMoveCursor);
  249. else
  250. this.setCursor(this.getController()._dropCopyCursor);
  251. }
  252. else {
  253. this.setCursor(this.getController()._dropNotAllowedCursor);
  254. }
  255. }
  256. FolderTreeNode.prototype.onDragLeaveTarget = function (){
  257. this.getController()._dropTarget = null;
  258. if(this.canDrop()){
  259. this.highlight(false);
  260. }
  261. this.setCursor("");
  262. }
  263. FolderTreeNode.prototype.onDrop = function (){
  264. if(this.canDrop()) {
  265. this.getController().drop(this, this._dropMove);
  266. this.highlight(false);
  267. }
  268. else {
  269. this.getController().stopDragDrop(this);
  270. }
  271. this.setCursor("");
  272. }