Steemit Condenser Contributions: automatic photo rotation

avatar
(Edited)

Context

Well this is actually a work done in the Steemit Image Hoster project but because you usually see the resulting data in the Condenser, I'll keep it as part of Condenser contributions.

Steemit Condenser Contributions

When you upload an image on Steemit.com, your original image is hosted under a URL in the following format:
https://cdn.steemitimages.com/[SOME_HASH]/[SOME_UID].jpeg

When you then access the image from the Condenser, it will not fetch the original image directly but will go through a proxy script that will download the original file, resize, compress and cache it under:
https://steemitimages.com/[WIDTH]x0/https://cdn.steemitimages.com/[THE_HASH]/[THE_UID].jpeg

Now the issue this PR tries to fix is happening during the proxy processing phase.

The issue

When taking a photo using your mobile phone or tablet in portrait mode (holding the phone upside up), the device's camera does is actually taking the shot in landscape mode (upside to the left) and adds some metadata to the saved file. When you open the photo in the photos app, the app will read that metadata and will rotate the image before displaying it to you for viewing.

What this means is that whatever software (including the browser) is used to view that photo should also apply the rotation before display. But the image proxy app, during the image processing has removed the useful metadata and as a result, when you view the image in a blog post, the image being displayed has a wrong orientation.

Here is an example of the issue from Rest in peace dad rip @wales. My condolences to @trystan family for your loss.

Image shown with the wrong orientation

The work done

The solution I've chose is not the best but it is the best for the moment. Ideally, I should make the code not strip the metadata out of the file during the processing of the image. However, those metadata sometimes include geolocation of where the photo has been taken and for safety reason I prefer them to not be included. So what I did is just perform a rotation when needed.

Maybe a future improvement would be to remove the auto-rotation and allow the metadata from the original file but filter out data that can be of user's safety concerns.

The fix was quite simple:
Code change

I took the opportunity to replace the use of deprecated method calls and also update the image processing library (Sharp) to a newer version that supports what I needed.

A quick test shows that it worked:
Fixed orientation of the uploaded image

Steemit Condenser Pull Request

This feature is not out yet, a pull request has been created:
https://github.com/steemit/imagehoster/pull/118.

The PR was approved and merged but the changes seem to have not been released yet but this is not something I can control so lets hope Steemit Inc will deploy soon.


Vote for my witness
Support @quochuy Witness.jpg
On Steem, Witnesses are playing the important role of providing a performant and safe network for all of us. You have the power to choose 30 trusty witnesses to package transactions and sign the blocks that will go in the Steem blockchain. Vote for me via SteemConnect to help me do more useful projects for the communities.



0
0
0.000
20 comments
avatar

Congratulations @quochuy, you have received a 80% upvote. I'm the Vietnamese Community bot developed by witness @quochuy and powered by community SP delegations

0
0
0.000
avatar

Congratulations @quochuy! You have completed the following achievement on the Steem blockchain and have been rewarded with new badge(s) :

You distributed more than 28000 upvotes. Your next target is to reach 29000 upvotes.

You can view your badges on your Steem Board and compare to others on the Steem Ranking
If you no longer want to receive notifications, reply to this comment with the word STOP

To support your work, I also upvoted your post!

Vote for @Steemitboard as a witness to get one more award and increased upvotes!
0
0
0.000
avatar

GJ, all features you make a added to steemit?

0
0
0.000
avatar

Yes, they are requests to get added to Steemit but Steemit Inc still has the task to review, approve and deploy them.

Posted using Partiko iOS

0
0
0.000
avatar

I seem to vaguely remember it being theoretically possible to strip out everything but rotation data but at the time was too lazy to look more into it (mostly because I do it locally as part of a batch process). Might be something to look into if you're not already :)

0
0
0.000
avatar

I’m sure there is away, the question is is that way supported by the current image library being used and how much work if it is not. But I don’t see this as being critical, the main thing is that the image shows up correctly.

Posted using Partiko iOS

0
0
0.000
avatar

Great work, this should benefit other frontends as well then since it's a contribution to imagehoster and not to condenser, right? Btw, the link to the pull request is wrong ;)

0
0
0.000
avatar

Thank you. I updated the link.
This change would benefit any dapps that are using the steemit image proxy.
But this is not always the case like with SteemPeak for example.

0
0
0.000
avatar

Nice!!! Many of us needed this is the platform, me myself also encounters this problem as well.

Good Job!!!!

0
0
0.000
avatar

I'm glad it will be useful to you. Lets hope it gets deployed quickly

0
0
0.000
avatar

I'm glad it will be
Useful to you. Lets hope it
Gets deployed quickly

                 - quochuy


I'm a bot. I detect haiku.

0
0
0.000