Results 1 to 8 of 8

Thread: phonegap camera

  1. #1
    Sencha User
    Join Date
    Sep 2010
    Location
    Netherlands
    Posts
    190

    Default phonegap camera

    Hello everyone,

    Someone got an idea how i can work this out:

    A panel with 2 buttons, 1 = upload , 2 = view uploaded.

    When button 1 is pressen, actionsheet comes up. Where you can choose: excisting or new photo. When pressed the album photo library is shown or the make photo screen. when you make phone i want to save the location (the photo must be saved on localstorage) in a var. When you press on button 2, a panel is shown with the image of the photo token or chosen by the user.

    At the moment i have:

    Code:
        function onSuccess(imageData) {
            locationCV = imageData;
        }
        
        function onFail(message) {
            alert(message);
        }
        
        
        
        var image;
        var actionSheetUpload = new Ext.ActionSheet({
            items: [
                {
                    text: 'Bestaande foto',
                    handler: function() {
                    }
                },
                {
                    text: 'Maak foto',
                    handler: function() {
                    navigator.camera.getPicture(onSuccess, onFail, { quality: 50, 
                                                destinationType: Camera.DestinationType.FILE_URI }); 
                    }
                },
                {
                    text: 'Annuleer',
                    ui  : 'decline',
                    handler: function() {
                        actionSheetUpload.hide();
                    }
                }
            ]
        });
        
            
        icams.uploadCVPanel = new Ext.Panel({
            id: 'uploadCVPanel',
            cls: 'infoCLS',
            title: 'Upload CV',
            dockedItems: [bottomTBL, topTBL],
            items: [
                {
                    html: '<h1>CV</h1><p>Welkom, op deze pagina kunt u uw CV uploaden. Er zijn twee mogelijkheden, u kunt een bestaande foto selecteren of u kunt een nieuwe foto maken.'
                },
                {
                    id: 'UploadNow',
                    xtype: 'button',
                    cls: 'loginBtn',
                    ui: 'confirm',
                    text: 'Upload CV',
                    handler: function() {
                        actionSheetUpload.show();
                    }
                },
                {
                    id: 'LaatFotozien',
                    xtype: 'button',
                    cls: 'registreerBtn',
                    ui: 'confirm',
                    text: 'Toon huidige',
                    handler: function() {
                    
                    icams.showCurrentPanel = new Ext.Panel({
                        id: 'showCurrentPane',
                        cls: 'loginPanelCLS',
                        title: 'Login',
                        scroll: 'vertical',
                        dockedItems: [bottomTBL, topTBL],
                        items: [
                            {
                                html: '<img id="uploadedCV" style="width:200px; height:200px" src="locationCV" />' 
                            }
                        ]
                    });
                    panel.add(icams.showCurrentPanel);
                    panel.setActiveItem(icams.showCurrentPanel);
                
                    }
                }
                    
            ]
                                            
        });
    But it is not working..

    Any help is appreciated

    ST 1.0 and newest PG version

  2. #2
    Sencha User
    Join Date
    Sep 2010
    Location
    Netherlands
    Posts
    190

    Default

    someone?

  3. #3
    Sencha User
    Join Date
    Sep 2010
    Location
    Netherlands
    Posts
    190

    Default Working

    Got it working

  4. #4
    Sencha User
    Join Date
    Aug 2010
    Location
    Europa
    Posts
    216

    Default

    Can you post the working code? Thanks in advance.

  5. #5
    Sencha User
    Join Date
    Sep 2010
    Location
    Netherlands
    Posts
    190

    Default

    Hey, sorry late response

    In the HTML i got:
    Code:
    <script type="text/javascript" charset="utf-8">
    
    	var pictureSource;   // picture source
        var destinationType; // sets the format of returned value 
    
        // Wait for PhoneGap to connect with the device
        //
        function onLoad() {
            document.addEventListener("deviceready",onDeviceReady,false);
        }
    
        // PhoneGap is ready to be used!
        //
        function onDeviceReady() {
            pictureSource=navigator.camera.PictureSourceType;
            destinationType=navigator.camera.DestinationType;
        }
    	
    	//Camera functions
    	
    	function onPhotoURISuccess(imageURI) {
    		// console.log(imageURI);
    		var largeImage = document.getElementById('largeImage');
    		largeImage.style.display = 'block';
    		largeImage.src = imageURI;
    		// Hier dingen doen met imageURI, kan opgestuurd worden?
    		// Hieronder wordt de actionsheet gehide, aangezien het foto uploaden is gelukt
    		actionSheetUpload.hide();
    		
    	}
    	
    	function capturePhoto() {
    		// Take picture using device camera, allow edit, and retrieve image as base64-encoded string  
    		navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 100, destinationType: destinationType.FILE_URI}); 
    	}
    	
    	function getPhoto(source) {
    		// Retrieve image file location from specified source
    		navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 100, 
    		destinationType: destinationType.FILE_URI,
    		sourceType: source });
    	}
    	function onFail(mesage) {
    		alert('Mislukt omdat: ' + message);
    	}
    
        </script>
    call the function in a button handler:

    Code:
     {
       text: 'Maak foto',
    	handler: function() {
    		capturePhoto();
    	}
    },
    And show the picture like this:

    Code:
    html: 'Hieronder de huidige CV:<br /><img style="display:none;" id="largeImage" src="" />'

    Greetz, hope you still can use it sorry didn't watch this thread for some time.

  6. #6
    Sencha User Mis63's Avatar
    Join Date
    Aug 2010
    Location
    Clermont-Ferrand, France
    Posts
    42

    Default

    Great

  7. #7

    Question integration with contacts list

    hey! nice work there!! i have a question about all this camera stuff. do you know how can i add pictures from camera or camera roll to a contact with this sencha's contacts list app example?? and do you know if this method will store the picture for good in the device's contacts app? or if you can guide me to any good information source for this.. is on iOS devices by the way.

    thanks!!

  8. #8

    Default

    I'm curious. Where you able to upload the image to an external server? I'd like to do that through a form.
    - use camera and capture in phonegap to either take a new picture and upload to server OR get existing photo already on the mobile devie and upload that one.

    Thanks

Similar Threads

  1. Access to Camera?
    By thesilentman in forum Sencha Touch 1.x: Discussion
    Replies: 7
    Last Post: 24 Jan 2011, 6:30 PM
  2. Geolocation working on Android? Timeline on release for camera access
    By olin in forum Sencha Touch 1.x: Discussion
    Replies: 0
    Last Post: 10 Aug 2010, 12:32 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •