The height of the subview being opened was supposedly calculated using an off-screen container independent from the currently displayed views, but this didn't work as expected because of the incorrect box alignment. This is now fixed and the correct minimum and maximum heights are set on the container separately, also preventing the current view from flickering before the transition in case the subview was taller.
With this issue fixed, the height can now be recalculated each time the subview is opened, without the caching that caused incorrect results when the same view was reopened with different elements or text.
Jumping could also occur because of a border applied only during the transition, which could influence the subview height in the presence of wrapping text.
MozReview-Commit-ID: EWHs1hFKXT4
In order to display the Library view sooner, the Recent Highlights section is populated asynchronously after the view is shown. When the Library button is moved to the overflow menu, this prevents the view height animation from including this section.
This can be worked around after the first time the view is opened, and is currently done by reusing the last known height. This logic causes issues with other subviews, but to fix this the Library view has to be changed to keep the existing highlight items while fetching the new ones.
MozReview-Commit-ID: AGs7nh4CsYE
The site security subview is now implemented using the "photonpanelmultiview" element, replacing the last instance of the "panelmultiview" element. The subview features a standard Photon header, hence the connection state icon was moved to the element below it. This makes the styles more similar between the main view and the subview. The connection state styles are now applied using a class name, and the tests have been updated accordingly.
This change required some fixes in the "photonpanelmultiview" implementation to make sure the height of the subview is correct and to allow keyboard navigation back to the main view.
Since the expander button and the permission controls in the main view are not visible anymore after the subview is shown, some code related to focus and hover could be removed as well.
MozReview-Commit-ID: 4nIAPWJPV8k
When the locale has a slightly longer label for 'Zoom', the popup auto-sizing
code starts having trouble with the inline start padding of that label and doesn't
size the popup correctly anymore.
When I change this to using a spacer element, this issue no longer occurs and the
label may become as large as localizers may need, as long as it doesn't exceed
the max-width of a panelview - 30em, currently.
MozReview-Commit-ID: CHRheMqazrj
mconley helped with the initial setup here and they were reviewed by myself (jaws). His changes have been folded in to this patch since they didn't work as a standalone changeset.
MozReview-Commit-ID: E7U1ZciJl4D
This moves the explanatory text from a pseudoelement to a real element,
and keeps only the image in a pseudoelement. It then uses a transitioned
opacity to fade that image in and out.
Because we need to fade this based on dragging items over the panel when
it's empty, it adds/removes a 'draggingover' attribute to handle the fade.
To cope with the extra element in the drag/drop container in customize mode,
this also makes the following changes:
- bail out of _onDragStart if there's no actual selected item.
- pick the fixed list in the panelHolder more reliably
- add a max-width to avoid the description making the panel wider
MozReview-Commit-ID: 9PEJSoJJ0Rp
* Harden the new `hideAllViewsExcept()` to not do erroneous things if called when
the binding is already gone.
* Generalize things into `hideAllViewsExcept(thisOne)`:
- Clear `_viewShowing` in there and do the descriptionHeightWorkaround thing
in there too,
- For Photon panels, do all the 'current' attribute setting in there. To show
a panel during transition, I introduced the 'in-transition' attribute.
* I had to make sure not to over-eagerly dispatch 'ViewShowing' events, because
that confuses some,
* Move the temporary panel handling, which contains an ephemeral panelmultiview
instance, internally. This cleans up the hacky, duplicate PanelUI.js code nicely.
* Keep a local copy of `_transitionDetails` to ensure it's still there after transition,
* Harden `_cleanupTransitionPhase()` to only clear the phase that belongs to a
specific transition, _if_ that's passed in as an argument. This resolves any
potential raciness that might occur when `showSubView()` is called again mid-transition.
* Skip the UITour element visibility check when it's inside a panelview, because
too many things need to happen and that check is too simple to be useful in
that case.
MozReview-Commit-ID: 5HpJKs1Ny5j
The margin rules for labels mean that if the See what's new link
starts its own line, the alignment looks off. We could override this,
but matching the styling for "Learn more" links, which get their own
line, seemed the better option.
MozReview-Commit-ID: 4WK9QtRMUQs
The highlight styling was recently added, causing update notification
buttons to both be styled as grey. This fixes that to style them as
blue again.
MozReview-Commit-ID: HDSA9NWBmIA
