I am trying to get the Camera API to work in my PhoneGap android app, but i keep getting this error
"Cannot read property 'getPicture' of undefined".
Now i have checked countless answers on StackOverflow and tutorials all over the web,and tried all the answer there(with no luck), and i cant seem to find the issue.
This is the button that calls the function
<button type="button" class="btn btn-primary" ng-click="getPic()">Camera</button>
This is the controller that handles the camera
myApp.controller('EditProfileCtrl', function ($scope, $http, navigateFactory) {
$scope.getPic = function () {
navigator.camera.getPicture(onSuccess, onFail, {
quality: 60,
destinationType: Camera.DestinationType.DATA_URL,
sourceType: 1
});
function onSuccess(imageData) {
var image = document.getElementById('myImage');
image.src = "data:image/jpeg;base64," + imageData;
}
function onFail(message) {
alert('Failed beause' + message);
}
};
});
Please ment if there is any additional information required. Any and all help will be hugely appreciated.
EDIT: So after following Aravin's advice i added <script src="cordova.js"></script>
now it atleast looks like something is happening, but now im getting these errors in my eclipse logcat:
I/System.out(3871): Error adding plugin org.apache.cordova.CameraLauncher D/PluginManager(3871): exec() call to unknown plugin: Camera
I am trying to get the Camera API to work in my PhoneGap android app, but i keep getting this error
"Cannot read property 'getPicture' of undefined".
Now i have checked countless answers on StackOverflow and tutorials all over the web,and tried all the answer there(with no luck), and i cant seem to find the issue.
This is the button that calls the function
<button type="button" class="btn btn-primary" ng-click="getPic()">Camera</button>
This is the controller that handles the camera
myApp.controller('EditProfileCtrl', function ($scope, $http, navigateFactory) {
$scope.getPic = function () {
navigator.camera.getPicture(onSuccess, onFail, {
quality: 60,
destinationType: Camera.DestinationType.DATA_URL,
sourceType: 1
});
function onSuccess(imageData) {
var image = document.getElementById('myImage');
image.src = "data:image/jpeg;base64," + imageData;
}
function onFail(message) {
alert('Failed beause' + message);
}
};
});
Please ment if there is any additional information required. Any and all help will be hugely appreciated.
EDIT: So after following Aravin's advice i added <script src="cordova.js"></script>
now it atleast looks like something is happening, but now im getting these errors in my eclipse logcat:
Share Improve this question edited May 11, 2015 at 16:51 scniro 17k8 gold badges66 silver badges107 bronze badges asked Jul 8, 2014 at 10:07 unselectedunselected 1091 gold badge2 silver badges10 bronze badges 16I/System.out(3871): Error adding plugin org.apache.cordova.CameraLauncher D/PluginManager(3871): exec() call to unknown plugin: Camera
- Are you running in simulator or mobile device? – msg Commented Jul 8, 2014 at 10:21
- Well both, on the device nothing happens at all, on the browser i get that error – unselected Commented Jul 8, 2014 at 10:26
- In browser, you will get this "undefined" error. because phonegap API's will work only when you wrap it as a build(ipa,apk..). – msg Commented Jul 8, 2014 at 10:29
- show where your cordova.js is located – Aravin Commented Jul 8, 2014 at 10:30
- Where would cordova.js usually be... sorry , i am working on this as part of a team so i didnt do everything myself – unselected Commented Jul 8, 2014 at 10:34
3 Answers
Reset to default 2The total work around is below..
you need to write all code in your html page.
<body>
<div data-role="page">
<script type="text/javascript">
function getPhotoFromCamera() {
navigator.camera.getPicture(onPhotoDataSuccess, onFail, {
quality: 50,
sourceType: navigator.camera.PictureSourceType.CAMERA,
destinationType: navigator.camera.DestinationType.DATA_URL,
});
}
function onPhotoDataSuccess(imageData){
var image = document.getElementById('image');
image.style.display = 'block';
image.src = "data:image/jpeg;base64,"+imageData;
}
function getPhotoFromAlbum(){
navigator.camera.getPicture(onPhotoURISuccess, onFail,{
quality: 50,
sourceType: navigator.camera.PictureSourceType.SAVEDPHOTOALBUM,
destinationType: navigator.camera.DestinationType.FILE_URI
});
}
function onPhotoURISuccess(imageURI){
var image = document.getElementById('image');
image.style.display = 'block';
image.src = imageURI;
}
function onFail(message){
alert('Failed because:' + message);
}
</script>
<div data-role="header" style="height:36px;">
<h1>Write New</h1>
<a href="#" data-icon="arrow-l" data-rel="back">Back</a>
</div>
<button onclick="getPhotoFromCamera();">Launch Camera</button>
<button onclick="getPhotoFromAlbum();">Goto Picture Gallery</button>
<div>
<img id="image" style="display:none;width;290px;height:210px;" src = ""/>
</div>
</div>
<script type="text/javascript" src="cordova.js"></script>
</body>
If you are using TFS, remember to check out for edit "fetch.json" before installing the plugin, or it will fail mid-installation.
So after trying all the things here with no success I did this which fixed the issue (dont know how)...
remove the plugin , build , add the plugin , build
and Magic!