0

Today I am having this small issue with my cart script again. When i upload from my desktop my images are orientated the way you want them by default so as I upload them, they load properly. But when I post items from my phone, the images are loaded sideways!

I CANT get the orientation through exif because of my server (don't have root access to fix that) so I was just going to see if the width is less then the height, then rotate them, but the code isn't working properly.

Right now the script uploads a file temporarily, then runs two functions to make a PNG version of the image for a thumbnail and a full sized version in the proper folders. It works to make the images just fine, the problem being it doesn't rotate them before it saves them if they need to be rotated. I have included my current function to create the images, what am i doing wrong that they aren't being rotated?

function createFullImage($filepath, $uploadpath) {
    list($width, $height, $original_type) = getimagesize($filepath);
    if($original_type === 1) {
        $imgt = "ImageGIF";
        $imgcreatefrom = "ImageCreateFromGIF";
    } elseif ($original_type === 2) {
        $imgt = "ImageJPEG";
        $imgcreatefrom = "ImageCreateFromJPEG";
    } elseif ($original_type === 3) {
        $imgt = "ImagePNG";
        $imgcreatefrom = "ImageCreateFromPNG";
    } else {
        return false;
    }
    $old_image = $imgcreatefrom($filepath);
    $new_image = imagecreatetruecolor($width, $height); // create new image
    imagecopyresampled($new_image, $old_image, 0, 0, 0, 0, $width, $height, $width, $height);
    if(height > width) {
        $new_image = imagerotate($new_image, 90, 0);
    }
    $imgt($new_image, $uploadpath);
    return file_exists($uploadpath);
}
Kaboom
  • 674
  • 6
  • 27
  • I don't see where $original_height and $original_width are defined. It looks like you called them $height and $width respectively. Edit: As a result, your imagerotate is never being called ((undefined > undefined) == false). – Hamilton Lucas Jun 17 '16 at 19:40
  • I forgot to change those variables apparently. lol let me try and fix that quick and get back to you. EDIT: I just misstyped them on this function, its right on the script. edited the main post – Kaboom Jun 17 '16 at 19:42
  • Try getting rid of the conditional entirely and see if it successfully rotates your normal images. I'm thinking the conditional is evaluating to false, so imagerotate is not being called. – Hamilton Lucas Jun 17 '16 at 19:45
  • You're correct. I am a dumbass lol. my < was backwards so it wasnt working on the test image. strangly its rotating the other images now tho. – Kaboom Jun 17 '16 at 19:48
  • Yeah - try logging out the values of width and height and make sure they are appropriate. You might also be able to change the behavior of the phone you're using such that it doesn't just store the orientation in the exif data, but produces an appropriately oriented image in the first place. Something like this: http://iphonephotographyschool.com/iphone-photos-upside-down/ – Hamilton Lucas Jun 17 '16 at 19:53
  • I posted an answer below with both functions. I got it to work so it rotates the images on the phone properly, but the desktop ones dont work now because of how iphones store their image data, When its flipped on the phone, the width and height also flip so the values for those fields make it look like the image doesnt need to be flipped, and my function (switching the > around) wont flip the images I want flipped. – Kaboom Jun 17 '16 at 19:58
  • Can you add a parameter to the UI layer that indicates whether the image should be rotated or not? Just set the value of that to true if on the phone, or false if on the desktop. Assuming the UI layer is HTML/Javascript, you should be able to use the user-agent to make the determination: http://stackoverflow.com/questions/11381673/detecting-a-mobile-browser – Hamilton Lucas Jun 17 '16 at 20:02
  • Its processing the images as they are uploaded. I can detect browsers, and force mobile upload to always rotate and desktop browsers to not, by calling two different functions (one with rotate and one without) since its only admins who can post images. This is most likely the solution I will use. – Kaboom Jun 17 '16 at 20:06

1 Answers1

1

Heres the working functions for both. Here's what happens

3264png × 2448png before its been flipped. 2448png × 3264png after its been flipped.

If an image is wider, its flipped. Which is a terrible solution if I upload a wider image from my desktop since it will be flipped, but I guess its the down side to having no EXIF function tho.

function createThumbnail($filepath, $thumbpath, $thumbnail_width, $thumbnail_height) {
    list($original_width, $original_height, $original_type) = getimagesize($filepath);
    if($original_type === 1) {
        $imgt = "ImageGIF";
        $imgcreatefrom = "ImageCreateFromGIF";
    } elseif ($original_type === 2) {
        $imgt = "ImageJPEG";
        $imgcreatefrom = "ImageCreateFromJPEG";
    } elseif ($original_type === 3) {
        $imgt = "ImagePNG";
        $imgcreatefrom = "ImageCreateFromPNG";
    } else {
        return false;
    }
    $old_image = $imgcreatefrom($filepath);
    $new_image = imagecreatetruecolor($thumbnail_width, $thumbnail_height); // creates new image, but with a black background
    imagecopyresampled($new_image, $old_image, 0, 0, 0, 0, $thumbnail_width, $thumbnail_height, $original_width, $original_height);
    if($original_height < $original_width) {
        $new_image = imagerotate($new_image, -90, 0);
    }
    $imgt($new_image, $thumbpath);
    return file_exists($thumbpath);
}

function createFullImage($filepath, $uploadpath) {
    list($width, $height, $original_type) = getimagesize($filepath);
    if($original_type === 1) {
        $imgt = "ImageGIF";
        $imgcreatefrom = "ImageCreateFromGIF";
    } elseif ($original_type === 2) {
        $imgt = "ImageJPEG";
        $imgcreatefrom = "ImageCreateFromJPEG";
    } elseif ($original_type === 3) {
        $imgt = "ImagePNG";
        $imgcreatefrom = "ImageCreateFromPNG";
    } else {
        return false;
    }
    $old_image = $imgcreatefrom($filepath);
    $new_image = imagecreatetruecolor($width, $height); // create new image
    imagecopyresampled($new_image, $old_image, 0, 0, 0, 0, $width, $height, $width, $height);
    if($width > $height) {
        $new_image = imagerotate($new_image, -90, 0);
    }
    $imgt($new_image, $uploadpath);
    return file_exists($uploadpath);
}
Kaboom
  • 674
  • 6
  • 27