CocoDu43
-
Posts
3 -
Joined
-
Last visited
CocoDu43's Achievements
Newbie (1/5)
0
Reputation
-
imagerotate() function sometimes work and sometimes not
CocoDu43 replied to CocoDu43's topic in PHP Coding Help
I got the bug : the photo was in a popup which reloads the mother window. The problem was that the mother window has just uploaded the photo, so the rotated photo was overwritten by the original photo re-uploaded. -
imagerotate() function sometimes work and sometimes not
CocoDu43 replied to CocoDu43's topic in PHP Coding Help
Thank you for trying to help The code with 90 and 270 is here because on the client side I use CSS to rotate the image, and the 90 and 270 degrees are reversed with the server side. 1) Here's the client side (HTML with a little PHP) : <!DOCTYPE html> <head> <title>Photo</title> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" rightmargin="0" bottommargin="0"> <link rel="stylesheet" href="../css/bootstrap.min.css" type="text/css" media="screen"> <!-- for img-responsive class --> <script src="//code.jquery.com/jquery-1.11.0.min.js"></script> <script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script> <style> body { overflow:hidden; /* disable scrollbars */ } .north { transform:rotate(0deg); -ms-transform:rotate(0deg); /* IE 9 */ -webkit-transform:rotate(0deg); /* Safari and Chrome */ } .west { transform:rotate(90deg); -ms-transform:rotate(90deg); /* IE 9 */ -webkit-transform:rotate(90deg); /* Safari and Chrome */ } .south { transform:rotate(180deg); -ms-transform:rotate(180deg); /* IE 9 */ -webkit-transform:rotate(180deg); /* Safari and Chrome */ } .east { transform:rotate(270deg); -ms-transform:rotate(270deg); /* IE 9 */ -webkit-transform:rotate(270deg); /* Safari and Chrome */ } #my_image { /* animation */ -webkit-transition: all 0.7s ease; transition: all 0.7s ease; } </style> <script> function etape2 () { $('#my_image').hide(); window.opener.location.reload(); x=$('#photo_x').val(); console.log(x); y=$('#photo_y').val(); console.log(y); // nouvelle taille de la fenêtre if ((x > y) && (x > (screen.availWidth - 120))) {y = Math.floor(((screen.availWidth -120)*y)/x); x = screen.availWidth - 120;} if ((y > x) && (y > (screen.availHeight - 120))) {x = Math.floor(((screen.availHeight-120)*x)/y); y = screen.availHeight - 120;} window.resizeTo(x, y); // nouvelle position de la fenêtre myleft=(((screen.availWidth-x)/2)-10); mytop=(((screen.availHeight-y)/2)-18); moveTo(myleft, mytop); window.location.reload(); } function turn_image() { var img = $('#my_image'); var degrees = "0"; if(img.hasClass('north')){ degrees = "90"; }else if(img.hasClass('west')){ degrees = "180"; }else if(img.hasClass('south')){ degrees = "270"; }else if(img.hasClass('east')){ degrees = "0"; } // demand to php file to rotate on the server if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else { // code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { $('#form_return_from_server').html(xmlhttp.responseText); etape2(); } } url = "photo_resize.php?filename=<?= $file ?>°rees="+degrees; xmlhttp.open("GET",url,true); xmlhttp.send(); if(img.hasClass('north')){ img.attr('class','west img-responsive'); }else if(img.hasClass('west')){ img.attr('class','south img-responsive'); }else if(img.hasClass('south')){ img.attr('class','east img-responsive'); }else if(img.hasClass('east')){ img.attr('class','north img-responsive'); } } </script> <div style="position:relative; "> <? echo "<img id='my_image' class='north img-responsive' src=\"$file\" onclick=\"window.close();\" style=\"cursor:pointer; cursor:hand;\" onmouseover=\"this.style.cursor='pointer'\">"; ?> <div style=" position:absolute; right:1em; top:1em "> <img src="../images/arrow_turn_right.png" onclick="turn_image();" style="cursor:pointer; cursor:hand;" onmouseover="this.style.cursor='pointer'"> </div> </div> <div id="form_return_from_server" style="display:none"></div> <input type="hidden" id="photo_x"> <input type="hidden" id="photo_y"> </body> 2) And the complete server side (PHP) : <? if ($degrees == 90) $degrees = 270; elseif ($degrees == 270) $degrees = 90; // Chargement $source = imagecreatefromjpeg($filename); // Rotation $bg_color = imagecolorallocate($source, 255,255,255); $rotate = imagerotate($source, $degrees, $bg_color); //$rotate = imagerotate2($source, $degrees, 0); //$rotate = imagerotateEquivalent($source, $degrees, 0); imagejpeg($rotate, $filename, 95); // imagemagick //passthru("convert -rotate $degrees $filename -"); // to new file //passthru("mogrify -rotate $degrees $filename"); // to same file // Libération de la mémoire imagedestroy($source); imagedestroy($rotate); list ($photo_x, $photo_y, $type, $attr) = getimagesize($filename); echo "<script>"; echo "$('#photo_x').val('$photo_x');"; echo "$('#photo_y').val('$photo_y');"; echo "</script>"; ?> -
Sometimes imagerotate() PHP function doesn't work (no error, the image is simply not rotated), sometimes it works. It makes me crazy. Here's my code: if ($degrees == 90) $degrees = 270; elseif ($degrees == 270) $degrees = 90; // Chargement $source = imagecreatefromjpeg($filename); // Rotation $rotate = imagerotate($source, $degrees, 0); imagejpeg($rotate, $filename, 95); // Libération de la mémoire imagedestroy($source); imagedestroy($rotate); In the htaccess I set: ExpiresActive Off #ExpiresByType image/jpg "access plus 1 hour" #ExpiresByType image/jpeg "access plus 1 hour" #ExpiresByType image/png "access plus 1 hour" so normally there is no cache. Please help.