Opened 11 years ago

Closed 11 years ago

#9769 closed Bug (fixed)

Horizontal scroll on Webkits when floating toolbar doesn't fit in viewport

Reported by: Piotrek Koszuliński Owned by: Olek Nowodziński
Priority: Normal Milestone: CKEditor 4.0.1
Component: UI : Toolbar Version: 4.0
Keywords: Webkit Cc:

Description (last modified by Piotrek Koszuliński)

On FF toolbar is resized to fit. In fact this isn't perfect solution too, because toolbar layout is changed (and therefore is different than for editor in left/right column), what may be confusing for users and doesn't look very well. I think that it should be aligned to right/left side of the viewport.

Attachments (3)

chrome_scroll.png (117.0 KB) - added by Piotrek Koszuliński 11 years ago.
chrome_toolbar.png (106.2 KB) - added by Piotrek Koszuliński 11 years ago.
floatingspacePinModeXpos.ogv (1.4 MB) - added by Olek Nowodziński 11 years ago.

Download all attachments as: .zip

Change History (14)

Changed 11 years ago by Piotrek Koszuliński

Attachment: chrome_scroll.png added

comment:1 Changed 11 years ago by Piotrek Koszuliński

Description: modified (diff)

comment:2 Changed 11 years ago by Frederico Caldeira Knabben

Status: newconfirmed

Correct. It should touch the right side of the viewport, but not cross it.

comment:3 Changed 11 years ago by Olek Nowodziński

Owner: set to Olek Nowodziński
Status: confirmedassigned

comment:4 Changed 11 years ago by Olek Nowodziński

Status: assignedreview

Proposed the t/9769 fix for all browsers that keeps the floating space visible for as long as possible when scaling-down the window by attaching it to the opposite side of the viewport.

I also revisited and commented existing code since tapeworms like this:

var newLeft = alignSide == 'left' ? ( editorRect.left > 0 ? editorRect.left : 0 ) : ( editorRect.right < viewRect.width ? viewRect.width - editorRect.right : 0 );

are nothing like a extendable and understandable code.

comment:5 Changed 11 years ago by Piotrek Koszuliński

Status: reviewreview_failed

Toolbar opens outside the left border of the viewport. See screenshot.

Second issue - there's a difference between Chrome and FF (and probably other browsers). When viewport.width < toolbar.width on FF toolbar is resized, but on Chrome toolbar stays wide and is displayed outside right border (but it's reachable). We have to make a decision how that should work. Both options have pros and cons...

Changed 11 years ago by Piotrek Koszuliński

Attachment: chrome_toolbar.png added

comment:6 in reply to:  5 Changed 11 years ago by Frederico Caldeira Knabben

Replying to Reinmar:

Toolbar opens outside the left border of the viewport.

I agree... it should not cross the left boundary.

Second issue - there's a difference between Chrome and FF (and probably other browsers). When viewport.width < toolbar.width on FF toolbar is resized, but on Chrome toolbar stays wide and is displayed outside right border (but it's reachable). We have to make a decision how that should work. Both options have pros and cons...

That's another issue which should not block this ticket. For now, KISS and let's get focused on the position.

Changed 11 years ago by Olek Nowodziński

comment:7 Changed 11 years ago by Olek Nowodziński

Status: review_failedreview

comment:8 Changed 11 years ago by Olek Nowodziński

Extracted floating space resize issue to separate ticket #9832.

comment:9 Changed 11 years ago by Piotrek Koszuliński

Status: reviewreview_passed

comment:10 Changed 11 years ago by Olek Nowodziński

Rebased branch to the latest master.

comment:11 Changed 11 years ago by Olek Nowodziński

Resolution: fixed
Status: review_passedclosed
Note: See TracTickets for help on using tickets.
© 2003 – 2022, CKSource sp. z o.o. sp.k. All rights reserved. | Terms of use | Privacy policy