Convert cr-settings-drawer to Polymer 0.8

chrome/browser/resources/settings/settings_drawer/settings_drawer.js

Index: chrome/browser/resources/settings/settings_drawer/settings_drawer.js
diff --git a/chrome/browser/resources/settings/settings_drawer/settings_drawer.js b/chrome/browser/resources/settings/settings_drawer/settings_drawer.js
index 7cbd9da99f82244f2eedbee2ae58b8a70e44590a..73f7b44ce3fdc9541173145a79f3000ddbbe63d3 100644
--- a/chrome/browser/resources/settings/settings_drawer/settings_drawer.js
+++ b/chrome/browser/resources/settings/settings_drawer/settings_drawer.js
@@ -9,50 +9,54 @@
  *
  * Example:
  *
- *     <core-drawer-panel>
- *       <cr-settings-drawer drawer selectedId="{{selectedId}}"
- *           pages="{{pages}}">
+ *     <paper-drawer-panel>
+ *       <cr-settings-drawer drawer selected-id="{{selectedId}}"
+ *           pages="[[pages]]">
  *       </cr-settings-drawer>
- *       <cr-settings-main main selectedId="{{selectedId}}" pages="{{pages}}">
+ *       <cr-settings-main main selected-id="{{selectedId}}" pages="[[pages]]">
  *       </cr-settings-main>
- *     </core-drawer-panel>
+ *     </paper-drawer-panel>
  *
  * @group Chrome Settings Elements
  * @element cr-settings-drawer
  */
-Polymer('cr-settings-drawer', {
-  publish: {
+Polymer({
+  is: 'cr-settings-drawer',
+
+  properties: {
     /**
      * Pages to include in the navigation.
-     *
-     * @attribute pages
-     * @type Array<!Object>
-     * @default null
+     * @type {!Array<!HTMLElement>}
      */
-    pages: null,
+    pages: {
+      type: Array,
+      value: function() { return []; },
+    },
 
     /**
      * ID of the currently selected page.
-     *
-     * @attribute selectedId
-     * @type string
-     * default ''
+     * @type {string}
      */
-    selectedId: '',
-  },
-
-  /** @override */
-  created: function() {
-    this.pages = [];
-  },
+    selectedId: {
+      type: String,
+      notify: true,
+    },
 
-  /**
-   * @type {Object}
-   * TODO(michaelpg): Create custom element and data source for user card.
-   */
-  user: {
-    name: 'Chrome User',
-    email: 'user@example.com',
-    iconUrl: 'chrome://theme/IDR_PROFILE_AVATAR_23@1x',
+    /**
+     * @type {!Object}
+     * @private
+     * TODO(michaelpg): Create custom element and data source for user card.
+     */
+    user_: {
+      type: Object,
+      value: function() {
+        return {
+          name: 'Chrome User',
+          email: 'user@example.com',
+          iconUrl: 'chrome://theme/IDR_PROFILE_AVATAR_23@1x',
+        };
+      },
+      notify: true,

[Jeremy Klein, 2015/05/12 23:35:16]

Why does this need to notify? Can it be readonly?

[michaelpg, 2015/05/13 00:54:26]

Done.

+    },
   },
 });