Site Settings: Give each category its own route.

chrome/browser/resources/settings/settings_page/settings_router.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
  * 'settings-router' is a simple router for settings. Its responsibilities:
  *  - Update the URL when the routing state changes.
  *  - Initialize the routing state with the initial URL.
  *  - Process and validate all routing state changes.
@@ skipping 124 matching lines @@
       subpageTitles: ['manageCertificates'],
     },
     {
       url: '/siteSettings',
       page: 'advanced',
       section: 'privacy',
       subpage: ['site-settings'],
       subpageTitles: ['siteSettings'],
     },
     {
       url: '/siteSettings/category',

[tommycli, 2016/01/05 18:28:58]

This route is no longer needed right?

[Finnur, 2016/01/06 14:53:46]

Correct.

       page: 'advanced',
       section: 'privacy',
       subpage: ['site-settings', 'site-settings-category'],
       subpageTitles: ['siteSettings', 'siteSettingsCategoryPageTitle'],
     },
     {
+      url: '/siteSettings/category/camera',
+      page: 'advanced',
+      section: 'privacy',
+      subpage: ['site-settings', 'site-settings-category'],
+      subpageTitles: ['siteSettings', 'siteSettingsCategoryPageTitle'],
+    },
+    {
+      url: '/siteSettings/category/cookies',
+      page: 'advanced',
+      section: 'privacy',
+      subpage: ['site-settings', 'site-settings-category'],

[tommycli, 2016/01/04 18:12:09]

final element is site-settings-cookies right?

and same below

[Finnur, 2016/01/05 15:54:07]

I'm not sure how to proceed here...

These sub-page strings equal Polymer element ids, right?

As such, there's only a site-settings-category element (which knows how to
display any category). Therefore there's no need for a specific
site-settings-cookies element.

I mean, I guess we could create one for each category and embed a
site-settings-category object within, or something... is that what you are
suggesting?

[tommycli, 2016/01/05 18:28:58]

Hello,

No, the subpage strings here do not equal Polymer element ids.

They equal the ids of neon-animatable elements within settings-animated-pages.

See
https://code.google.com/p/chromium/codesearch#chromium/src/chrome/browser/res...

I'm suggesting you do something within privacy_page.html:

<settings-animated-pages id="pages" current-route="{{currentRoute}}"
section="privacy">
  ...
  <neon-animatable id="site-settings-cookies">
    <site-settings-category category="cookies"></site-settings-category>
  </neon-animatable>
  <neon-animatable id="site-settings-fullscreen">
    <site-settings-category category="fullscreen"></site-settings-category>
  </neon-animatable>

  ...

This is necessary, I think, since you will want to support animated transitions
between subpages - right?

[Finnur, 2016/01/06 14:53:46]

Convinced.

However, I've not had luck now nor in the past with setting the |category| value
via HTML like you suggest (Dan mentioned talking to the Polymer team about that,
because it seems like a common need). I therefore still need to set it
dynamically in site_settings_page.js. 

That means the |category| value will get lost on page refresh and needs to be
set explicitly via the URL (requiring the computeCategoryFromDisplayName still,
which I've renamed to clarify a bit, hopefully).

Would like to remove it, but don't see how at the moment.

[tommycli, 2016/01/06 19:10:34]

You can only define this.category from HTML if 'category' is a polymer property.
i.e., you need to add something like

  category: {
    type: String,
  }

under 'properties' in site_settings_category.js.

settings_section.js does something very similar:
https://code.google.com/p/chromium/codesearch#chromium/src/chrome/browser/res...

[Finnur, 2016/01/07 13:14:49]

|category| is already defined; it used to reside in this file, but Steven moved
it into site_settings_behavior, which this derives from.

However, I made another attempt and was successful this time. I suspect either
selectedCategory or the url parsing was messing with my last attempt. After I
removed both of those and tried again it worked, with minor modifications.

+      subpageTitles: ['siteSettings', 'siteSettingsCategoryPageTitle'],

[tommycli, 2016/01/04 18:12:09]

final element is siteSettingsCookiesPageTitle right?

and same below

[Finnur, 2016/01/05 15:54:07]

Yes, if we can resolve the above.

[Finnur, 2016/01/06 14:53:46]

Done.

+    },
+    {
+      url: '/siteSettings/category/fullscreen',
+      page: 'advanced',
+      section: 'privacy',
+      subpage: ['site-settings', 'site-settings-category'],
+      subpageTitles: ['siteSettings', 'siteSettingsCategoryPageTitle'],
+    },
+    {
+      url: '/siteSettings/category/location',
+      page: 'advanced',
+      section: 'privacy',
+      subpage: ['site-settings', 'site-settings-category'],
+      subpageTitles: ['siteSettings', 'siteSettingsCategoryPageTitle'],
+    },
+    {
+      url: '/siteSettings/category/javascript',
+      page: 'advanced',
+      section: 'privacy',
+      subpage: ['site-settings', 'site-settings-category'],
+      subpageTitles: ['siteSettings', 'siteSettingsCategoryPageTitle'],
+    },
+    {
+      url: '/siteSettings/category/microphone',
+      page: 'advanced',
+      section: 'privacy',
+      subpage: ['site-settings', 'site-settings-category'],
+      subpageTitles: ['siteSettings', 'siteSettingsCategoryPageTitle'],
+    },
+    {
+      url: '/siteSettings/category/notifications',
+      page: 'advanced',
+      section: 'privacy',
+      subpage: ['site-settings', 'site-settings-category'],
+      subpageTitles: ['siteSettings', 'siteSettingsCategoryPageTitle'],
+    },
+    {
+      url: '/siteSettings/category/popups',
+      page: 'advanced',
+      section: 'privacy',
+      subpage: ['site-settings', 'site-settings-category'],
+      subpageTitles: ['siteSettings', 'siteSettingsCategoryPageTitle'],
+    },
+    {
       url: '/siteSettings/category/details',
       page: 'advanced',
       section: 'privacy',
       subpage: ['site-settings', 'site-settings-category', 'site-details'],
       subpageTitles: ['siteSettings', 'siteSettingsCategoryPageTitle',
           'siteSettingsSiteDetailsPageTitle'],
     },
     {
       url: '/clearBrowserData',
       page: 'advanced',
@@ skipping 96 matching lines @@
           history.replaceState(historicState, null);
         }
 
         return;
       }
     }
 
     assertNotReached('Route not found: ' + JSON.stringify(newRoute));
   },
 });