Files.app: Show details of drive sync progress.

 * Show the open button of progress center if it shows drive sync item.
 * If the progress center panel is opened, we show the progress bar for the drive sync item.

BUG=450630
TEST=FileManagerJsTest.ProgressCenterItemGroupTest

Review URL: https://codereview.chromium.org/1009313004

Cr-Commit-Position: refs/heads/master@{#321548}

ui/file_manager/file_manager/foreground/css/file_manager.css

@@ -1922,7 +1922,7 @@ list.autocomplete-suggestions > [lead] {
 }
 
 #progress-center li.error .progress-bar,
-#progress-center li.quiet .progress-bar {
+#progress-center-close-view.quiet .progress-bar {
   display: none;
 }
 
@@ -1993,10 +1993,11 @@ list.autocomplete-suggestions > [lead] {
   display: none;
 }
 
-#progress-center-close-view.single button.open {
+#progress-center-close-view.single:not(.quiet) button.open {
   display: none;
 }
 
+#progress-center-close-view.quiet button.cancel,
 #progress-center li:not(.cancelable) button.cancel {
   visibility: hidden;
 }

ui/file_manager/file_manager/foreground/js/progress_center_item_group.js

@@ -130,17 +130,25 @@ ProgressCenterItemGroup.getSummarizedErrorItem = function(var_args) {
 };
 
 /**
- * Obtains Whether the item should be animated or not.
+ * Obtains whether the item should be animated or not.
  * @param {boolean} previousAnimated Whether the item is previously animated or
  *     not.
  * @param {ProgressCenterItem} previousItem Item before updating.
  * @param {ProgressCenterItem} item New item.
+ * @param {boolean} summarized If the item is summarized one or not.
  * @return {boolean} Whether the item should be animated or not.
  * @private
  */
 ProgressCenterItemGroup.shouldAnimate_ = function(
-    previousAnimated, previousItem, item) {
-  if (!previousItem || !item || previousItem.quiet || item.quiet)
+    previousAnimated, previousItem, item, summarized) {
+  // Check visibility of previous and current progress bar.
+  var previousShow =
+      previousItem && (!summarized || !previousItem.quiet);
+  var currentShow =
+      item && (!summarized || !item.quiet);
+  // If previous or current item does not show progress bar, we should not
+  // animate.
+  if (!previousShow || !currentShow)
     return false;
   if (previousItem.progressRateInPercent < item.progressRateInPercent)
     return true;
@@ -233,7 +241,8 @@ ProgressCenterItemGroup.prototype.update = function(item) {
       this.animated_[item.id] = ProgressCenterItemGroup.shouldAnimate_(
           !!this.animated_[item.id],
           previousItem,
-          item);
+          item,
+          /* summarized */ false);
       if (!this.animated_[item.id])
         this.completeItemAnimation(item.id);
       break;
@@ -253,7 +262,8 @@ ProgressCenterItemGroup.prototype.update = function(item) {
   this.summarizedItemAnimated_ = ProgressCenterItemGroup.shouldAnimate_(
       !!this.summarizedItemAnimated_,
       previousSummarizedItem,
-      this.summarizedItem_);
+      this.summarizedItem_,
+      /* summarized */ true);
   if (!this.summarizedItemAnimated_)
     this.completeSummarizedItemAnimation();
 };

ui/file_manager/file_manager/foreground/js/progress_center_item_group_unittest.js

@@ -3,29 +3,17 @@
 // found in the LICENSE file.
 'use strict';
 
-/**
- * Test target.
- * @type {ProgressCenterItemGroup}
- */
-var group;
-
-/**
- * Set up before each test.
- */
-function setUp() {
-  // Prepare the string assets.
-  loadTimeData.data = {
-    COPY_PROGRESS_SUMMARY: 'Copying...',
-    ERROR_PROGRESS_SUMMARY: '1 Error.',
-    ERROR_PROGRESS_SUMMARY_PLURAL: '$1 Errors.'
-  };
-
-  // Make the test target.
-  group = new ProgressCenterItemGroup();
-  assertEquals(ProgressCenterItemGroup.State.EMPTY, group.state);
-}
+// Prepare the string assets.
+loadTimeData.data = {
+  COPY_PROGRESS_SUMMARY: 'Copying...',
+  ERROR_PROGRESS_SUMMARY: '1 Error.',
+  ERROR_PROGRESS_SUMMARY_PLURAL: '$1 Errors.'
+};
 
 function testSimpleProgress() {
+  var group = new ProgressCenterItemGroup(/* name */ 'test', /* quite */ false);
+  assertEquals(ProgressCenterItemGroup.State.EMPTY, group.state);
+
   var item = new ProgressCenterItem();
   item.id = 'test-item-1';
   item.message = 'TestItemMessage1';
@@ -73,6 +61,7 @@ function testSimpleProgress() {
 }
 
 function testCompleteAnimationDuringProgress() {
+  var group = new ProgressCenterItemGroup(/* name */ 'test', /* quite */ false);
   var item = new ProgressCenterItem();
   item.id = 'test-item-1';
   item.message = 'TestItemMessage1';
@@ -134,6 +123,7 @@ function testCompleteAnimationDuringProgress() {
 }
 
 function testAddMaxProgressItem() {
+  var group = new ProgressCenterItemGroup(/* name */ 'test', /* quite */ false);
   var item = new ProgressCenterItem();
   item.id = 'test-item-1';
   item.message = 'TestItemMessage1';
@@ -161,6 +151,7 @@ function testAddMaxProgressItem() {
 }
 
 function testCompleteDuringAnimation() {
+  var group = new ProgressCenterItemGroup(/* name */ 'test', /* quite */ false);
   var item = new ProgressCenterItem();
   item.id = 'test-item-1';
   item.message = 'TestItemMessage1';
@@ -197,6 +188,7 @@ function testCompleteDuringAnimation() {
 }
 
 function testTwoItems() {
+  var group = new ProgressCenterItemGroup(/* name */ 'test', /* quite */ false);
   var item1 = new ProgressCenterItem();
   item1.id = 'test-item-1';
   item1.message = 'TestItemMessage1';
@@ -286,6 +278,7 @@ function testTwoItems() {
 }
 
 function testOneError() {
+  var group = new ProgressCenterItemGroup(/* name */ 'test', /* quite */ false);
   var item = new ProgressCenterItem();
   item.id = 'test-item-1';
   item.message = 'TestItemMessage1';
@@ -310,6 +303,7 @@ function testOneError() {
 }
 
 function testOneItemWithError() {
+  var group = new ProgressCenterItemGroup(/* name */ 'test', /* quite */ false);
   var item1 = new ProgressCenterItem();
   item1.id = 'test-item-1';
   item1.message = 'TestItemMessage1';
@@ -385,6 +379,7 @@ function testOneItemWithError() {
 }
 
 function testOneItemWithErrorDuringAnimation() {
+  var group = new ProgressCenterItemGroup(/* name */ 'test', /* quite */ false);
   var item1 = new ProgressCenterItem();
   item1.id = 'test-item-1';
   item1.message = 'TestItemMessage1';
@@ -427,6 +422,7 @@ function testOneItemWithErrorDuringAnimation() {
 }
 
 function testTwoErrors() {
+  var group = new ProgressCenterItemGroup(/* name */ 'test', /* quite */ false);
   var item1 = new ProgressCenterItem();
   item1.id = 'test-item-1';
   item1.message = 'Error message 1';
@@ -458,6 +454,7 @@ function testTwoErrors() {
 }
 
 function testCancel() {
+  var group = new ProgressCenterItemGroup(/* name */ 'test', /* quite */ false);
   var item = new ProgressCenterItem();
   item.id = 'test-item-1';
   item.message = 'TestItemMessage1';
@@ -484,6 +481,7 @@ function testCancel() {
 }
 
 function testCancelWithError() {
+  var group = new ProgressCenterItemGroup(/* name */ 'test', /* quite */ false);
   var item1 = new ProgressCenterItem();
   item1.id = 'test-item-1';
   item1.message = 'TestItemMessage1';
@@ -521,3 +519,48 @@ function testCancelWithError() {
                ProgressCenterItemGroup.getSummarizedErrorItem(group).message);
   assertEquals(ProgressCenterItemGroup.State.INACTIVE, group.state);
 }
+
+function testQuietItem() {
+  var group = new ProgressCenterItemGroup(/* name */ 'test', /* quite */ true);
+  var item = new ProgressCenterItem();
+  item.id = 'test-item-1';
+  item.message = 'TestItemMessage1';
+  item.state = ProgressItemState.PROGRESSING;
+  item.progressMax = 1.0;
+  item.quiet = true;
+
+  // Add an item.
+  group.update(item);
+  assertFalse(group.isAnimated(item.id));
+  assertFalse(group.isSummarizedAnimated());
+  assertEquals(ProgressCenterItemGroup.State.ACTIVE, group.state);
+
+  // Start an animation of the item.
+  item.progressValue = 0.5;
+  group.update(item, 0);
+  assertTrue(group.isAnimated(item.id));
+  // Summarized item should not animated because the panel does not show
+  // progress bar for quiet and summarized item.
+  assertFalse(group.isSummarizedAnimated());
+  assertEquals(0.5, group.getItem(item.id).progressValue);
+  assertEquals(0.5, group.getSummarizedItem(0).progressValue);
+  assertEquals(ProgressCenterItemGroup.State.ACTIVE, group.state);
+
+  // Item is completed, but the animation is still on going.
+  item.progressValue = 1.0;
+  item.state = ProgressItemState.COMPLETED;
+  group.update(item, 0);
+  assertTrue(group.isAnimated(item.id));
+  assertFalse(group.isSummarizedAnimated());
+  assertEquals(100, group.getItem(item.id).progressRateInPercent);
+  assertEquals(100, group.getSummarizedItem(0).progressRateInPercent);
+  assertEquals(ProgressCenterItemGroup.State.ACTIVE, group.state);
+
+  // The animation of the item is completed.
+  group.completeItemAnimation(item.id);
+  assertFalse(group.isAnimated(item.id));
+  assertFalse(group.isSummarizedAnimated());
+  assertEquals(null, group.getItem(item.id));
+  assertFalse(!!group.getSummarizedItem(0));
+  assertEquals(ProgressCenterItemGroup.State.EMPTY, group.state);
+}