Add support for custom entries in <cr_network_select/>.

ui/webui/resources/cr_elements/network/cr_network_list_network_item.js

Index: ui/webui/resources/cr_elements/network/cr_network_list_network_item.js
diff --git a/ui/webui/resources/cr_elements/network/cr_network_list_item.js b/ui/webui/resources/cr_elements/network/cr_network_list_network_item.js
similarity index 78%
rename from ui/webui/resources/cr_elements/network/cr_network_list_item.js
rename to ui/webui/resources/cr_elements/network/cr_network_list_network_item.js
index b922df8e63ac67e95353137151b75b079d990ec0..5a59631e10fecad1edb2e780b8ecd258aced7356 100644
--- a/ui/webui/resources/cr_elements/network/cr_network_list_item.js
+++ b/ui/webui/resources/cr_elements/network/cr_network_list_network_item.js
@@ -1,4 +1,4 @@
-// Copyright 2015 The Chromium Authors. All rights reserved.
+// Copyright 2016 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.
 
@@ -65,10 +65,10 @@ function getNetworkName(network) {
 }
 
 /**
- * Polymer class definition for 'cr-network-list-item'.
+ * Polymer class definition for 'cr-network-list-network-item'.
  */
 Polymer({
-  is: 'cr-network-list-item',
+  is: 'cr-network-list-network-item',
 
   properties: {
     /**
@@ -96,6 +96,43 @@ Polymer({
       value: 'none',
       observer: 'networkStateChanged_'
     },
+
+    /**
+     * Permission to show buttons.

[stevenjb, 2016/06/24 22:33:08]

nit: 'Whether to show buttons.' sounds a bit more natural.

[Alexander Alekseev, 2016/06/25 06:04:43]

Done.

+     */
+    showButtons: {
+      type: Boolean,
+      value: false,
+      observer: 'showButtonsChanged_'
+    },
+
+    /**
+     * This event is fired on each NetworkStateProperties object when it has
+     * state 'Connected'.
+     *
+     * @type {String}
+     */
+    networkConnectedEvent: {

[stevenjb, 2016/06/24 22:33:08]

I don't think we need/want this, see comment below.

+      type: String,
+      value: null,
+    },
+  },
+
+  /**
+   * Determines visibility of the "Settings" button.

[stevenjb, 2016/06/24 22:33:08]

* @private {boolean}

+   */
+  showSettingsButton_ : false,
+
+  /**
+   * Determines visibility of "known buttons" block.

[stevenjb, 2016/06/24 22:33:08]

* @private {boolean}

+   */
+  showKnownButtons_: false,
+
+  /**
+   * Polymer |showButtons| changed observer.
+   */
+  showButtonsChanged_: function() {
+    this.updateButtonsState_()
   },
 
   /**
@@ -105,26 +142,33 @@ Polymer({
   networkStateChanged_: function() {
     if (!this.networkState)
       return;
-
     var network = this.networkState;
     var isDisconnected =
         network.ConnectionState == CrOnc.ConnectionState.NOT_CONNECTED;
+
+    if (this.networkConnectedEvent &&
+        network.ConnectionState == CrOnc.ConnectionState.CONNECTED) {
+      this.fire(this.networkConnectedEvent, this.networkState);

[stevenjb, 2016/06/24 22:33:08]

Rather than provide a custom property for this event, this could just fire
'network-connected' and document that in the header. That way we wouldn't need
to propagate this property through the layers.

+    }
+
+    this.updateButtonsState_();
+
     var name = getNetworkName(network);
     if (this.isListItem_(this.listItemType)) {
-      this.$.networkName.textContent = name;
-      this.$.networkName.classList.toggle('connected', !isDisconnected);
+      this.$.itemName.textContent = name;
+      this.$.itemName.classList.toggle('connected', !isDisconnected);
       return;
     }
     if (network.Name && network.ConnectionState) {
-      this.$.networkName.textContent = getText('OncType' + network.Type);
-      this.$.networkName.classList.toggle('connected', false);
+      this.$.itemName.textContent = getText('OncType' + network.Type);
+      this.$.itemName.classList.toggle('connected', false);
       this.$.networkStateText.textContent =
           getConnectionStateText(network.ConnectionState, name);
       this.$.networkStateText.classList.toggle('connected', !isDisconnected);
       return;
     }
-    this.$.networkName.textContent = getText('OncType' + network.Type);
-    this.$.networkName.classList.toggle('connected', false);
+    this.$.itemName.textContent = getText('OncType' + network.Type);
+    this.$.itemName.classList.toggle('connected', false);
     this.$.networkStateText.textContent = getText('networkDisabled');
     this.$.networkStateText.classList.toggle('connected', false);
 
@@ -216,5 +260,12 @@ Polymer({
   isListItemType_: function(listItemType, type) {
     return listItemType == type;
   },
+
+  updateButtonsState_: function() {
+    this.showSettingsButton = this.showButtons &&
+        this.isListItemType_(this.listItemType, 'visible');
+    this.showKnownButtons_ = this.showButtons &&
+        this.isListItemType_(this.listItemType, 'known');
+  },
 });
 })();