From ef2e8483ccaeee5a1e185e4e8d4b4697588a838b Mon Sep 17 00:00:00 2001 From: Naoki Fukino Date: Thu, 13 Jul 2017 08:10:41 +0000 Subject: [PATCH] Files app: Add share options menu on toolbar. This CL to divide tasks to open tasks and other tasks. open tasks: Files app internal tasks and file_hander tasks with OPEN_WITH verb. other tasks: all other tasks. The OPEN combubutton should have only open tasks, and the new option menu should have the other tasks. The new option menu has share icon as most of tasks should be SHARE_WITH tasks, but other kind of tasks (e.g. PACK_WITH) can also be included. Existing share{_white}.png was renamed as person_add{_white}.png and the new icon for share button was named as share{_white}.png, to be consistent with the naming in go/icons. Bug: 740819 Change-Id: Ic5e82aed490af9372e300c5153b5a384b6656464 Reviewed-on: https://chromium-review.googlesource.com/567917 Reviewed-by: Tatsuhisa Yamaguchi Commit-Queue: Naoki Fukino Cr-Commit-Position: refs/heads/master@{#486316} --- chrome/app/chromeos_strings.grdp | 3 + .../file_manager/private_api_strings.cc | 1 + .../foreground/css/file_manager.css | 18 +++- .../images/files/ui/2x/person_add.png | Bin 0 -> 527 bytes .../images/files/ui/2x/person_add_white.png | Bin 0 -> 386 bytes .../foreground/images/files/ui/2x/share.png | Bin 527 -> 791 bytes .../images/files/ui/2x/share_white.png | Bin 386 -> 530 bytes .../foreground/images/files/ui/person_add.png | Bin 0 -> 371 bytes .../images/files/ui/person_add_white.png | Bin 0 -> 280 bytes .../foreground/images/files/ui/share.png | Bin 371 -> 415 bytes .../images/files/ui/share_white.png | Bin 280 -> 288 bytes .../file_manager/foreground/js/file_tasks.js | 102 ++++++++++++++---- .../foreground/js/task_controller.js | 94 ++++++++-------- .../foreground/js/task_controller_unittest.js | 15 ++- .../foreground/js/ui/file_manager_ui.js | 17 +++ ui/file_manager/file_manager/main.html | 12 +++ 16 files changed, 184 insertions(+), 78 deletions(-) create mode 100644 ui/file_manager/file_manager/foreground/images/files/ui/2x/person_add.png create mode 100644 ui/file_manager/file_manager/foreground/images/files/ui/2x/person_add_white.png create mode 100644 ui/file_manager/file_manager/foreground/images/files/ui/person_add.png create mode 100644 ui/file_manager/file_manager/foreground/images/files/ui/person_add_white.png diff --git a/chrome/app/chromeos_strings.grdp b/chrome/app/chromeos_strings.grdp index 596c2fbaa12879..f0552d6f97348f 100644 --- a/chrome/app/chromeos_strings.grdp +++ b/chrome/app/chromeos_strings.grdp @@ -1166,6 +1166,9 @@ Press any key to continue exploring. Thumbnail view + + Share options + Sort options diff --git a/chrome/browser/chromeos/extensions/file_manager/private_api_strings.cc b/chrome/browser/chromeos/extensions/file_manager/private_api_strings.cc index 337a792bef2472..8d09be358893e2 100644 --- a/chrome/browser/chromeos/extensions/file_manager/private_api_strings.cc +++ b/chrome/browser/chromeos/extensions/file_manager/private_api_strings.cc @@ -499,6 +499,7 @@ ExtensionFunction::ResponseAction FileManagerPrivateGetStringsFunction::Run() { SET_STRING("FORMATTING_WARNING", IDS_FILE_BROWSER_FORMATTING_WARNING); SET_STRING("FORMAT_DEVICE_BUTTON_LABEL", IDS_FILE_BROWSER_FORMAT_DEVICE_BUTTON_LABEL); + SET_STRING("SHARE_BUTTON_TOOLTIP", IDS_FILE_BROWSER_SHARE_BUTTON_TOOLTIP); SET_STRING("SORT_BUTTON_TOOLTIP", IDS_FILE_BROWSER_SORT_BUTTON_TOOLTIP); SET_STRING("GEAR_BUTTON_TOOLTIP", IDS_FILE_BROWSER_GEAR_BUTTON_TOOLTIP); SET_STRING("GET_INFO_BUTTON_LABEL", IDS_FILE_BROWSER_GET_INFO_BUTTON_LABEL); diff --git a/ui/file_manager/file_manager/foreground/css/file_manager.css b/ui/file_manager/file_manager/foreground/css/file_manager.css index aeecf068d77e26..f45347efb796e4 100644 --- a/ui/file_manager/file_manager/foreground/css/file_manager.css +++ b/ui/file_manager/file_manager/foreground/css/file_manager.css @@ -351,18 +351,30 @@ body.check-select #search-button > .icon { url(../images/files/ui/2x/search.png) 2x); } -#share-button > .icon { +#share-menu-button > .icon { background-image: -webkit-image-set( url(../images/files/ui/share_white.png) 1x, url(../images/files/ui/2x/share_white.png) 2x); } -body.check-select #share-button > .icon { +body.check-select #share-menu-button > .icon { background-image: -webkit-image-set( url(../images/files/ui/share.png) 1x, url(../images/files/ui/2x/share.png) 2x); } +#share-button > .icon { + background-image: -webkit-image-set( + url(../images/files/ui/person_add_white.png) 1x, + url(../images/files/ui/2x/person_add_white.png) 2x); +} + +body.check-select #share-button > .icon { + background-image: -webkit-image-set( + url(../images/files/ui/person_add.png) 1x, + url(../images/files/ui/2x/person_add.png) 2x); +} + #delete-button > .icon { background-image: -webkit-image-set( url(../images/files/ui/delete_white.png) 1x, @@ -1627,6 +1639,7 @@ body.check-select #list-container list li[selected] .detail-thumbnail opacity: 0; } +#share-menu cr-menu-item, #tasks-menu cr-menu-item:not(.change-default) { background-position: left 10px center; padding-left: 32px; @@ -1915,6 +1928,7 @@ list.autocomplete-suggestions > [lead] { } #gear-menu, +#share-menu, #sort-menu, #tasks-menu { margin-top: 2px; diff --git a/ui/file_manager/file_manager/foreground/images/files/ui/2x/person_add.png b/ui/file_manager/file_manager/foreground/images/files/ui/2x/person_add.png new file mode 100644 index 0000000000000000000000000000000000000000..15539408413f64d95e48375ff6a97cf3436375f5 GIT binary patch literal 527 zcmV+q0`UEbP)Px$$w@>(R9Fe^R=-QbKoo8ghc1Gko9-?FL0l{1A}(T=CJlo4KiEmATbKGj2qI~d zrQ#xPVpnm>;_j&6*d>YItGN=IKA-p(_Um*SAa5xs>8zKjhz1?nKAn^@k6TZtNw1%9TrWpo7z$Kwn0ou8)>rY6k zL-Iz1vB#@KQD7ceMu%N?pyXlbiBBe$DR{xmr*H=NwC9BmFo=8#2{?`ulkmXHuoV)J z0jJY0@)P-}66k|K#32#Ub>!H&2Z$FpwbAKDf-YY2NKo=F?*>A4U+jZSp%#;Nl ztyXK-FpP6{;Hd1hb5U}NUt%CCv+w)Qh$ks;{EAyp#&(rjU|H5SdVhp|H$aBI1#1bZ z56o{k6XP%p?>*0ZP4t;*VFJx&bG2Tt(}6ny+6EzFJrBGN1<5`LUZS1vAbC5POs+Px$JV``BR9Fe^l`(DtF%U%|;RfUm>C;0?7jYjBz9iV@ny z_81$9!Xtfo8UOh+9`7upQMKBE+JOQcXxnxM8gTfBo@WK5;}RrVfnU(KGmceUA%j5z zom`20roG2?0&%rEW=+N!!=Yr>oyY7DQhD)hI#u6(DZjS>V}h-LXW5$odS=n-952W zhfKQkf%g;WbNde7fb0mq!3H$k+81k@`K|!}6s*DCaSW@tikYTW(PJa91SfE>DR$YD zwf!V;0dD>6rWPZOg)Qq9i=bU{{v|EhuCV#V+kEA>_Za(n4Kq5gb~fXw)T5rUw@c=w8ve}*h z_FLgWc^^3uXXbMpN$dGVyM+q8B-tOnR%;>TILYcnpxC(_)|kD`wl7 zD}e5vu2d?Y(SPlW1P+iNpm$~<=w1Z^f#(*zS<$T=i^WEo&E^vPr}Q-%=8WI(Ur41= z-$J3#9mv-JjJ&kXQmOP(_cKh=$1ssd45_M0rJhA3FGT~$7N&c}V(~r6GDDa^I2^u+ zAd8?05czE24A0|>uLJBE!2dKG_^+UOob5bjs(|#cB!58Q0QiVV=lN&=XhY9>rVe@8 z=kq;Dr_(=qKUrRM3h2uX;1raB19;8j@yum1nO#{hk-sQ`36Z0&`;L9S)xj=pVkMPc zXx9Q!0-GIzpF@wV;>HVf@R2h8^(M4b0DF9ZMpHm5AUbA8#N!xV#;47YjMF*GkMKr};eDWsO9O2b z3WXiEmY;i0fCa%npeg*(pf_QJbO57^=?%8!Hi@Le(40=^GLm?3ES~(jPT1bKa=E-4 z3^S)DJ>*D3KgJa)x1h0&chaDG*cx%CVs8HiOCb1hU!e x7j*n2Q1&>aJ<^el)AgUlU2%!1|49Eb!f(>_6b$EF{38GW002ovPDHLkV1km>c@6*o delta 501 zcmVYX?x^6{C5hjwxe}V>?#g9RbMSJP z_v3rty?58NR;xx;f&X3st&9TLw%yP)tpnL1yf}_uApPNRIDZ!58zKjhz1?nKAn^@k z6TZtNw1%9TrWpo7z$Kwn0ou8)>rY6kL-Iz1vB#@KQD7ceMu%N?pyXlbiBBe$DR{xm zr*H=NwC9BmFo=8#2{?`ulkmXHuoV)J0jJY0@)P-}66k|K#32#Ub>!H&2Z$FpwbAKD zf-YY2NKo=F?|%jm$m|-*_S<#cS_6 rfVuL&Cq_MuB~5?@S94W?KUaZow~&&Jo+cbb00000NkvXXu0mjfQT6K2 diff --git a/ui/file_manager/file_manager/foreground/images/files/ui/2x/share_white.png b/ui/file_manager/file_manager/foreground/images/files/ui/2x/share_white.png index 0f2a111ffa349dbb41b39c03f9659e7824410d1b..fc26f3c516b8278f20de08c2d9b7c12858ba4ad9 100644 GIT binary patch delta 504 zcmVY2{b?x}%Sw77G0000V4e5Je&32ILOu(?d%a zaUTxAefA2pkUljM6%rQ+*}T7s5!%J}7#oSgBYk-p|M@c>?<}KHwc3H&fdU<9+ja&T zaQKIwX9c9=5+quIU(mNRj#XSCgFynFT#0<9y~lL|akV;TO@GE2!=Yr>oyY7DQhD)h zI#u6(DZjS>V}h-LXW5$odS=n-952WhfKQkf%g;WbNde7fb0mq!3H$k+81k@`K|!} z6s*DCaSW@tieQPx$ElET{R5%gUQL$>mP!u)6f^@LS-YH8yAQUI-DEWerP+gt7TAak$*;OPVUl1G} zrQ`?NlBs*BQz4LePUwU8L>q@Lz3}qRJ@=lQd+%$t{=I2U6ZpPALC)+aZyrU_O4j^Z z!1KHZUDx*-jG_uwmSr!F<5y8c7vS6t@uLtkP7JOu=PCt)AgJUZ@Y{(`_g&`d)?C-^ zk~B^8E6?*g;v`89xHRlwjUPXe!vq`bU`$A#R(D_+#s?1x8N;n07!^ff@eq?^o-k#J z93c!tg>xL|#yZ{TXnG(;;Wu_BYNJqb$+Qj-2v0 z5;TZkaLu{(nmGCJIYG@(WTCu*$b)WrNz5F^U{m6=1;F1j*kIS>G?e&@@DY(bSvk2W Rn_BPx#(n&-?R5%gckueU!Knw(P2pW*+pyv@OAB=`m`I9+`0>a1m;V|)|7@6;*} zJ&nD2gghFqA$R~=i7~|ejo#NoJV)0B`63=dSVm1otEe4KvpkNCW>}~AMfH#-HY`s6 zVRbJv@OdA+06TC87UI&1-m(`MsDS@{l&w&&(oXAxmL_t(I5o2JW5HJ#}KOrGO;?JKy zWgzt|EG%6M7A$xHW)o|`@87>y{r~^p7Nj1?HUUz0AT|?-AOsp38rXoE&5_jU!`K83 zh>eZ)x^?T;6`+PMFik*uHjIrk4C3PA)PR2OXJllw1=`-k!+*mw@%#7hMj(xg7cV{u zGk^ugh>ni-1hQv=_&^Q2ftsU$nwPV(vZ}!X3@8QH2vP?Ea07tsSwM|4U{MB!IABOy zEn2kb6qJvXA{YiZbwVYWVG8v0^lkv1Y!AerfOx~dfB*V`V#>zG#wRaaxPTmhFfCx3 zs6Yf7*sP+WGJWy(?b|9$OicfQfp{He3QhxH3P92L_wV0+AfF$I#X;ggL#mf7S<(h( zg9v;8Xxlb5H8owJ8a9|ZU|?s$*hB>)FeUy1YB&PZ1T^40jEx+PFfpt&8yj03Fc0K` iB!OvT5>`dz2m%20*>rK33W@vx0000oqB!2;OQb$4nuFf3k0003kNkl^|9!1eg*8Ez)^SlRL*Y_HXq6$`)Wq&V@<5y8c7vS6t@uLtk zP7JOu=PCt)AgJUZ@Y{(`_g&`d)?C-^k~B^8E6?*g;v`89xHRlwjUPXe!vq`bU`$A# zR(D_+#s?1x8N;n07!^ff@eq?^o-k#J93c!tg>xL|#yZ{TXnG(@`O3+x9ok7NacD&5oS%Hxe|6UvSO2^_n>O@Hs)vP-LOJg2;nzdP&S2 q#$Z$8vjxE4GT30(}_nU(^v%+3l$;0g&kOyO?J~b@R*s*{26wVB>%Fyu2a|; z($0Gk79du18h~m5Z&Bm#GN30xlczbOc7~_bv$JA=Y_y#RFU3~58tYx5Md=tL!)G7}>jlFq}~AMfH#-HY`s6VRbJv@OdA+06TC87UI&1-m(`MsDS@{l&w&& z(oXAxm} tasks + */ +FileTasks.prototype.updateOpenComboButton_ = function(combobutton, tasks) { + combobutton.hidden = tasks.length == 0; + if (tasks.length == 0) + return; combobutton.clear(); - combobutton.hidden = false; // If there exist defaultTask show it on the combobutton. if (this.defaultTask_) { - combobutton.defaultItem = this.createCombobuttonItem_(this.defaultTask_, - str('TASK_OPEN')); + combobutton.defaultItem = + this.createCombobuttonItem_(this.defaultTask_, str('TASK_OPEN')); } else { combobutton.defaultItem = { type: FileTasks.TaskMenuButtonItemType.ShowMenu, @@ -687,7 +718,7 @@ FileTasks.prototype.display = function(combobutton) { // If there exist 2 or more available tasks, show them in context menu // (including defaultTask). If only one generic task is available, we // also show it in the context menu. - var items = this.createItems_(); + var items = this.createItems_(tasks); if (items.length > 1 || (items.length === 1 && this.defaultTask_ === null)) { for (var j = 0; j < items.length; j++) { combobutton.addDropDownItem(items[j]); @@ -706,19 +737,43 @@ FileTasks.prototype.display = function(combobutton) { } }; +/** + * Setup a menu button for sharing options based on the given tasks. + * @param {!cr.ui.MenuButton} shareMenuButton + * @param {!Array} tasks + */ +FileTasks.prototype.updateShareMenuButton_ = function(shareMenuButton, tasks) { + shareMenuButton.hidden = tasks.length == 0; + if (tasks.length == 0) + return; + + shareMenuButton.menu.clear(); + var items = this.createItems_(tasks); + for (var i = 0; i < items.length; i++) { + var menuitem = shareMenuButton.menu.addMenuItem(items[i]); + cr.ui.decorate(menuitem, cr.ui.FilesMenuItem); + menuitem.data = items[i]; + if (items[i].iconType) { + menuitem.style.backgroundImage = ''; + menuitem.setAttribute('file-type-icon', items[i].iconType); + } + } +}; + /** * Creates sorted array of available task descriptions such as title and icon. * + * @param {!Array} tasks Tasks to create items. * @return {!Array} Created array can be used to feed combobox, menus * and so on. * @private */ -FileTasks.prototype.createItems_ = function() { +FileTasks.prototype.createItems_ = function(tasks) { var items = []; // Create items. - for (var index = 0; index < this.tasks_.length; index++) { - var task = this.tasks_[index]; + for (var index = 0; index < tasks.length; index++) { + var task = tasks[index]; if (task === this.defaultTask_) { var title = task.title + ' ' + loadTimeData.getString('DEFAULT_TASK_LABEL'); @@ -781,16 +836,17 @@ FileTasks.prototype.createCombobuttonItem_ = function(task, opt_title, * @param {string} title Title to use. * @param {string} message Message to use. * @param {function(Object)} onSuccess Callback to pass selected task. - * @param {boolean=} opt_hideGenericFileHandler Whether to hide generic file - * handler or not. + * @param {boolean=} opt_forChangeDefault Whether to return items which are for + * change-default dialog. */ -FileTasks.prototype.showTaskPicker = function(taskDialog, title, message, - onSuccess, - opt_hideGenericFileHandler) { - var items = !opt_hideGenericFileHandler ? this.createItems_() : - this.createItems_().filter(function(item) { - return !item.isGenericFileHandler; - }); +FileTasks.prototype.showTaskPicker = function( + taskDialog, title, message, onSuccess, opt_forChangeDefault) { + var items = !opt_forChangeDefault ? + this.createItems_(this.tasks_) : + this.createItems_(this.tasks_.filter(FileTasks.isOpenTask)) + .filter(function(item) { + return !item.isGenericFileHandler; + }); var defaultIdx = 0; for (var j = 0; j < items.length; j++) { diff --git a/ui/file_manager/file_manager/foreground/js/task_controller.js b/ui/file_manager/file_manager/foreground/js/task_controller.js index dba35e620a14a0..ff34eb6cc6669d 100644 --- a/ui/file_manager/file_manager/foreground/js/task_controller.js +++ b/ui/file_manager/file_manager/foreground/js/task_controller.js @@ -104,6 +104,8 @@ function TaskController( ui.taskMenuButton.addEventListener( 'select', this.onTaskItemClicked_.bind(this)); + ui.shareMenuButton.menu.addEventListener( + 'activate', this.onTaskItemClicked_.bind(this)); this.selectionHandler_.addEventListener( FileSelectionHandler.EventType.CHANGE, this.onSelectionChanged_.bind(this)); @@ -146,51 +148,54 @@ TaskController.createTemporaryDisabledTaskItem_ = function() { * @private */ TaskController.prototype.onTaskItemClicked_ = function(event) { + // 'select' event from ComboButton has the item as event.item. + // 'activate' event from cr.ui.MenuButton has the item as event.target.data. + var item = event.item || event.target.data; this.getFileTasks() - .then(function(tasks) { - switch (event.item.type) { - case FileTasks.TaskMenuButtonItemType.ShowMenu: - this.ui_.taskMenuButton.showMenu(false); - break; - case FileTasks.TaskMenuButtonItemType.RunTask: - tasks.execute(event.item.task.taskId); - break; - case FileTasks.TaskMenuButtonItemType.ChangeDefaultTask: - var selection = this.selectionHandler_.selection; - var extensions = []; - - for (var i = 0; i < selection.entries.length; i++) { - var match = /\.(\w+)$/g.exec(selection.entries[i].toURL()); - if (match) { - var ext = match[1].toUpperCase(); - if (extensions.indexOf(ext) == -1) { - extensions.push(ext); + .then(function(tasks) { + switch (item.type) { + case FileTasks.TaskMenuButtonItemType.ShowMenu: + this.ui_.taskMenuButton.showMenu(false); + break; + case FileTasks.TaskMenuButtonItemType.RunTask: + tasks.execute(item.task.taskId); + break; + case FileTasks.TaskMenuButtonItemType.ChangeDefaultTask: + var selection = this.selectionHandler_.selection; + var extensions = []; + + for (var i = 0; i < selection.entries.length; i++) { + var match = /\.(\w+)$/g.exec(selection.entries[i].toURL()); + if (match) { + var ext = match[1].toUpperCase(); + if (extensions.indexOf(ext) == -1) { + extensions.push(ext); + } } } - } - - var format = ''; - - if (extensions.length == 1) { - format = extensions[0]; - } - - // Change default was clicked. We should open "change default" dialog. - tasks.showTaskPicker( - this.ui_.defaultTaskPicker, - loadTimeData.getString('CHANGE_DEFAULT_MENU_ITEM'), - strf('CHANGE_DEFAULT_CAPTION', format), - this.changeDefaultTask_.bind(this, selection), - true); - break; - default: - assertNotReached('Unknown task.'); - } - }.bind(this)) - .catch(function(error) { - if (error) - console.error(error.stack || error); - }); + + var format = ''; + + if (extensions.length == 1) { + format = extensions[0]; + } + + // Change default was clicked. We should open "change default" + // dialog. + tasks.showTaskPicker( + this.ui_.defaultTaskPicker, + loadTimeData.getString('CHANGE_DEFAULT_MENU_ITEM'), + strf('CHANGE_DEFAULT_CAPTION', format), + this.changeDefaultTask_.bind(this, selection), true); + break; + default: + assertNotReached('Unknown task.'); + } + }.bind(this)) + .catch(function(error) { + if (error) + console.error(error.stack || error); + }); }; /** @@ -218,7 +223,7 @@ TaskController.prototype.changeDefaultTask_ = function(selection, task) { this.tasks_ = null; this.getFileTasks() .then(function(tasks) { - tasks.display(this.ui_.taskMenuButton); + tasks.display(this.ui_.taskMenuButton, this.ui_.shareMenuButton); }.bind(this)) .catch(function(error) { if (error) @@ -303,7 +308,7 @@ TaskController.prototype.updateTasks_ = function() { (selection.directoryCount > 0 || selection.fileCount > 0)) { this.getFileTasks() .then(function(tasks) { - tasks.display(this.ui_.taskMenuButton); + tasks.display(this.ui_.taskMenuButton, this.ui_.shareMenuButton); this.updateContextMenuTaskItems_(tasks.getTaskItems()); }.bind(this)) .catch(function(error) { @@ -312,6 +317,7 @@ TaskController.prototype.updateTasks_ = function() { }); } else { this.ui_.taskMenuButton.hidden = true; + this.ui_.shareMenuButton.hidden = true; } }; diff --git a/ui/file_manager/file_manager/foreground/js/task_controller_unittest.js b/ui/file_manager/file_manager/foreground/js/task_controller_unittest.js index bd2d0f338634ff..393c5399a8aaba 100644 --- a/ui/file_manager/file_manager/foreground/js/task_controller_unittest.js +++ b/ui/file_manager/file_manager/foreground/js/task_controller_unittest.js @@ -44,8 +44,7 @@ function testExecuteEntryTask(callback) { fileSystem.entries['/test.png'] = new MockFileEntry(fileSystem, '/test.png', {}); var controller = new TaskController( - DialogType.FULL_PAGE, - { + DialogType.FULL_PAGE, { getDriveConnectionState: function() { return VolumeManagerCommon.DriveConnectionType.ONLINE; }, @@ -57,14 +56,11 @@ function testExecuteEntryTask(callback) { }, { taskMenuButton: document.createElement('button'), - fileContextMenu: { - defaultActionMenuItem: document.createElement('div') - } + shareMenuButton: {menu: document.createElement('div')}, + fileContextMenu: + {defaultActionMenuItem: document.createElement('div')} }, - new MockMetadataModel({}), - {}, - new cr.EventTarget(), - null); + new MockMetadataModel({}), {}, new cr.EventTarget(), null); controller.executeEntryTask(fileSystem.entries['/test.png']); reportPromise(new Promise(function(fulfill) { @@ -119,6 +115,7 @@ function createTaskController(selectionHandler) { return new TaskController( DialogType.FULL_PAGE, {}, { taskMenuButton: document.createElement('button'), + shareMenuButton: {menu: document.createElement('div')}, fileContextMenu: {defaultActionMenuItem: document.createElement('div')} }, diff --git a/ui/file_manager/file_manager/foreground/js/ui/file_manager_ui.js b/ui/file_manager/file_manager/foreground/js/ui/file_manager_ui.js index 06f54f2cb0824c..1369f731084ebb 100644 --- a/ui/file_manager/file_manager/foreground/js/ui/file_manager_ui.js +++ b/ui/file_manager/file_manager/foreground/js/ui/file_manager_ui.js @@ -280,6 +280,23 @@ function FileManagerUI(providersModel, element, launchParam) { cr.ui.ComboButton.prototype.showMenu.call(this, shouldSetFocus); }; + /** + * The menu button for share options + * @type {!cr.ui.MenuButton} + * @const + */ + this.shareMenuButton = + util.queryDecoratedElement('#share-menu-button', cr.ui.MenuButton); + var shareMenuButtonToggleRipple = + /** @type {!FilesToggleRipple} */ ( + queryRequiredElement('files-toggle-ripple', this.shareMenuButton)); + this.shareMenuButton.addEventListener('menushow', function() { + shareMenuButtonToggleRipple.activated = true; + }); + this.shareMenuButton.addEventListener('menuhide', function() { + shareMenuButtonToggleRipple.activated = false; + }); + /** * Banners in the file list. * @type {Banners} diff --git a/ui/file_manager/file_manager/main.html b/ui/file_manager/file_manager/main.html index 218dd29f8df0f8..ca9b12bd722c9a 100644 --- a/ui/file_manager/file_manager/main.html +++ b/ui/file_manager/file_manager/main.html @@ -260,6 +260,10 @@ menu-item-selector="cr-menu-item, hr"> + + + @@ -288,6 +292,14 @@ tabindex="10" hidden i18n-values="aria-label:TASKS_BUTTON_LABEL"> +