MD Settings: simplify language model and data binding

chrome/browser/resources/settings/languages_page/manage_languages_page.html

 <link rel="import" href="chrome://resources/html/assert.html">
 <link rel="import" href="chrome://resources/html/cr.html">
 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icons/iron-icons.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-list/iron-list.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-checkbox/paper-checkbox.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button.html">
 <link rel="import" href="chrome://md-settings/settings_shared_css.html">
 <link rel="import" href="languages.html">
 
 <dom-module id="settings-manage-languages-page">
   <template>
     <style include="settings-shared">
       .list-frame {
         display: flex;
         flex-direction: column;
         align-items: initial;
       }
 
       iron-list {
         height: 300px;
       }
     </style>
     <settings-languages languages="{{languages}}"></settings-languages>
-    <div class="settings-box first content">
-      <div class="start">
-        <h2 i18n-content="enabledLanguages"></h2>
-        <div class="list-frame vertical-list">
-          <template is="dom-repeat" items="{{languages.enabledLanguages}}">
+    <div class="settings-box first block">
+      <h2 i18n-content="enabledLanguages"></h2>

[stevenjb, 2016/04/20 20:40:50]

$i18n{}

[michaelpg, 2016/04/20 23:19:59]

I've done this separately in crrev.com/1905533005 with dschuyler@ to review.

Then rebased this patch on that one.

You can see the changes including i18n by comparing with patch set 2, and the
changes that are just from this CL by comparing to base.

+      <div class="list-frame vertical-list">
+        <template is="dom-repeat" items="{{languages.enabled}}">
+          <div class="list-item">
+            <div class="start" title="[[item.language.nativeDisplayName]]">
+              [[item.language.displayName]]
+            </div>
+            <paper-icon-button icon="clear" on-tap="onRemoveLanguageTap_"
+                hidden$="[[!item.removable]]">
+            </paper-icon-button>
+          </div>
+        </template>
+      </div>
+      <h2 i18n-content="allLanguages"></h2>

[stevenjb, 2016/04/20 20:40:50]

$i18n{}

[michaelpg, 2016/04/20 23:19:59]

Done.

+      <div class="list-frame vertical-list">
+        <iron-list items="{{languages.supported}}" as="item">

[stevenjb, 2016/04/20 20:40:50]

as= not needed?

[michaelpg, 2016/04/20 23:19:59]

Done.

+          <template>
             <div class="list-item">
-              <div class="start" title="[[item.language.nativeDisplayName]]">
-                [[item.language.displayName]]
-              </div>
-              <paper-icon-button icon="clear" on-tap="onRemoveLanguageTap_"
-                  hidden$="[[!canRemoveLanguage_(
-                      item.language.code, prefs.intl.app_locale.value)]]">
-              </paper-icon-button>
+              <paper-checkbox
+                  checked="[[isCheckboxChecked_(item, languages.enabled.*)]]"
+                  disabled="[[isLanguageRequired_(item, languages.enabled.*)]]"
+                  title$="[[item.nativeDisplayName]]"
+                  on-change="onLanguageCheckboxChange_">
+                [[item.displayName]]
+              </paper-checkbox>
             </div>
           </template>
-        </div>
-        <h2 i18n-content="allLanguages"></h2>
-        <div class="list-frame vertical-list">
-          <iron-list items="{{availableLanguages_}}" as="item">
-            <template>
-              <div class="list-item">
-                <paper-checkbox checked="[[item.enabled]]"
-                    title$="[[item.nativeDisplayName]]"
-                    disabled="[[!canRemoveLanguage_(
-                        item.code, prefs.intl.app_locale.value)]]"
-                    on-change="onLanguageCheckboxChange_">
-                  [[item.displayName]]
-                </paper-checkbox>
-              </div>
-            </template>
-          </iron-list>
-        </div>
+        </iron-list>
       </div>
     </div>
   </template>
   <script src="manage_languages_page.js"></script>
 </dom-module>