Part 2: Sencha Store to local CSV file

Sonntag, 2. Februar 2014
Hey guys,

This is Part 2 of 3 How to send a Sencha Store as CSV file by email. If you missed the first part, you would like to take a look here http://abitofcoding.blogspot.com/2014/01/part-1-sencha-touch-store-to-csv-string.html

1. Get Phonegap / Cordova ready
Firstly we will need our app wrapped with Phonegap / Cordova. There are several ways to do, since Touch 2.3.0 Sencha offers a pretty nice integration for Phonegap and Cordova. Since the you can setup your project with a single Sencha CMD command:



// FOR PHONEGAP
// sencha phonegap init [APP IDENTIFIER] [APP NAME]
sencha phonegap init com.mycompany.MyApp MyApp

// FOR CORDOVA
// sencha cordova init [APP IDENTIFIER] [APP NAME]
sencha cordova init com.mycompant.MyApp MyApp


Take a look at the Sencha Docs for more options and information: http://www.sencha.com/blog/leveraging-phonegap-within-sencha-touch/

2. Install requirements
As we need access to the device filesystem we need to install the file plugin for Phonegap / Cordova.
If you use Phonegap / Cordova 3.* it's pretty simple:

// FOR CORDOVA
//same for phonegap as for cordova
cordova plugin add org.apache.cordova.file
// the transfer plugin is not really needed but nice to avoid errors :)
cordova plugin add org.apache.cordova.file-transfer


That's it :D

3. Building and saving

As mentioned Part 1 is about building the CSV string. This one we will use now to safe on file.
You can create and add any content to any kind of file you want.
Take the CSV string from Part 1 as data and take a filename which is something like *.csv and you will have a CSV file created on your device!
Questions or improvements are welcome!

// FOR CORDOVA
DATA2FILE: function(filename, data, callback) {
        // default filename
        var defaultFileName =  'export-file.txt';

        if (filename === undefined || filename === null) {
            filename = defaultFileName;
        }

        // Request the file system
        window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, fail);

        // Access to filesystem is OK
        function gotFS(fileSystem) {
            fileSystem.root.getFile(filename, {create: true}, gotFileEntry, fail);
        }

        // File is ready
        function gotFileEntry(fileEntry) {
            fileEntry.createWriter(gotFileWriter, fail);
        }

        // Write file content
        function gotFileWriter(writer) {
            writer.onwriteend = function(evt) {
                console.log('finished writing');
                if (callback !== undefined) {
                    callback(writer);
                }
            };
            writer.write(data);
        }

        function fail(error) {
            console.log('Error: ', error.code);
        }
    }

To combine the CSV string from Part 1 and this method something like this is possible:

var duSto = Ext.getStore('dummyStore');
STORE2CSV(duSto,null,
 function(csvData){
  DATA2FILE('export.csv',csvData, function( // PART 3 HOW TO SEND COMING SOON){}
        }
)