Shadow dom image wrapper #1520
Merged
Shadow dom image wrapper #1520
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
juliaroldi
requested review from
JiuqingSong,
BryanValverdeU,
Andres-CT98,
flyingbee2012 and
ianeli1
and removed request for
JiuqingSong
Create a long rectangle image, insert it. Then rotate, I think the size of wrapper SPAN is wrong (or incorrectly rotated?) That causes the image float higher than other text. Maybe not a new issue, but better also fix it. |
JiuqingSong
reviewed
Jan 20, 2023
| this.disposer = editor.addDomEventHandler('blur', this.onBlur); | ||
| this.disposer = editor.addDomEventHandler({ | ||
| blur: () => this.onBlur, | ||
| drop: e => e.preventDefault(), |
There was a problem hiding this comment.
I think we should disable onDrag instead, and only disable when image is in editing.
juliaroldi
changed the title
JiuqingSong
reviewed
Jan 23, 2023
Comment on lines
200
to
211
| // When left click in a image that already in editing mode, do not quit edit mode | ||
| // This will avoid another image into the editor after drag | ||
| const mouseTarget = e.rawEvent.target; | ||
| const button = e.rawEvent.button; | ||
| if ( | ||
| this.shadowSpan !== mouseTarget || | ||
| (this.shadowSpan === mouseTarget && button !== 0) || | ||
| this.isCropping | ||
| ) { | ||
| this.setEditingImage(null); | ||
| } | ||
|
|
There was a problem hiding this comment.
Actually the issue still happens after this fix:
I suggest we handle ondrag event, and if the dragging is happened when this.image is not null, always do preventDefault() so drag will not happen at all.
…u/juliaroldi/shadow-dom-image-wrapper
juliaroldi
force-pushed
the
u/juliaroldi/shadow-dom-image-wrapper
branch
from
6795fc4 to
4aca7d0
Compare
JiuqingSong
approved these changes
Jan 23, 2023
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Instead of insert the image wrapper with a cloned image outside the editor and overlay the image wrapper, add the image wrapper with a cloned image into shadow dom and let it handle hiding the original image. After this change, the code to handle zoom issues and image overlaying the toolbar above the editor will be not needed. Also, code to add auto low to the rotator handle, remove the wrapper before dispose the editor and avoid drop image while in editing mode was added.