DOMUI Prefs: Add a deletable item list type, and use it for startup pages.

chrome/browser/resources/shared/js/cr/ui/list.js

 // Copyright (c) 2010 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 // require: listselectionmodel.js
 
 /**
  * @fileoverview This implements a list control.
  */
 
@@ skipping 285 matching lines @@
       if (this.disabled)
         return;
 
       var target = e.target;
 
       // If the target was this element we need to make sure that the user did
       // not click on a border or a scrollbar.
       if (target == this && !inViewport(target, e))
         return;
 
-      while (target && target.parentNode != this) {
-        target = target.parentNode;
-      }
+      target = this.getListItemContainingElement_(target);
 
-      if (!target) {
-        this.selectionController_.handleMouseDownUp(e, -1);
-      } else {
-        var cs = getComputedStyle(target);
-        var top = target.offsetTop -
-                  parseFloat(cs.marginTop);
-        var index = Math.floor(top / this.getItemHeight_());
-        this.selectionController_.handleMouseDownUp(e, index);
-      }
+      var index = target ? this.getIndexOfListItem(target) : -1;
+      this.selectionController_.handleMouseDownUp(e, index);
     },
 
     /**
+     * Returns the list item element containing the given element, or null if
+     * it doesn't belong to any list item element.
+     * @param {HTMLElement} element The element.
+     * @return {ListItem} The list item containing |element|, or null.
+     * @private
+     */
+    getListItemContainingElement_: function(element) {

[arv (Not doing code reviews), 2010/12/14 19:07:41]

This should be public. Maybe rename it getListItemAncestor as well.

[stuartmorgan, 2010/12/14 22:09:50]

Done.

+      var container = element;
+      while (container && container.parentNode != this) {
+        container = container.parentNode;
+      }
+      return container;
+    },
+
+    /**
      * Handle a keydown event.
      * @param {Event} e The keydown event.
      * @return {boolean} Whether the key event was handled.
      */
     handleKeyDown: function(e) {
       if (this.disabled)
         return;
 
       return this.selectionController_.handleKeyDown(e);
     },
@@ skipping 116 matching lines @@
      * @return {ListItem} The found list item or null if not found.
      */
     getListItemByIndex: function(index) {
       if (index < this.firstIndex_ || index >= this.lastIndex_)
         return null;
 
       return this.children[index - this.firstIndex_ + 1];
     },
 
     /**
+     * Find the index of the given list item element.
+     * @param {ListItem} item The list item to get the index of.
+     * @return {number} The index of the list item, or -1 if not found.
+     */
+    getIndexOfListItem: function(item) {
+      var cs = getComputedStyle(item);
+      var top = item.offsetTop - parseFloat(cs.marginTop);
+      var index = Math.floor(top / this.getItemHeight_());
+      var childIndex = index - this.firstIndex_ + 1;
+      if (childIndex >= 0 && childIndex < this.children.length &&
+          this.children[childIndex] == item)
+        return index;
+      return -1;
+    },
+
+    /**
      * Creates a new list item.
      * @param {*} value The value to use for the item.
      * @return {!ListItem} The newly created list item.
      */
     createItem: function(value) {
       return new cr.ui.ListItem({label: value});
     },
 
     /**
      * Creates the selection controller to use internally.
@@ skipping 102 matching lines @@
       }
     }
   };
 
   cr.defineProperty(List, 'disabled', cr.PropertyKind.BOOL_ATTR);
 
   return {
     List: List
   }
 });