MD Settings: Search Engines: Move dropdown menu to search_engines_list

chrome/browser/resources/settings/search_engines_page/search_engines_list.html

Index: chrome/browser/resources/settings/search_engines_page/search_engines_list.html
diff --git a/chrome/browser/resources/settings/search_engines_page/search_engines_list.html b/chrome/browser/resources/settings/search_engines_page/search_engines_list.html
index 20a9316762f18aa0709e3cf36f59b9a5930f6fbd..4ed2c80d349e9802ee3d8391188dad752fdfc366 100644
--- a/chrome/browser/resources/settings/search_engines_page/search_engines_list.html
+++ b/chrome/browser/resources/settings/search_engines_page/search_engines_list.html
@@ -1,11 +1,15 @@
+<link rel="import" href="chrome://resources/cr_elements/shared_style_css.html">
 <link rel="import" href="chrome://resources/html/polymer.html">
+<link rel="import" href="chrome://resources/polymer/v1_0/iron-dropdown/iron-dropdown.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-list/iron-list.html">
-<link rel="import" href="chrome://resources/cr_elements/shared_style_css.html">
+<link rel="import" href="/search_engines_page/search_engines_browser_proxy.html">
+<link rel="import" href="/search_engines_page/search_engine_dialog.html">
 <link rel="import" href="/search_engines_page/search_engine_entry.html">
+<link rel="import" href="/settings_shared_css.html">
 
 <dom-module id="settings-search-engines-list">
   <template>
-    <style include="cr-shared-style">
+    <style include="settings-shared">
       .headers {
         display: flex;
         padding: 10px 0;
@@ -32,16 +36,45 @@
         border-top: none;
       }
     </style>
+
     <div id="outer">
       <content></content>
       <iron-list items="[[engines]]" selectable>
         <template>
           <settings-search-engine-entry engine="[[item]]"
-              tabindex$="[[tabIndex]]">
+              tabindex$="[[tabIndex]]" on-open-menu="onOpenMenu_">
           </settings-search-engine-entry>
         </template>
       </iron-list>
     </div>
+    <iron-dropdown horizontal-align="right" vertical-align="auto">

[dpapad, 2016/09/15 23:14:12]

Can we encapsulate the menu inside its own element, instead of dumping it inside
search-engine-list? Almost all the logic in search_engine_list.js now is related
to the menu, which feels a bit of a violation. For example, the list now keeps
track of a search engine member variable, that is feeding the menu, and is
otherwise useless to the list.

[stevenjb, 2016/09/15 23:35:55]

We certainly can. Adding new elements is a bit more extra work than adding a C++
class/file, so we often don't do that, but in principal I agree that it is
better encapsulation.

Let me know if you think that is important to do now. I'm juggling about 10
balls right now so this may not return to the top of my queue for a few weeks...
(I'm gardening next week then out for a couple).

+      <div class="dropdown-content">
+        <button class="dropdown-item" role="option" on-tap="onMakeDefaultTap_"
+            hidden$="[[!dropdownEngine_.canBeDefault]]">
+          $i18n{searchEnginesMakeDefault}
+        </button>
+        <button class="dropdown-item" role="option" on-tap="onEditTap_"
+            hidden$="[[!dropdownEngine_.canBeEdited]]">
+          $i18n{searchEnginesEdit}
+        </button>
+        <button class="dropdown-item" role="option" on-tap="onDeleteTap_"
+            hidden$="[[!dropdownEngine_.canBeRemoved]]">
+          $i18n{searchEnginesRemoveFromList}
+        </button>
+        <button class="dropdown-item" role="option" on-tap="onManageTap_"
+            hidden$="[[!dropdownEngine_.extension.id]]">
+          $i18n{searchEnginesManageExtension}
+        </button>
+        <button class="dropdown-item" role="option" on-tap="onDisableTap_"
+            hidden$="[[!dropdownEngine_.extension.id]]">
+          $i18n{disable}
+        </button>
+      </div>
+    </iron-dropdown>
+    <template is="dom-if" if="[[showEditSearchEngineDialog_]]" restamp>
+      <settings-search-engine-dialog model="[[dropdownEngine_]]">
+      </settings-search-engine-dialog>
+    </template>
   </template>
   <script src="search_engines_list.js"></script>
 </dom-module>