You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@cordova.apache.org by Mikejo5000 <gi...@git.apache.org> on 2016/04/09 00:39:14 UTC
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
GitHub user Mikejo5000 opened a pull request:
https://github.com/apache/cordova-plugin-camera/pull/203
Added Sample section to the Camera plugin README
You can merge this pull request into a Git repository by running:
$ git pull https://github.com/Mikejo5000/cordova-plugin-camera master
Alternatively you can review and apply these changes as the patch at:
https://github.com/apache/cordova-plugin-camera/pull/203.patch
To close this pull request, make a commit to your master/trunk branch
with (at least) the following in the commit message:
This closes #203
----
commit 0d1ecf74973a3aa3bd4171a9726b4ee53277b6ff
Author: Mikejo5001 <m....@outlook.com>
Date: 2016-04-08T22:38:19Z
Added Sample section to the Camera plugin README
----
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by Mikejo5000 <gi...@git.apache.org>.
Github user Mikejo5000 commented on a diff in the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#discussion_r59604648
--- Diff: jsdoc2md/TEMPLATE.md ---
@@ -203,3 +203,194 @@ Tizen only supports a `destinationType` of
[web_activities]: https://hacks.mozilla.org/2013/01/introducing-web-activities/
[wp8_bug]: https://issues.apache.org/jira/browse/CB-2083
[msdn_wp8_docs]: http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh394006.aspx
+
+## Sample: Take Pictures, Select Pictures from the Picture Library, and Get Thumbnails <a name="sample"></a>
+
+The Camera plugin allows you to do things like open the device's Camera app and take a picture, or open the file picker and select one. The code snippets in this section demonstrate different tasks including:
+
+* Open the Camera app and [take a Picture](#takePicture)
+* Take a picture and [return thumbnails](#getThumbnails) (resized picture)
+* Take a picture and [generate a FileEntry object](#convert)
+* [Select a file](#selectFile) from the picture library
+* Select a JPEG image and [return thumbnails](#getFileThumbnails) (resized image)
+* Select an image and [generate a FileEntry object](#convert)
+
+## Take a Picture <a name="takePicture"></a>
+
+Before you can take a picture, you need to set some Camera plugin options to pass into the Camera plugin's `getPicture` function. Here is a common set of recommendations. In this example, you create the object that you will use for the Camera options, and set the `sourceType` dynamically to support both the Camera app and the file picker.
+
+```js
+function setOptions(srcType) {
+ var options = {
+ // Some common settings are 20, 50, and 100
+ quality: 50,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
+ correctOrientation: true //Corrects Android orientation quirks
+ }
+ return options;
+}
+```
+
+Typically, you want to use a FILE_URI instead of a DATA_URL to avoid most memory issues. JPEG is the recommended encoding type for Android.
+
+You take a picture by passing in the options object to `getPicture`, which takes a CameraOptions object as the third argument. When you call `setOptions`, pass `Camera.PictureSourceType.CAMERA` as the picture source.
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ displayImage(imageUri);
+ // You may choose to copy the picture, save it somewhere, or upload.
+ func(imageUri);
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+Once you take the picture, you can display it or do something else. In this example, call the app's `displayImage` function from the preceding code.
+
+```js
+function displayImage(imgUri) {
+
+ var elem = document.getElementById('imageFile');
+ elem.src = imgUri;
+}
+```
+
+## Take a Picture and Return Thumbnails (Resize the Picture) <a name="getThumbnails"></a>
+
+To get smaller images, you can return a resized image by passing both `targetHeight` and `targetWidth` values with your CameraOptions object. In this example, you resize the returned image to fit in a 100px by 100px box (the aspect ratio is maintained, so 100px is either the height or width, whichever is greater in the source).
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "camera-thmb") {
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select a File from the Picture Library <a name="selectFile"></a>
+
+When selecting a file using the file picker, you also need to set the CameraOptions object. In this example, set the `sourceType` to `Camera.PictureSourceType.SAVEDPHOTOALBUM`. To open the file picker, call `getPicture` just as you did in the previous example, passing in the success and error callbacks along with CameraOptions object.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select an Image and Return Thumbnails (resized images) <a name="getFileThumbnails"></a>
+
+Resizing a file selected with the file picker works just like resizing using the Camera app. If you are using the file picker instead of the Camera, and you are resizing the image, the `Camera.EncodingType` value must match the value for the selected image. We previously set this value to JPEG in the app's `setOptions` function.
--- End diff --
Yes, you're right! The issue is fixed when I add "ms-appdata:" to the CSP. A little tricky.
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by riknoll <gi...@git.apache.org>.
Github user riknoll commented on a diff in the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#discussion_r59300947
--- Diff: README.md ---
@@ -526,3 +526,207 @@ Tizen only supports a `destinationType` of
[web_activities]: https://hacks.mozilla.org/2013/01/introducing-web-activities/
[wp8_bug]: https://issues.apache.org/jira/browse/CB-2083
[msdn_wp8_docs]: http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh394006.aspx
+
+## Sample: Take Pictures, Select Pictures from the Picture Library, and Get Thumbnails
+
+The Camera plugin allows you to do things like open the device's Camera app and take a picture, or open the file picker and select one. The code snippets in this section demonstrate different tasks including:
+
+* Open the Camera app and take a Picture
+* Take a picture and return thumbnails (resized picture)
+* Take a picture and generate a FileEntry object
+* Select a file from the picture library
+* Select a JPEG image and return thumbnails (resized image)
+* Select an image and generate a FileEntry object
+
+## Take a Picture
+
+Before you can take a picture, you need to set some Camera plugin options to pass into the Camera plugin's `getPicture` function. Here is a common set of recommendations. In this example, you create the object that you will use for the Camera options, and set the `sourceType` dynamically to support both the Camera app and the file picker.
+
+```js
+function setOptions(srcType) {
+ var options = {
+ quality: 20,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
--- End diff --
Why do we recommend this quality? I'm not arguing against it, just curious.
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by riknoll <gi...@git.apache.org>.
Github user riknoll commented on a diff in the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#discussion_r59300666
--- Diff: README.md ---
@@ -526,3 +526,207 @@ Tizen only supports a `destinationType` of
[web_activities]: https://hacks.mozilla.org/2013/01/introducing-web-activities/
[wp8_bug]: https://issues.apache.org/jira/browse/CB-2083
[msdn_wp8_docs]: http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh394006.aspx
+
+## Sample: Take Pictures, Select Pictures from the Picture Library, and Get Thumbnails
+
+The Camera plugin allows you to do things like open the device's Camera app and take a picture, or open the file picker and select one. The code snippets in this section demonstrate different tasks including:
+
+* Open the Camera app and take a Picture
+* Take a picture and return thumbnails (resized picture)
+* Take a picture and generate a FileEntry object
+* Select a file from the picture library
+* Select a JPEG image and return thumbnails (resized image)
+* Select an image and generate a FileEntry object
+
+## Take a Picture
+
+Before you can take a picture, you need to set some Camera plugin options to pass into the Camera plugin's `getPicture` function. Here is a common set of recommendations. In this example, you create the object that you will use for the Camera options, and set the `sourceType` dynamically to support both the Camera app and the file picker.
+
+```js
+function setOptions(srcType) {
+ var options = {
+ quality: 20,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
+ correctOrientation: true //Corrects Android orientation quirks
+ }
+ return options;
+}
+```
+
+Typically, you want to use a FILE_URI instead of a DATA_URL to avoid most memory issues. JPEG is the recommended encoding type for Android.
+
+You take a picture by passing in the options object to `getPicture`, which takes a CameraOptions object as the third argument. When you call `setOptions`, pass `Camera.PictureSourceType.CAMERA` as the picture source.
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ displayImage(imageUri);
+ // You may choose to copy the picture, save it somewhere, or upload.
+ func(imageUri);
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+Once you take the picture, you can display it or do something else. In this example, call the app's `displayImage` function from the preceding code.
+
+```js
+function displayImage(imgUri) {
+
+ var elem = document.getElementById('imageFile');
+ elem.src = imgUri;
+}
+```
+
+## Take a Picture and Return Thumbnails (Resize the Picture)
+
+To get smaller images, you can return a resized image by passing both `targetHeight` and `targetWidth` values with your CameraOptions object. In this example, you resize the returned images to 100px (the aspect ratio is maintained, so 100px is either the height or width, whichever is greater).
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
--- End diff --
Instead of saying "resize the returned images to 100px", perhaps you could rephrase it to something like "resize the returned image to fit in a 100px by 100px box"
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by riknoll <gi...@git.apache.org>.
Github user riknoll commented on a diff in the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#discussion_r59476286
--- Diff: jsdoc2md/TEMPLATE.md ---
@@ -203,3 +203,194 @@ Tizen only supports a `destinationType` of
[web_activities]: https://hacks.mozilla.org/2013/01/introducing-web-activities/
[wp8_bug]: https://issues.apache.org/jira/browse/CB-2083
[msdn_wp8_docs]: http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh394006.aspx
+
+## Sample: Take Pictures, Select Pictures from the Picture Library, and Get Thumbnails <a name="sample"></a>
+
+The Camera plugin allows you to do things like open the device's Camera app and take a picture, or open the file picker and select one. The code snippets in this section demonstrate different tasks including:
+
+* Open the Camera app and [take a Picture](#takePicture)
+* Take a picture and [return thumbnails](#getThumbnails) (resized picture)
+* Take a picture and [generate a FileEntry object](#convert)
+* [Select a file](#selectFile) from the picture library
+* Select a JPEG image and [return thumbnails](#getFileThumbnails) (resized image)
+* Select an image and [generate a FileEntry object](#convert)
+
+## Take a Picture <a name="takePicture"></a>
+
+Before you can take a picture, you need to set some Camera plugin options to pass into the Camera plugin's `getPicture` function. Here is a common set of recommendations. In this example, you create the object that you will use for the Camera options, and set the `sourceType` dynamically to support both the Camera app and the file picker.
+
+```js
+function setOptions(srcType) {
+ var options = {
+ // Some common settings are 20, 50, and 100
+ quality: 50,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
+ correctOrientation: true //Corrects Android orientation quirks
+ }
+ return options;
+}
+```
+
+Typically, you want to use a FILE_URI instead of a DATA_URL to avoid most memory issues. JPEG is the recommended encoding type for Android.
+
+You take a picture by passing in the options object to `getPicture`, which takes a CameraOptions object as the third argument. When you call `setOptions`, pass `Camera.PictureSourceType.CAMERA` as the picture source.
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ displayImage(imageUri);
+ // You may choose to copy the picture, save it somewhere, or upload.
+ func(imageUri);
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+Once you take the picture, you can display it or do something else. In this example, call the app's `displayImage` function from the preceding code.
+
+```js
+function displayImage(imgUri) {
+
+ var elem = document.getElementById('imageFile');
+ elem.src = imgUri;
+}
+```
+
+## Take a Picture and Return Thumbnails (Resize the Picture) <a name="getThumbnails"></a>
+
+To get smaller images, you can return a resized image by passing both `targetHeight` and `targetWidth` values with your CameraOptions object. In this example, you resize the returned image to fit in a 100px by 100px box (the aspect ratio is maintained, so 100px is either the height or width, whichever is greater in the source).
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "camera-thmb") {
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select a File from the Picture Library <a name="selectFile"></a>
+
+When selecting a file using the file picker, you also need to set the CameraOptions object. In this example, set the `sourceType` to `Camera.PictureSourceType.SAVEDPHOTOALBUM`. To open the file picker, call `getPicture` just as you did in the previous example, passing in the success and error callbacks along with CameraOptions object.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select an Image and Return Thumbnails (resized images) <a name="getFileThumbnails"></a>
+
+Resizing a file selected with the file picker works just like resizing using the Camera app. If you are using the file picker instead of the Camera, and you are resizing the image, the `Camera.EncodingType` value must match the value for the selected image. We previously set this value to JPEG in the app's `setOptions` function.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "picker-thmb") {
+ // To downscale a selected image,
+ // Camera.EncodingType (e.g., JPEG) must match the selected image type.
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something with image
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Take a picture and get a FileEntry Object <a name="convert"></a>
+
+If you want to do something like copy the image to another location, or upload it somewhere using the FileTransfer plugin, you need to get a FileEntry object for the returned picture. To do that, call `window.resolveLocalFileSystemURL` on the file URI returned by the Camera app. If you need to use a FileEntry object, set the `destinationType` to `Camera.DestinationType.FILE_URI` in your CameraOptions object (this is also the default value).
+
+>*Note* You need the File plugin to call `window.resolveLocalFileSystemURL`.
+
+Here is the call to `window.resolveLocalFileSystemURL`. The image URI is passed to this function from the success callback of `getPicture`. The success handler of `resolveLocalFileSystemURL` receives the FileEntry object.
+
+```js
+function getFileEntry(imgUri) {
+ window.resolveLocalFileSystemURL(imgUri, function success(fileEntry) {
+
+ // Do something with the FileEntry object, like write to it, upload it, etc.
+ // writeFile(fileEntry, imgUri);
+ console.log("got file: " + fileEntry.fullPath);
+ // displayFileData(fileEntry.nativeURL, "Native URL");
+
+ }, function () {
+ // If don't get the FileEntry (which may happen when testing
+ // on some emulators), copy to a new FileEntry.
+ copyToFile(imgUri);
+ });
+}
+```
+
+In the example shown in the preceding code, you call the app's `copyToFile` function if you don't get a valid FileEntry object. The image URI returned from the Camera app should result in a valid FileEntry, but platform behavior may be different for files returned from the file picker.
+
+The code shown here creates a file in your app's cache (in sandboxed storage) named `tempFile.jpeg`. With the new FileEntry object, you can copy the image to the file or do something else like upload it.
+
+```js
+function copyToFile(imgUri) {
+ window.resolveLocalFileSystemURL(cordova.file.cacheDirectory, function success(dirEntry) {
+
+ // JPEG file
+ dirEntry.getFile("tempFile.jpeg", { create: true, exclusive: false }, function (fileEntry) {
+
+ // Do something with it, like write to it, upload it, etc.
+ // writeFile(fileEntry, imgUri);
--- End diff --
Can we have the full file writing implementation here to? Or can you link to the file plugin README where there is an example? Right now this function doesn't really show the copying part
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by riknoll <gi...@git.apache.org>.
Github user riknoll commented on a diff in the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#discussion_r59602729
--- Diff: jsdoc2md/TEMPLATE.md ---
@@ -203,3 +203,194 @@ Tizen only supports a `destinationType` of
[web_activities]: https://hacks.mozilla.org/2013/01/introducing-web-activities/
[wp8_bug]: https://issues.apache.org/jira/browse/CB-2083
[msdn_wp8_docs]: http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh394006.aspx
+
+## Sample: Take Pictures, Select Pictures from the Picture Library, and Get Thumbnails <a name="sample"></a>
+
+The Camera plugin allows you to do things like open the device's Camera app and take a picture, or open the file picker and select one. The code snippets in this section demonstrate different tasks including:
+
+* Open the Camera app and [take a Picture](#takePicture)
+* Take a picture and [return thumbnails](#getThumbnails) (resized picture)
+* Take a picture and [generate a FileEntry object](#convert)
+* [Select a file](#selectFile) from the picture library
+* Select a JPEG image and [return thumbnails](#getFileThumbnails) (resized image)
+* Select an image and [generate a FileEntry object](#convert)
+
+## Take a Picture <a name="takePicture"></a>
+
+Before you can take a picture, you need to set some Camera plugin options to pass into the Camera plugin's `getPicture` function. Here is a common set of recommendations. In this example, you create the object that you will use for the Camera options, and set the `sourceType` dynamically to support both the Camera app and the file picker.
+
+```js
+function setOptions(srcType) {
+ var options = {
+ // Some common settings are 20, 50, and 100
+ quality: 50,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
+ correctOrientation: true //Corrects Android orientation quirks
+ }
+ return options;
+}
+```
+
+Typically, you want to use a FILE_URI instead of a DATA_URL to avoid most memory issues. JPEG is the recommended encoding type for Android.
+
+You take a picture by passing in the options object to `getPicture`, which takes a CameraOptions object as the third argument. When you call `setOptions`, pass `Camera.PictureSourceType.CAMERA` as the picture source.
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ displayImage(imageUri);
+ // You may choose to copy the picture, save it somewhere, or upload.
+ func(imageUri);
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+Once you take the picture, you can display it or do something else. In this example, call the app's `displayImage` function from the preceding code.
+
+```js
+function displayImage(imgUri) {
+
+ var elem = document.getElementById('imageFile');
+ elem.src = imgUri;
+}
+```
+
+## Take a Picture and Return Thumbnails (Resize the Picture) <a name="getThumbnails"></a>
+
+To get smaller images, you can return a resized image by passing both `targetHeight` and `targetWidth` values with your CameraOptions object. In this example, you resize the returned image to fit in a 100px by 100px box (the aspect ratio is maintained, so 100px is either the height or width, whichever is greater in the source).
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "camera-thmb") {
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select a File from the Picture Library <a name="selectFile"></a>
+
+When selecting a file using the file picker, you also need to set the CameraOptions object. In this example, set the `sourceType` to `Camera.PictureSourceType.SAVEDPHOTOALBUM`. To open the file picker, call `getPicture` just as you did in the previous example, passing in the success and error callbacks along with CameraOptions object.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select an Image and Return Thumbnails (resized images) <a name="getFileThumbnails"></a>
+
+Resizing a file selected with the file picker works just like resizing using the Camera app. If you are using the file picker instead of the Camera, and you are resizing the image, the `Camera.EncodingType` value must match the value for the selected image. We previously set this value to JPEG in the app's `setOptions` function.
--- End diff --
The other possibility is that the type of URI being returned just needs to be whitelisted as part of the content security policy in the HTML file. I've had CSP issues with some of the URIs returned on Android before
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by riknoll <gi...@git.apache.org>.
Github user riknoll commented on a diff in the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#discussion_r59614155
--- Diff: jsdoc2md/TEMPLATE.md ---
@@ -203,3 +203,194 @@ Tizen only supports a `destinationType` of
[web_activities]: https://hacks.mozilla.org/2013/01/introducing-web-activities/
[wp8_bug]: https://issues.apache.org/jira/browse/CB-2083
[msdn_wp8_docs]: http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh394006.aspx
+
+## Sample: Take Pictures, Select Pictures from the Picture Library, and Get Thumbnails <a name="sample"></a>
+
+The Camera plugin allows you to do things like open the device's Camera app and take a picture, or open the file picker and select one. The code snippets in this section demonstrate different tasks including:
+
+* Open the Camera app and [take a Picture](#takePicture)
+* Take a picture and [return thumbnails](#getThumbnails) (resized picture)
+* Take a picture and [generate a FileEntry object](#convert)
+* [Select a file](#selectFile) from the picture library
+* Select a JPEG image and [return thumbnails](#getFileThumbnails) (resized image)
+* Select an image and [generate a FileEntry object](#convert)
+
+## Take a Picture <a name="takePicture"></a>
+
+Before you can take a picture, you need to set some Camera plugin options to pass into the Camera plugin's `getPicture` function. Here is a common set of recommendations. In this example, you create the object that you will use for the Camera options, and set the `sourceType` dynamically to support both the Camera app and the file picker.
+
+```js
+function setOptions(srcType) {
+ var options = {
+ // Some common settings are 20, 50, and 100
+ quality: 50,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
+ correctOrientation: true //Corrects Android orientation quirks
+ }
+ return options;
+}
+```
+
+Typically, you want to use a FILE_URI instead of a DATA_URL to avoid most memory issues. JPEG is the recommended encoding type for Android.
+
+You take a picture by passing in the options object to `getPicture`, which takes a CameraOptions object as the third argument. When you call `setOptions`, pass `Camera.PictureSourceType.CAMERA` as the picture source.
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ displayImage(imageUri);
+ // You may choose to copy the picture, save it somewhere, or upload.
+ func(imageUri);
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+Once you take the picture, you can display it or do something else. In this example, call the app's `displayImage` function from the preceding code.
+
+```js
+function displayImage(imgUri) {
+
+ var elem = document.getElementById('imageFile');
+ elem.src = imgUri;
+}
+```
+
+## Take a Picture and Return Thumbnails (Resize the Picture) <a name="getThumbnails"></a>
+
+To get smaller images, you can return a resized image by passing both `targetHeight` and `targetWidth` values with your CameraOptions object. In this example, you resize the returned image to fit in a 100px by 100px box (the aspect ratio is maintained, so 100px is either the height or width, whichever is greater in the source).
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "camera-thmb") {
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select a File from the Picture Library <a name="selectFile"></a>
+
+When selecting a file using the file picker, you also need to set the CameraOptions object. In this example, set the `sourceType` to `Camera.PictureSourceType.SAVEDPHOTOALBUM`. To open the file picker, call `getPicture` just as you did in the previous example, passing in the success and error callbacks along with CameraOptions object.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select an Image and Return Thumbnails (resized images) <a name="getFileThumbnails"></a>
+
+Resizing a file selected with the file picker works just like resizing using the Camera app. If you are using the file picker instead of the Camera, and you are resizing the image, the `Camera.EncodingType` value must match the value for the selected image. We previously set this value to JPEG in the app's `setOptions` function.
--- End diff --
Cool! That has confused me in the past as well and comes up on Slack sometimes too. Might be worth documenting!
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by riknoll <gi...@git.apache.org>.
Github user riknoll commented on a diff in the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#discussion_r59602299
--- Diff: jsdoc2md/TEMPLATE.md ---
@@ -203,3 +203,194 @@ Tizen only supports a `destinationType` of
[web_activities]: https://hacks.mozilla.org/2013/01/introducing-web-activities/
[wp8_bug]: https://issues.apache.org/jira/browse/CB-2083
[msdn_wp8_docs]: http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh394006.aspx
+
+## Sample: Take Pictures, Select Pictures from the Picture Library, and Get Thumbnails <a name="sample"></a>
+
+The Camera plugin allows you to do things like open the device's Camera app and take a picture, or open the file picker and select one. The code snippets in this section demonstrate different tasks including:
+
+* Open the Camera app and [take a Picture](#takePicture)
+* Take a picture and [return thumbnails](#getThumbnails) (resized picture)
+* Take a picture and [generate a FileEntry object](#convert)
+* [Select a file](#selectFile) from the picture library
+* Select a JPEG image and [return thumbnails](#getFileThumbnails) (resized image)
+* Select an image and [generate a FileEntry object](#convert)
+
+## Take a Picture <a name="takePicture"></a>
+
+Before you can take a picture, you need to set some Camera plugin options to pass into the Camera plugin's `getPicture` function. Here is a common set of recommendations. In this example, you create the object that you will use for the Camera options, and set the `sourceType` dynamically to support both the Camera app and the file picker.
+
+```js
+function setOptions(srcType) {
+ var options = {
+ // Some common settings are 20, 50, and 100
+ quality: 50,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
+ correctOrientation: true //Corrects Android orientation quirks
+ }
+ return options;
+}
+```
+
+Typically, you want to use a FILE_URI instead of a DATA_URL to avoid most memory issues. JPEG is the recommended encoding type for Android.
+
+You take a picture by passing in the options object to `getPicture`, which takes a CameraOptions object as the third argument. When you call `setOptions`, pass `Camera.PictureSourceType.CAMERA` as the picture source.
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ displayImage(imageUri);
+ // You may choose to copy the picture, save it somewhere, or upload.
+ func(imageUri);
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+Once you take the picture, you can display it or do something else. In this example, call the app's `displayImage` function from the preceding code.
+
+```js
+function displayImage(imgUri) {
+
+ var elem = document.getElementById('imageFile');
+ elem.src = imgUri;
+}
+```
+
+## Take a Picture and Return Thumbnails (Resize the Picture) <a name="getThumbnails"></a>
+
+To get smaller images, you can return a resized image by passing both `targetHeight` and `targetWidth` values with your CameraOptions object. In this example, you resize the returned image to fit in a 100px by 100px box (the aspect ratio is maintained, so 100px is either the height or width, whichever is greater in the source).
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "camera-thmb") {
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select a File from the Picture Library <a name="selectFile"></a>
+
+When selecting a file using the file picker, you also need to set the CameraOptions object. In this example, set the `sourceType` to `Camera.PictureSourceType.SAVEDPHOTOALBUM`. To open the file picker, call `getPicture` just as you did in the previous example, passing in the success and error callbacks along with CameraOptions object.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select an Image and Return Thumbnails (resized images) <a name="getFileThumbnails"></a>
+
+Resizing a file selected with the file picker works just like resizing using the Camera app. If you are using the file picker instead of the Camera, and you are resizing the image, the `Camera.EncodingType` value must match the value for the selected image. We previously set this value to JPEG in the app's `setOptions` function.
--- End diff --
Hmmm, that could be a bug. @rakatyal sound familiar? If you could give an example of the URI that is returned we can take a look.
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by riknoll <gi...@git.apache.org>.
Github user riknoll commented on a diff in the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#discussion_r59299069
--- Diff: README.md ---
@@ -526,3 +526,207 @@ Tizen only supports a `destinationType` of
[web_activities]: https://hacks.mozilla.org/2013/01/introducing-web-activities/
[wp8_bug]: https://issues.apache.org/jira/browse/CB-2083
[msdn_wp8_docs]: http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh394006.aspx
+
+## Sample: Take Pictures, Select Pictures from the Picture Library, and Get Thumbnails
+
+The Camera plugin allows you to do things like open the device's Camera app and take a picture, or open the file picker and select one. The code snippets in this section demonstrate different tasks including:
+
+* Open the Camera app and take a Picture
+* Take a picture and return thumbnails (resized picture)
+* Take a picture and generate a FileEntry object
+* Select a file from the picture library
+* Select a JPEG image and return thumbnails (resized image)
+* Select an image and generate a FileEntry object
+
+## Take a Picture
+
+Before you can take a picture, you need to set some Camera plugin options to pass into the Camera plugin's `getPicture` function. Here is a common set of recommendations. In this example, you create the object that you will use for the Camera options, and set the `sourceType` dynamically to support both the Camera app and the file picker.
+
+```js
+function setOptions(srcType) {
+ var options = {
+ quality: 20,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
+ correctOrientation: true //Corrects Android orientation quirks
+ }
+ return options;
+}
+```
+
+Typically, you want to use a FILE_URI instead of a DATA_URL to avoid most memory issues. JPEG is the recommended encoding type for Android.
+
+You take a picture by passing in the options object to `getPicture`, which takes a CameraOptions object as the third argument. When you call `setOptions`, pass `Camera.PictureSourceType.CAMERA` as the picture source.
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ displayImage(imageUri);
+ // You may choose to copy the picture, save it somewhere, or upload.
+ func(imageUri);
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+Once you take the picture, you can display it or do something else. In this example, call the app's `displayImage` function from the preceding code.
+
+```js
+function displayImage(imgUri) {
+
+ var elem = document.getElementById('imageFile');
+ elem.src = imgUri;
+}
+```
+
+## Take a Picture and Return Thumbnails (Resize the Picture)
+
+To get smaller images, you can return a resized image by passing both `targetHeight` and `targetWidth` values with your CameraOptions object. In this example, you resize the returned images to 100px (the aspect ratio is maintained, so 100px is either the height or width, whichever is greater).
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "camera-thmb") {
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select a File from the Picture Library
+
+When selecting a file using the file picker, you also need to set the CameraOptions object. In this example, set the `sourceType` to `Camera.PictureSourceType.SAVEDPHOTOALBUM`. To open the file picker, call `getPicture` just as you did in the previous example, passing in the success and error callbacks along with CameraOptions object.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select an Image and Return Thumbnails (resized images)
+
+Resizing a file selected with the file picker works just like resizing using the Camera app. If you are using the file picker instead of the Camera, and you are resizing the image, the `Camera.EncodingType` value must match the value for the selected image. We previously set this value to JPEG in the app's `setOptions` function.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "picker-thmb") {
+ // To downscale a selected image,
+ // Camera.EncodingType (e.g., JPEG) must match the selected image type.
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something with image
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Take a picture and get a FileEntry Object
+
+If you want to do something like copy the image to another location, or upload it somewhere using the FileTransfer plugin, you need to get a FileEntry object for the returned picture. To do that, call `window.resolveLocalFileSystemURL` on the file URI returned by the Camera app. If you need to use a FileEntry object, set the `destinationType` to `Camera.DestinationType.FILE_URI` in your CameraOptions object (this is also the default value).
+
+```js
+function setOptions(srcType) {
+ var options = {
+ quality: 20,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
+ correctOrientation: true //Corrects Android orientation quirks
+ }
+ return options;
+}
+```
+
+Here is the call to `window.resolveLocalFileSystemURL`. The image URI is passed to this function from the success callback of `getPicture`. The success handler of `resolveLocalFileSystemURL` receives the FileEntry object.
+
+```js
+function getFileEntry(imgUri) {
+ window.resolveLocalFileSystemURL(imgUri, function success(fileEntry) {
+
+ // Do something with the FileEntry object, like write to it, upload it, etc.
+ // writeFile(fileEntry, imgUri);
+ console.log("got file: " + fileEntry.fullPath);
+ displayFileData(fileEntry.nativeURL, "Native URL");
+
+ }, function () {
+ // If you can't easily get the FileEntry (for example, no write access
+ // to Pictures library) copy to a new FileEntry.
+ copyToFile(imgUri);
+ });
+}
+```
+
+In the example shown in the preceding code, you call the app's `copyToFile` function if you don't get a valid FileEntry object. The image URI returned from the Camera app should result in a valid FileEntry, but platform behavior may be different for files returned from the file picker.
+
--- End diff --
Why wouldn't you be able to access the pictures library? I guess in Android the user could deny the permission request. In that case, it would not be able to read the file either, though. Is this something that you experienced in testing? Might be related to the file plugin bug that was blocking writes to external storage on Android (that bug should be fixed in the next plugin release)
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by riknoll <gi...@git.apache.org>.
Github user riknoll commented on a diff in the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#discussion_r59475889
--- Diff: jsdoc2md/TEMPLATE.md ---
@@ -203,3 +203,194 @@ Tizen only supports a `destinationType` of
[web_activities]: https://hacks.mozilla.org/2013/01/introducing-web-activities/
[wp8_bug]: https://issues.apache.org/jira/browse/CB-2083
[msdn_wp8_docs]: http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh394006.aspx
+
+## Sample: Take Pictures, Select Pictures from the Picture Library, and Get Thumbnails <a name="sample"></a>
+
+The Camera plugin allows you to do things like open the device's Camera app and take a picture, or open the file picker and select one. The code snippets in this section demonstrate different tasks including:
+
+* Open the Camera app and [take a Picture](#takePicture)
+* Take a picture and [return thumbnails](#getThumbnails) (resized picture)
+* Take a picture and [generate a FileEntry object](#convert)
+* [Select a file](#selectFile) from the picture library
+* Select a JPEG image and [return thumbnails](#getFileThumbnails) (resized image)
+* Select an image and [generate a FileEntry object](#convert)
+
+## Take a Picture <a name="takePicture"></a>
+
+Before you can take a picture, you need to set some Camera plugin options to pass into the Camera plugin's `getPicture` function. Here is a common set of recommendations. In this example, you create the object that you will use for the Camera options, and set the `sourceType` dynamically to support both the Camera app and the file picker.
+
+```js
+function setOptions(srcType) {
+ var options = {
+ // Some common settings are 20, 50, and 100
+ quality: 50,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
+ correctOrientation: true //Corrects Android orientation quirks
+ }
+ return options;
+}
+```
+
+Typically, you want to use a FILE_URI instead of a DATA_URL to avoid most memory issues. JPEG is the recommended encoding type for Android.
+
+You take a picture by passing in the options object to `getPicture`, which takes a CameraOptions object as the third argument. When you call `setOptions`, pass `Camera.PictureSourceType.CAMERA` as the picture source.
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ displayImage(imageUri);
+ // You may choose to copy the picture, save it somewhere, or upload.
+ func(imageUri);
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+Once you take the picture, you can display it or do something else. In this example, call the app's `displayImage` function from the preceding code.
+
+```js
+function displayImage(imgUri) {
+
+ var elem = document.getElementById('imageFile');
+ elem.src = imgUri;
+}
+```
+
+## Take a Picture and Return Thumbnails (Resize the Picture) <a name="getThumbnails"></a>
+
+To get smaller images, you can return a resized image by passing both `targetHeight` and `targetWidth` values with your CameraOptions object. In this example, you resize the returned image to fit in a 100px by 100px box (the aspect ratio is maintained, so 100px is either the height or width, whichever is greater in the source).
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "camera-thmb") {
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select a File from the Picture Library <a name="selectFile"></a>
+
+When selecting a file using the file picker, you also need to set the CameraOptions object. In this example, set the `sourceType` to `Camera.PictureSourceType.SAVEDPHOTOALBUM`. To open the file picker, call `getPicture` just as you did in the previous example, passing in the success and error callbacks along with CameraOptions object.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select an Image and Return Thumbnails (resized images) <a name="getFileThumbnails"></a>
+
+Resizing a file selected with the file picker works just like resizing using the Camera app. If you are using the file picker instead of the Camera, and you are resizing the image, the `Camera.EncodingType` value must match the value for the selected image. We previously set this value to JPEG in the app's `setOptions` function.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "picker-thmb") {
+ // To downscale a selected image,
+ // Camera.EncodingType (e.g., JPEG) must match the selected image type.
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something with image
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Take a picture and get a FileEntry Object <a name="convert"></a>
+
+If you want to do something like copy the image to another location, or upload it somewhere using the FileTransfer plugin, you need to get a FileEntry object for the returned picture. To do that, call `window.resolveLocalFileSystemURL` on the file URI returned by the Camera app. If you need to use a FileEntry object, set the `destinationType` to `Camera.DestinationType.FILE_URI` in your CameraOptions object (this is also the default value).
+
+>*Note* You need the File plugin to call `window.resolveLocalFileSystemURL`.
--- End diff --
Can you link to the file plugin here?
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by riknoll <gi...@git.apache.org>.
Github user riknoll commented on the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#issuecomment-210056156
LGTM! I'll merge this later today and regenerate the README
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by riknoll <gi...@git.apache.org>.
Github user riknoll commented on a diff in the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#discussion_r59298167
--- Diff: README.md ---
@@ -526,3 +526,207 @@ Tizen only supports a `destinationType` of
[web_activities]: https://hacks.mozilla.org/2013/01/introducing-web-activities/
[wp8_bug]: https://issues.apache.org/jira/browse/CB-2083
[msdn_wp8_docs]: http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh394006.aspx
+
+## Sample: Take Pictures, Select Pictures from the Picture Library, and Get Thumbnails
+
+The Camera plugin allows you to do things like open the device's Camera app and take a picture, or open the file picker and select one. The code snippets in this section demonstrate different tasks including:
+
+* Open the Camera app and take a Picture
+* Take a picture and return thumbnails (resized picture)
+* Take a picture and generate a FileEntry object
+* Select a file from the picture library
+* Select a JPEG image and return thumbnails (resized image)
+* Select an image and generate a FileEntry object
+
+## Take a Picture
+
+Before you can take a picture, you need to set some Camera plugin options to pass into the Camera plugin's `getPicture` function. Here is a common set of recommendations. In this example, you create the object that you will use for the Camera options, and set the `sourceType` dynamically to support both the Camera app and the file picker.
+
+```js
+function setOptions(srcType) {
+ var options = {
+ quality: 20,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
+ correctOrientation: true //Corrects Android orientation quirks
+ }
+ return options;
+}
+```
+
+Typically, you want to use a FILE_URI instead of a DATA_URL to avoid most memory issues. JPEG is the recommended encoding type for Android.
+
+You take a picture by passing in the options object to `getPicture`, which takes a CameraOptions object as the third argument. When you call `setOptions`, pass `Camera.PictureSourceType.CAMERA` as the picture source.
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ displayImage(imageUri);
+ // You may choose to copy the picture, save it somewhere, or upload.
+ func(imageUri);
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+Once you take the picture, you can display it or do something else. In this example, call the app's `displayImage` function from the preceding code.
+
+```js
+function displayImage(imgUri) {
+
+ var elem = document.getElementById('imageFile');
+ elem.src = imgUri;
+}
+```
+
+## Take a Picture and Return Thumbnails (Resize the Picture)
+
+To get smaller images, you can return a resized image by passing both `targetHeight` and `targetWidth` values with your CameraOptions object. In this example, you resize the returned images to 100px (the aspect ratio is maintained, so 100px is either the height or width, whichever is greater).
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "camera-thmb") {
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select a File from the Picture Library
+
+When selecting a file using the file picker, you also need to set the CameraOptions object. In this example, set the `sourceType` to `Camera.PictureSourceType.SAVEDPHOTOALBUM`. To open the file picker, call `getPicture` just as you did in the previous example, passing in the success and error callbacks along with CameraOptions object.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select an Image and Return Thumbnails (resized images)
+
+Resizing a file selected with the file picker works just like resizing using the Camera app. If you are using the file picker instead of the Camera, and you are resizing the image, the `Camera.EncodingType` value must match the value for the selected image. We previously set this value to JPEG in the app's `setOptions` function.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "picker-thmb") {
+ // To downscale a selected image,
+ // Camera.EncodingType (e.g., JPEG) must match the selected image type.
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something with image
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Take a picture and get a FileEntry Object
+
+If you want to do something like copy the image to another location, or upload it somewhere using the FileTransfer plugin, you need to get a FileEntry object for the returned picture. To do that, call `window.resolveLocalFileSystemURL` on the file URI returned by the Camera app. If you need to use a FileEntry object, set the `destinationType` to `Camera.DestinationType.FILE_URI` in your CameraOptions object (this is also the default value).
+
+```js
+function setOptions(srcType) {
+ var options = {
+ quality: 20,
+ destinationType: Camera.DestinationType.FILE_URI,
--- End diff --
It might be helpful to clarify that `window.resolveLocalFileSystemURL` requires that you add the file plugin
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by riknoll <gi...@git.apache.org>.
Github user riknoll commented on a diff in the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#discussion_r59302091
--- Diff: README.md ---
@@ -526,3 +526,207 @@ Tizen only supports a `destinationType` of
[web_activities]: https://hacks.mozilla.org/2013/01/introducing-web-activities/
[wp8_bug]: https://issues.apache.org/jira/browse/CB-2083
[msdn_wp8_docs]: http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh394006.aspx
+
+## Sample: Take Pictures, Select Pictures from the Picture Library, and Get Thumbnails
+
+The Camera plugin allows you to do things like open the device's Camera app and take a picture, or open the file picker and select one. The code snippets in this section demonstrate different tasks including:
+
+* Open the Camera app and take a Picture
+* Take a picture and return thumbnails (resized picture)
+* Take a picture and generate a FileEntry object
+* Select a file from the picture library
+* Select a JPEG image and return thumbnails (resized image)
+* Select an image and generate a FileEntry object
+
+## Take a Picture
+
+Before you can take a picture, you need to set some Camera plugin options to pass into the Camera plugin's `getPicture` function. Here is a common set of recommendations. In this example, you create the object that you will use for the Camera options, and set the `sourceType` dynamically to support both the Camera app and the file picker.
+
+```js
+function setOptions(srcType) {
+ var options = {
+ quality: 20,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
+ correctOrientation: true //Corrects Android orientation quirks
+ }
+ return options;
+}
+```
+
+Typically, you want to use a FILE_URI instead of a DATA_URL to avoid most memory issues. JPEG is the recommended encoding type for Android.
+
+You take a picture by passing in the options object to `getPicture`, which takes a CameraOptions object as the third argument. When you call `setOptions`, pass `Camera.PictureSourceType.CAMERA` as the picture source.
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ displayImage(imageUri);
+ // You may choose to copy the picture, save it somewhere, or upload.
+ func(imageUri);
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+Once you take the picture, you can display it or do something else. In this example, call the app's `displayImage` function from the preceding code.
+
+```js
+function displayImage(imgUri) {
+
+ var elem = document.getElementById('imageFile');
+ elem.src = imgUri;
+}
+```
+
+## Take a Picture and Return Thumbnails (Resize the Picture)
+
+To get smaller images, you can return a resized image by passing both `targetHeight` and `targetWidth` values with your CameraOptions object. In this example, you resize the returned images to 100px (the aspect ratio is maintained, so 100px is either the height or width, whichever is greater).
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "camera-thmb") {
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select a File from the Picture Library
+
+When selecting a file using the file picker, you also need to set the CameraOptions object. In this example, set the `sourceType` to `Camera.PictureSourceType.SAVEDPHOTOALBUM`. To open the file picker, call `getPicture` just as you did in the previous example, passing in the success and error callbacks along with CameraOptions object.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select an Image and Return Thumbnails (resized images)
+
+Resizing a file selected with the file picker works just like resizing using the Camera app. If you are using the file picker instead of the Camera, and you are resizing the image, the `Camera.EncodingType` value must match the value for the selected image. We previously set this value to JPEG in the app's `setOptions` function.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "picker-thmb") {
+ // To downscale a selected image,
+ // Camera.EncodingType (e.g., JPEG) must match the selected image type.
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
--- End diff --
What's the reason for the `Camera.EncodingType` comment? I think it should work either way (on Android at least). Is it different for other platforms?
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by riknoll <gi...@git.apache.org>.
Github user riknoll commented on a diff in the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#discussion_r59298463
--- Diff: README.md ---
@@ -526,3 +526,207 @@ Tizen only supports a `destinationType` of
[web_activities]: https://hacks.mozilla.org/2013/01/introducing-web-activities/
[wp8_bug]: https://issues.apache.org/jira/browse/CB-2083
[msdn_wp8_docs]: http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh394006.aspx
+
+## Sample: Take Pictures, Select Pictures from the Picture Library, and Get Thumbnails
+
+The Camera plugin allows you to do things like open the device's Camera app and take a picture, or open the file picker and select one. The code snippets in this section demonstrate different tasks including:
+
+* Open the Camera app and take a Picture
+* Take a picture and return thumbnails (resized picture)
+* Take a picture and generate a FileEntry object
+* Select a file from the picture library
+* Select a JPEG image and return thumbnails (resized image)
+* Select an image and generate a FileEntry object
+
+## Take a Picture
+
+Before you can take a picture, you need to set some Camera plugin options to pass into the Camera plugin's `getPicture` function. Here is a common set of recommendations. In this example, you create the object that you will use for the Camera options, and set the `sourceType` dynamically to support both the Camera app and the file picker.
+
+```js
+function setOptions(srcType) {
+ var options = {
+ quality: 20,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
+ correctOrientation: true //Corrects Android orientation quirks
+ }
+ return options;
+}
+```
+
+Typically, you want to use a FILE_URI instead of a DATA_URL to avoid most memory issues. JPEG is the recommended encoding type for Android.
+
+You take a picture by passing in the options object to `getPicture`, which takes a CameraOptions object as the third argument. When you call `setOptions`, pass `Camera.PictureSourceType.CAMERA` as the picture source.
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ displayImage(imageUri);
+ // You may choose to copy the picture, save it somewhere, or upload.
+ func(imageUri);
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+Once you take the picture, you can display it or do something else. In this example, call the app's `displayImage` function from the preceding code.
+
+```js
+function displayImage(imgUri) {
+
+ var elem = document.getElementById('imageFile');
+ elem.src = imgUri;
+}
+```
+
+## Take a Picture and Return Thumbnails (Resize the Picture)
+
+To get smaller images, you can return a resized image by passing both `targetHeight` and `targetWidth` values with your CameraOptions object. In this example, you resize the returned images to 100px (the aspect ratio is maintained, so 100px is either the height or width, whichever is greater).
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "camera-thmb") {
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select a File from the Picture Library
+
+When selecting a file using the file picker, you also need to set the CameraOptions object. In this example, set the `sourceType` to `Camera.PictureSourceType.SAVEDPHOTOALBUM`. To open the file picker, call `getPicture` just as you did in the previous example, passing in the success and error callbacks along with CameraOptions object.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select an Image and Return Thumbnails (resized images)
+
+Resizing a file selected with the file picker works just like resizing using the Camera app. If you are using the file picker instead of the Camera, and you are resizing the image, the `Camera.EncodingType` value must match the value for the selected image. We previously set this value to JPEG in the app's `setOptions` function.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "picker-thmb") {
+ // To downscale a selected image,
+ // Camera.EncodingType (e.g., JPEG) must match the selected image type.
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something with image
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Take a picture and get a FileEntry Object
+
+If you want to do something like copy the image to another location, or upload it somewhere using the FileTransfer plugin, you need to get a FileEntry object for the returned picture. To do that, call `window.resolveLocalFileSystemURL` on the file URI returned by the Camera app. If you need to use a FileEntry object, set the `destinationType` to `Camera.DestinationType.FILE_URI` in your CameraOptions object (this is also the default value).
+
+```js
+function setOptions(srcType) {
+ var options = {
+ quality: 20,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
--- End diff --
Is there a reason you show the `setOptions` implementation here but not in all of the above examples? Looks like the same implementation
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by asfgit <gi...@git.apache.org>.
Github user asfgit closed the pull request at:
https://github.com/apache/cordova-plugin-camera/pull/203
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by riknoll <gi...@git.apache.org>.
Github user riknoll commented on a diff in the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#discussion_r59477164
--- Diff: jsdoc2md/TEMPLATE.md ---
@@ -203,3 +203,194 @@ Tizen only supports a `destinationType` of
[web_activities]: https://hacks.mozilla.org/2013/01/introducing-web-activities/
[wp8_bug]: https://issues.apache.org/jira/browse/CB-2083
[msdn_wp8_docs]: http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh394006.aspx
+
+## Sample: Take Pictures, Select Pictures from the Picture Library, and Get Thumbnails <a name="sample"></a>
+
+The Camera plugin allows you to do things like open the device's Camera app and take a picture, or open the file picker and select one. The code snippets in this section demonstrate different tasks including:
+
+* Open the Camera app and [take a Picture](#takePicture)
+* Take a picture and [return thumbnails](#getThumbnails) (resized picture)
+* Take a picture and [generate a FileEntry object](#convert)
+* [Select a file](#selectFile) from the picture library
+* Select a JPEG image and [return thumbnails](#getFileThumbnails) (resized image)
+* Select an image and [generate a FileEntry object](#convert)
+
+## Take a Picture <a name="takePicture"></a>
+
+Before you can take a picture, you need to set some Camera plugin options to pass into the Camera plugin's `getPicture` function. Here is a common set of recommendations. In this example, you create the object that you will use for the Camera options, and set the `sourceType` dynamically to support both the Camera app and the file picker.
+
+```js
+function setOptions(srcType) {
+ var options = {
+ // Some common settings are 20, 50, and 100
+ quality: 50,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
+ correctOrientation: true //Corrects Android orientation quirks
+ }
+ return options;
+}
+```
+
+Typically, you want to use a FILE_URI instead of a DATA_URL to avoid most memory issues. JPEG is the recommended encoding type for Android.
+
+You take a picture by passing in the options object to `getPicture`, which takes a CameraOptions object as the third argument. When you call `setOptions`, pass `Camera.PictureSourceType.CAMERA` as the picture source.
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ displayImage(imageUri);
+ // You may choose to copy the picture, save it somewhere, or upload.
+ func(imageUri);
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+Once you take the picture, you can display it or do something else. In this example, call the app's `displayImage` function from the preceding code.
+
+```js
+function displayImage(imgUri) {
+
+ var elem = document.getElementById('imageFile');
+ elem.src = imgUri;
+}
+```
+
+## Take a Picture and Return Thumbnails (Resize the Picture) <a name="getThumbnails"></a>
+
+To get smaller images, you can return a resized image by passing both `targetHeight` and `targetWidth` values with your CameraOptions object. In this example, you resize the returned image to fit in a 100px by 100px box (the aspect ratio is maintained, so 100px is either the height or width, whichever is greater in the source).
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "camera-thmb") {
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select a File from the Picture Library <a name="selectFile"></a>
+
+When selecting a file using the file picker, you also need to set the CameraOptions object. In this example, set the `sourceType` to `Camera.PictureSourceType.SAVEDPHOTOALBUM`. To open the file picker, call `getPicture` just as you did in the previous example, passing in the success and error callbacks along with CameraOptions object.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select an Image and Return Thumbnails (resized images) <a name="getFileThumbnails"></a>
+
+Resizing a file selected with the file picker works just like resizing using the Camera app. If you are using the file picker instead of the Camera, and you are resizing the image, the `Camera.EncodingType` value must match the value for the selected image. We previously set this value to JPEG in the app's `setOptions` function.
--- End diff --
I'm still a bit confused by the EncodingType comment. What platform has this behavior? Does specifying the encoding type filter what photos appear? I know it doesn't on Android, but I haven't done exhaustive testing on the other platforms and would be interested to know where you encountered that.
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by Mikejo5000 <gi...@git.apache.org>.
Github user Mikejo5000 commented on a diff in the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#discussion_r59600615
--- Diff: jsdoc2md/TEMPLATE.md ---
@@ -203,3 +203,194 @@ Tizen only supports a `destinationType` of
[web_activities]: https://hacks.mozilla.org/2013/01/introducing-web-activities/
[wp8_bug]: https://issues.apache.org/jira/browse/CB-2083
[msdn_wp8_docs]: http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh394006.aspx
+
+## Sample: Take Pictures, Select Pictures from the Picture Library, and Get Thumbnails <a name="sample"></a>
+
+The Camera plugin allows you to do things like open the device's Camera app and take a picture, or open the file picker and select one. The code snippets in this section demonstrate different tasks including:
+
+* Open the Camera app and [take a Picture](#takePicture)
+* Take a picture and [return thumbnails](#getThumbnails) (resized picture)
+* Take a picture and [generate a FileEntry object](#convert)
+* [Select a file](#selectFile) from the picture library
+* Select a JPEG image and [return thumbnails](#getFileThumbnails) (resized image)
+* Select an image and [generate a FileEntry object](#convert)
+
+## Take a Picture <a name="takePicture"></a>
+
+Before you can take a picture, you need to set some Camera plugin options to pass into the Camera plugin's `getPicture` function. Here is a common set of recommendations. In this example, you create the object that you will use for the Camera options, and set the `sourceType` dynamically to support both the Camera app and the file picker.
+
+```js
+function setOptions(srcType) {
+ var options = {
+ // Some common settings are 20, 50, and 100
+ quality: 50,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
+ correctOrientation: true //Corrects Android orientation quirks
+ }
+ return options;
+}
+```
+
+Typically, you want to use a FILE_URI instead of a DATA_URL to avoid most memory issues. JPEG is the recommended encoding type for Android.
+
+You take a picture by passing in the options object to `getPicture`, which takes a CameraOptions object as the third argument. When you call `setOptions`, pass `Camera.PictureSourceType.CAMERA` as the picture source.
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ displayImage(imageUri);
+ // You may choose to copy the picture, save it somewhere, or upload.
+ func(imageUri);
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+Once you take the picture, you can display it or do something else. In this example, call the app's `displayImage` function from the preceding code.
+
+```js
+function displayImage(imgUri) {
+
+ var elem = document.getElementById('imageFile');
+ elem.src = imgUri;
+}
+```
+
+## Take a Picture and Return Thumbnails (Resize the Picture) <a name="getThumbnails"></a>
+
+To get smaller images, you can return a resized image by passing both `targetHeight` and `targetWidth` values with your CameraOptions object. In this example, you resize the returned image to fit in a 100px by 100px box (the aspect ratio is maintained, so 100px is either the height or width, whichever is greater in the source).
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "camera-thmb") {
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select a File from the Picture Library <a name="selectFile"></a>
+
+When selecting a file using the file picker, you also need to set the CameraOptions object. In this example, set the `sourceType` to `Camera.PictureSourceType.SAVEDPHOTOALBUM`. To open the file picker, call `getPicture` just as you did in the previous example, passing in the success and error callbacks along with CameraOptions object.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select an Image and Return Thumbnails (resized images) <a name="getFileThumbnails"></a>
+
+Resizing a file selected with the file picker works just like resizing using the Camera app. If you are using the file picker instead of the Camera, and you are resizing the image, the `Camera.EncodingType` value must match the value for the selected image. We previously set this value to JPEG in the app's `setOptions` function.
--- End diff --
I spent some more time testing this; it is an issue that shows up on Windows 10 (x64/x86) but not on Android/iOS it appears. I think I uncovered a likely bug here; if you set config.xml to Win10 (and target Win10), the image URI returned by getPicture can't be used as an Image source (won't display when assigned to img.src); this specific issue described in the text only appears when config.xml is set to 8.1 AND you are targeting Win10. So the bigger issue appears to be a returned file URI on Win10 that is not easily used as an image source...
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by riknoll <gi...@git.apache.org>.
Github user riknoll commented on a diff in the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#discussion_r59298569
--- Diff: README.md ---
@@ -526,3 +526,207 @@ Tizen only supports a `destinationType` of
[web_activities]: https://hacks.mozilla.org/2013/01/introducing-web-activities/
[wp8_bug]: https://issues.apache.org/jira/browse/CB-2083
[msdn_wp8_docs]: http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh394006.aspx
+
+## Sample: Take Pictures, Select Pictures from the Picture Library, and Get Thumbnails
+
+The Camera plugin allows you to do things like open the device's Camera app and take a picture, or open the file picker and select one. The code snippets in this section demonstrate different tasks including:
+
+* Open the Camera app and take a Picture
+* Take a picture and return thumbnails (resized picture)
+* Take a picture and generate a FileEntry object
+* Select a file from the picture library
+* Select a JPEG image and return thumbnails (resized image)
+* Select an image and generate a FileEntry object
+
+## Take a Picture
+
+Before you can take a picture, you need to set some Camera plugin options to pass into the Camera plugin's `getPicture` function. Here is a common set of recommendations. In this example, you create the object that you will use for the Camera options, and set the `sourceType` dynamically to support both the Camera app and the file picker.
+
+```js
+function setOptions(srcType) {
+ var options = {
+ quality: 20,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
+ correctOrientation: true //Corrects Android orientation quirks
+ }
+ return options;
+}
+```
+
+Typically, you want to use a FILE_URI instead of a DATA_URL to avoid most memory issues. JPEG is the recommended encoding type for Android.
+
+You take a picture by passing in the options object to `getPicture`, which takes a CameraOptions object as the third argument. When you call `setOptions`, pass `Camera.PictureSourceType.CAMERA` as the picture source.
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ displayImage(imageUri);
+ // You may choose to copy the picture, save it somewhere, or upload.
+ func(imageUri);
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+Once you take the picture, you can display it or do something else. In this example, call the app's `displayImage` function from the preceding code.
+
+```js
+function displayImage(imgUri) {
+
+ var elem = document.getElementById('imageFile');
+ elem.src = imgUri;
+}
+```
+
+## Take a Picture and Return Thumbnails (Resize the Picture)
+
+To get smaller images, you can return a resized image by passing both `targetHeight` and `targetWidth` values with your CameraOptions object. In this example, you resize the returned images to 100px (the aspect ratio is maintained, so 100px is either the height or width, whichever is greater).
+
+```js
+function openCamera(selection) {
+
+ var srcType = Camera.PictureSourceType.CAMERA;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "camera-thmb") {
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select a File from the Picture Library
+
+When selecting a file using the file picker, you also need to set the CameraOptions object. In this example, set the `sourceType` to `Camera.PictureSourceType.SAVEDPHOTOALBUM`. To open the file picker, call `getPicture` just as you did in the previous example, passing in the success and error callbacks along with CameraOptions object.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Select an Image and Return Thumbnails (resized images)
+
+Resizing a file selected with the file picker works just like resizing using the Camera app. If you are using the file picker instead of the Camera, and you are resizing the image, the `Camera.EncodingType` value must match the value for the selected image. We previously set this value to JPEG in the app's `setOptions` function.
+
+```js
+function openFilePicker(selection) {
+
+ var srcType = Camera.PictureSourceType.SAVEDPHOTOALBUM;
+ var options = setOptions(srcType);
+ var func = copyToFile;
+
+ if (selection == "picker-thmb") {
+ // To downscale a selected image,
+ // Camera.EncodingType (e.g., JPEG) must match the selected image type.
+ options.targetHeight = 100;
+ options.targetWidth = 100;
+ }
+
+ navigator.camera.getPicture(function cameraSuccess(imageUri) {
+
+ // Do something with image
+
+ }, function cameraError(error) {
+ console.debug("Unable to obtain picture: " + error, "app");
+
+ }, options);
+}
+```
+
+## Take a picture and get a FileEntry Object
+
+If you want to do something like copy the image to another location, or upload it somewhere using the FileTransfer plugin, you need to get a FileEntry object for the returned picture. To do that, call `window.resolveLocalFileSystemURL` on the file URI returned by the Camera app. If you need to use a FileEntry object, set the `destinationType` to `Camera.DestinationType.FILE_URI` in your CameraOptions object (this is also the default value).
+
+```js
+function setOptions(srcType) {
+ var options = {
+ quality: 20,
+ destinationType: Camera.DestinationType.FILE_URI,
+ // In this app, dynamically set the picture source, Camera or photo gallery
+ sourceType: srcType,
+ encodingType: Camera.EncodingType.JPEG,
+ mediaType: Camera.MediaType.PICTURE,
+ allowEdit: true,
+ correctOrientation: true //Corrects Android orientation quirks
+ }
+ return options;
+}
+```
+
+Here is the call to `window.resolveLocalFileSystemURL`. The image URI is passed to this function from the success callback of `getPicture`. The success handler of `resolveLocalFileSystemURL` receives the FileEntry object.
+
+```js
+function getFileEntry(imgUri) {
+ window.resolveLocalFileSystemURL(imgUri, function success(fileEntry) {
+
+ // Do something with the FileEntry object, like write to it, upload it, etc.
+ // writeFile(fileEntry, imgUri);
+ console.log("got file: " + fileEntry.fullPath);
+ displayFileData(fileEntry.nativeURL, "Native URL");
+
+ }, function () {
+ // If you can't easily get the FileEntry (for example, no write access
+ // to Pictures library) copy to a new FileEntry.
+ copyToFile(imgUri);
+ });
--- End diff --
Is `displayFileData()` defined anywhere?
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org
[GitHub] cordova-plugin-camera pull request: Added Sample section to the Ca...
Posted by riknoll <gi...@git.apache.org>.
Github user riknoll commented on the pull request:
https://github.com/apache/cordova-plugin-camera/pull/203#issuecomment-208634228
I made a few comments inline, but nothing major.
Also, `README.md` is actually a generated file in this repo (and this repo only). It would be great if you could move the changes you made in that file over to `jsdoc2md/TEMPLATE.md`. `README.md` should get automatically regenerated with your changes after you make a commit. You can edit `README.md` directly in the other repos (the camera plugin is just special)
---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@cordova.apache.org
For additional commands, e-mail: dev-help@cordova.apache.org