i_user
i_user

Reputation: 513

Phonegap - Camera taken photo always turns landscape

i'm able to upload photo successfully with the phonegap file upload script. but the problem is when i take a photo which is portrait and it shows up in the thumbnail, it turns to the photo to landscape but when you pick up from the gallery it appears as it is

<script>



    var deviceReady = false;

    /**
     * Take picture with camera
     */
    function takePicture() {
        navigator.camera.getPicture(
            function(uri) {
                var img = document.getElementById('camera_image');
                img.style.visibility = "visible";
                img.style.display = "block";
                img.src = uri;
                document.getElementById('camera_status').innerHTML = "Success";
            },
            function(e) {
                console.log("Error getting picture: " + e);
                document.getElementById('camera_status').innerHTML = "Error getting picture.";
            },
            { quality: 50, destinationType: navigator.camera.DestinationType.FILE_URI});
    };

    /**
     * Select picture from library
     */
    function selectPicture() {
        navigator.camera.getPicture(
            function(uri) {
                var img = document.getElementById('camera_image');
                img.style.visibility = "visible";
                img.style.display = "block";
                img.src = uri;
                document.getElementById('camera_status').innerHTML = "Success";
            },
            function(e) {
                console.log("Error getting picture: " + e);
                document.getElementById('camera_status').innerHTML = "Error getting picture.";
            },
            { quality: 50, destinationType: navigator.camera.DestinationType.FILE_URI, sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY});
    };

    /**
     * Upload current picture
     */
    function uploadPicture() {

        // Get URI of picture to upload
        var img = document.getElementById('camera_image');
        var imageURI = img.src;
        if (!imageURI || (img.style.display == "none")) {
            document.getElementById('camera_status').innerHTML = "Take picture or select picture from gallery";
            return;
        }

        // Verify server has been entered
        server = document.getElementById('serverUrl').value;
        if (server) {

           // Specify transfer options
            var options = new FileUploadOptions();
            randomizer = Math.floor((Math.random() * 1000000) + 1);
            options.fileKey="file";
            options.fileName=imageURI.substr(imageURI.lastIndexOf('/')+1)+randomizer+'.jpg';
            options.mimeType="image/jpeg";
            options.chunkedMode = false;




options.params = {
            filename: window.localStorage.setItem("key", options.fileName),


        }


            // Transfer picture to server
            var ft = new FileTransfer();
            ft.upload(imageURI, "http://myphonegap/pg_upload.php", function(r) {
        document.getElementById('camera_status').innerHTML = "Please wait redirecting"; 
        window.location.href = "source.html"            
            }, function(error) {
                document.getElementById('camera_status').innerHTML = "Upload failed: Code = "+error.code;               
            }, options);
        }
    }

    /**
     * View pictures uploaded to the server
     */
    function viewUploadedPictures() {

        // Get server URL
        server = document.getElementById('serverUrl').value;
        if (server) {

            // Get HTML that lists all pictures on server using XHR 
            var xmlhttp = new XMLHttpRequest();

            // Callback function when XMLHttpRequest is ready
            xmlhttp.onreadystatechange=function(){
                if(xmlhttp.readyState === 4){

                    // HTML is returned, which has pictures to display
                    if (xmlhttp.status === 200) {
                        document.getElementById('server_images').innerHTML = xmlhttp.responseText;
                    }

                    // If error
                    else {
                        document.getElementById('server_images').innerHTML = "Error retrieving pictures from server.";
                    }
                }
            };
            xmlhttp.open("GET", server , true);
            xmlhttp.send();         
        }   
    }

    /**
     * Function called when page has finished loading.
     */
    function init() {
        document.addEventListener("deviceready", function() {deviceReady = true;}, false);
        window.setTimeout(function() {
            if (!deviceReady) {
                alert("Error: PhoneGap did not initialize.  Demo will not run correctly.");
            }
        },2000);
    }



    </script>

Upvotes: 0

Views: 314

Answers (1)

Lukesmith
Lukesmith

Reputation: 170

Are you using the app in landscape?

if so, try adding this option to your camera settings in the getPicture() function:

correctOrientation: false

or if your using in portrait try setting it true. It smells like a bug but that might fix it.

Also are you checking the actual uploaded image? Is it the wrong orientation?

Upvotes: 1

Related Questions