Resize images with respect for the EXIF orientation flag

[Gompje]

The EXIF info of an image contains a 'rotation flag'. When resizing the image, it should take this into account. Almost all the apps only manipulate this flag when asking to rotate.

This was my ugly hacked code for Hugo (Go). But I'm much better at Vue and converting my Hugo project to Nuxt static. I'm willing to add this to your package as a pull -- but I do not know where to start. Deadline. Very Tired.

{{ $orientation := 1 }}
{{ with $image.Exif }}
{{ $orientation = .Tags.Orientation }}
{{ end }}

{{ if eq $orientation 1 }}
{{ $image := .Resize "480x" }}
{{ else if (eq $orientation 8) }}
// Rotate the image 90deg CCW (.Resize "r90")
{{ $image := .Resize "480x" "r90" }}
{{ end }}

obligatoire stackoverflow thing: https://stackoverflow.com/questions/13872331/rotating-an-image-with-orientation-specified-in-exif-using-python-without-pil-in

resources:

• https://github.com/blueimp/JavaScript-Load-Image#exif-parser

[Gompje]

And by apps I really basically mean: "I want my user to take a picture with his smartphone. Let him manipulate it like he/she sees it on his fit -- on his/her smartphone. Add that to git, push and voila: static site updated"

[farnabaz]

Thank you for the explanation. We can apply operientation before removing EXIF data.

[Gompje]

Thanks for this! @farnabaz I had a little bit of time this morning. Had kinda the same idea :) but I did not find where. Turns out I was looking in the wrong files - ha!

@farnabaz: I'm looking to be more involved into Nuxt, and to be more contributing. I forked this project and want to help. Will make myself familiar with the code and such but when I want to run the playground, it gives me an error:

→ Its now lunch, but I will add this to my fork. and this my fork on my NUXT install which currently uses this module (obviously) and has the image rotation problem. I will give feedback if it works or not

 FATAL  Cannot resolve "~/node_modules/.cache/nuxt-image" from "[MY FS]/nuxt-modules/image/playground/node_modules/.cache/nuxt-image"

• with [MY FS] as in the abs path of that folder.
• with [nuxt-modules] just the root folder containing all my future contrubitions to nuxt modules ;-)

I just did what I normally do, and definatly build yarn and things like that. I dont now what I'm missing. The .cache folder doesn't even exists

[Gompje]

IDK if I did something wrong, but this doesn't seem to work yet.

• I forked the IPX repo, your feature branch (build it etc..)
• I told in my nuxt project to use my local repo
• this works: my local files are copied to the node_modules where before there was the package dist

when I look at the cache images (and on the page) the image isn't rotated.

I've checked the EXIF info on the file and it does include the tag. The code I used in the issue worked in Hugo. Same image.

[niklasfjeldberg]

Any update on this issue?