MD History: Display synced tabs history.

chrome/browser/resources/md_history/synced_device_card.js

Index: chrome/browser/resources/md_history/synced_device_card.js
diff --git a/chrome/browser/resources/md_history/synced_device_card.js b/chrome/browser/resources/md_history/synced_device_card.js
new file mode 100644
index 0000000000000000000000000000000000000000..c4a993daff677d6032443f21cd3b8470da3d4790
--- /dev/null
+++ b/chrome/browser/resources/md_history/synced_device_card.js
@@ -0,0 +1,68 @@
+// 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.
+
+Polymer({
+  is: 'synced-device-card',
+
+  properties: {
+    // Name of the synced device.
+    device: {
+      type: String,
+      value: ''
+    },
+
+    // When the device information was last updated.
+    lastUpdateTime: {
+      type: String,
+      value: ''
+    },
+
+    // The list of tabs open for this device.
+    tabs: {
+      type: Array,
+      value: function() { return []; },
+      observer: 'updateIcons_'
+    },
+
+    // Whether the card is open.
+    cardOpen: {
+      type: Boolean,
+      value: true
+    },
+  },
+
+  /**
+   * Opens all the tabs displayed on the device in separate tabs.
+   * @private
+   */
+  openAllTabs_: function() {
+    for (var i = 0; i < this.tabs.length; i++)
+      window.open(this.tabs[i].url, '_blank');
+  },
+
+  /**
+   * Toggles the dropdown display of synced tabs for each device card.
+   */
+  toggleTabCard: function() {
+    this.$.collapse.toggle();
+    this.$$('#dropdown-indicator').icon =

[tsergeant, 2016/03/01 03:58:23]

Can use $ instead of $$

[calamity, 2016/03/08 02:46:51]

Done.

+        this.$.collapse.opened ? 'expand-less' : 'expand-more';
+  },
+
+  /**
+   * When the synced tab information is set, the icon associated with the tab
+   * website is also set.
+   * @private
+   */
+  updateIcons_: function() {
+    this.async(function() {
+      var icons = Polymer.dom(this.root).querySelectorAll('.website-icon');
+
+      for (var i = 0; i < this.tabs.length; i++) {
+        icons[i].style.backgroundImage =
+            getFaviconImageSet(this.tabs[i].url);
+      }
+    });
+  }
+});