A very easy way to rotate an image using Jquery and then save it.
Please download the js file and link it locally. (jQueryRotateCompressed.js)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 |
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript" src="https://raw.githubusercontent.com/wilq32-pwitkowski/jqueryrotate/master/jQueryRotateCompressed.js"></script> <img src="uploads/101822973264163759893-1428320267361.jpeg" id="img"/> <script> $(document).ready(function(){ var value = 0 $("#img").rotate({ bind: { click: function(){ value +=90; $(this).rotate({ animateTo:value}) } } }); $(document).on('click', '#img', function() { // alert("Hello"); var idno = "test"; $.ajax({ url: "saveimage.php", dataType: "html", type: 'POST', data: "panelid="+idno, //variable with data success: function(data){ // $(".test").html(data); // alert(data); } }); }); }); </script> |
And now to save the image (saveimage.php)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<?Php $degrees = -90; //change this to be whatever degree of rotation you want header('Content-type: image/jpeg'); $filename = 'uploads/101822973264163759893-1428320267361.jpeg'; //this is the original file $source = imagecreatefromjpeg($filename) or notfound(); $rotate = imagerotate($source,$degrees,0); imagejpeg($rotate,$filename); //save the new image imagedestroy($source); //free up the memory imagedestroy($rotate); //free up the memory ?> |