[MD Extensions] Add a details subpage, move to one list

chrome/browser/resources/md_extensions/manager.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.
 
 cr.define('extensions', function() {
   'use strict';
 
   /**
    * Compares two extensions to determine which should come first in the list.
    * @param {chrome.developerPrivate.ExtensionInfo} a
@@ skipping 42 matching lines @@
       extensions: {
         type: Array,
         value: function() { return []; },
       },
 
       /** @type {!Array<!chrome.developerPrivate.ExtensionInfo>} */
       apps: {
         type: Array,
         value: function() { return []; },
       },
-
-      /** @type {!Array<!chrome.developerPrivate.ExtensionInfo>} */
-      websites: {
-        type: Array,
-        value: function() { return []; },
-      },
     },
 
     behaviors: [
       I18nBehavior,
     ],
 
     ready: function() {
       /** @type {extensions.Sidebar} */
       this.sidebar =
           /** @type {extensions.Sidebar} */(this.$$('extensions-sidebar'));
       this.service = extensions.Service.getInstance();
       this.service.managerReady(this);
-      this.scrollHelper_ = new ScrollHelper(this);
-      this.sidebar.setScrollDelegate(this.scrollHelper_);
+      this.listHelper_ = new ListHelper(this);
+      this.sidebar.setListDelegate(this.listHelper_);
       this.$.toolbar.setSearchDelegate(new SearchHelper(this));
     },
 
     /**
      * @param {chrome.developerPrivate.ExtensionType} type The type of item.
      * @return {string} The ID of the list that the item belongs in.
      * @private
      */
     getListId_: function(type) {
       var listId;
       var ExtensionType = chrome.developerPrivate.ExtensionType;
       switch (type) {
         case ExtensionType.HOSTED_APP:
         case ExtensionType.LEGACY_PACKAGED_APP:
-          listId = 'websites';
-          break;
         case ExtensionType.PLATFORM_APP:
           listId = 'apps';
           break;
         case ExtensionType.EXTENSION:
         case ExtensionType.SHARED_MODULE:
           listId = 'extensions';
           break;
         case ExtensionType.THEME:
           assertNotReached(
               'Don\'t send themes to the chrome://extensions page');
           break;
       }
       assert(listId);
       return listId;
     },
 
     /**
      * @param {string} listId The list to look for the item in.
      * @param {string} itemId The id of the item to look for.
      * @return {number} The index of the item in the list, or -1 if not found.
      * @private
      */
     getIndexInList_: function(listId, itemId) {
       return this[listId].findIndex(function(item) {
         return item.id == itemId;
       });
     },
 
     /**
-     * @param {!Array<!chrome.developerPrivate.ExtensionInfo>} list
      * @return {boolean} Whether the list should be visible.
      */
-    computeListHidden_: function(list) {
-      return list.length == 0;
+    computeListHidden_: function(a, b, c, d) {

[Dan Beam, 2016/04/26 01:32:12]

why a, b, c, d with no doc?

[Devlin, 2016/04/26 17:24:18]

Whoops, was debugging.  Removed.

+      return this.$['items-list'].items.length == 0;
     },
 
     /**
      * Creates and adds a new extensions-item element to the list, inserting it
      * into its sorted position in the relevant section.
      * @param {!chrome.developerPrivate.ExtensionInfo} item The extension
      *     the new element is representing.
      */
     addItem: function(item) {
       var listId = this.getListId_(item.type);
@@ skipping 23 matching lines @@
      * @param {!chrome.developerPrivate.ExtensionInfo} item The data for the
      *     item to remove.
      */
     removeItem: function(item) {
       var listId = this.getListId_(item.type);
       var index = this.getIndexInList_(listId, item.id);
       // We should never try and remove a non-existent item.
       assert(index >= 0);
       this.splice(listId, index, 1);
     },
+

[Dan Beam, 2016/04/26 01:32:12]

doc

[Devlin, 2016/04/26 17:24:18]

Done.

+    showDetailsFor: function(data) {
+      this.$['details-view'].set('data', data);
+      this.$.pages.selected = 1;
+    },
+

[Dan Beam, 2016/04/26 01:32:12]

/** @private */

[Devlin, 2016/04/26 17:24:18]

Done.

+    onDetailsViewClose_: function() {
+      this.$.pages.selected = 0;
+    }
   });
 
   /**
    * @param {extensions.Manager} manager

[Dan Beam, 2016/04/26 01:32:12]

a helper that takes a manager and implements a delegate?

this code is starting to get a little confusing

[Devlin, 2016/04/26 17:24:18]

It's okay, we don't yet have Factory, Impl, or half a dozen other generic
pattern names! ;)

Really, this is only needed because we have yet to find a
polymeric-closure-compilable-way of having Manager override another class
directly - ListHelper is entirely an implementation detail of the manager.

    * @constructor
-   * @implements {extensions.SidebarScrollDelegate}
+   * @implements {extensions.SidebarListDelegate}
    */
-  function ScrollHelper(manager) {
-    this.items_ = manager.$.items;
+  function ListHelper(manager) {
+    this.manager = manager;
   }
 
-  ScrollHelper.prototype = {
+  ListHelper.prototype = {
     /** @override */
-    scrollToExtensions: function() {
-      this.items_.scrollTop =
-          this.items_.querySelector('#extensions-list').offsetTop;
+    showExtensions: function() {
+      this.manager.$['items-list'].set('items', this.manager.extensions);

[Dan Beam, 2016/04/26 01:32:12]

why not just ask for for an items list element if it's the only property that's
used from |this.manager|?

[Devlin, 2016/04/26 17:24:18]

We also use manager.extensions and manager.apps.  We could pass in all three,
but it seemed too verbose.  Again, this is really just an implementation detail,
and would be cleaner if we could just put showApps() and showExtensions()
directly on manager, but we can't.  I'm thinking of these as the equivalent of
private inner classes in C++.

     },
 
     /** @override */
-    scrollToApps: function() {
-      this.items_.scrollTop =
-          this.items_.querySelector('#apps-list').offsetTop;
-    },
-
-    /** @override */
-    scrollToWebsites: function() {
-      this.items_.scrollTop =
-          this.items_.querySelector('#websites-list').offsetTop;
+    showApps: function() {
+      this.manager.$['items-list'].set('items', this.manager.apps);
     },
   };
 
   /**
    * @param {extensions.Manager} manager
    * @constructor
    * @implements {SearchFieldDelegate}
    */
   function SearchHelper(manager) {
     this.manager_ = manager;
   }
 
   SearchHelper.prototype = {
     /** @override */
     onSearchTermSearch: function(searchTerm) {
       this.manager_.filter = searchTerm;
     },
   };
 
   return {Manager: Manager};
 });