Missing personal toolbar when expanding the horizontal toolbar #950

hvelarde · 2015-09-11T14:50:56Z

The toolbar with icons only:

The toolbar expanded with legends; the user icon is missing:

vangheem · 2015-09-11T15:40:16Z

ichim-david · 2015-09-11T18:54:52Z

It's not missing, it's just moved to the bottom below the toolbar.
At least with plone 5.0rc I can still see faintly the white text.
I am checking the css to see if I can easily fix it.

On a side note what a frustrating way to find out how to change the toolbar from left to top.
I tried to search google how to change the pattern and the best that I got was code talk such as this
plone/plone.app.layout@176bdca
where I had to go in configuration resources and change the option from the side to the top as modifying the class to use in viewlets/toolbar.pt didn't make any difference ( turns out the classes need to be added on the body).

hvelarde · 2015-09-11T19:15:59Z

@ichim-david there's an option on the Site control panel configlet for that.

pbauer · 2015-09-13T12:25:29Z

@ichim-david that is http://localhost:8080/Plone/@@site-controlpanel

- Add content views from right to left to options subset until personal toolbar fits on the same line as the other menus - Cleaned hideElements of duplicated selectors - Take into consideration that you could go from a width that can't fit the toolbar to a view that is even smaller. This happens when using a Samsung galaxy 10 resolution of 1280x800. On german translation both resolutions can't display fully the toolbar however on the smaller size we need to hide even more items as such moving also the content views and not only the content menus

ichim-david · 2015-09-13T21:27:39Z

I have started working on this issue within a branch as can be seen within the referenced commit.
Basically in order for the personal toolbar to always remain visible and on the toolbar we need
to move also content views which I chose to move from right to left as can be seen from the following screenshot:

I still have some small cleaning up to do and to add some comments to the changed code but it is already a lot cleaner that it was before.

I am still surprised though that 1280px can't fully display the toolbar using the German translation and
I think we should fix this even if we need to lower some of the padding and/or font size.
EDIT:
here is a screenshot to prove that by default Plone can't show all of the info. This is because even though we might have larger resolutions the max width will always be 1200 and right now it doesn't fit all of the actions

- moveViewsToSubset now has a clearer condition name for the moving of the view to the subset - run the hideElements action when clicking on the toobar logo to expand the toolbar. If it needs to resize it will, otherwise nothing will happen

ichim-david · 2015-09-14T05:52:07Z

Found more issues when the more options is clicked and you contract the toolbar, the more-options move back to the toolbar however they don't have enough room to display the text and the popup is displaced.
See screenshot:

Still better that what was before but the whole more button selected action I will need to check.
For starters if I contract or expand I think the more options should be hidden.

hvelarde · 2015-09-14T13:40:03Z

@ichim-david thanks, for taking care of this; there is something else that seems weird to me: why the name of the menu item appears duplicated on all menus?

bloodbare · 2015-09-14T14:12:01Z

Hey,

We implemented some solution to fit the toolbar on horizontal in a rush some weeks ago: the more button. Its not perfect, neither nice, but we saw that it's impossible to make it fit in 1200px the menu with texts.

The code is there :
https://github.com/plone/Products.CMFPlone/blob/master/Products/CMFPlone/static/patterns/toolbar/src/toolbar.js#L219

The problem was that the calculations were not acurate and there were a bunch of container sizes where it was miscalculated.

It's great somebody is taking care of it!

ichim-david · 2015-09-14T19:25:35Z

@hvelarde this is the way it was coded, if you look at plone.app.contentmenu
or plone.app.layout and search for plone-toolbar-submenu-header you will find it present as a submenu.

I think it might be too late to get rid of them as a design decision now but you could easily hide them with this css line
.plone-toolbar-submenu-header:first-child { display: none;}
it is normally found in toolbar.plone.less from CMFPlone.

If others agree with your assessment they can easily be removed.

- jQuery offset returns strange results when zooming as appose to normal offsetTop which we use to calculate whether the personal toolbar is moved - Move only the views that are not already hidden avoiding thus duplications if there is more than one view to move to the more section

davilima6 · 2015-09-16T18:33:21Z

I agree menu titles shouldn't be repeated. I think that was useful when "More options" toolbar icon brought both Portlet management and Display menu links. But that should be another issue.

hvelarde · 2015-09-16T18:34:20Z

I opened a new issue for that: #1007

- Properly set the active class on the toolbar menu list item when clicking on the more link - Fixed case where the more button lost it's active class when clicking on the children content menus. - Clicking on the body now hides also the opened more sublist - Fixed a case where the more sublist remained opened even when you were clicking on the white portal-header area because the nav bar expands in height to fit the sublist even though it's black styling remains at 50px - Fixed an issue where clicking on the sublist content menus removed the active class from the more link

- Menus are now closed when switching from expanded to contracted and back - Clicking the personal bar link now closes the subset menu as well - Fixed the position of the subset menus when collapsed by removing the hardcoded value of 105px from toolbar.plone.less

- Add content views from right to left to options subset until personal toolbar fits on the same line as the other menus - Cleaned hideElements of duplicated selectors - Take into consideration that you could go from a width that can't fit the toolbar to a view that is even smaller. This happens when using a Samsung galaxy 10 resolution of 1280x800. On german translation both resolutions can't display fully the toolbar however on the smaller size we need to hide even more items as such moving also the content views and not only the content menus

- moveViewsToSubset now has a clearer condition name for the moving of the view to the subset - run the hideElements action when clicking on the toobar logo to expand the toolbar. If it needs to resize it will, otherwise nothing will happen

- jQuery offset returns strange results when zooming as appose to normal offsetTop which we use to calculate whether the personal toolbar is moved - Move only the views that are not already hidden avoiding thus duplications if there is more than one view to move to the more section

- Properly set the active class on the toolbar menu list item when clicking on the more link - Fixed case where the more button lost it's active class when clicking on the children content menus. - Clicking on the body now hides also the opened more sublist - Fixed a case where the more sublist remained opened even when you were clicking on the white portal-header area because the nav bar expands in height to fit the sublist even though it's black styling remains at 50px - Fixed an issue where clicking on the sublist content menus removed the active class from the more link

- Menus are now closed when switching from expanded to contracted and back - Clicking the personal bar link now closes the subset menu as well - Fixed the position of the subset menus when collapsed by removing the hardcoded value of 105px from toolbar.plone.less

ichim-david · 2015-09-16T21:29:57Z

I've added a pull request fixing this issue and a couple of other issues as well.
I wanted to add a jenkins build but it seems I don't have permissions.

hvelarde · 2015-09-17T13:33:41Z

I already added it.

- Add content views from right to left to options subset until personal toolbar fits on the same line as the other menus - Cleaned hideElements of duplicated selectors - Take into consideration that you could go from a width that can't fit the toolbar to a view that is even smaller. This happens when using a Samsung galaxy 10 resolution of 1280x800. On german translation both resolutions can't display fully the toolbar however on the smaller size we need to hide even more items as such moving also the content views and not only the content menus

- moveViewsToSubset now has a clearer condition name for the moving of the view to the subset - run the hideElements action when clicking on the toobar logo to expand the toolbar. If it needs to resize it will, otherwise nothing will happen

- jQuery offset returns strange results when zooming as appose to normal offsetTop which we use to calculate whether the personal toolbar is moved - Move only the views that are not already hidden avoiding thus duplications if there is more than one view to move to the more section

- Properly set the active class on the toolbar menu list item when clicking on the more link - Fixed case where the more button lost it's active class when clicking on the children content menus. - Clicking on the body now hides also the opened more sublist - Fixed a case where the more sublist remained opened even when you were clicking on the white portal-header area because the nav bar expands in height to fit the sublist even though it's black styling remains at 50px - Fixed an issue where clicking on the sublist content menus removed the active class from the more link

- Menus are now closed when switching from expanded to contracted and back - Clicking the personal bar link now closes the subset menu as well - Fixed the position of the subset menus when collapsed by removing the hardcoded value of 105px from toolbar.plone.less

…ribes better the use of the method

ichim-david · 2015-09-17T18:34:56Z

Fixes committed to CMFPlone from pull request #1009
A new commit will need to be done to compile plone resources otherwise you will get the fixes only
when in devel mode.
I can't do this now since I've upgraded to node 4.0 and plone-compile-resources script fails with it.
@hvelarde maybe you can update the plone compiled resources.

hvelarde · 2015-10-02T13:28:29Z

This is still happening in Plone 5.0 final; I'm going to open another issue describing it with more details.

hvelarde added the 01 type: bug label Sep 11, 2015

hvelarde added this to the Plone 5.0 milestone Sep 11, 2015

hvelarde mentioned this issue Sep 11, 2015

Toolbar issues #957

Open

19 tasks

ichim-david self-assigned this Sep 13, 2015

ichim-david mentioned this issue Sep 16, 2015

Issues when toggling from collapsed to expanded #1002

Closed

ichim-david mentioned this issue Sep 16, 2015

Duplicated menu item on toolbars #1007

Closed

ichim-david added a commit that referenced this issue Sep 16, 2015

Refs #950; rebased commits and added changes entry

b1532a7

ichim-david added a commit that referenced this issue Sep 17, 2015

Refs #950; fix condition for adding views to subset

6053718

ichim-david added a commit that referenced this issue Sep 17, 2015

Refs #950; move hiding of more-subset out of list loop

2fe86b4

ichim-david added a commit that referenced this issue Sep 17, 2015

Refs #950 remove jQuery call from filter to avoid extra search

783ff83

ichim-david added a commit that referenced this issue Sep 17, 2015

Refs #950 rename moveViewsToSubset to cloneViewsIntoSubset which desc…

ba6d7f5

…ribes better the use of the method

ichim-david added a commit that referenced this issue Sep 17, 2015

Refs #950 added Changes.rst entry

d836a77

ichim-david closed this as completed Sep 17, 2015

hvelarde mentioned this issue Oct 2, 2015

Horizontal toolbar breaks when expanding/collapsing #1128

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Missing personal toolbar when expanding the horizontal toolbar #950

Missing personal toolbar when expanding the horizontal toolbar #950

hvelarde commented Sep 11, 2015

vangheem commented Sep 11, 2015

ichim-david commented Sep 11, 2015

hvelarde commented Sep 11, 2015

pbauer commented Sep 13, 2015

ichim-david commented Sep 13, 2015

ichim-david commented Sep 14, 2015

hvelarde commented Sep 14, 2015

bloodbare commented Sep 14, 2015

ichim-david commented Sep 14, 2015

davilima6 commented Sep 16, 2015

hvelarde commented Sep 16, 2015

ichim-david commented Sep 16, 2015

hvelarde commented Sep 17, 2015

ichim-david commented Sep 17, 2015

hvelarde commented Oct 2, 2015

Missing personal toolbar when expanding the horizontal toolbar #950

Missing personal toolbar when expanding the horizontal toolbar #950

Comments

hvelarde commented Sep 11, 2015

vangheem commented Sep 11, 2015

ichim-david commented Sep 11, 2015

hvelarde commented Sep 11, 2015

pbauer commented Sep 13, 2015

ichim-david commented Sep 13, 2015

ichim-david commented Sep 14, 2015

hvelarde commented Sep 14, 2015

bloodbare commented Sep 14, 2015

ichim-david commented Sep 14, 2015

davilima6 commented Sep 16, 2015

hvelarde commented Sep 16, 2015

ichim-david commented Sep 16, 2015

hvelarde commented Sep 17, 2015

ichim-david commented Sep 17, 2015

hvelarde commented Oct 2, 2015