Commit 62a3872f authored by Luciano Pacheco's avatar Luciano Pacheco Committed by Chromium LUCI CQ

Files app: Remove old progress center

The old progress center isn't in use any more. This CL removes the code
supporting it.

Remove the UI test that was testing the old progress center.

Change test transferFromDownloadsToDownloads() to check the new feedback
panel.

Bug: 1027012
Change-Id: Ifab607ecbeff9456181c5a3f9f3ed4b41c63b8c0
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2563528
Auto-Submit: Luciano Pacheco <lucmult@chromium.org>
Reviewed-by: default avatarAlex Danilo <adanilo@chromium.org>
Commit-Queue: Alex Danilo <adanilo@chromium.org>
Cr-Commit-Position: refs/heads/master@{#832090}
parent 2093b912
...@@ -120,12 +120,6 @@ body.files-ng .dialog-navigation-list { ...@@ -120,12 +120,6 @@ body.files-ng .dialog-navigation-list {
position: relative; position: relative;
} }
.dialog-navigation-list-footer {
display: flex;
flex: none;
flex-direction: column;
}
#directory-tree { #directory-tree {
bottom: 0; bottom: 0;
flex: none; flex: none;
...@@ -3531,203 +3525,6 @@ body:not(.files-ng) #tasks-menu { ...@@ -3531,203 +3525,6 @@ body:not(.files-ng) #tasks-menu {
min-height: calc(68px + 24px); min-height: calc(68px + 24px);
} }
/* Progress center */
@keyframes progress-center-toggle {
/* Height values of each frame are set by script.
* Keep the animation sync with JS. */
from {
}
to {
}
}
#progress-center {
background-color: transparent;
border-top: 1px solid rgb(214, 214, 214);
position: relative;
transition: background-color 300ms linear,
border 300ms linear;
}
#progress-center.animated {
animation: progress-center-toggle 300ms ease-out;
}
#progress-center-open-view {
max-height: 40vh;
opacity: 1;
overflow-y: auto;
padding-top: 10px;
transition: opacity 300ms linear;
}
#progress-center:not(.opened) #progress-center-open-view {
opacity: 0;
pointer-events: none;
position: absolute;
}
#progress-center-close-view {
opacity: 1;
padding-top: 20px;
transition: opacity 300ms linear;
}
#progress-center.opened #progress-center-close-view {
opacity: 0;
pointer-events: none;
position: absolute;
}
#progress-center.animated #progress-center-open-view,
#progress-center.animated #progress-center-close-view {
left: 0;
pointer-events: none;
position: absolute;
right: 0;
top: 0;
z-index: 1;
}
#progress-center li {
display: flex;
/* This must not be margin-bottom to calculate parent's height correctly. */
padding-bottom: 16px;
padding-inline-end: 12px;
}
#progress-center label {
color: rgb(76, 76, 76);
display: block;
font-weight: 500;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
#progress-center li.error.single label {
white-space: normal;
}
#progress-center .progress-frame {
flex: 1 0 0;
overflow: hidden;
padding-inline-end: 12px;
padding-inline-start: 16px;
}
#progress-center .progress-bar {
background: rgb(224, 224, 224);
border-radius: 2px;
display: inline-block;
height: 4px;
margin-bottom: 3px;
opacity: 1;
overflow: hidden;
width: 100%;
}
#progress-center li.error .progress-bar,
#progress-center-close-view.quiet .progress-bar {
display: none;
}
#progress-center .progress-track {
background: rgb(26, 194, 34);
height: 100%;
}
#progress-center .progress-track.animated {
transition: width 300ms linear;
}
#progress-center .button-frame {
align-self: flex-start;
flex: none;
}
#progress-center button {
border: none;
cursor: pointer;
display: inline-block;
height: 16px;
min-height: 0;
min-width: 0;
outline: none;
padding: 0;
vertical-align: middle;
width: 16px;
}
#progress-center button.close {
background: -webkit-image-set(
url(../images/files/ui/expand_more_active.png) 1x,
url(../images/files/ui/2x/expand_more_active.png) 2x)
no-repeat;
display: block;
margin-bottom: 20px;
margin-inline-end: 12px;
margin-inline-start: auto;
}
#progress-center button.open {
background: -webkit-image-set(
url(../images/files/ui/expand_less.png) 1x,
url(../images/files/ui/2x/expand_less.png) 2x)
no-repeat;
/* If progress bar exists, show open button at slighly higher position. */
margin-bottom: 14px;
}
#progress-center button.dismiss,
#progress-center button.cancel {
background: -webkit-image-set(
url(../images/files/ui/cancel.png) 1x,
url(../images/files/ui/2x/cancel.png) 2x)
no-repeat;
}
#progress-center li.error button.open,
#progress-center li.quiet button.open {
margin-bottom: 0;
}
#progress-center button.dismiss {
display: none;
}
/*
* Dismiss button is shown only when
* - Single error in close view.
* - Error items in open view.
*/
li#progress-center-close-view.error.single button.dismiss,
#progress-center-open-view li.error button.dismiss {
display: block;
}
#progress-center-close-view:not(.single) button.cancel {
display: none;
}
#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 {
display: none;
}
.text-measure {
pointer-events: none;
position: absolute;
top: 0;
visibility: hidden;
z-index: -1;
}
files-toggle-ripple { files-toggle-ripple {
bottom: 0; bottom: 0;
left: 0; left: 0;
......
...@@ -73,44 +73,6 @@ class ProgressCenterItemGroup { ...@@ -73,44 +73,6 @@ class ProgressCenterItemGroup {
this.totalProgressValue_ = 0; this.totalProgressValue_ = 0;
} }
/**
* Makes the summarized item for the groups.
*
* When a group has only error items, getSummarizedItem of the item returns
* null. Basically the first result of the groups that the progress center
* panel contains is used as a summarized item. But If all the group returns
* null, the progress center panel generates the summarized item by using the
* method.
*
* @param {...ProgressCenterItemGroup} var_args List of groups.
* @return {ProgressCenterItem} Summarized item.
*/
static getSummarizedErrorItem(var_args) {
const groups = Array.prototype.slice.call(arguments);
const errorItems = [];
for (let i = 0; i < groups.length; i++) {
for (const id in groups[i].items_) {
const item = groups[i].items_[id];
if (item.state === ProgressItemState.ERROR) {
errorItems.push(item);
}
}
}
if (errorItems.length === 0) {
return null;
}
if (errorItems.length === 1) {
return errorItems[0].clone();
}
const item = new ProgressCenterItem();
item.state = ProgressItemState.ERROR;
item.message = strf('ERROR_PROGRESS_SUMMARY_PLURAL', errorItems.length);
item.single = false;
return item;
}
/** /**
* @return {ProgressCenterItemGroup.State} State of the group. * @return {ProgressCenterItemGroup.State} State of the group.
*/ */
...@@ -118,19 +80,6 @@ class ProgressCenterItemGroup { ...@@ -118,19 +80,6 @@ class ProgressCenterItemGroup {
return this.state_; return this.state_;
} }
/**
* @return {number} Number of error items that the group contains.
*/
get numErrors() {
let result = 0;
for (const id in this.items_) {
if (this.items_[id].state === ProgressItemState.ERROR) {
result++;
}
}
return result;
}
/** /**
* Obtains the progressing (or completed but animated) item. * Obtains the progressing (or completed but animated) item.
* *
...@@ -150,14 +99,6 @@ class ProgressCenterItemGroup { ...@@ -150,14 +99,6 @@ class ProgressCenterItemGroup {
return !!this.animated_[id]; return !!this.animated_[id];
} }
/**
* Obtains whether the summarized item should be animated or not.
* @return {boolean} Whether the summarized item should be animated or not.
*/
isSummarizedAnimated() {
return this.summarizedItemAnimated_;
}
/** /**
* Dismisses an error item. * Dismisses an error item.
* @param {string} id Item id. * @param {string} id Item id.
......
...@@ -254,8 +254,7 @@ class FileManagerUI { ...@@ -254,8 +254,7 @@ class FileManagerUI {
* @type {!ProgressCenterPanel} * @type {!ProgressCenterPanel}
* @const * @const
*/ */
this.progressCenterPanel = new ProgressCenterPanel( this.progressCenterPanel = new ProgressCenterPanel();
queryRequiredElement('#progress-center', this.element));
/** /**
* Activity feedback panel. * Activity feedback panel.
...@@ -539,18 +538,6 @@ class FileManagerUI { ...@@ -539,18 +538,6 @@ class FileManagerUI {
util.queryDecoratedElement('#directory-tree-context-menu', cr.ui.Menu); util.queryDecoratedElement('#directory-tree-context-menu', cr.ui.Menu);
this.directoryTree.disabledContextMenu = this.directoryTree.disabledContextMenu =
util.queryDecoratedElement('#disabled-context-menu', cr.ui.Menu); util.queryDecoratedElement('#disabled-context-menu', cr.ui.Menu);
// Visible height of the directory tree depends on the size of progress
// center panel. When the size of progress center panel changes, directory
// tree has to be notified to adjust its components (e.g. progress bar).
const relayoutLimiter = new AsyncUtil.RateLimiter(
directoryTree.relayout.bind(directoryTree), 200);
const observer =
new MutationObserver(relayoutLimiter.run.bind(relayoutLimiter));
observer.observe(
this.progressCenterPanel.element,
/** @type {MutationObserverInit} */
({subtree: true, attributes: true, childList: true}));
} }
/** /**
......
...@@ -506,26 +506,6 @@ ...@@ -506,26 +506,6 @@
<div class="dialog-navigation-list-contents" role="navigation"> <div class="dialog-navigation-list-contents" role="navigation">
<tree id="directory-tree" role="tree" tabindex="0" files-ng></tree> <tree id="directory-tree" role="tree" tabindex="0" files-ng></tree>
</div> </div>
<div class="dialog-navigation-list-footer" hidden>
<div id="progress-center" hidden>
<li id="progress-center-close-view">
<div class="progress-frame">
<label></label>
<div class="progress-bar">
<div class="progress-track" hidden></div>
</div>
</div>
<div class="button-frame">
<button class="cancel" tabindex="-1"></button>
<button class="dismiss" tabindex="-1"></button>
<button class="open" tabindex="-1"></button>
</div>
</li>
<div id="progress-center-open-view">
<button class="close" tabindex="-1"></button>
</div>
</div>
</div>
</div> </div>
<div class="splitter" id="navigation-list-splitter"> <div class="splitter" id="navigation-list-splitter">
<cr-button aria-hidden="true" class="splitter-button" tabindex="-1"> <cr-button aria-hidden="true" class="splitter-button" tabindex="-1">
......
...@@ -25,7 +25,6 @@ action("create_test_main") { ...@@ -25,7 +25,6 @@ action("create_test_main") {
"crostini_tasks.js", "crostini_tasks.js",
"js/strings.js", "js/strings.js",
"menu.js", "menu.js",
"progress_center.js",
] ]
deps = [ "//ui/resources:webui_resources_grd" ] deps = [ "//ui/resources:webui_resources_grd" ]
args = [ "--output=" + rebase_path(output, root_build_dir) ] args = [ "--output=" + rebase_path(output, root_build_dir) ]
...@@ -41,7 +40,6 @@ js_type_check("closure_compile") { ...@@ -41,7 +40,6 @@ js_type_check("closure_compile") {
":crostini_tasks", ":crostini_tasks",
":menu", ":menu",
":plugin_vm", ":plugin_vm",
":progress_center",
] ]
} }
...@@ -56,7 +54,6 @@ js_library("closure_compile_externs") { ...@@ -56,7 +54,6 @@ js_library("closure_compile_externs") {
"$externs_path/metrics_private.js", "$externs_path/metrics_private.js",
"//ui/file_manager/externs/background/background_base.js", "//ui/file_manager/externs/background/background_base.js",
"//ui/file_manager/externs/background/progress_center.js", "//ui/file_manager/externs/background/progress_center.js",
"//ui/file_manager/externs/progress_center_panel.js",
"//ui/file_manager/externs/background/crostini.js", "//ui/file_manager/externs/background/crostini.js",
"//ui/file_manager/externs/entry_location.js", "//ui/file_manager/externs/entry_location.js",
"//ui/file_manager/externs/volume_info.js", "//ui/file_manager/externs/volume_info.js",
...@@ -106,11 +103,3 @@ js_library("plugin_vm") { ...@@ -106,11 +103,3 @@ js_library("plugin_vm") {
"//ui/webui/resources/js:webui_resource_test", "//ui/webui/resources/js:webui_resource_test",
] ]
} }
js_library("progress_center") {
deps = [
"js:test_util",
"//ui/file_manager/file_manager/common/js:progress_center_common",
"//ui/webui/resources/js:webui_resource_test",
]
}
// Copyright 2018 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.
const progressCenter = {};
/**
* @param {string} id
* @param {string} message
* @return {!ProgressCenterItem}
*/
progressCenter.createItem = function(id, message) {
const item = new ProgressCenterItem();
item.id = id;
item.message = message;
return item;
};
progressCenter.testScrollWhenManyMessages = async (done) => {
const visibleClosed = '#progress-center:not([hidden]):not(.opened)';
const visibleOpen = '#progress-center:not([hidden]).opened';
const openIcon = '#progress-center-close-view .open';
const navListFooter = '.dialog-navigation-list-footer';
const items = [];
const center = fileManager.fileBrowserBackground_.progressCenter;
// Load a single file.
await test.setupAndWaitUntilReady();
// Add lots of messages.
for (let i = 0; i < 100; i++) {
const item = progressCenter.createItem('id' + i, 'msg ' + i);
items.push(item);
center.updateItem(item);
}
// Wait for notification expand icon.
await test.waitForElement(visibleClosed);
// Click open icon, ensure progress center is open.
assertTrue(test.fakeMouseClick(openIcon));
await test.waitForElement(visibleOpen);
// Ensure progress center is scrollable.
const footer = document.querySelector(navListFooter);
assertTrue(footer.scrollHeight > footer.clientHeight);
// Clear items.
items.forEach((item) => {
item.state = ProgressItemState.COMPLETED;
center.updateItem(item);
});
done();
};
...@@ -487,9 +487,11 @@ testcase.transferFromDownloadsToDownloads = async () => { ...@@ -487,9 +487,11 @@ testcase.transferFromDownloadsToDownloads = async () => {
destination: TRANSFER_LOCATIONS.downloads, destination: TRANSFER_LOCATIONS.downloads,
isMove: true, isMove: true,
})); }));
chrome.test.assertEq(
'', // Check: No feedback panel items.
(await remoteCall.waitForElement(appId, '.progress-frame label')).text); const panelItems = await remoteCall.callRemoteTestUtil(
'deepQueryAllElements', appId, [['#progress-panel', '#panel']]);
chrome.test.assertEq(0, panelItems.length);
}; };
/** /**
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment