Implementing logic in HTML5 FileSystem API

I have this fiddle (please use Google Chrome when running the fiddle).

I would like to know how to properly implement this using HTML 5 file system API.

Use Case: When appending something in the sandbox filesystem API, I would like to check first if the file size of the existing file exceeds a particular threshold level. If so, rename or delete the file.

$(document).ready(function () {
    var messages = "A sample text!";
    navigator.webkitPersistentStorage.requestQuota(1024 * 1024, function (availBytes) {
        window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem;
        window.requestFileSystem(window.PERSISTENT, availBytes, function (fs) {
            fs.root.getFile("sample.txt", {
                create: true
            }, function (file) {
                console.log("file.name =" + file.name);
                console.log("file.fullPath =" + file.fullPath);

                file.getMetadata(function (md) {
                    //1. check the file size first (md.size)
                    //2. if file size > 100KB
                    //       2.1 delete the existing file or rename it
                    //       2.2 create a new file
                    //   else
                    //       3 create a new file
                }, this.onError);

                file.createWriter(function (fileWriter) {

                    fileWriter.onerror = function (e) {
                        console.log('Write failed: ' + e.toString());
                    };
                    fileWriter.seek(fileWriter.length); // Start write position at EOF.
                    var blob = new Blob([messages], {
                        type: 'plain/text'
                    });
                    fileWriter.write(blob);
                }, this.onError);
            }, this.onError);
        }, this.onError); //end window.requestFileSystem
    }, function (e) {
        console.log('Error', e);
    });

    function onError(e) {
        var msg = '';

        switch (e.code) {
            case FileError.QUOTA_EXCEEDED_ERR:
                msg = 'QUOTA_EXCEEDED_ERR';
                break;
            case FileError.NOT_FOUND_ERR:
                msg = 'NOT_FOUND_ERR';
                break;
            case FileError.SECURITY_ERR:
                msg = 'SECURITY_ERR';
                break;
            case FileError.INVALID_MODIFICATION_ERR:
                msg = 'INVALID_MODIFICATION_ERR';
                break;
            case FileError.INVALID_STATE_ERR:
                msg = 'INVALID_STATE_ERR';
                break;
            default:
                msg = 'Unknown Error';
                break;
        };

        console.log('Error: ' + msg);
    }
});

I used the

 file.getMetadata(function (md) {
            //1. check the file size first (md.size)
            //2. if file size > 100KB
            //       2.1 delete the existing file or rename it
            //       2.2 create a new file
            //   else
            //       3 create a new file
        }, this.onError);

But I am confuse how to prevent the createwriter from running since they are on the same callback function.

I would like to know how to properly sequence my code such that, I will check first the file size of the existing file prior to appending.

There are a lot of callback functions on the FileEntry interface and I am getting confused if I would put them or use them all at once.

  fs.root.getFile('sample.txt', {create: true, exclusive: true}, function(fileEntry) {
    //fileEntry.getMetadata(successCallback, opt_errorCallback);
    //fileEntry.remove(successCallback, opt_errorCallback);
    //fileEntry.moveTo(dirEntry, opt_newName, opt_successCallback, opt_errorCallback);
    //fileEntry.copyTo(dirEntry, opt_newName, opt_successCallback, opt_errorCallback);
    //fileEntry.getParent(successCallback, opt_errorCallback);
    //fileEntry.toURL(opt_mimeType);
    }, errorHandler);

  }

file.createWriter(function (fileWriter) {})