Develop Reference

PhoneGap - How to make a copy of image and save in application folder?

In my app the user can choose one image from gallery, this image will be used in user account and can't be accessible by gallery, so I need sabe a copy of this image into cordova.file.dataDirectory but I don't know how to get local file URI to make copy and save.
How to copy image file from local device to cordova.file.dataDirectory?
My app have a screen where user can give title and choose image using a input file.
I'm using cordova plugin file

Searching I found solution in old documentation of PhoneGap (recent docs no have this information). To copy files just use copyTo method.
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(entry){
var parent = document.getElementById('parent').value;
parentEntry = new DirectoryEntry({fullPath: parent});
// copy the file to a new directory and rename it
entry.copyTo(parentEntry, "file.copy", function(entry){
console.log("New Path: " + entry.fullPath);
}, function(error){
console.log(error.code);
});
}, null);

Cordova app downloaded images showing in gallery

My application downloads a set of images and stores them in the internal storage by creating a folder.
The problem is the images are being shown in the gallery. This should not happen, is there a way to programatically hide the images but still be usable by the app?
Thanks in advance.
EDIT:
This is only happening to the android version of the app. In the iOS it is not showing in the Camera Roll.

This depends where you download the images: If you download them on your Pictures folder or inside of a public folder from sdcard/internal memory then MediaScanner scan them so your pictures will be visible in the Gallery app.
To avoid this you can try one of the following solutions:
Add a .nomedia file inside your destination folder
OR
Download your pictures in app cache directory by using LocalFileSystem.TEMPORARY.
Something like
window.requestFileSystem(LocalFileSystem.TEMPORARY, 0, function(fs) {
fs.root.getDirectory("media", {create: true}, function(fileDirectoryEntry) {
// var destFile = fileDirectory + "/" + filename;
// downloadPicture(srcUrl, destFile);
});
});
The downside of this solution is that when the app is removed, your pictures are deleted as well.

phonegap download and save images from a url to the application installation folder

I am developing an application in phonegap that is supposed to work in both ios and android.
For this application i need to download all images from the server.I was able to download the images to the external memory card using the following code.
function storeIntelligrapeLogo() {
alert('start of file download');
var url = "http://www.kannuronlineservices.com/images/logo.png"; // image url
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fs) {
alert('inside request file sysytem')
var imagePath = 'file:///storage/sdcard0'+fs.root.fullPath + "/logo.png"; // full file path
alert('inside request file sysytem path fs.root==' + fs.root);
alert('inside request file sysytem path fs.root.fullPath==' + fs.root.fullPath);
var fileTransfer = new FileTransfer();
fileTransfer.download(url, imagePath, function(entry) {
alert(entry.fullPath); // entry is fileEntry object
}, function(error) {
alert("Some error" + JSON.stringify(error));
});
}) }
Now i would like this to work in ios also.For that what is the file path i have to use
for 'file:///storage/sdcard0'.Then now the file is downloaded to the external memory card in android and i would like it to be downloaded to the application installation folder and so that when the application is uninstalled,the images also get deleted.Or please suggest me if there exist some other way of doing this,ie:downloading images from server folder and storing it locally with phonegap so that the application is expected to work in offline mode also.
Thanks.

You can use a phonegap plugin.
Look at http://plugins.cordova.io/#/package/de.fastr.phonegap.plugins.downloader
It downloads multiple files to persistant storage on android and ios.

Phonegap Build: download image in one of the folders of your app

I am able to download an image if I specify the path directly with
file:///storage/sdcard0/
How can I save an image to my one of the folders in my app ? I tried this approach to set app path but it doesn't work for me.
This is what I am using so far and it works if you want to save and image to sdcard:
var fileName = "myImage.png";
var fileTransfer = new FileTransfer();
var uri = encodeURI("http://my.url.to.image/myImage.png");
var filePath = "file:///storage/sdcard0/uploads/myImage.png";
fileTransfer.download(
uri,
filePath,
function(entry) {
alert("download complete: " + entry.fullPath);
console.log("download complete: " + entry.fullPath);
},
function(error) {
alert("download error source/target/code:\n" + error.source +" \n||| "+error.target+" \n||| "+error.code);
console.log("download error source/target/code " + error.source+" / "+error.target+" / "+error.code);
}
);
If I use this function:
function getPhoneGapPath() {
'use strict';
var path = window.location.pathname;
var phoneGapPath = path.substring(0, path.lastIndexOf('/') + 1);
return phoneGapPath;
}
I get /android_asset/www/. How would I get the correct path to my app?
The app is using AngularJS and is not bootstrapped in onDeviceReady (developer before me made it that way and now changing it to something like this is beyond me (tried but didn't work)).
Another question I can refer to was asked here.
I also tried this, this, this and this but none worked for me. I get "" for fullPath and recently I managed to get path printed with .toURL() and it was "cdvfile://localhost/persistent". The above download code now also works if I use
filePath = "cdvfile://localhost/persistent/MyAppID/uploads/myImage.png";
but this creates folder /MyAppID/uploads in /storage/sdcard0 which is bad again. My app needs to get to images with
<img src="uploads/myImage.png" alt="myimg"/>
Another useful link is here but it offers no help as to how to write to pre-created folder of your own app.
EDIT: As far as I've learned you cannot write within your own app(read only). That's why I tried to reference images from sdcard with
<img src="file:///storage/sdcard0/Android/data/com.app.my/cache/myImage.png" alt="myimg"/>
and this works! :) Unfortunately this is hardcoded and not good since other phones might have a different persistent location.
If I try
<img src="cdvfile://localhost/persistent/Android/data/com.app.my/cache/myImage.png" alt="myimg"/>
this does not reference the picture :/ (it does download it on storage/sdcard0/Android/data/com.app.my/cache/ though)

I would use the folder alias as defined in the plugin docs here (https://github.com/apache/cordova-plugin-file/blob/master/doc/index.md). Specifically cordova.file.dataDirectory. Note that this is not, afaik, under the www of your original project, but it seems to be the preferred place to store downloads. Once saved there you can resolve that to a URL that you could use to load via AJAX, or in an img tag if you are downloading graphics.

As far as I learned you cannot write to your own app (change items inside your app - /www folder on Android).
My solution was to save images to PERSISTENT storage (sdcard usually).
You can get the path of your app's persistent storage with these steps:
function onDeviceReady() {
console.log('Device Platform: ' + device.platform); // returns 'Android' or 'iOS' for instance
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, fail);
cacheFolderSubPath = "Android/data/com.id.myApp/cache/"; // this is app's cache folder that is removed when you delete your app! (I don't know what this path should be for iOS devices)
}
Then inside gotFS success callback
function gotFS(fileSystem) {
var nturl = fileSystem.root.toNativeURL(); // cdvfile://localhost/persistent/
window.resolveLocalFileSystemURL(nturl+cacheFolderSubPath, onResolveSuccess, onResolveFail);
}
and in onResolveSuccess
function onResolveSuccess(fileEntry){
appCachePath = fileEntry.toNativeURL()+"/"; // file:///storage/sdcard0/Android/data/com.id.myApp/cache/ in my case but some other Androids have storage/emulated/0 or something like that ...
continueCustomExecution();
}
and now in continueCustomExecution() you can run your program and do whatever it is you do ... and in this case download images into appCachePath that we got earlier. You can now successfully reference images in src tags with our appCachePath+yourImageName.
Unfortunately I still don't know how to download an image successfully on iOS. I get an error code 1 with FileTransfer plugin ... (saving to file:///var/mobile/Applications/my.app.id/Documents/). Probably should save somewhere else but this is the path I get when requesting PERSISTENT FileSystem.
Cheers

Path - Android / PhoneGap

am building an app that gets new data from a server - xml and images, and saves that to the sdcard. I then use either the xml from within the app or the one on the sdcard, downloaded from the server. This works fine... the trouble is the xml references images - and ones that were installed with the app work fine.
I need to be able to use the new images, that were downloaded though.
Right now I have the images like so in the xml:
<listImage>images/breakfast/thumb_zucchiniBread.jpg</listImage>
That for images installed with the app. When I get the new xml, and want to use images on the sdcard how can I do this? I've tried using the path the images are downloaded to like so:
<detailImage>data/data/com.gmr.humana/gallery_oats.jpg</detailImage>
But it doesn't work. Have tried Android/data etc...
This needs to work on iOS also, but hoping to just get Android working first.

Get file/image from system local file storage
function getFileSystem{
window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem;
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, fail);
}
function fail() {
console.log("failed to get filesystem");
}
function gotFS(fileSystem) {
console.log("got filesystem");
console.log(fileSystem.root.fullPath);
window.rootFS = fileSystem.root;
}