| OLD | NEW |
| 1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. |
| 2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
| 3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
| 4 | 4 |
| 5 // TODO(arv): Now that this is driven by a data model, implement a data model | 5 // TODO(arv): Now that this is driven by a data model, implement a data model |
| 6 // that handles the loading and the events from the bookmark backend. | 6 // that handles the loading and the events from the bookmark backend. |
| 7 | 7 |
| 8 /** | 8 /** |
| 9 * @typedef {{childIds: Array<string>}} | 9 * @typedef {{childIds: Array<string>}} |
| 10 * | 10 * |
| (...skipping 461 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 472 }, | 472 }, |
| 473 set editing(editing) { | 473 set editing(editing) { |
| 474 var oldEditing = this.editing; | 474 var oldEditing = this.editing; |
| 475 if (oldEditing == editing) | 475 if (oldEditing == editing) |
| 476 return; | 476 return; |
| 477 | 477 |
| 478 var url = this.bookmarkNode.url; | 478 var url = this.bookmarkNode.url; |
| 479 var title = this.bookmarkNode.title; | 479 var title = this.bookmarkNode.title; |
| 480 var isFolder = bmm.isFolder(this.bookmarkNode); | 480 var isFolder = bmm.isFolder(this.bookmarkNode); |
| 481 var listItem = this; | 481 var listItem = this; |
| 482 var labelEl = this.firstChild; | |
| 483 var urlEl = labelEl.nextSibling; | |
| 484 var labelInput, urlInput; | 482 var labelInput, urlInput; |
| 485 | 483 |
| 486 // Handles enter and escape which trigger reset and commit respectively. | 484 // Handles enter and escape which trigger reset and commit respectively. |
| 487 function handleKeydown(e) { | 485 function handleKeydown(e) { |
| 488 // Make sure that the tree does not handle the key. | 486 // Make sure that the tree does not handle the key. |
| 489 e.stopPropagation(); | 487 e.stopPropagation(); |
| 490 | 488 |
| 491 // Calling list.focus blurs the input which will stop editing the list | 489 // Calling list.focus blurs the input which will stop editing the list |
| 492 // item. | 490 // item. |
| 493 switch (e.key) { | 491 switch (e.key) { |
| (...skipping 45 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 539 var doc = e.target.ownerDocument; | 537 var doc = e.target.ownerDocument; |
| 540 window.setTimeout(function() { | 538 window.setTimeout(function() { |
| 541 var activeElement = doc.hasFocus() && doc.activeElement; | 539 var activeElement = doc.hasFocus() && doc.activeElement; |
| 542 if (activeElement != urlInput && activeElement != labelInput) { | 540 if (activeElement != urlInput && activeElement != labelInput) { |
| 543 listItem.editing = false; | 541 listItem.editing = false; |
| 544 } | 542 } |
| 545 }, 50); | 543 }, 50); |
| 546 } | 544 } |
| 547 | 545 |
| 548 var doc = this.ownerDocument; | 546 var doc = this.ownerDocument; |
| 547 var labelTextEl = queryRequiredElement('.label-text', this); |
| 548 var urlEl = queryRequiredElement('.url', this); |
| 549 if (editing) { | 549 if (editing) { |
| 550 this.setAttribute('editing', ''); | 550 this.setAttribute('editing', ''); |
| 551 this.draggable = false; | 551 this.draggable = false; |
| 552 | 552 |
| 553 labelInput = /** @type {HTMLElement} */(doc.createElement('input')); | 553 labelInput = /** @type {HTMLElement} */(doc.createElement('input')); |
| 554 labelInput.placeholder = | 554 labelInput.placeholder = |
| 555 loadTimeData.getString('name_input_placeholder'); | 555 loadTimeData.getString('name_input_placeholder'); |
| 556 replaceAllChildren(labelEl, labelInput); | 556 replaceAllChildren(labelTextEl, labelInput); |
| 557 labelInput.value = title; | 557 labelInput.value = title; |
| 558 | 558 |
| 559 if (!isFolder) { | 559 if (!isFolder) { |
| 560 urlInput = /** @type {HTMLElement} */(doc.createElement('input')); | 560 urlInput = /** @type {HTMLElement} */(doc.createElement('input')); |
| 561 urlInput.type = 'url'; | 561 urlInput.type = 'url'; |
| 562 urlInput.required = true; | 562 urlInput.required = true; |
| 563 urlInput.placeholder = | 563 urlInput.placeholder = |
| 564 loadTimeData.getString('url_input_placeholder'); | 564 loadTimeData.getString('url_input_placeholder'); |
| 565 | 565 |
| 566 // We also need a name for the input for the CSS to work. | 566 // We also need a name for the input for the CSS to work. |
| (...skipping 55 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 622 return; | 622 return; |
| 623 } | 623 } |
| 624 urlEl.textContent = this.bookmarkNode.url = newUrl; | 624 urlEl.textContent = this.bookmarkNode.url = newUrl; |
| 625 } | 625 } |
| 626 | 626 |
| 627 this.removeAttribute('editing'); | 627 this.removeAttribute('editing'); |
| 628 this.draggable = true; | 628 this.draggable = true; |
| 629 | 629 |
| 630 labelInput = this.querySelector('.label input'); | 630 labelInput = this.querySelector('.label input'); |
| 631 var newLabel = labelInput.value; | 631 var newLabel = labelInput.value; |
| 632 labelEl.textContent = this.bookmarkNode.title = newLabel; | 632 labelTextEl.textContent = this.bookmarkNode.title = newLabel; |
| 633 | 633 |
| 634 if (isFolder) { | 634 if (isFolder) { |
| 635 if (newLabel != title) { | 635 if (newLabel != title) { |
| 636 cr.dispatchSimpleEvent(this, 'rename', true); | 636 cr.dispatchSimpleEvent(this, 'rename', true); |
| 637 } | 637 } |
| 638 } else if (newLabel != title || newUrl != url) { | 638 } else if (newLabel != title || newUrl != url) { |
| 639 cr.dispatchSimpleEvent(this, 'edit', true); | 639 cr.dispatchSimpleEvent(this, 'edit', true); |
| 640 } | 640 } |
| 641 } | 641 } |
| 642 } | 642 } |
| 643 }; | 643 }; |
| 644 | 644 |
| 645 return { | 645 return { |
| 646 BookmarkList: BookmarkList, | 646 BookmarkList: BookmarkList, |
| 647 list: /** @type {Element} */(null), // Set when decorated. | 647 list: /** @type {Element} */(null), // Set when decorated. |
| 648 }; | 648 }; |
| 649 }); | 649 }); |
| OLD | NEW |