Skip to content

GitLab

T
tangled
Commit f8682c06 authored by michaelpg's avatar michaelpg Committed by Commit bot
Browse files
Options

Convert cr-settings-main to Polymer 0.8 

This hasn't been thoroughly tested yet. Once more pages are ready
and the rest of the structure is in place I will look more closely
at how pages are selected

BUG=485381

Review URL: https://codereview.chromium.org/1141603003

Cr-Commit-Position: refs/heads/master@{#329485}
parent 9b015b54
Hide whitespace changes
Inline Side-by-side
Showing with 130 additions and 63 deletions
chrome/browser/resources/settings/settings_main/settings_main_style.html → chrome/browser/resources/settings/settings_main/settings_main.css
View file @ f8682c06
<link rel="import" href="chrome://resources/polymer/polymer/polymer.html">
<link rel="import" href="chrome://resources/polymer/core-style/core-style.html">
/* 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. */
<core-style id="settingsMainStyle">
:host {
background-color: rgb(219, 222, 224);
color: black;
......@@ -22,4 +22,3 @@
::content core-icon-button {
position: absolute;
}
</core-style>
chrome/browser/resources/settings/settings_main/settings_main.html
View file @ f8682c06
<link rel="import" href="chrome://resources/polymer/polymer/polymer.html">
<link rel="import" href="chrome://resources/polymer/core-animated-pages/core-animated-pages.html">
<link rel="import" href="chrome://resources/polymer/core-transition/core-transition.html">
<link rel="import" href="chrome://resources/polymer/paper-shadow/paper-shadow.html">
<link rel="import" href="chrome://resources/polymer/v0_8/polymer/polymer.html">
<link rel="import" href="chrome://resources/polymer/v0_8/iron-pages/iron-pages.html">
<link rel="import" href="chrome://md-settings/routes.html">
<!-- TODO: Uncomment pages as they are upgraded.
<link rel="import" href="chrome://md-settings/a11y_page/a11y_page.html">
<link rel="import" href="chrome://md-settings/date_time_page/date_time_page.html">
<link rel="import" href="chrome://md-settings/downloads_page/downloads_page.html">
......@@ -9,41 +10,54 @@
<link rel="import" href="chrome://md-settings/internet_page/internet_detail_page.html">
<link rel="import" href="chrome://md-settings/search_engines_page/search_engines_page.html">
<link rel="import" href="chrome://md-settings/search_page/search_page.html">
<link rel="import" href="chrome://md-settings/routes.html">
<link rel="import" href="settings_main_style.html">
-->
<polymer-element name="cr-settings-main">
<dom-module id="cr-settings-main">
<link rel="import" type="css" href="settings_main.css">
<template>
<core-style ref="settingsMainStyle"></core-style>
<div id="mainContainer">
<cr-settings-page-header selectedPage="{{$.pageContainer.selectedItem}}">
<cr-settings-page-header selected-page="[[selectedPage]]">
</cr-settings-page-header>
<content select="core-icon-button"></content>
<more-route-selector selectedParams="{{params}}">
<core-animated-pages id="pageContainer"
on-core-select="{{onCoreSelect_}}" valueattr="PAGE_ID"
transitions="cross-fade">
<content select="paper-icon-button"></content>
<more-route-selector selected-params="{{params}}">
<iron-pages id="pageContainer" selected-item="{{selectedPage}}"
on-iron-select="onIronSelect_" attr-for-selected="PAGE_ID">
<!-- TODO: Uncomment pages as they are upgraded. -->
<if expr="chromeos">
<!--
<cr-settings-internet-page route="internet">
</cr-settings-internet-page>
-->
<!--
<cr-settings-internet-detail-page route="internet-detail"
subpage="true" guid="{{params.guid}}">
</cr-settings-internet-detail-page>
-->
</if>
<!--
<cr-settings-a11y-page prefs="{{prefs}}" route="a11y">
</cr-settings-a11y-page>
-->
<if expr="chromeos">
<!--
<cr-settings-date-time-page prefs="{{prefs}}" route="dateTime">
</cr-settings-date-time-page>
</if>
-->
<!--
<cr-settings-downloads-page prefs="{{prefs}}" route="downloads">
</cr-settings-downloads-page>
-->
<!--
<cr-settings-search-page prefs="{{prefs}}" route="search">
</cr-settings-search-page>
-->
<!--
<cr-settings-search-engines-page prefs="{{prefs}}"
route="search-engines">
</cr-settings-search-engines-page>
</core-animated-pages>
-->
</iron-pages>
</more-route-selector>
</div>
</template>
......
chrome/browser/resources/settings/settings_main/settings_main.js
View file @ f8682c06
......@@ -8,47 +8,51 @@
*
* Example:
*
* <cr-settings-main pages="{{pages}}" selectedPageId="{{selectedId}}">
* <cr-settings-main pages="[[pages]]" selected-page-id="{{selectedId}}">
* </cr-settings-main>
*
* See cr-settings-drawer for example of use in 'core-drawer-panel'.
* See cr-settings-drawer for example of use in 'paper-drawer-panel'.
*
* @group Chrome Settings Elements
* @element cr-settings-main
*/
Polymer('cr-settings-main', {
publish: {
Polymer({
is: 'cr-settings-main',
properties: {
/**
* Preferences state.
*
* @attribute prefs
* @type CrSettingsPrefsElement
* @default null
* @type {?CrSettingsPrefsElement}
*/
prefs: null,
prefs: {
type: Object,
notify: true,
},
/**
* Pages that may be shown.
*
* @attribute pages
* @type Array<!Object>
* @default null
* @type {?Array<!HTMLElement>}
*/
pages: null,
pages: Array,
/**
* ID of the currently selected page.
*
* @attribute selectedPageId
* @type string
* default ''
* Currently selected page.
* @type {?HTMLElement}
*/
selectedPageId: '',
},
selectedPage: {
type: Object,
notify: true,
},
/** @override */
created: function() {
this.pages = [];
/**
* ID of the currently selected page.
*/
selectedPageId: {
type: String,
notify: true,
observe: 'selectedPageIdChanged_',
},
},
/** @override */
......@@ -62,14 +66,15 @@ Polymer('cr-settings-main', {
},
/**
* Polymer changed event for selectedPageId. See note for onCoreSelect_ below.
* Polymer changed event for selectedPageId. See note for onIronSelect_ below.
* @private
*/
selectedPageIdChanged: function() {
selectedPageIdChanged_: function() {
this.$.pageContainer.selected = this.selectedPageId;
},
/**
* We observe $.pageContainer.on-core-select instead of using data binding
* We observe $.pageContainer.on-iron-select instead of using data binding
* for two reasons:
* 1) We need to exclude subpages
* 2) There is a bug with data binding or our useage of it here causing
......@@ -78,7 +83,7 @@ Polymer('cr-settings-main', {
* fixing this and using filters once we switch to Polymer 0.8.
* @private
*/
onCoreSelect_: function(event) {
onIronSelect_: function(event) {
if (event.target != this.$.pageContainer || !event.detail.isSelected ||
event.detail.item.subpage) {
return;
......@@ -89,7 +94,6 @@ Polymer('cr-settings-main', {
/**
* If no page is selected, selects the first page. This happens on load and
* when a selected page is removed.
*
* @private
*/
ensureSelection_: function() {
......@@ -100,8 +104,7 @@ Polymer('cr-settings-main', {
},
/**
* Updates the list of pages using the pages in core-animated-pages.
*
* Updates the list of pages using the pages in iron-pages.
* @private
*/
pageContainerUpdated_: function() {
......
chrome/browser/resources/settings/settings_resources.grd
View file @ f8682c06
......@@ -41,8 +41,8 @@
<structure name="IDR_SETTINGS_CR_SETTINGS_DRAWER_JS"
file="settings_drawer/settings_drawer.js"
type="chrome_html" />
<structure name="IDR_SETTINGS_CR_SETTINGS_MAIN_STYLE_HTML"
file="settings_main/settings_main_style.html"
<structure name="IDR_SETTINGS_CR_SETTINGS_MAIN_CSS"
file="settings_main/settings_main.css"
type="chrome_html" />
<structure name="IDR_SETTINGS_CR_SETTINGS_MAIN_HTML"
file="settings_main/settings_main.html"
......
ui/webui/resources/polymer_resources.grdp
View file @ f8682c06
......@@ -532,6 +532,42 @@
<structure name="IDR_POLYMER_08_IRON_META_IRON_META_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/iron-meta/iron-meta-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_IRON_PAGES_IRON_PAGES_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/iron-pages/iron-pages.html"
type="chrome_html" />
<structure name="IDR_POLYMER_08_IRON_PAGES_IRON_PAGES_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/iron-pages/iron-pages-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_IRON_RESIZABLE_BEHAVIOR_IRON_RESIZABLE_BEHAVIOR_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/iron-resizable-behavior/iron-resizable-behavior.html"
type="chrome_html" />
<structure name="IDR_POLYMER_08_IRON_RESIZABLE_BEHAVIOR_IRON_RESIZABLE_BEHAVIOR_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/iron-resizable-behavior/iron-resizable-behavior-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_IRON_SELECTOR_IRON_MULTI_SELECTABLE_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/iron-selector/iron-multi-selectable.html"
type="chrome_html" />
<structure name="IDR_POLYMER_08_IRON_SELECTOR_IRON_MULTI_SELECTABLE_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/iron-selector/iron-multi-selectable-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_IRON_SELECTOR_IRON_SELECTABLE_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/iron-selector/iron-selectable.html"
type="chrome_html" />
<structure name="IDR_POLYMER_08_IRON_SELECTOR_IRON_SELECTABLE_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/iron-selector/iron-selectable-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_IRON_SELECTOR_IRON_SELECTION_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/iron-selector/iron-selection.html"
type="chrome_html" />
<structure name="IDR_POLYMER_08_IRON_SELECTOR_IRON_SELECTION_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/iron-selector/iron-selection-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_IRON_SELECTOR_IRON_SELECTOR_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/iron-selector/iron-selector.html"
type="chrome_html" />
<structure name="IDR_POLYMER_08_IRON_SELECTOR_IRON_SELECTOR_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/iron-selector/iron-selector-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_PAPER_BEHAVIORS_PAPER_BUTTON_BEHAVIOR_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/paper-behaviors/paper-button-behavior.html"
......@@ -637,44 +673,59 @@
<structure name="IDR_POLYMER_08_MORE_ROUTING_DRIVER_HASH_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/driver/hash-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_MORE_ROUTE_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/more-route.html"
<structure name="IDR_POLYMER_08_MORE_ROUTING_DRIVER_MOCK_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/driver/mock-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_DRIVER_MOCK_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/driver/mock.html"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_DRIVER_PATH_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/driver/path-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_DRIVER_PATH_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/driver/path.html"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_MORE_ROUTE_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/more-route-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_MORE_ROUTE_CONTEXT_AWARE_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/more-route-context-aware.html"
<structure name="IDR_POLYMER_08_MORE_ROUTING_MORE_ROUTE_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/more-route.html"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_MORE_ROUTE_CONTEXT_AWARE_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/more-route-context-aware-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_MORE_ROUTE_SELECTION_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/more-route-selection.html"
<structure name="IDR_POLYMER_08_MORE_ROUTING_MORE_ROUTE_CONTEXT_AWARE_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/more-route-context-aware.html"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_MORE_ROUTE_SELECTION_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/more-route-selection-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_MORE_ROUTE_SELECTOR_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/more-route-selector.html"
<structure name="IDR_POLYMER_08_MORE_ROUTING_MORE_ROUTE_SELECTION_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/more-route-selection.html"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_MORE_ROUTE_SELECTOR_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/more-route-selector-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_MORE_ROUTING_CONFIG_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/more-routing-config.html"
<structure name="IDR_POLYMER_08_MORE_ROUTING_MORE_ROUTE_SELECTOR_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/more-route-selector.html"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_MORE_ROUTING_CONFIG_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/more-routing-config-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_MORE_ROUTING_CONFIG_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/more-routing-config.html"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_MORE_ROUTING_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/more-routing.html"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_ROUTE_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/route-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_ROUTE_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/route.html"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_ROUTE_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/route-extracted.js"
<structure name="IDR_POLYMER_08_MORE_ROUTING_ROUTING_EXTRACTED_JS"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/routing-extracted.js"
type="chrome_html" />
<structure name="IDR_POLYMER_08_MORE_ROUTING_ROUTING_HTML"
file="../../../third_party/polymer/v0_8/components-chromium/more-routing/routing.html"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment