New issue
Advanced search Search tips
Note: Color blocks (like █ or █) mean that a user may not be available. Tooltip shows the reason.

Issue 610609 link

Starred by 3 users
Status: Fixed
Owner:
█ tsergeant@chromium.org
Not on Chrome
Closed: Jul 2016
Cc:
calamity@chromium.org
dbeam@chromium.org
bettes@chromium.org
dpa...@chromium.org
Components:
EstimatedDays: ----
NextAction: ----
OS: ----
Pri: 2
Type: Bug

Blocking:
issue 609536



Sign in to add a comment

MD WebUI: Add shared <cr-toolbar> element

Project Member Reported by tsergeant@chromium.org, May 10 2016 
The latest design revision for material webui pages iterates on the search field and integrates it much more tightly with the rest of the toolbar.

We want to create a shared toolbar element which implements the features of the search field and toolbar in one element.

Comment 1 by tsergeant@chromium.org, May 12 2016

Cc: bettes@chromium.org
The initial implementation is very nearly ready for code review, here are a selection of screenshots (and a gif!)
history-wide-no-search.png
74.0 KB View Download
history-thin-no-search.png
58.0 KB View Download
history-wide-search.png
61.1 KB View Download
history-thin-search.png
48.5 KB View Download
search-field-anim.gif
603 KB View Download

Comment 2 by dbeam@chromium.org, May 12 2016 

i haven't had amazing experiences with kitchen sink elements (they end up all swiss army knife-y from each consumer's requirements), but hopefully this one bucks the norm!
Project Member

Comment 3 by bugdroid1@chromium.org, May 26 2016 

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/66d8b689e6e5e4a8f2b74430e0680e459021c5b8

commit 66d8b689e6e5e4a8f2b74430e0680e459021c5b8
Author: tsergeant <tsergeant@chromium.org>
Date: Thu May 26 04:08:10 2016

MD WebUI: Add shared cr-toolbar element

The toolbar currently contains the page name and a search field, which
reuses the implementation of the existing <cr-search-field> element. The
toolbar has some responsive behavior and basic animations. This is
sufficient to allow us to replace some of the internals of
<history-toolbar> with a <cr-toolbar>.

The two main features which still need to be implemented are a menu
button in the thin layout, and a spinner when a search is in progress.

BUG= 610609 
CQ_INCLUDE_TRYBOTS=tryserver.chromium.linux:closure_compilation

Review-Url: https://codereview.chromium.org/1963503002
Cr-Commit-Position: refs/heads/master@{#396115}

[modify] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/chrome/app/generated_resources.grd
[modify] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/chrome/browser/resources/md_history/compiled_resources2.gyp
[modify] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/chrome/browser/resources/md_history/history_toolbar.html
[modify] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/chrome/browser/resources/md_history/history_toolbar.js
[modify] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/chrome/browser/ui/webui/md_history_ui.cc
[modify] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/chrome/test/data/webui/md_history/history_toolbar_test.js
[modify] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/ui/webui/resources/cr_elements/cr_search_field/compiled_resources2.gyp
[modify] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/ui/webui/resources/cr_elements/cr_search_field/cr_search_field.css
[modify] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/ui/webui/resources/cr_elements/cr_search_field/cr_search_field.html
[modify] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/ui/webui/resources/cr_elements/cr_search_field/cr_search_field.js
[add] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/ui/webui/resources/cr_elements/cr_search_field/cr_search_field_behavior.html
[add] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/ui/webui/resources/cr_elements/cr_search_field/cr_search_field_behavior.js
[add] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/ui/webui/resources/cr_elements/cr_toolbar/compiled_resources2.gyp
[add] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar.html
[add] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar.js
[add] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar_search_field.html
[add] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar_search_field.js
[modify] https://crrev.com/66d8b689e6e5e4a8f2b74430e0680e459021c5b8/ui/webui/resources/cr_elements_resources.grdp
Project Member

Comment 5 by bugdroid1@chromium.org, Jun 8 2016 

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/99778ce52abf223bd279c42669a9d9049f0f9fdf

commit 99778ce52abf223bd279c42669a9d9049f0f9fdf
Author: tsergeant <tsergeant@chromium.org>
Date: Wed Jun 08 04:08:15 2016

MD WebUI: Add loading spinner to cr-toolbar, hook into MD History toolbar

Adds a processing spinner which is visible when the search bar is open,
and hooks it into MD History so that it is shown when loading data from
a search. It is not shown when incrementally loading new data in the
infinite list.

BUG= 610609 
CQ_INCLUDE_TRYBOTS=tryserver.chromium.linux:closure_compilation

Review-Url: https://codereview.chromium.org/2032313002
Cr-Commit-Position: refs/heads/master@{#398476}

[modify] https://crrev.com/99778ce52abf223bd279c42669a9d9049f0f9fdf/chrome/browser/resources/md_history/app.html
[modify] https://crrev.com/99778ce52abf223bd279c42669a9d9049f0f9fdf/chrome/browser/resources/md_history/app.js
[modify] https://crrev.com/99778ce52abf223bd279c42669a9d9049f0f9fdf/chrome/browser/resources/md_history/history_toolbar.html
[modify] https://crrev.com/99778ce52abf223bd279c42669a9d9049f0f9fdf/chrome/browser/resources/md_history/history_toolbar.js
[modify] https://crrev.com/99778ce52abf223bd279c42669a9d9049f0f9fdf/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar.html
[modify] https://crrev.com/99778ce52abf223bd279c42669a9d9049f0f9fdf/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar.js
[modify] https://crrev.com/99778ce52abf223bd279c42669a9d9049f0f9fdf/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar_search_field.html
[modify] https://crrev.com/99778ce52abf223bd279c42669a9d9049f0f9fdf/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar_search_field.js
Project Member

Comment 6 by bugdroid1@chromium.org, Jul 15 2016 

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/1ce950b1dfba435c8671b75c82bd2256a0718533

commit 1ce950b1dfba435c8671b75c82bd2256a0718533
Author: tsergeant <tsergeant@chromium.org>
Date: Fri Jul 15 02:28:00 2016

MD WebUI: Center search field correctly inside cr-toolbar

This changes the behavior of the search field so that it no longer
expands on open in wide windows. This makes it possible to center the
search field inside the toolbar. Also tweaks the open/close animation
for the toolbar in narrow mode to be smoother.

BUG= 610609 
CQ_INCLUDE_TRYBOTS=tryserver.chromium.linux:closure_compilation;master.tryserver.chromium.linux:closure_compilation

Review-Url: https://codereview.chromium.org/2140943002
Cr-Commit-Position: refs/heads/master@{#405681}

[modify] https://crrev.com/1ce950b1dfba435c8671b75c82bd2256a0718533/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar.html
[modify] https://crrev.com/1ce950b1dfba435c8671b75c82bd2256a0718533/ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar_search_field.html

Comment 7 by tsergeant@chromium.org, Jul 15 2016

Status: Fixed (was: Started)
I think all the main feature work here is done, so I'm closing this bug.
►

Sign in to add a comment