Mihoko Iijima view profile on InterSystems Developer Community

My samples is using 2 JavaScript libraries.
1) JSZip(http://stuk.github.io/jszip)
2) FileSaver.js(https://github.com/eligrey/FileSaver.js/).
These library can downloads some files from one path at once and save as one Zip file.
Simple samples is below:::

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
 <script type="text/javascript" src="http://stuk.github.io/jszip/dist/jszip.min.js" charset="utf-8"></script>
 <script src="FileSaver.min.js" charset="utf-8"></script>
</head>
<body>
<form name=f1 method=post>
<h2>Download＋Zip Simple sample</h2>
Please set urlList variable correct file path in startDL() before testing.
<br>
<input type="button" name="b1" value="Download" onclick=startDL()>
</form>
<script type='text/javascript'>
function startDL(){

//　urlListにはダウンロード用ファイルを直接指定しています。
// 【注意】日本語を含むファイル名はダウンロードできません。
var urlList = ["./ImageTest/IMG_3587.JPG","./ImageTest/IMG_3598.JPG"]
console.log(urlList);

zip = new JSZip();
deferreds = $.Deferred();
var promise = deferreds;


$.map(urlList,function(value,index) {
    console.log('urlList:index='+index+' = '+value);
    console.log('match() : '+value.match(".+/(.+?)([\?#;].*)?$")[1]);

promise = promise.then( function() {
var newPromise = new $.Deferred();

var xhr= new XMLHttpRequest();
  xhr.open('GET',value,true);
xhr.responseType='arraybuffer';
xhr.addEventListener('load', function() {

// zipにレスポンスデータ追加
zip.file(value.match(".+/(.+?)([\?#;].*)?$")[1],xhr.response);
newPromise.resolve();
});
xhr.send();
        return newPromise;
});

});

promise.then( function() {
zip.generateAsync({type:"blob"}).then( function(content){
saveAs(content,'test.zip');
});

});
deferreds.resolve();
}
</script>
</body>
</html>

I attached sample for mojo+dojo.downloadandzip-mojo-dojo_1.zip

go to post

Mihoko Iijima · Jul 13, 2016

<!DOCTYPE html>downloadandzip-mojo-dojo_0.zip
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="http://stuk.github.io/jszip/dist/jszip.min.js" charset="utf-8"></script>
<script src="FileSaver.min.js" charset="utf-8"></script>

</head>
<body>
<form name=f1 method=post>
<h2>Download＋Zip Simple sample</h2>
Please set urlList variable correct file path in startDL() before testing.
<br>
<input type="button" name="b1" value="Download" onclick=startDL()>
</form>
<script type='text/javascript'>
function startDL(){
//　urlListにはダウンロード用ファイルを直接指定しています。
// 【注意】日本語を含むファイル名はダウンロードできません。
var urlList = ["./ImageTest/IMG_3587.JPG","./ImageTest/IMG_3598.JPG"]
console.log(urlList);

zip = new JSZip();
deferreds = $.Deferred();
var promise = deferreds;

$.map(urlList,function(value,index) {
    console.log('urlList:index='+index+' = '+value);
    console.log('match() : '+value.match(".+/(.+?)([\?#;].*)?$")[1]);

promise = promise.then( function() {
var newPromise = new $.Deferred();

var xhr= new XMLHttpRequest();
xhr.open('GET',value,true);
xhr.responseType='arraybuffer';
xhr.addEventListener('load', function() {

// zipにレスポンスデータ追加
zip.file(value.match(".+/(.+?)([\?#;].*)?$")[1],xhr.response);
newPromise.resolve();
});
xhr.send();
        return newPromise;
});

});

promise.then( function() {
zip.generateAsync({type:"blob"}).then( function(content){
saveAs(content,'test.zip');
});

});
deferreds.resolve();
}
</script>
</body>
</html>

I attached sample for mojo+dojo.

Followers:

show all 1

Ken W.

Following:

Mihoko has not followed anybody yet.

Global Masters badges:

show all 5

Social networks

InterSystems resources