deployment-tool/examples/ui/file-reader.html at master · cpswarm/deployment-tool · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
<html>
<head>
    <script src="lib/jszip-3.1.5.min.js"></script>
</head>
<body>

<input type="file" id="files" name="files[]" webkitdirectory multiple />
<output id="list"></output>

<script>
    function handleFileSelect(evt) {
        var files = evt.target.files; // FileList object

        var output = [];

        new Promise(function(resolve, reject) {
            // too many files may cause problems
            console.log("Selected files:", files.length);

            var archive = new JSZip();
            var pending = files.length;

            for (var i = 0, f; f = files[i]; i++) {
                output.push('<li><strong>', escape(f.name), '</strong> (', f.type || 'n/a', ') - ',
                    f.size, ' bytes, last modified: ',
                    f.lastModifiedDate ? f.lastModifiedDate.toLocaleDateString() : 'n/a',
                    '</li>');

                // console.log(f);

                var reader = new FileReader();

                // Closure to capture the file information.
                reader.onload = (function (file) {
                    return function (e) {
                        // console.log("e:", e.target.result);
                        console.log("loaded:", file.webkitRelativePath);
                        // parent directory name is in the path
                        // trim selected directory name
                        console.log(file.webkitRelativePath);
                        var path = file.webkitRelativePath.substring(file.webkitRelativePath.indexOf('/')+1)
                        archive.file(path, file);
                        console.log(path);

                        // count down and resolve promise
                        pending--;
                        if(pending == 0){
                            resolve(archive);
                        }
                    };
                })(f);

                // Read in the image file as a data URL.
                reader.readAsArrayBuffer(f); // bytes array
                // reader.readAsDataURL(f); // header + base64_encoded
            }
            document.getElementById('list').innerHTML = '<ul>' + output.join('') + '</ul>';
        }).then(function(archive) {
            return archive.generateAsync({type: "base64"});
        }).then(function (z) {
            console.log("zip", z);
        });


    }

    document.getElementById('files').addEventListener('change', handleFileSelect, false);
</script>
</body>
</html>