HTML and CSS Reference
In-Depth Information
You should save a reference to the newly created folder somewhere so that you can retrieve it later
when you actually store the picture. To do that, declare a new global property on the application root
object. Edit your instantPhotoApp.js file so it begins as shown below:
var instantPhotoApp = instantPhotoApp || {};
instantPhotoApp.customFolder = null;
The net effect of the code is that any time the Instant Photo application is launched, it checks
whether the Instant Photo folder already exists within the Pictures Library; if it doesn't exist, the
application creates it. In either case, the end result is that the app stores a reference to the folder
object in the newly created customFolder property.
Saving a copy of the picture
The webcam capture dialog box returns a file reference to the captured stream. In terms of the
Windows 8 API, the then promise triggered by the camera dialog receives a StorageFile object. You
first encountered this object in Chapter 10, “Adding persistent data to applications.”
A StorageFile object has a handy method named copyAsync that copies the file to a given folder.
Therefore, to save the captured photo to the Pictures library, you need to add the following line to
the then promise right after you display the image.
// Here file is the storage object returned by the camera capture UI dialog
Here's the full code you need to run when the user clicks the button to take a new picture:
instantPhotoApp.takePicture = function () {
try {
var dialog = new Windows.Media.Capture.CameraCaptureUI();
var aspectRatio = { width: 16, height: 9 };
dialog.photoSettings.croppedAspectRatio = aspectRatio;
dialog.photoSettings.format = Windows.Media.Capture.
.then(function (file) {
if (file) {
var viewer = document.getElementById("imgPhoto");
viewer.src = URL.createObjectURL(file);
} catch (err) {
// Show some error message
Search WWH ::

Custom Search