Junaid Qadir Shekhanzai
Junaid Qadir Shekhanzai

Reputation: 1425

How can I Recursively Read Files and Folders using JavaScript

I've just started discovering Windows StoreApps (that's what Microsoft calls it) and I'm following the sample code here about using the FolderPicker.

I want to Iterate through the folder and read all the sub-folders and files.

There are two functions I've looked at which I thought are what I need but I'm not able to do it properly after trying hours.

In the link above, the line which says:

WinJS.log && WinJS.log("Picked folder: " + folder.name, "sample", "status");

I tried to dig deeper in the folder with something like:

folder.getFoldersAsync().then(function (folderItem) {
    document.getElementById('musicFolder').innerHTML += folderItem.length + " folders)<br/>";
    folderItem.forEach(function (x) {
        document.getElementById('musicFolder').innerHTML += "--" + x.name + "<br/>";
        x.getFilesAsync().then(function (items) {
            document.getElementById('musicFolder').innerHTML += items.length + " files"+"<br>";
        });
    });
});

UPDATE:

I have been struggling but can't get the stuff organized while iterating folders and sub-folders.

@Damir's code doesn't dig deepest folder. We need a recursive function. I could come up with the following function but as I said result is not organized

function scanFolder(folder) {
    var isInc = false;
    folder.getFoldersAsync().then(function (folderItem) {
        if (folderItem.length > 0) {
            folderItem.forEach(function (x) {
                if (!isInc) {
                    isInc = true;
                    hyphen += "-";
                }
                document.getElementById('musicFolder').innerHTML += hyphen + x.name + "</br>";
                x.getFilesAsync().then(function (items) {
                    items.forEach(function (item) {
                        allTracks.push({
                            name: item.name,
                            path: item.path
                        });
                        document.getElementById('musicFolder').innerHTML += hyphen +"-"+ item.name + "</br>";
                    });
                }).done(function () {
                    scanFolder(x);
                });
            });
        }
    });
}

Upvotes: 1

Views: 3984

Answers (1)

Damir Arh
Damir Arh

Reputation: 17855

You want to read all the subfolders and the files inside them? Something like this should work:

folder.getFoldersAsync().then(function (folderItem) {
    document.getElementById('musicFolder').innerHTML += "(" + folderItem.length + " folders)<br/>";
    folderItem.forEach(function (x) {
        x.getFilesAsync().then(function (items) {
            document.getElementById('musicFolder').innerHTML += "--" + x.name + " (" + items.length + " files)<br>";
            items.forEach(function(item) {
                document.getElementById('musicFolder').innerHTML += "----" + item.name + "<br>";
            });
        });
    });
});

EDIT:

There's actually no need for recursion to recursively scan a folder and its subfolders in WinRT. You can use StorageFolder.CreateFileQueryWithOptions() instead:

var options = new Windows.Storage.Search.QueryOptions(Windows.Storage.Search.CommonFileQuery.defaultQuery, ['*']);
options.folderDepth = Windows.Storage.Search.FolderDepth.deep;
folder.createFileQueryWithOptions(options).getFilesAsync().then(function (files) {
    var paths = new Array();
    files.forEach(function(file) {
        paths.push(file.path);
    });
    paths.sort();
    paths.forEach(function(path) {
        document.getElementById('musicFolder').innerHTML += path + "<br>";
    });
});

From here on you can transform the flat list of files to whatever you need instead of just printing out their path.

Upvotes: 3

Related Questions