This extension adds the ability to crop when a user uploads their display picture. When FileReader
is not supported by the browser, the vanilla method is used.
DOES NOT WORK ON iOS DUE TO A VANILLA FLARUM BUG
I did a little hack to the extension so it actually works on iOS now. So yeah, it fixes the vanilla bug as well ?
What causes the bug is that the dev team adds only a click
handler to the elements. In order to make it work on some mobile devices, we need to add the touchend
or tap
listener, too. It'll be something like:
$("#id").on("tap click", function(e) { });
However, as on the extension side we couldn't modify the core code, I have to do some trick to let it happen. What I did is to remove the touchend
handlers every time when the elements reload, and add them back again depending on what elements are available. Inside the handlers, I prevent it from continuing to fire the click
event to make the click
firing twice -- because that does happen sometimes. Then at the end I just simulate the mouse hover stuff and fire the click
event.
Screenshots
Dependency
Croppie -- MIT, Included in the extension
Installation
composer require wiseclock/flarum-ext-profile-image-crop
Updating
composer update wiseclock/flarum-ext-profile-image-crop
Source
Github
Change Log
- Mar 13, 2017 - 0.1.1
- Credit the author of Croppie in composer.json.
- Avoid using the forum's attribute to pass in image.
- WORKS ON iOS TOO NOW!
Todo
Buy me a drink? ?