First we must change
cordova.xml
-----------
<access origin="*"/>
HTML:
--------
<!DOCTYPE HTML>
<html>
<head>
<meta name="viewport" content="width=320; user-scalable=yes" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Image Download Demo</title>
<script type="text/javascript" charset="utf-8" src="jquery-1.8.2.min.js"></script>
<script type="text/javascript" charset="utf-8" src="cordova-1.7.0.js"></script>
<script type="text/javascript" charset="utf-8">
//Global instance of DirectoryEntry for our data
var DATADIR;
var knownfiles = [];
//Loaded my file system, now let's get a directory entry for where I'll store my crap
function onFSSuccess(fileSystem) {
//alert("onsuccess");
//Android/data/com.asman.imagedownloaddemo----is where we want store the files
fileSystem.root.getDirectory(
"Android/data/com.asman.imagedownloaddemo", {
create : true
}, gotDir, onError);
}
//The directory entry callback
function gotDir(d) {
//alert("got dir");
console.log("got dir");
DATADIR = d;
var reader = DATADIR.createReader();
reader.readEntries(function(d) {
gotFiles(d);
appReady();
}, onError);
}
//Result of reading my directory
function gotFiles(entries) {
//alert("gotfiles");
console.log("The dir has " + entries.length + " entries.");
for ( var i = 0; i < entries.length; i++) {
console.log(entries[i].name + ' dir? ' + entries[i].isDirectory);
knownfiles.push(entries[i].name);
renderPicture(entries[i].fullPath);
}
}
function renderPicture(path) {
//alert("renderpicture");
$("#photos").append("<img src='file://"+path+"'>");
console.log("<img src='file://"+path+"'>");
}
function onError(e) {
console.log("ERROR");
console.log(JSON.stringify(e));
}
function onDeviceReady() {
//what do we have in cache already?
//alert("gasaf");
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, onFSSuccess,
null);
}
//http://www.raymondcamden.com/demos/2012/jan/17/imagelister.cfc?method=listimages
//get files names
function appReady() {
//alert("app ready");
$("#status").html("Ready to check remote files...");
$
.get(
"http://172.16.16.81:2020/TrendsRest/images",
{},
function(res1) {
//alert(res1);
var res=res1.images;
//alert(res.length);
if (res.length > 0) {
$("#status").html(
"Going to sync some images...");
for ( var i = 0; i < res.length; i++) {
if (knownfiles.indexOf(res[i]) == -1) {
console.log("need to download "
+ res[i]);
//alert("res"+res[i]);
var ft = new FileTransfer();
var dlPath = DATADIR.fullPath + "/"
+ res[i];
//alert("dlpath"+dlPath);
console.log("downloading crap to "
+ dlPath);
ft
.download(
"http://172.16.16.81:2020/TrendsRest/files/"
+ escape(res[i]),
dlPath,
function() {
renderPicture(dlPath);
console
.log("Successful download");
//alert(dlPath);
}, onError);
}
}
}
$("#status").html("");
}, "json");
}
function init() {
//alert("dsgdfsgfd");
document.addEventListener("deviceready", onDeviceReady, true);
}
</script>
<style>
img {
max-width: 200px;
}
</style>
</head>
<body onload="init();">
<h2>Image Download Demo</h2>
<div id="status"></div>
<div id="photos"></div>
</body>
</html>
Refer
http://www.raymondcamden.com/index.cfm/2012/1/19/Downloading-files-to-a-PhoneGap-application--Part-1
cordova.xml
-----------
<access origin="*"/>
HTML:
--------
<!DOCTYPE HTML>
<html>
<head>
<meta name="viewport" content="width=320; user-scalable=yes" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Image Download Demo</title>
<script type="text/javascript" charset="utf-8" src="jquery-1.8.2.min.js"></script>
<script type="text/javascript" charset="utf-8" src="cordova-1.7.0.js"></script>
<script type="text/javascript" charset="utf-8">
//Global instance of DirectoryEntry for our data
var DATADIR;
var knownfiles = [];
//Loaded my file system, now let's get a directory entry for where I'll store my crap
function onFSSuccess(fileSystem) {
//alert("onsuccess");
//Android/data/com.asman.imagedownloaddemo----is where we want store the files
fileSystem.root.getDirectory(
"Android/data/com.asman.imagedownloaddemo", {
create : true
}, gotDir, onError);
}
//The directory entry callback
function gotDir(d) {
//alert("got dir");
console.log("got dir");
DATADIR = d;
var reader = DATADIR.createReader();
reader.readEntries(function(d) {
gotFiles(d);
appReady();
}, onError);
}
//Result of reading my directory
function gotFiles(entries) {
//alert("gotfiles");
console.log("The dir has " + entries.length + " entries.");
for ( var i = 0; i < entries.length; i++) {
console.log(entries[i].name + ' dir? ' + entries[i].isDirectory);
knownfiles.push(entries[i].name);
renderPicture(entries[i].fullPath);
}
}
function renderPicture(path) {
//alert("renderpicture");
$("#photos").append("<img src='file://"+path+"'>");
console.log("<img src='file://"+path+"'>");
}
function onError(e) {
console.log("ERROR");
console.log(JSON.stringify(e));
}
function onDeviceReady() {
//what do we have in cache already?
//alert("gasaf");
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, onFSSuccess,
null);
}
//http://www.raymondcamden.com/demos/2012/jan/17/imagelister.cfc?method=listimages
//get files names
function appReady() {
//alert("app ready");
$("#status").html("Ready to check remote files...");
$
.get(
"http://172.16.16.81:2020/TrendsRest/images",
{},
function(res1) {
//alert(res1);
var res=res1.images;
//alert(res.length);
if (res.length > 0) {
$("#status").html(
"Going to sync some images...");
for ( var i = 0; i < res.length; i++) {
if (knownfiles.indexOf(res[i]) == -1) {
console.log("need to download "
+ res[i]);
//alert("res"+res[i]);
var ft = new FileTransfer();
var dlPath = DATADIR.fullPath + "/"
+ res[i];
//alert("dlpath"+dlPath);
console.log("downloading crap to "
+ dlPath);
ft
.download(
"http://172.16.16.81:2020/TrendsRest/files/"
+ escape(res[i]),
dlPath,
function() {
renderPicture(dlPath);
console
.log("Successful download");
//alert(dlPath);
}, onError);
}
}
}
$("#status").html("");
}, "json");
}
function init() {
//alert("dsgdfsgfd");
document.addEventListener("deviceready", onDeviceReady, true);
}
</script>
<style>
img {
max-width: 200px;
}
</style>
</head>
<body onload="init();">
<h2>Image Download Demo</h2>
<div id="status"></div>
<div id="photos"></div>
</body>
</html>
Refer
http://www.raymondcamden.com/index.cfm/2012/1/19/Downloading-files-to-a-PhoneGap-application--Part-1
No comments:
Post a Comment