DOMUI Prefs: Switch search engines to inline delete buttons

BUG=63825
TEST=Search engines in DOMUI prefs should be removable with inline delete buttons.

Review URL: http://codereview.chromium.org/6013005

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@69842 0039d316-1c4b-4281-b951-d872f2087c98

4 files changed, 16 insertions, 19 deletions

diff --git a/chrome/browser/dom_ui/options/search_engine_manager_handler.cc b/chrome/browser/dom_ui/options/search_engine_manager_handler.cc
index bbe7234..25ce098 100644
--- a/chrome/browser/dom_ui/options/search_engine_manager_handler.cc
+++ b/chrome/browser/dom_ui/options/search_engine_manager_handler.cc
@@ -56,8 +56,6 @@ void SearchEngineManagerHandler::GetLocalizedValues(
       l10n_util::GetStringUTF16(IDS_SEARCH_ENGINES_EDITOR_KEYWORD_COLUMN));
   localized_strings->SetString("addSearchEngineButton",
       l10n_util::GetStringUTF16(IDS_SEARCH_ENGINES_EDITOR_NEW_BUTTON));
-  localized_strings->SetString("removeSearchEngineButton",
-      l10n_util::GetStringUTF16(IDS_SEARCH_ENGINES_EDITOR_REMOVE_BUTTON));
   localized_strings->SetString("editSearchEngineButton",
       l10n_util::GetStringUTF16(IDS_SEARCH_ENGINES_EDITOR_EDIT_BUTTON));
   localized_strings->SetString("makeDefaultSearchEngineButton",
diff --git a/chrome/browser/resources/options/search_engine_manager.html b/chrome/browser/resources/options/search_engine_manager.html
index ddea38f..58d1ab1 100644
--- a/chrome/browser/resources/options/search_engine_manager.html
+++ b/chrome/browser/resources/options/search_engine_manager.html
@@ -7,8 +7,6 @@
     <div>
       <div><button id="addSearchEngineButton"
           i18n-content="addSearchEngineButton"></div>
-      <div><button id="removeSearchEngineButton" disabled
-          i18n-content="removeSearchEngineButton"></div>
       <div><button id="editSearchEngineButton" disabled
           i18n-content="editSearchEngineButton"></div>
       <div><button id="makeDefaultSearchEngineButton" disabled
diff --git a/chrome/browser/resources/options/search_engine_manager.js b/chrome/browser/resources/options/search_engine_manager.js
index 3e50004..0443ed0 100644
--- a/chrome/browser/resources/options/search_engine_manager.js
+++ b/chrome/browser/resources/options/search_engine_manager.js
@@ -41,9 +41,6 @@ cr.define('options', function() {
         chrome.send('editSearchEngine', ["-1"]);
         OptionsPage.showOverlay('editSearchEngineOverlay');
       };
-      $('removeSearchEngineButton').onclick = function(event) {
-        chrome.send('removeSearchEngine', [self.selectedModelIndex_]);
-      };
       $('editSearchEngineButton').onclick = function(event) {
         chrome.send('editSearchEngine', [self.selectedModelIndex_]);
         OptionsPage.showOverlay('editSearchEngineOverlay');
@@ -57,8 +54,6 @@ cr.define('options', function() {
       // TODO(stuartmorgan): Remove this once the strings are updated.
       $('addSearchEngineButton').textContent =
           localStrings.getStringWithoutAccelerator('addSearchEngineButton');
-      $('removeSearchEngineButton').textContent =
-          localStrings.getStringWithoutAccelerator('removeSearchEngineButton');
     },
 
     /**
@@ -89,8 +84,6 @@ cr.define('options', function() {
       var engine = selectedIndex != -1 ?
           this.list_.dataModel.item(selectedIndex) : null;
 
-      $('removeSearchEngineButton').disabled =
-          !(engine && engine['canBeRemoved']);
       $('editSearchEngineButton').disabled = engine == null;
       $('makeDefaultSearchEngineButton').disabled =
           !(engine && engine['canBeDefault']);
diff --git a/chrome/browser/resources/options/search_engine_manager_engine_list.js b/chrome/browser/resources/options/search_engine_manager_engine_list.js
index 52ddb55..1e7d93e 100644
--- a/chrome/browser/resources/options/search_engine_manager_engine_list.js
+++ b/chrome/browser/resources/options/search_engine_manager_engine_list.js
@@ -3,10 +3,10 @@
 // found in the LICENSE file.
 
 cr.define('options.search_engines', function() {
-  const List = cr.ui.List;
+  const DeletableItem = options.DeletableItem;
+  const DeletableItemList = options.DeletableItemList;
   const ListInlineHeaderSelectionController =
       options.ListInlineHeaderSelectionController;
-  const ListItem = cr.ui.ListItem;
 
   /**
    * Creates a new search engine list item.
@@ -31,11 +31,11 @@ cr.define('options.search_engines', function() {
   };
 
   SearchEngineListItem.prototype = {
-    __proto__: ListItem.prototype,
+    __proto__: DeletableItem.prototype,
 
     /** @inheritDoc */
     decorate: function() {
-      ListItem.prototype.decorate.call(this);
+      DeletableItem.prototype.decorate.call(this);
 
       var engine = this.searchEngine_;
 
@@ -44,6 +44,8 @@ cr.define('options.search_engines', function() {
       else if (engine['default'])
         this.classList.add('default');
 
+      this.deletable = engine['canBeRemoved'];
+
       var nameEl = this.ownerDocument.createElement('div');
       nameEl.className = 'name';
       if (engine['heading']) {
@@ -54,21 +56,21 @@ cr.define('options.search_engines', function() {
         nameEl.style.backgroundImage = url('chrome://favicon/iconurl/' +
                                            engine['iconURL']);
       }
-      this.appendChild(nameEl);
+      this.contentElement.appendChild(nameEl);
 
       var keywordEl = this.ownerDocument.createElement('div');
       keywordEl.className = 'keyword';
       keywordEl.textContent = engine['heading'] ?
           localStrings.getString('searchEngineTableKeywordHeader') :
           engine['keyword'];
-      this.appendChild(keywordEl);
+      this.contentElement.appendChild(keywordEl);
     },
   };
 
   var SearchEngineList = cr.ui.define('list');
 
   SearchEngineList.prototype = {
-    __proto__: List.prototype,
+    __proto__: DeletableItemList.prototype,
 
     /** @inheritDoc */
     createItem: function(searchEngine) {
@@ -80,13 +82,19 @@ cr.define('options.search_engines', function() {
       return new ListInlineHeaderSelectionController(sm, this);
     },
 
+    /** @inheritDoc */
+    deleteItemAtIndex: function(index) {
+      var modelIndex = this.dataModel.item(index)['modelIndex']
+      chrome.send('removeSearchEngine', [String(modelIndex)]);
+    },
+
     /**
      * Returns true if the given item is selectable.
      * @param {number} index The index to check.
      */
     canSelectIndex: function(index) {
       return !this.dataModel.item(index).hasOwnProperty('heading');
-    }
+    },
   };
 
   // Export