NavigatorView.js 35 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159
  1. /*
  2. * Copyright (C) 2012 Google Inc. All rights reserved.
  3. *
  4. * Redistribution and use in source and binary forms, with or without
  5. * modification, are permitted provided that the following conditions are
  6. * met:
  7. *
  8. * 1. Redistributions of source code must retain the above copyright
  9. * notice, this list of conditions and the following disclaimer.
  10. *
  11. * 2. Redistributions in binary form must reproduce the above
  12. * copyright notice, this list of conditions and the following disclaimer
  13. * in the documentation and/or other materials provided with the
  14. * distribution.
  15. *
  16. * THIS SOFTWARE IS PROVIDED BY GOOGLE INC. AND ITS CONTRIBUTORS
  17. * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
  18. * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
  19. * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL GOOGLE INC.
  20. * OR ITS CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
  21. * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
  22. * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
  23. * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
  24. * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
  25. * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
  26. * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  27. */
  28. /**
  29. * @extends {WebInspector.View}
  30. * @constructor
  31. */
  32. WebInspector.NavigatorView = function()
  33. {
  34. WebInspector.View.call(this);
  35. this.registerRequiredCSS("navigatorView.css");
  36. var scriptsTreeElement = document.createElement("ol");
  37. this._scriptsTree = new WebInspector.NavigatorTreeOutline(scriptsTreeElement);
  38. this._scriptsTree.childrenListElement.addEventListener("keypress", this._treeKeyPress.bind(this), true);
  39. var scriptsOutlineElement = document.createElement("div");
  40. scriptsOutlineElement.addStyleClass("outline-disclosure");
  41. scriptsOutlineElement.addStyleClass("navigator");
  42. scriptsOutlineElement.appendChild(scriptsTreeElement);
  43. this.element.addStyleClass("fill");
  44. this.element.addStyleClass("navigator-container");
  45. this.element.appendChild(scriptsOutlineElement);
  46. this.setDefaultFocusedElement(this._scriptsTree.element);
  47. /** @type {!Map.<WebInspector.UISourceCode, !WebInspector.NavigatorUISourceCodeTreeNode>} */
  48. this._uiSourceCodeNodes = new Map();
  49. /** @type {!Map.<WebInspector.NavigatorTreeNode, !StringMap.<!WebInspector.NavigatorFolderTreeNode>>} */
  50. this._subfolderNodes = new Map();
  51. this._rootNode = new WebInspector.NavigatorRootTreeNode(this);
  52. this._rootNode.populate();
  53. WebInspector.resourceTreeModel.addEventListener(WebInspector.ResourceTreeModel.EventTypes.InspectedURLChanged, this._inspectedURLChanged, this);
  54. this.element.addEventListener("contextmenu", this.handleContextMenu.bind(this), false);
  55. }
  56. WebInspector.NavigatorView.Events = {
  57. ItemSelected: "ItemSelected",
  58. ItemSearchStarted: "ItemSearchStarted",
  59. ItemRenamingRequested: "ItemRenamingRequested",
  60. ItemCreationRequested: "ItemCreationRequested"
  61. }
  62. WebInspector.NavigatorView.iconClassForType = function(type)
  63. {
  64. if (type === WebInspector.NavigatorTreeOutline.Types.Domain)
  65. return "navigator-domain-tree-item";
  66. if (type === WebInspector.NavigatorTreeOutline.Types.FileSystem)
  67. return "navigator-folder-tree-item";
  68. return "navigator-folder-tree-item";
  69. }
  70. WebInspector.NavigatorView.prototype = {
  71. /**
  72. * @param {WebInspector.UISourceCode} uiSourceCode
  73. */
  74. addUISourceCode: function(uiSourceCode)
  75. {
  76. var projectNode = this._projectNode(uiSourceCode.project());
  77. var folderNode = this._folderNode(projectNode, uiSourceCode.parentPath());
  78. var uiSourceCodeNode = new WebInspector.NavigatorUISourceCodeTreeNode(this, uiSourceCode);
  79. this._uiSourceCodeNodes.put(uiSourceCode, uiSourceCodeNode);
  80. folderNode.appendChild(uiSourceCodeNode);
  81. if (uiSourceCode.url === WebInspector.inspectedPageURL)
  82. this.revealUISourceCode(uiSourceCode);
  83. },
  84. /**
  85. * @param {WebInspector.Event} event
  86. */
  87. _inspectedURLChanged: function(event)
  88. {
  89. var nodes = this._uiSourceCodeNodes.values();
  90. for (var i = 0; i < nodes.length; ++i) {
  91. var uiSourceCode = nodes[i].uiSourceCode();
  92. if (uiSourceCode.url === WebInspector.inspectedPageURL)
  93. this.revealUISourceCode(uiSourceCode);
  94. }
  95. },
  96. /**
  97. * @param {WebInspector.Project} project
  98. * @return {WebInspector.NavigatorTreeNode}
  99. */
  100. _projectNode: function(project)
  101. {
  102. if (!project.displayName())
  103. return this._rootNode;
  104. var projectNode = this._rootNode.child(project.id());
  105. if (!projectNode) {
  106. var type = project.type() === WebInspector.projectTypes.FileSystem ? WebInspector.NavigatorTreeOutline.Types.FileSystem : WebInspector.NavigatorTreeOutline.Types.Domain;
  107. projectNode = new WebInspector.NavigatorFolderTreeNode(this, project, project.id(), type, "", project.displayName());
  108. this._rootNode.appendChild(projectNode);
  109. }
  110. return projectNode;
  111. },
  112. /**
  113. * @param {WebInspector.NavigatorTreeNode} projectNode
  114. * @param {string} folderPath
  115. * @return {WebInspector.NavigatorTreeNode}
  116. */
  117. _folderNode: function(projectNode, folderPath)
  118. {
  119. if (!folderPath)
  120. return projectNode;
  121. var subfolderNodes = this._subfolderNodes.get(projectNode);
  122. if (!subfolderNodes) {
  123. subfolderNodes = /** @type {!StringMap.<!WebInspector.NavigatorFolderTreeNode>} */ (new StringMap());
  124. this._subfolderNodes.put(projectNode, subfolderNodes);
  125. }
  126. var folderNode = subfolderNodes.get(folderPath);
  127. if (folderNode)
  128. return folderNode;
  129. var parentNode = projectNode;
  130. var index = folderPath.lastIndexOf("/");
  131. if (index !== -1)
  132. parentNode = this._folderNode(projectNode, folderPath.substring(0, index));
  133. var name = folderPath.substring(index + 1);
  134. folderNode = new WebInspector.NavigatorFolderTreeNode(this, null, name, WebInspector.NavigatorTreeOutline.Types.Folder, folderPath, name);
  135. subfolderNodes.put(folderPath, folderNode);
  136. parentNode.appendChild(folderNode);
  137. return folderNode;
  138. },
  139. /**
  140. * @param {WebInspector.UISourceCode} uiSourceCode
  141. * @param {boolean=} select
  142. */
  143. revealUISourceCode: function(uiSourceCode, select)
  144. {
  145. var node = this._uiSourceCodeNodes.get(uiSourceCode);
  146. if (!node)
  147. return null;
  148. if (this._scriptsTree.selectedTreeElement)
  149. this._scriptsTree.selectedTreeElement.deselect();
  150. this._lastSelectedUISourceCode = uiSourceCode;
  151. node.reveal(select);
  152. },
  153. /**
  154. * @param {WebInspector.UISourceCode} uiSourceCode
  155. * @param {boolean} focusSource
  156. */
  157. _scriptSelected: function(uiSourceCode, focusSource)
  158. {
  159. this._lastSelectedUISourceCode = uiSourceCode;
  160. var data = { uiSourceCode: uiSourceCode, focusSource: focusSource};
  161. this.dispatchEventToListeners(WebInspector.NavigatorView.Events.ItemSelected, data);
  162. },
  163. /**
  164. * @param {WebInspector.UISourceCode} uiSourceCode
  165. */
  166. removeUISourceCode: function(uiSourceCode)
  167. {
  168. var node = this._uiSourceCodeNodes.get(uiSourceCode);
  169. if (!node)
  170. return;
  171. var projectNode = this._projectNode(uiSourceCode.project());
  172. var subfolderNodes = this._subfolderNodes.get(projectNode);
  173. var parentNode = node.parent;
  174. this._uiSourceCodeNodes.remove(uiSourceCode);
  175. parentNode.removeChild(node);
  176. node = parentNode;
  177. while (node) {
  178. parentNode = node.parent;
  179. if (!parentNode || !node.isEmpty())
  180. break;
  181. if (subfolderNodes)
  182. subfolderNodes.remove(node._folderPath);
  183. parentNode.removeChild(node);
  184. node = parentNode;
  185. }
  186. },
  187. /**
  188. * @param {WebInspector.UISourceCode} uiSourceCode
  189. */
  190. requestRename: function(uiSourceCode)
  191. {
  192. this.dispatchEventToListeners(WebInspector.ScriptsNavigator.Events.ItemRenamingRequested, uiSourceCode);
  193. },
  194. /**
  195. * @param {WebInspector.UISourceCode} uiSourceCode
  196. * @param {function(boolean)=} callback
  197. */
  198. rename: function(uiSourceCode, callback)
  199. {
  200. var node = this._uiSourceCodeNodes.get(uiSourceCode);
  201. if (!node)
  202. return null;
  203. node.rename(callback);
  204. },
  205. reset: function()
  206. {
  207. var nodes = this._uiSourceCodeNodes.values();
  208. for (var i = 0; i < nodes.length; ++i)
  209. nodes[i].dispose();
  210. this._scriptsTree.removeChildren();
  211. this._uiSourceCodeNodes.clear();
  212. this._subfolderNodes.clear();
  213. this._rootNode.reset();
  214. },
  215. /**
  216. * @param {Event} event
  217. */
  218. handleContextMenu: function(event)
  219. {
  220. var contextMenu = new WebInspector.ContextMenu(event);
  221. this._appendAddFolderItem(contextMenu);
  222. contextMenu.show();
  223. },
  224. /**
  225. * @param {WebInspector.ContextMenu} contextMenu
  226. */
  227. _appendAddFolderItem: function(contextMenu)
  228. {
  229. function addFolder()
  230. {
  231. WebInspector.isolatedFileSystemManager.addFileSystem();
  232. }
  233. var addFolderLabel = WebInspector.UIString(WebInspector.useLowerCaseMenuTitles() ? "Add folder to workspace" : "Add Folder to Workspace");
  234. contextMenu.appendItem(addFolderLabel, addFolder);
  235. },
  236. /**
  237. * @param {Event} event
  238. * @param {WebInspector.UISourceCode} uiSourceCode
  239. */
  240. handleFileContextMenu: function(event, uiSourceCode)
  241. {
  242. var contextMenu = new WebInspector.ContextMenu(event);
  243. contextMenu.appendApplicableItems(uiSourceCode);
  244. contextMenu.appendSeparator();
  245. this._appendAddFolderItem(contextMenu);
  246. contextMenu.show();
  247. },
  248. /**
  249. * @param {Event} event
  250. * @param {WebInspector.NavigatorFolderTreeNode} node
  251. */
  252. handleFolderContextMenu: function(event, node)
  253. {
  254. var contextMenu = new WebInspector.ContextMenu(event);
  255. var path = "/";
  256. var projectNode = node;
  257. while (projectNode.parent !== this._rootNode) {
  258. path = "/" + projectNode.id + path;
  259. projectNode = projectNode.parent;
  260. }
  261. var project = projectNode._project;
  262. if (project.type() === WebInspector.projectTypes.FileSystem) {
  263. function refresh()
  264. {
  265. project.refresh(path);
  266. }
  267. contextMenu.appendItem(WebInspector.UIString("Refresh"), refresh.bind(this));
  268. function create()
  269. {
  270. var data = {};
  271. data.project = project;
  272. data.path = path;
  273. this.dispatchEventToListeners(WebInspector.NavigatorView.Events.ItemCreationRequested, data);
  274. }
  275. contextMenu.appendItem(WebInspector.UIString(WebInspector.useLowerCaseMenuTitles() ? "New file" : "New File"), create.bind(this));
  276. function exclude()
  277. {
  278. var shouldExclude = window.confirm(WebInspector.UIString("Are you sure you want to exclude this folder?"));
  279. if (shouldExclude) {
  280. WebInspector.startBatchUpdate();
  281. project.excludeFolder(path);
  282. WebInspector.endBatchUpdate();
  283. }
  284. }
  285. contextMenu.appendItem(WebInspector.UIString(WebInspector.useLowerCaseMenuTitles() ? "Exclude folder" : "Exclude Folder"), exclude.bind(this));
  286. }
  287. contextMenu.appendSeparator();
  288. this._appendAddFolderItem(contextMenu);
  289. if (project.type() === WebInspector.projectTypes.FileSystem && node === projectNode) {
  290. function removeFolder()
  291. {
  292. var shouldRemove = window.confirm(WebInspector.UIString("Are you sure you want to remove this folder?"));
  293. if (shouldRemove)
  294. project.remove();
  295. }
  296. var removeFolderLabel = WebInspector.UIString(WebInspector.useLowerCaseMenuTitles() ? "Remove folder from workspace" : "Remove Folder from Workspace");
  297. contextMenu.appendItem(removeFolderLabel, removeFolder);
  298. }
  299. contextMenu.show();
  300. },
  301. /**
  302. * @param {Event} event
  303. */
  304. _treeKeyPress: function(event)
  305. {
  306. if (WebInspector.isBeingEdited(this._scriptsTree.childrenListElement))
  307. return;
  308. var searchText = String.fromCharCode(event.charCode);
  309. if (searchText.trim() !== searchText)
  310. return;
  311. this.dispatchEventToListeners(WebInspector.NavigatorView.Events.ItemSearchStarted, searchText);
  312. event.consume(true);
  313. },
  314. __proto__: WebInspector.View.prototype
  315. }
  316. /**
  317. * @constructor
  318. * @extends {TreeOutline}
  319. * @param {Element} element
  320. */
  321. WebInspector.NavigatorTreeOutline = function(element)
  322. {
  323. TreeOutline.call(this, element);
  324. this.element = element;
  325. this.comparator = WebInspector.NavigatorTreeOutline._treeElementsCompare;
  326. }
  327. WebInspector.NavigatorTreeOutline.Types = {
  328. Root: "Root",
  329. Domain: "Domain",
  330. Folder: "Folder",
  331. UISourceCode: "UISourceCode",
  332. FileSystem: "FileSystem"
  333. }
  334. WebInspector.NavigatorTreeOutline._treeElementsCompare = function compare(treeElement1, treeElement2)
  335. {
  336. // Insert in the alphabetical order, first domains, then folders, then scripts.
  337. function typeWeight(treeElement)
  338. {
  339. var type = treeElement.type();
  340. if (type === WebInspector.NavigatorTreeOutline.Types.Domain) {
  341. if (treeElement.titleText === WebInspector.inspectedPageDomain)
  342. return 1;
  343. return 2;
  344. }
  345. if (type === WebInspector.NavigatorTreeOutline.Types.FileSystem)
  346. return 3;
  347. if (type === WebInspector.NavigatorTreeOutline.Types.Folder)
  348. return 4;
  349. return 5;
  350. }
  351. var typeWeight1 = typeWeight(treeElement1);
  352. var typeWeight2 = typeWeight(treeElement2);
  353. var result;
  354. if (typeWeight1 > typeWeight2)
  355. result = 1;
  356. else if (typeWeight1 < typeWeight2)
  357. result = -1;
  358. else {
  359. var title1 = treeElement1.titleText;
  360. var title2 = treeElement2.titleText;
  361. result = title1.compareTo(title2);
  362. }
  363. return result;
  364. }
  365. WebInspector.NavigatorTreeOutline.prototype = {
  366. /**
  367. * @return {Array.<WebInspector.UISourceCode>}
  368. */
  369. scriptTreeElements: function()
  370. {
  371. var result = [];
  372. if (this.children.length) {
  373. for (var treeElement = this.children[0]; treeElement; treeElement = treeElement.traverseNextTreeElement(false, this, true)) {
  374. if (treeElement instanceof WebInspector.NavigatorSourceTreeElement)
  375. result.push(treeElement.uiSourceCode);
  376. }
  377. }
  378. return result;
  379. },
  380. __proto__: TreeOutline.prototype
  381. }
  382. /**
  383. * @constructor
  384. * @extends {TreeElement}
  385. * @param {string} type
  386. * @param {string} title
  387. * @param {Array.<string>} iconClasses
  388. * @param {boolean} hasChildren
  389. * @param {boolean=} noIcon
  390. */
  391. WebInspector.BaseNavigatorTreeElement = function(type, title, iconClasses, hasChildren, noIcon)
  392. {
  393. this._type = type;
  394. TreeElement.call(this, "", null, hasChildren);
  395. this._titleText = title;
  396. this._iconClasses = iconClasses;
  397. this._noIcon = noIcon;
  398. }
  399. WebInspector.BaseNavigatorTreeElement.prototype = {
  400. onattach: function()
  401. {
  402. this.listItemElement.removeChildren();
  403. if (this._iconClasses) {
  404. for (var i = 0; i < this._iconClasses.length; ++i)
  405. this.listItemElement.addStyleClass(this._iconClasses[i]);
  406. }
  407. var selectionElement = document.createElement("div");
  408. selectionElement.className = "selection";
  409. this.listItemElement.appendChild(selectionElement);
  410. if (!this._noIcon) {
  411. this.imageElement = document.createElement("img");
  412. this.imageElement.className = "icon";
  413. this.listItemElement.appendChild(this.imageElement);
  414. }
  415. this.titleElement = document.createElement("div");
  416. this.titleElement.className = "base-navigator-tree-element-title";
  417. this._titleTextNode = document.createTextNode("");
  418. this._titleTextNode.textContent = this._titleText;
  419. this.titleElement.appendChild(this._titleTextNode);
  420. this.listItemElement.appendChild(this.titleElement);
  421. },
  422. onreveal: function()
  423. {
  424. if (this.listItemElement)
  425. this.listItemElement.scrollIntoViewIfNeeded(true);
  426. },
  427. /**
  428. * @return {string}
  429. */
  430. get titleText()
  431. {
  432. return this._titleText;
  433. },
  434. set titleText(titleText)
  435. {
  436. if (this._titleText === titleText)
  437. return;
  438. this._titleText = titleText || "";
  439. if (this.titleElement)
  440. this.titleElement.textContent = this._titleText;
  441. },
  442. /**
  443. * @return {string}
  444. */
  445. type: function()
  446. {
  447. return this._type;
  448. },
  449. __proto__: TreeElement.prototype
  450. }
  451. /**
  452. * @constructor
  453. * @extends {WebInspector.BaseNavigatorTreeElement}
  454. * @param {WebInspector.NavigatorView} navigatorView
  455. * @param {string} type
  456. * @param {string} title
  457. */
  458. WebInspector.NavigatorFolderTreeElement = function(navigatorView, type, title)
  459. {
  460. var iconClass = WebInspector.NavigatorView.iconClassForType(type);
  461. WebInspector.BaseNavigatorTreeElement.call(this, type, title, [iconClass], true);
  462. this._navigatorView = navigatorView;
  463. }
  464. WebInspector.NavigatorFolderTreeElement.prototype = {
  465. onpopulate: function()
  466. {
  467. this._node.populate();
  468. },
  469. onattach: function()
  470. {
  471. WebInspector.BaseNavigatorTreeElement.prototype.onattach.call(this);
  472. this.collapse();
  473. this.listItemElement.addEventListener("contextmenu", this._handleContextMenuEvent.bind(this), false);
  474. },
  475. /**
  476. * @param {WebInspector.NavigatorFolderTreeNode} node
  477. */
  478. setNode: function(node)
  479. {
  480. this._node = node;
  481. var paths = [];
  482. while (node && !node.isRoot()) {
  483. paths.push(node._title);
  484. node = node.parent;
  485. }
  486. paths.reverse();
  487. this.tooltip = paths.join("/");
  488. },
  489. /**
  490. * @param {Event} event
  491. */
  492. _handleContextMenuEvent: function(event)
  493. {
  494. if (!this._node)
  495. return;
  496. this.select();
  497. this._navigatorView.handleFolderContextMenu(event, this._node);
  498. },
  499. __proto__: WebInspector.BaseNavigatorTreeElement.prototype
  500. }
  501. /**
  502. * @constructor
  503. * @extends {WebInspector.BaseNavigatorTreeElement}
  504. * @param {WebInspector.NavigatorView} navigatorView
  505. * @param {WebInspector.UISourceCode} uiSourceCode
  506. * @param {string} title
  507. */
  508. WebInspector.NavigatorSourceTreeElement = function(navigatorView, uiSourceCode, title)
  509. {
  510. WebInspector.BaseNavigatorTreeElement.call(this, WebInspector.NavigatorTreeOutline.Types.UISourceCode, title, ["navigator-" + uiSourceCode.contentType().name() + "-tree-item"], false);
  511. this._navigatorView = navigatorView;
  512. this._uiSourceCode = uiSourceCode;
  513. this.tooltip = uiSourceCode.originURL();
  514. }
  515. WebInspector.NavigatorSourceTreeElement.prototype = {
  516. /**
  517. * @return {WebInspector.UISourceCode}
  518. */
  519. get uiSourceCode()
  520. {
  521. return this._uiSourceCode;
  522. },
  523. onattach: function()
  524. {
  525. WebInspector.BaseNavigatorTreeElement.prototype.onattach.call(this);
  526. this.listItemElement.draggable = true;
  527. this.listItemElement.addEventListener("click", this._onclick.bind(this), false);
  528. this.listItemElement.addEventListener("contextmenu", this._handleContextMenuEvent.bind(this), false);
  529. this.listItemElement.addEventListener("mousedown", this._onmousedown.bind(this), false);
  530. this.listItemElement.addEventListener("dragstart", this._ondragstart.bind(this), false);
  531. },
  532. _onmousedown: function(event)
  533. {
  534. if (event.which === 1) // Warm-up data for drag'n'drop
  535. this._uiSourceCode.requestContent(callback.bind(this));
  536. /**
  537. * @param {?string} content
  538. * @param {boolean} contentEncoded
  539. * @param {string} mimeType
  540. */
  541. function callback(content, contentEncoded, mimeType)
  542. {
  543. this._warmedUpContent = content;
  544. }
  545. },
  546. _shouldRenameOnMouseDown: function()
  547. {
  548. if (!this._uiSourceCode.canRename())
  549. return false;
  550. var isSelected = this === this.treeOutline.selectedTreeElement;
  551. var isFocused = this.treeOutline.childrenListElement.isSelfOrAncestor(document.activeElement);
  552. return isSelected && isFocused && !WebInspector.isBeingEdited(this.treeOutline.element);
  553. },
  554. selectOnMouseDown: function(event)
  555. {
  556. if (event.which !== 1 || !this._shouldRenameOnMouseDown()) {
  557. TreeElement.prototype.selectOnMouseDown.call(this, event);
  558. return;
  559. }
  560. setTimeout(rename.bind(this), 300);
  561. function rename()
  562. {
  563. if (this._shouldRenameOnMouseDown())
  564. this._navigatorView.requestRename(this._uiSourceCode);
  565. }
  566. },
  567. _ondragstart: function(event)
  568. {
  569. event.dataTransfer.setData("text/plain", this._warmedUpContent);
  570. event.dataTransfer.effectAllowed = "copy";
  571. return true;
  572. },
  573. onspace: function()
  574. {
  575. this._navigatorView._scriptSelected(this.uiSourceCode, true);
  576. return true;
  577. },
  578. /**
  579. * @param {Event} event
  580. */
  581. _onclick: function(event)
  582. {
  583. this._navigatorView._scriptSelected(this.uiSourceCode, false);
  584. },
  585. /**
  586. * @param {Event} event
  587. */
  588. ondblclick: function(event)
  589. {
  590. var middleClick = event.button === 1;
  591. this._navigatorView._scriptSelected(this.uiSourceCode, !middleClick);
  592. },
  593. onenter: function()
  594. {
  595. this._navigatorView._scriptSelected(this.uiSourceCode, true);
  596. return true;
  597. },
  598. /**
  599. * @param {Event} event
  600. */
  601. _handleContextMenuEvent: function(event)
  602. {
  603. this.select();
  604. this._navigatorView.handleFileContextMenu(event, this._uiSourceCode);
  605. },
  606. __proto__: WebInspector.BaseNavigatorTreeElement.prototype
  607. }
  608. /**
  609. * @constructor
  610. * @param {string} id
  611. */
  612. WebInspector.NavigatorTreeNode = function(id)
  613. {
  614. this.id = id;
  615. /** @type {!StringMap.<!WebInspector.NavigatorTreeNode>} */
  616. this._children = new StringMap();
  617. }
  618. WebInspector.NavigatorTreeNode.prototype = {
  619. /**
  620. * @return {TreeElement}
  621. */
  622. treeElement: function() { },
  623. dispose: function() { },
  624. /**
  625. * @return {boolean}
  626. */
  627. isRoot: function()
  628. {
  629. return false;
  630. },
  631. /**
  632. * @return {boolean}
  633. */
  634. hasChildren: function()
  635. {
  636. return true;
  637. },
  638. populate: function()
  639. {
  640. if (this.isPopulated())
  641. return;
  642. if (this.parent)
  643. this.parent.populate();
  644. this._populated = true;
  645. this.wasPopulated();
  646. },
  647. wasPopulated: function()
  648. {
  649. var children = this.children();
  650. for (var i = 0; i < children.length; ++i)
  651. this.treeElement().appendChild(children[i].treeElement());
  652. },
  653. /**
  654. * @param {!WebInspector.NavigatorTreeNode} node
  655. */
  656. didAddChild: function(node)
  657. {
  658. if (this.isPopulated())
  659. this.treeElement().appendChild(node.treeElement());
  660. },
  661. /**
  662. * @param {!WebInspector.NavigatorTreeNode} node
  663. */
  664. willRemoveChild: function(node)
  665. {
  666. if (this.isPopulated())
  667. this.treeElement().removeChild(node.treeElement());
  668. },
  669. /**
  670. * @return {boolean}
  671. */
  672. isPopulated: function()
  673. {
  674. return this._populated;
  675. },
  676. /**
  677. * @return {boolean}
  678. */
  679. isEmpty: function()
  680. {
  681. return !this._children.size();
  682. },
  683. /**
  684. * @param {string} id
  685. * @return {WebInspector.NavigatorTreeNode}
  686. */
  687. child: function(id)
  688. {
  689. return this._children.get(id);
  690. },
  691. /**
  692. * @return {!Array.<!WebInspector.NavigatorTreeNode>}
  693. */
  694. children: function()
  695. {
  696. return this._children.values();
  697. },
  698. /**
  699. * @param {!WebInspector.NavigatorTreeNode} node
  700. */
  701. appendChild: function(node)
  702. {
  703. this._children.put(node.id, node);
  704. node.parent = this;
  705. this.didAddChild(node);
  706. },
  707. /**
  708. * @param {!WebInspector.NavigatorTreeNode} node
  709. */
  710. removeChild: function(node)
  711. {
  712. this.willRemoveChild(node);
  713. this._children.remove(node.id);
  714. delete node.parent;
  715. node.dispose();
  716. },
  717. reset: function()
  718. {
  719. this._children.clear();
  720. }
  721. }
  722. /**
  723. * @constructor
  724. * @extends {WebInspector.NavigatorTreeNode}
  725. * @param {WebInspector.NavigatorView} navigatorView
  726. */
  727. WebInspector.NavigatorRootTreeNode = function(navigatorView)
  728. {
  729. WebInspector.NavigatorTreeNode.call(this, "");
  730. this._navigatorView = navigatorView;
  731. }
  732. WebInspector.NavigatorRootTreeNode.prototype = {
  733. /**
  734. * @return {boolean}
  735. */
  736. isRoot: function()
  737. {
  738. return true;
  739. },
  740. /**
  741. * @return {TreeOutline}
  742. */
  743. treeElement: function()
  744. {
  745. return this._navigatorView._scriptsTree;
  746. },
  747. __proto__: WebInspector.NavigatorTreeNode.prototype
  748. }
  749. /**
  750. * @constructor
  751. * @extends {WebInspector.NavigatorTreeNode}
  752. * @param {WebInspector.NavigatorView} navigatorView
  753. * @param {WebInspector.UISourceCode} uiSourceCode
  754. */
  755. WebInspector.NavigatorUISourceCodeTreeNode = function(navigatorView, uiSourceCode)
  756. {
  757. WebInspector.NavigatorTreeNode.call(this, uiSourceCode.name());
  758. this._navigatorView = navigatorView;
  759. this._uiSourceCode = uiSourceCode;
  760. this._treeElement = null;
  761. }
  762. WebInspector.NavigatorUISourceCodeTreeNode.prototype = {
  763. /**
  764. * @return {WebInspector.UISourceCode}
  765. */
  766. uiSourceCode: function()
  767. {
  768. return this._uiSourceCode;
  769. },
  770. /**
  771. * @return {TreeElement}
  772. */
  773. treeElement: function()
  774. {
  775. if (this._treeElement)
  776. return this._treeElement;
  777. this._treeElement = new WebInspector.NavigatorSourceTreeElement(this._navigatorView, this._uiSourceCode, "");
  778. this.updateTitle();
  779. this._uiSourceCode.addEventListener(WebInspector.UISourceCode.Events.TitleChanged, this._titleChanged, this);
  780. this._uiSourceCode.addEventListener(WebInspector.UISourceCode.Events.WorkingCopyChanged, this._workingCopyChanged, this);
  781. this._uiSourceCode.addEventListener(WebInspector.UISourceCode.Events.WorkingCopyCommitted, this._workingCopyCommitted, this);
  782. this._uiSourceCode.addEventListener(WebInspector.UISourceCode.Events.FormattedChanged, this._formattedChanged, this);
  783. return this._treeElement;
  784. },
  785. /**
  786. * @param {boolean=} ignoreIsDirty
  787. */
  788. updateTitle: function(ignoreIsDirty)
  789. {
  790. if (!this._treeElement)
  791. return;
  792. var titleText = this._uiSourceCode.displayName();
  793. if (!ignoreIsDirty && (this._uiSourceCode.isDirty() || this._uiSourceCode.hasUnsavedCommittedChanges()))
  794. titleText = "*" + titleText;
  795. this._treeElement.titleText = titleText;
  796. },
  797. /**
  798. * @return {boolean}
  799. */
  800. hasChildren: function()
  801. {
  802. return false;
  803. },
  804. dispose: function()
  805. {
  806. if (!this._treeElement)
  807. return;
  808. this._uiSourceCode.removeEventListener(WebInspector.UISourceCode.Events.TitleChanged, this._titleChanged, this);
  809. this._uiSourceCode.removeEventListener(WebInspector.UISourceCode.Events.WorkingCopyChanged, this._workingCopyChanged, this);
  810. this._uiSourceCode.removeEventListener(WebInspector.UISourceCode.Events.WorkingCopyCommitted, this._workingCopyCommitted, this);
  811. this._uiSourceCode.removeEventListener(WebInspector.UISourceCode.Events.FormattedChanged, this._formattedChanged, this);
  812. },
  813. _titleChanged: function(event)
  814. {
  815. this.updateTitle();
  816. },
  817. _workingCopyChanged: function(event)
  818. {
  819. this.updateTitle();
  820. },
  821. _workingCopyCommitted: function(event)
  822. {
  823. this.updateTitle();
  824. },
  825. _formattedChanged: function(event)
  826. {
  827. this.updateTitle();
  828. },
  829. /**
  830. * @param {boolean=} select
  831. */
  832. reveal: function(select)
  833. {
  834. this.parent.populate();
  835. this.parent.treeElement().expand();
  836. this._treeElement.reveal();
  837. if (select)
  838. this._treeElement.select();
  839. },
  840. /**
  841. * @param {function(boolean)=} callback
  842. */
  843. rename: function(callback)
  844. {
  845. if (!this._treeElement)
  846. return;
  847. // Tree outline should be marked as edited as well as the tree element to prevent search from starting.
  848. var treeOutlineElement = this._treeElement.treeOutline.element;
  849. WebInspector.markBeingEdited(treeOutlineElement, true);
  850. function commitHandler(element, newTitle, oldTitle)
  851. {
  852. if (newTitle !== oldTitle) {
  853. this._treeElement.titleText = newTitle;
  854. this._uiSourceCode.rename(newTitle, renameCallback.bind(this));
  855. return;
  856. }
  857. afterEditing.call(this, true);
  858. }
  859. function renameCallback(success)
  860. {
  861. if (!success) {
  862. WebInspector.markBeingEdited(treeOutlineElement, false);
  863. this.updateTitle();
  864. this.rename(callback);
  865. return;
  866. }
  867. afterEditing.call(this, true);
  868. }
  869. function cancelHandler()
  870. {
  871. afterEditing.call(this, false);
  872. }
  873. /**
  874. * @param {boolean} committed
  875. */
  876. function afterEditing(committed)
  877. {
  878. WebInspector.markBeingEdited(treeOutlineElement, false);
  879. this.updateTitle();
  880. this._treeElement.treeOutline.childrenListElement.focus();
  881. if (callback)
  882. callback(committed);
  883. }
  884. var editingConfig = new WebInspector.EditingConfig(commitHandler.bind(this), cancelHandler.bind(this));
  885. this.updateTitle(true);
  886. WebInspector.startEditing(this._treeElement.titleElement, editingConfig);
  887. window.getSelection().setBaseAndExtent(this._treeElement.titleElement, 0, this._treeElement.titleElement, 1);
  888. },
  889. __proto__: WebInspector.NavigatorTreeNode.prototype
  890. }
  891. /**
  892. * @constructor
  893. * @extends {WebInspector.NavigatorTreeNode}
  894. * @param {WebInspector.NavigatorView} navigatorView
  895. * @param {WebInspector.Project} project
  896. * @param {string} id
  897. * @param {string} type
  898. * @param {string} folderPath
  899. * @param {string} title
  900. */
  901. WebInspector.NavigatorFolderTreeNode = function(navigatorView, project, id, type, folderPath, title)
  902. {
  903. WebInspector.NavigatorTreeNode.call(this, id);
  904. this._navigatorView = navigatorView;
  905. this._project = project;
  906. this._type = type;
  907. this._folderPath = folderPath;
  908. this._title = title;
  909. }
  910. WebInspector.NavigatorFolderTreeNode.prototype = {
  911. /**
  912. * @return {TreeElement}
  913. */
  914. treeElement: function()
  915. {
  916. if (this._treeElement)
  917. return this._treeElement;
  918. this._treeElement = this._createTreeElement(this._title, this);
  919. return this._treeElement;
  920. },
  921. /**
  922. * @return {TreeElement}
  923. */
  924. _createTreeElement: function(title, node)
  925. {
  926. var treeElement = new WebInspector.NavigatorFolderTreeElement(this._navigatorView, this._type, title);
  927. treeElement.setNode(node);
  928. return treeElement;
  929. },
  930. wasPopulated: function()
  931. {
  932. if (!this._treeElement || this._treeElement._node !== this)
  933. return;
  934. this._addChildrenRecursive();
  935. },
  936. _addChildrenRecursive: function()
  937. {
  938. var children = this.children();
  939. for (var i = 0; i < children.length; ++i) {
  940. var child = children[i];
  941. this.didAddChild(child);
  942. if (child instanceof WebInspector.NavigatorFolderTreeNode)
  943. child._addChildrenRecursive();
  944. }
  945. },
  946. _shouldMerge: function(node)
  947. {
  948. return this._type !== WebInspector.NavigatorTreeOutline.Types.Domain && node instanceof WebInspector.NavigatorFolderTreeNode;
  949. },
  950. didAddChild: function(node)
  951. {
  952. function titleForNode(node)
  953. {
  954. return node._title;
  955. }
  956. if (!this._treeElement)
  957. return;
  958. var children = this.children();
  959. if (children.length === 1 && this._shouldMerge(node)) {
  960. node._isMerged = true;
  961. this._treeElement.titleText = this._treeElement.titleText + "/" + node._title;
  962. node._treeElement = this._treeElement;
  963. this._treeElement.setNode(node);
  964. return;
  965. }
  966. var oldNode;
  967. if (children.length === 2)
  968. oldNode = children[0] !== node ? children[0] : children[1];
  969. if (oldNode && oldNode._isMerged) {
  970. delete oldNode._isMerged;
  971. var mergedToNodes = [];
  972. mergedToNodes.push(this);
  973. var treeNode = this;
  974. while (treeNode._isMerged) {
  975. treeNode = treeNode.parent;
  976. mergedToNodes.push(treeNode);
  977. }
  978. mergedToNodes.reverse();
  979. var titleText = mergedToNodes.map(titleForNode).join("/");
  980. var nodes = [];
  981. treeNode = oldNode;
  982. do {
  983. nodes.push(treeNode);
  984. children = treeNode.children();
  985. treeNode = children.length === 1 ? children[0] : null;
  986. } while (treeNode && treeNode._isMerged);
  987. if (!this.isPopulated()) {
  988. this._treeElement.titleText = titleText;
  989. this._treeElement.setNode(this);
  990. for (var i = 0; i < nodes.length; ++i) {
  991. delete nodes[i]._treeElement;
  992. delete nodes[i]._isMerged;
  993. }
  994. return;
  995. }
  996. var oldTreeElement = this._treeElement;
  997. var treeElement = this._createTreeElement(titleText, this);
  998. for (var i = 0; i < mergedToNodes.length; ++i)
  999. mergedToNodes[i]._treeElement = treeElement;
  1000. oldTreeElement.parent.appendChild(treeElement);
  1001. oldTreeElement.setNode(nodes[nodes.length - 1]);
  1002. oldTreeElement.titleText = nodes.map(titleForNode).join("/");
  1003. oldTreeElement.parent.removeChild(oldTreeElement);
  1004. this._treeElement.appendChild(oldTreeElement);
  1005. if (oldTreeElement.expanded)
  1006. treeElement.expand();
  1007. }
  1008. if (this.isPopulated())
  1009. this._treeElement.appendChild(node.treeElement());
  1010. },
  1011. willRemoveChild: function(node)
  1012. {
  1013. if (node._isMerged || !this.isPopulated())
  1014. return;
  1015. this._treeElement.removeChild(node._treeElement);
  1016. },
  1017. __proto__: WebInspector.NavigatorTreeNode.prototype
  1018. }