I updated it to markerjs2 and cleanup the codes.
Here is the link for the PR:
7 Likes
The editor improvements are fantastic, and it removed so much code 
Unfortunately, after saving the edit, the post is no longer showing up, as the markdown isn’t quite right. It looks like the string parsing is not correct.
The top image markdown is the uneditted file. After editing you can see that the component is getting confused from the
(1) in the filename and putting that into the upload path, look at (1upload. Now that themes can have JS tests, lets add a test for the file name parsing.
I am going to disable the theme component here on Meta for a bit while this gets fixed. It’s already marked as #theme:broken-theme so nothing new here 
6 Likes
I fixed the bug catching wrong parentheses when finding image url.
Here is the link for the PR:
I am also planning to add a function when hovering over the image the user can choose whether to annotate it or crop (rotate/flip) it.
6 Likes
Hi Nam,
Component is now installed on meta and I was testing it out!
Some feedback:
- It is unclear how to open up the editor. I would recommend some indication here (maybe float the word edit? or a pencil? in the preview area):
-
There is a big z-index fight with the composer leaving the image behind the composer. You have to shrink the composer way down to see it all.
-
Images being edited seems enormous. Any way to keep dimensions of image being edited?
6 Likes
Thank you so much for the feedback!
I am working on the feedback #1. I will change the style of them but the ‘ANNOTATE’ or ‘CROP’ button will open up the requested tool.
For feedback #2, could you clarify the issue for me?
I can work on #3 soon.
6 Likes
Sure:
The composer is rendered on top of the image editor for me, so I can not edit properly till I shrink the composer.
Thanks heaps for all you awesome work here!
3 Likes
Thank you for your clarification!
Could you tell me which device, browser, and version you used?
The editor pops up on top of the image editor for me. This is how it looks on mine:
4 Likes
Oh I see what is going on here, can you test with the “focused sidebar” theme which is only enabled for the Discourse team (and part of Discourse for Teams)
My guess is that you need to push the zindex up a tiny bit more. @markvanlan is helping out here.
4 Likes
@Nam Merged in an awesome change allowing crop/rotate. There is now a selection stage after you click an (local upload only) image, to either annotate or crop/rotate. 
The only issue right now is another z-index issue but with the cropping modal (the annotating modal z-index is correct). There is no stable className on the outer element for the cropping modal, so I have a PR open for the cropro library to add one.
Edit:
I forked the repo and made the small change we need. No more z-index issue.
4 Likes
It seems like there is no solution for the issues that images being edited are too big.
It’s because the MarkerJs and Cropro set the image size when it is being edited.
3 Likes
It’s been a year so I’ll ask in desperation again because this has so much potential, any hope for images hosted on s3 and using a cdn? 
2 Likes
Meta uses S3 and CDN and it works just fine if you are uploading the image at the same time you want to edit it. AFAIK it won’t work while editing existing images.
1 Like
Interesting, I tried it on another site which currently has all plugins and TCs disabled and I have the same problem, but it works with s3 disabled, any ideas? The image is also oddly stretched out, should be 2:3 but it’s stretching to the width of the screen.
3 Likes
Do you have DISCOURSE_ENABLE_CORS: true in your app.yml ?
2 Likes
No I don’t have that line, and nothing set in cors-origins site setting either.
1 Like
Try setting that up and rebuilding.
2 Likes
Still happening after enabling/rebuilding, do I need to set anything for cors-origins or DISCOURSE_CORS_ORIGIN: ?
1 Like
I have problem cannot edit done.
1 Like
When I try this on smartphone, it does not edit current image, and replace next image (next to current).
Could you check for this?
1 Like