Convert the downloads page to Polymer 0.8

chrome/browser/resources/settings/downloads_page/downloads_page.js

 // Copyright 2015 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.
 
 /**
  * @fileoverview
  * 'cr-settings-downloads-page' is the settings page containing downloads
  * settings.
  *
  * Example:
  *
- *    <core-animated-pages>
+ *    <iron-animated-pages>
  *      <cr-settings-downloads-page prefs="{{prefs}}">
  *      </cr-settings-downloads-page>
  *      ... other pages ...
- *    </core-animated-pages>
+ *    </iron-animated-pages>
  *
  * @group Chrome Settings Elements
  * @element cr-settings-downloads-page
  */
-Polymer('cr-settings-downloads-page', {
-  publish: {
+Polymer({
+  is: 'cr-settings-downloads-page',
+
+  properties: {
     /**
      * Preferences state.
-     *
-     * @attribute prefs
-     * @type CrSettingsPrefsElement
-     * @default null
+     * @type {?CrSettingsPrefsElement}
      */
-    prefs: null,
+    prefs: {
+      type: Object,
+      notify: true,
+    },
 
     /**
      * Route for the page.
-     *
-     * @attribute route
-     * @type string
-     * @default ''
      */
-    route: '',
+    route: {

[michaelpg, 2015/05/12 05:52:14]

I'm probably just out of the loop, but what's the rationale for not using the
shorthand (route: String)?

[Jeremy Klein, 2015/05/12 06:19:27]

In this case, no reason. Done.

FWIW there is a subtle difference here if the property is reflected to an
attribute. With no "value: ''", the attribute isn't added at all by default, but
with it, you get route=''.

[michaelpg, 2015/05/12 06:50:19]

I don't see this behavior -- either way, for me, the attribute is not present
(getAttribute('route') === null). The difference I do see is that with "value:
''", the instance of the element will have a property "route" set to ''
(otherwise, no such property is defined on the instance).

+      type: String,
+      value: '',
+    },
 
     /**
      * Whether the page is a subpage.
-     *
-     * @attribute subpage
-     * @type boolean
-     * @default false
      */
-    subpage: false,
+    subpage: {
+      type: Boolean,
+      value: false,
+    },
 
     /**
      * ID of the page.
-     *
-     * @attribute PAGE_ID
-     * @const string
-     * @default 'downloads'
      */
-    PAGE_ID: 'downloads',
+    PAGE_ID: {
+      type: String,
+      value: 'downloads',
+    },
 
     /**
      * Title for the page header and navigation menu.
-     *
-     * @attribute pageTitle
-     * @type string
      */
-    pageTitle: loadTimeData.getString('downloadsPageTitle'),
+    pageTitle: {
+      type: String,
+      value: function() {
+        return loadTimeData.getString('downloadsPageTitle');
+      },
+    },
 
     /**
      * Name of the 'core-icon' to show.

[michaelpg, 2015/05/12 05:52:14]

iron-icon

[Jeremy Klein, 2015/05/12 06:19:27]

Done.

-     *
-     * @attribute icon
-     * @type string
-     * @default 'file-download'
      */
-    icon: 'file-download',
+    icon: {
+      type: String,
+      value: 'file-download',
+    },
   },
 
-  selectDownloadLocation: function() {
+  /** @private */
+  selectDownloadLocation_: function() {
     // TODO(orenb): Communicate with the C++ to actually display a folder
     // picker.
     this.$.downloadsPath.value = '/Downloads';
   },
 });