MD History: Synced Tabs fixes

chrome/browser/resources/md_history/app.crisper.js

 // 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.
 
 /**
  * @fileoverview PromiseResolver is a helper class that allows creating a
  * Promise that will be fulfilled (resolved or rejected) some time later.
  *
  * Example:
  *  var resolver = new PromiseResolver();
@@ skipping 14593 matching lines @@
 
     /**
      * The indexes where a window separator should be shown. The use of a
      * separate array here is necessary for window separators to appear
      * correctly in search. See http://crrev.com/2022003002 for more details.
      * @type {!Array<number>}
      */
     separatorIndexes: Array,
 
     // Whether the card is open.
-    cardOpen_: {type: Boolean, value: true},
+    opened: Boolean,
 
     searchTerm: String,
 
     // Internal identifier for the device.
     sessionTag: String,
   },
 
   /**
    * Open a single synced tab. Listens to 'click' rather than 'tap'
    * to determine what modifier keys were pressed.
@@ skipping 31 matching lines @@
       }
     });
   },
 
   /** @private */
   isWindowSeparatorIndex_: function(index, separatorIndexes) {
     return this.separatorIndexes.indexOf(index) != -1;
   },
 
   /**
-   * @param {boolean} cardOpen
+   * @param {boolean} opened
    * @return {string}
+   * @private
    */
-  getCollapseTitle_: function(cardOpen) {
-    return cardOpen ? loadTimeData.getString('collapseSessionButton') :
-                      loadTimeData.getString('expandSessionButton');
+  getCollapseIcon_: function(opened) {
+    return opened ? 'cr:expand-less' : 'cr:expand-more';
   },
 
   /**
+   * @param {boolean} opened
+   * @return {string}
+   * @private
+   */
+  getCollapseTitle_: function(opened) {
+    return opened ? loadTimeData.getString('collapseSessionButton') :
+                    loadTimeData.getString('expandSessionButton');
+  },
+
+  /**
    * @param {CustomEvent} e
    * @private
    */
   onMenuButtonTap_: function(e) {
     this.fire('toggle-menu', {
       target: Polymer.dom(e).localTarget,
       tag: this.sessionTag
     });
     e.stopPropagation();  // Prevent iron-collapse.
   },
 });
 // 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.
 
 /**
  * @typedef {{device: string,
  *           lastUpdateTime: string,
+ *           opened: boolean,
  *           separatorIndexes: !Array<number>,
  *           timestamp: number,
  *           tabs: !Array<!ForeignSessionTab>,
  *           tag: string}}
  */
 var ForeignDeviceInternal;
 
 Polymer({
   is: 'history-synced-device-manager',
 
@@ skipping 34 matching lines @@
 
     /** @private */
     fetchingSyncedTabs_: {
       type: Boolean,
       value: false,
     }
   },
 
   listeners: {
     'toggle-menu': 'onToggleMenu_',
+    'scroll': 'onListScroll_'
   },
 
   /** @override */
   attached: function() {
     // Update the sign in state.
     chrome.send('otherDevicesInitialized');
   },
 
   /**
    * @param {!ForeignSession} session
@@ skipping 26 matching lines @@
             windowAdded = true;
           }
         }
       }
       if (windowAdded && i != session.windows.length - 1)
         separatorIndexes.push(tabs.length - 1);
     }
     return {
       device: session.name,
       lastUpdateTime: '– ' + session.modifiedTime,
+      opened: true,
       separatorIndexes: separatorIndexes,
       timestamp: session.timestamp,
       tabs: tabs,
       tag: session.tag,
     };
   },
 
   onSignInTap_: function() {
     chrome.send('startSignInFlow');
   },
 
+  onListScroll_: function() {
+    var menu = this.$.menu.getIfExists();
+    if (menu)
+      menu.closeMenu();
+  },
+
   onToggleMenu_: function(e) {
     this.$.menu.get().then(function(menu) {
       menu.toggleMenu(e.detail.target, e.detail.tag);
     });
   },
 
   onOpenAllTap_: function() {
     var menu = assert(this.$.menu.getIfExists());
     md_history.BrowserService.getInstance().openForeignSessionAllTabs(
         menu.itemData);
@@ skipping 73 matching lines @@
     var updateCount = Math.min(sessionList.length, this.syncedDevices_.length);
     for (var i = 0; i < updateCount; i++) {
       var oldDevice = this.syncedDevices_[i];
       if (oldDevice.tag != sessionList[i].tag ||
           oldDevice.timestamp != sessionList[i].timestamp) {
         this.splice(
             'syncedDevices_', i, 1, this.createInternalDevice_(sessionList[i]));
       }
     }
 
-    // Then, append any new devices.
-    for (var i = updateCount; i < sessionList.length; i++) {
-      this.push('syncedDevices_', this.createInternalDevice_(sessionList[i]));
+    if (sessionList.length >= this.syncedDevices_.length) {
+      // The list grew; append new items.
+      for (var i = updateCount; i < sessionList.length; i++) {
+        this.push('syncedDevices_', this.createInternalDevice_(sessionList[i]));
+      }
+    } else {
+      // The list shrank; remove deleted items.
+      this.splice(
+          'syncedDevices_', updateCount,
+          this.syncedDevices_.length - updateCount);
     }
   },
 
   /**
    * End fetching synced tabs when sync is disabled.
    */
   tabSyncDisabled: function() {
     this.fetchingSyncedTabs_ = false;
     this.clearDisplayedSyncedDevices_();
   },
@@ skipping 429 matching lines @@
     return selectedPage;
   },
 
   /** @private */
   closeDrawer_: function() {
     var drawer = this.$$('#drawer');
     if (drawer)
       drawer.close();
   },
 });