Fixed international composition issues (e.g., Japanese Input method) by lepidum · Pull Request #999 · ether/etherpad

lepidum · 2012-09-14T07:32:22Z

This change fixed issue during international composition(e.g., Japanese input method).

Issue :

Input method receives interrupt and breaking the state under input, when received changesets from server during Japanese input.

Changes :

moved inInternationalComposition from Ace2Inner to top window.
enabled bindTheEventHandlers() on IE9.
while inInternationalComposition is true, 'NEW_CHANGES' and 'ACCEPT_COMMIT' messages are pushed to msgQueue. when called handleUserChanges(), apply messages from msgQueue.

We're tested by the following browsers.

Internet Explorer 9
Firefox 15.0.1
Google Chrome 21.0.1180.89 (Official Build 154005)

moved inInternationalComposition from Ace2Inner to top window fix bindTheEventHandlers() because ie9 implement CompositionEvent when inInternationalComposition, NEW_CHANGES msg and ACCEPT_COMMIT msg are pushed msgQueue. when handleUserChanges(), apply msgQueue.

Fixed international composition issues (e.g., Japanese Input method)

JohnMcLear · 2012-09-14T11:25:14Z

Tested Ok, good job :)

Fixed international composition issues (e.g., Japanese Input method)

JohnMcLear · 2012-10-03T00:43:25Z

@lepidum can you please look at the bug this introduced? #1032

JohnMcLear · 2012-10-09T21:50:11Z

@lepidum I'm going to revert this change if it isn't resolve w/ in 48 hours.

lepidum · 2012-10-10T03:00:48Z

Sorry for this late reply.

The problem will be caused by our change.

We're trying to fix this problem, but we have not good idea.
(some quick-hack are available. but not tested widely & not good ideas)

Please wait a little more.

scanferla · 2012-10-10T17:39:18Z

Please tell me what's the quick-hack is, as my Etherpad Lite it's running on production and Firefox users can't use it at all...

Thanks in advance!

Edit: For now, I've reverted the specific commit. Will it cause any other prolblems?

lepidum · 2012-10-11T03:53:45Z

@scanferla

In production environment, I would like to recommend you to revert our commit for a while.

Because our change is not required for users who do not enter anything other than US-ASCII.
And my 'quick-hack' is not quick in fact. :(

I think that other problems are not caused by revert.

Best regards,

Pita · 2012-10-11T08:56:01Z

why does this have to be a global?

There is no special reason. We're trying to fix.

fixed by https://github.com/Pita/etherpad-lite/pull/1059

lepidum · 2012-10-11T16:19:44Z

We have finished fix #1032 .

Tested at
Internet Explorer 9.0.8112.16421
Firefox 16
Firefox Aurora 17.0a2 2012-10-08
Google Chrome 22.0.1229.94
Google Chrome Beta 24.0.1290.1

We are preparing the pull request now.
Just a moment...

JohnMcLear · 2012-10-11T16:20:41Z

Great news @marcelklehr Congrats @lepidum looking forward, we might even bump to 1.1.5 today.. Damn our eagerness to release.

lepidum · 2012-10-11T16:23:05Z

I have requested.
see: https://github.com/Pita/etherpad-lite/pull/1059

When "Disable chat" is ticked in the Settings dialog, refreshMyViewControls() already sets `disabled` on `#options-stickychat` and `#options-chatandusers`, but the browser only greys the checkbox itself — the adjacent `<label>` keeps its normal colour, so the row still looks interactive even though clicks are no-ops. Add a popup-scoped rule that follows the existing convention used for disabled `.nice-select` controls (`color: ether#999; cursor: not-allowed`) so any disabled checkbox or radio in a settings popup matches its label to the disabled state. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

#7593) (#7597) * fix(userlist): stop username input from overlapping the Log out button Fixes #7593. In the pad's Users popup, #myusernameform had no width set and the <input id="myusernameedit"> inside it took its natural content width, pushing past the Log out button and making the button overflow the popup at common widths. Constrain #myusernameform to 75px and make the input fill its container with box-sizing: border-box so the text field stays inside the form and the Log out button sits visibly next to it rather than getting covered or clipped off-screen. Low-risk, CSS-only change. No test plan beyond visual verification because the affected control is in the users popup UI. * fix(chat): bottom-align titlebar controls; restore chat icon click (#7590) Two regressions from the #7584 a11y refactor of the chat widget, both pure-CSS fixes scoped to the chat panel. 1. Title bar — `<a>` → `<button>` for #titlecross/#titlesticky kept the `float: right` layout, but a `<button>`'s box is only as tall as its glyph, so the small `−` and `█` controls floated at the *top* of the 44px title bar instead of sitting on the title's baseline as the anchors did. Switch #titlebar to a flex row with `align-items: flex-end`, give #titlelabel `flex: 1` to push the controls to the right edge, and use `order: 1/2` to keep the historical visual order `[█] [−]` (which `float: right` previously produced from reverse source order). 2. Chat-icon corner widget — `<div>` → `<button id="chaticon">` exposes the inner `<span class="buttonicon">` to the global `.buttonicon` rule's `display: flex; position: relative; align-items/justify-content: center;`. The existing override only reset `display`, leaving the span as a positioned flex item that, in some layouts, sat over the button's hit surface and swallowed clicks. Reset the remaining flex properties and add `pointer-events: none` so clicks always reach the `<button>`'s own click handler — preferred over weakening the global .buttonicon rule, which the toolbar relies on for icon centring. Visual-only / behaviour-fix, no markup or JS changes. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(settings): grey disabled chat option labels (#7592) When "Disable chat" is ticked in the Settings dialog, refreshMyViewControls() already sets `disabled` on `#options-stickychat` and `#options-chatandusers`, but the browser only greys the checkbox itself — the adjacent `<label>` keeps its normal colour, so the row still looks interactive even though clicks are no-ops. Add a popup-scoped rule that follows the existing convention used for disabled `.nice-select` controls (`color: #999; cursor: not-allowed`) so any disabled checkbox or radio in a settings popup matches its label to the disabled state. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * revert(userlist): drop username input width cap (#7593 review) The width:75px on #myusernameform and width:100%/box-sizing on #myusernameedit from a55436c were guarding against an overlap with a "Log out" button — but no Log out button exists in vanilla etherpad-lite (the original report came from a setup with a plugin that adds one). Without that button visible, the cap just makes the default username field unnecessarily narrow. Restore #myusernameform to just `margin-left: 10px` and drop the forced width on the input. If the overlap reappears in a real plugin setup it should be re-fixed there (or with a more targeted rule that only kicks in when a logout button is actually present). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(chat): keep titlesticky at top of title bar (#7590 review) The previous pass bottom-aligned both corner controls via align-items: flex-end on #titlebar. That correctly placed the close button (#titlecross) on the title's baseline, but it also dragged the much smaller "stick to screen" button (#titlesticky) down to the same baseline — visibly far below where it sat in the original layout. Switch to per-control align-self so each lands where it should: - #titlesticky → align-self: flex-start (top, where it always was) - #titlecross → align-self: flex-end (bottom, on the title's baseline) - #titlelabel → align-self: center (don't stretch the heading) Drop align-items from #titlebar so the defaults don't override these. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * revert(chat): restore original #titlebar layout (#7590 review) Both attempted CSS layouts for the title bar (full flex with align-items: flex-end, then per-control align-self) ended up looking worse than the original in review. Drop all the #titlebar / #titlelabel / #titlecross / #titlesticky changes from 905294d and f37da9a and restore the pre-existing float-based layout. The chat panel ships with its original visuals; we'll revisit #7590 separately if needed. Keeps the chat-icon click fix from 905294d (#chaticon .buttonicon flex/pointer-events reset) and the focus-visible additions for the title-bar buttons. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(chat): clear inline display:none in chat.show() When the user disables chat in settings, applyShowChat(false) calls \`$('#chatbox').hide()\` which sets the chatbox's inline display to \`none\`. Re-enabling chat doesn't undo that — it only re-shows the icon. Then clicking the icon runs chat.show(), which adds the \`.visible\` class but only flips visibility, not display, so the chatbox stays hidden by the lingering inline style and the chat appears not to open. Clear the inline display in chat.show() before adding the .visible class so the box becomes visible regardless of how it got hidden. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(colibris): align username gap; grey unchecked-disabled toggles users.css: change #myusernameform margin-left from 35px to 10px to match the base popup_users.css. The 35px value was chosen for the sticky chatAndUsers layout, but for the standalone Users popup it opens an unnecessarily wide gap between the colour swatch and the username field. (#7593 review) form.css: drop the \`:checked\` qualifier from the disabled toggle visual rule so unchecked-but-disabled toggles also dim. Without this, "Chat always on screen" / "Show Chat and Users" stayed fully bright when "Disable chat" was ticked even though the underlying inputs were disabled. Fixes #7592 in the colibris skin. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(chat): simple flex titlebar — CHAT _ [] Single flex row, vertically centred via align-items: center. Title takes the remaining width with flex: 1; the two corner controls fall in at the right edge in source order (titlecross then titlesticky), giving the intended visual: minus on the left, sticky on the right. Drops `float: right` from the controls, `display: inline` from the heading, and the prior `padding-top: 2px` hack on titlesticky (flex alignment handles the vertical position now). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(chat): titlebar uses underscore for minimize; symmetric padding - Replace \`−\` with \`_\` in #titlecross. The minus glyph sits at the centre of its em-box and read as a hyphen mid-row when the row was vertically centred; \`_\` sits at the bottom of its em-box and reads as a proper minimize indicator. - Even out #titlebar horizontal padding to 9px and drop the asymmetric \`margin-left: 4px\` on #titlelabel so CHAT on the left and the sticky button on the right are the same distance from the bar's edges. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(chat): lift #titlecross underscore 5px The \`_\` glyph renders at the bottom of its em-box, so even with the title bar's flex \`align-items: center\` it sits noticeably below the CHAT baseline. Lift it with \`transform: translateY(-5px)\` (doesn't affect flex layout calculations) so the underscore reads at roughly the same vertical line as the title. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * test(chat): cover #7590 / #7592 / #7593 fixes Adds Playwright frontend specs for the changes in this PR: chat.spec.ts - chat icon click reveals chatbox after disable→enable cycle (regression: chat.show() must clear inline display:none) - title bar lays out as a centred flex row with underscore minimize (covers display, align-items, label flex:1, no float, translateY lift, and visual padding symmetry via rendered geometry) - chat icon click reliably opens the chat box (#chaticon .buttonicon pointer/flex reset) pad_settings.spec.ts - disabling chat disables and visually greys the dependent chat toggles (#7592 — checks input :disabled state and label opacity) change_user_name.spec.ts - #myusernameform has 10px left margin and is not width-capped (#7593 review — colibris margin alignment, no input width cap) Padding symmetry asserted via rendered rect deltas rather than the CSS literal, since colibris ships its own #titlebar padding override. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

nagoya-y and others added 2 commits September 13, 2012 23:37

Merge pull request #2 from ayokura/fix-international-composition

22315cd

Fixed international composition issues (e.g., Japanese Input method)

JohnMcLear added a commit that referenced this pull request Sep 14, 2012

Merge pull request #999 from lepidum/develop

ba8177f

Fixed international composition issues (e.g., Japanese Input method)

JohnMcLear merged commit ba8177f into ether:develop Sep 14, 2012

Pita reviewed Oct 11, 2012
View reviewed changes

marcelklehr mentioned this pull request Oct 11, 2012

Embedding pads produces an error in firefox and no text is saved #1032

Closed

lepidum mentioned this pull request Oct 11, 2012

Fix for #1032 caused by pull-request 999 #1059

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Fixed international composition issues (e.g., Japanese Input method)#999

Fixed international composition issues (e.g., Japanese Input method)#999
JohnMcLear merged 2 commits intoether:developfrom
lepidum:develop

lepidum commented Sep 14, 2012

Uh oh!

JohnMcLear commented Sep 14, 2012

Uh oh!

JohnMcLear commented Oct 3, 2012

Uh oh!

JohnMcLear commented Oct 9, 2012

Uh oh!

lepidum commented Oct 10, 2012

Uh oh!

scanferla commented Oct 10, 2012

Uh oh!

lepidum commented Oct 11, 2012

Uh oh!

Pita Oct 11, 2012

Uh oh!

lepidum Oct 11, 2012

Uh oh!

lepidum Oct 11, 2012

Uh oh!

lepidum commented Oct 11, 2012

Uh oh!

JohnMcLear commented Oct 11, 2012

Uh oh!

lepidum commented Oct 11, 2012

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

Uh oh!

Conversation

lepidum commented Sep 14, 2012

Uh oh!

JohnMcLear commented Sep 14, 2012

Uh oh!

JohnMcLear commented Oct 3, 2012

Uh oh!

JohnMcLear commented Oct 9, 2012

Uh oh!

lepidum commented Oct 10, 2012

Uh oh!

scanferla commented Oct 10, 2012

Uh oh!

lepidum commented Oct 11, 2012

Uh oh!

Pita Oct 11, 2012

Choose a reason for hiding this comment

Uh oh!

lepidum Oct 11, 2012

Choose a reason for hiding this comment

Uh oh!

lepidum Oct 11, 2012

Choose a reason for hiding this comment

Uh oh!

lepidum commented Oct 11, 2012

Uh oh!

JohnMcLear commented Oct 11, 2012

Uh oh!

lepidum commented Oct 11, 2012

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants