imgcache.js
Version:
JS library based on the File API to cache images for offline recovery (target: cordova/phonegap & chrome)
73 lines (63 loc) • 2.72 kB
HTML
<html>
<head>
<meta charset="utf-8">
<title>imgcache.js - Tests - promises</title>
<script src="../js/imgcache.js"></script>
<script src="q.js"></script>
<script src="../js/qimgcache.js"></script>
<script>
var correctUrl = 'http://data-gov.tw.rpi.edu/w/images/thumb/f/f1/Processing_Tutorial_Finished.png/180px-Processing_Tutorial_Finished.png',
wrongUrl = 'http://expected.error.error/error.jpg';
QImgCache.cacheFile(correctUrl)
.then(function () {
console.log('expected: A cached');
return QImgCache.getCachedFile(correctUrl)
})
.progress(function (progressEvent) {
console.log('progress: ' + progressEvent.loaded + '/' + progressEvent.total);
})
.fail(function () {
alert('unexpected: A not cached');
})
.then(function (file_entry) {
console.log('SUCCESS - expected: B got file entry'); console.log(file_entry);
})
.fail(function () {
alert('unexpected: B not cached');
});
/* test errors : those are expected to call fail callbacks */
QImgCache.cacheFile(wrongUrl)
.then(function () {
alert('unexpected: C cached');
})
.fail(function () {
console.log('SUCCESS - expected: C not cached');
});
QImgCache.getCachedFile(wrongUrl)
.then(function (file_entry) {
alert.log('ERROR - unexpected: D got file entry'); console.log(file_entry);
})
.fail(function () {
console.log('SUCCESS - expected: D not cached');
});
</script>
<link rel="stylesheet" href="examples.css">
</head>
<body>
<h1>qimgcache.js - Promises</h1>
<div class="clearfix">
<div id="actions">
<p>If you get an alert, then something didn't work.</p>
<p>Check out the console to see what's going on - failure to load cordova is expected</p>
</div>
<div class="note">
<p>Don't forget to accept your browser request to store data on the local computer!</p>
</div>
<div class="note">
<p>If this file is opened in Chrome from a "file://" url, run Chrome with the following flags: <code>--allow-file-access-from-files --allow-file-access</code> in order to <a href="http://stackoverflow.com/questions/6427870/html5-file-api-security-error-while-reading-a-file">avoid a security error</a>.</p>
<p>Otherwise run the page from a web server - <a href="http://updates.html5rocks.com/2011/08/Debugging-the-Filesystem-API">More info</a></p>
</div>
</div>
</body>
</html>