Importing CSV with header / Autoadjustable table

Hi Active Users,

I have discovered Grid 1.0 last week and I have to say I was (and still am) very impressed - very good job!

This week, I tried using it to create a data editor for a statistical program. Well, for this purpose, I think I will wait for next version (editable one). though I tried the patch version which works, I prefer to wait a more official stuff. Little question: do you still intend to keep your dual-licence approach? I am working in a univeristy, only for open-source projects and would not be able to buy something...

Anyway, here is my little contribution: a function to load an external CSV, based on one I found on this forum, which also writes the good CSS to obtain a table with good sizes.

function LoadTXTfile(URLfic){

    // create ActiveWidgets data model - text-based table
    var table = new Active.Text.Table;
    // provide data URL - plain text comma-separated file
    table.setURL(URLfic);
    var Datalen = 0;
    var myData =[];
    var TestmyData =[];
    var myColumns =[];
    var CloneColumns =[];
    var CloneData = [];
    var ColSelected =[];
    var NumColSel = 0;
    var Xsentence ="";
    var maxcol = 150;
    var lastcol = 0;
    var ColLength = [];
    
    var obj = new Active.Controls.Grid;
    obj.setStatusProperty("code", "loading");
    var defaultResponse = table.response;
    table.response = function(data){
    defaultResponse.call(table, data);
    Datalen=table.getCount();


    // load second CSV line (max 150 cols) to calculate last not empty field
    var x=1;
    var y=0;
    Xsentence = 'TestmyData.push([table.getText( ' + x + ', ' + y + ')';
    y=1;
    for(y=1; y< maxcol; y++) { Xsentence += ', table.getText( ' + x + ', ' + y + ')'; }
    Xsentence += '])';
    eval(Xsentence);

    // calculate ths CSV file last data column
    for(var x=0; x< maxcol; x++) { if(TestmyData[0][x]!=table.getText(0, x)) {lastcol = x+1; } }
    //alert(lastcol);

    TestmyData = [];

    NumColSel = lastcol;
    for(var x=0; x< lastcol; x++) { ColSelected.push([x]); }
    LoadData();
    function LoadData() {
        // load first CSV line into array myColumns (note: remove next line -- if myColumns load as array
        // take header size also
        for(var x=0; x< lastcol; x++) {
            myColumns.push([table.getText( 0, x)]);
            ColLength.push((myColumns[x])[0].length);
            }

        CloneColumns = myColumns ;

        // load CSV data lines 2 to bottom into array myData
        var x=1; // x=0 -- if myColumns load as array or in a separate CSV file
        var y=0;

        while( x< Datalen) {
            Xsentence = 'myData.push([table.getText( ' + x + ', ' + y + ')';
            var tmpsize = table.getText(x,y).length;
            if (tmpsize> ColLength[y]) ColLength[y]= tmpsize

            y=1;
            for(y=1; y< lastcol; y++) {
                Xsentence += ', table.getText( ' + x + ', ' + y + ')';
                var tmpsize = table.getText(x,y).length;
                if (tmpsize> ColLength[y]) ColLength[y]= tmpsize
                }
            Xsentence += '])';
            eval(Xsentence);
        y=0;
        x++; }

        // clone the arrays and use tem as default
        CloneColumns = myColumns ;
        CloneData = myData ;

        // load data javascript objects
        obj.setRowProperty("count", Datalen-1);
        obj.setColumnProperty("count", NumColSel);
        obj.setDataProperty("text", function(i, j){return CloneData[i][j]});
        obj.setColumnProperty("text", function(i){return CloneColumns[i]});

        // write good CSS to "auto-size" the grid
        var objid=obj.getId();
        var stylesheet = document.styleSheets[document.styleSheets.length-1];
        var TableWidth=0;
        for(var x=0; x <lastcol;x++){
            var colWidth = 20+(ColLength[x]*7);
            stylesheet.addRule("#"+objid+ " .active-column-"+x,"width:"+colWidth+"px");
            TableWidth += colWidth;
        }
        //TableWidth += 1;

        stylesheet.addRule("#"+objid, "width:"+TableWidth+"px");
        var TableHeight=(20+(Datalen-1)*18);
        stylesheet.addRule("#"+objid, "height:"+TableHeight+"px");
    }
    // let the browser paint the grid
    window.setTimeout(function(){
    obj.setStatusProperty("code", "");
    obj.refresh();
    }, 0);
    }
    // start asyncronous data retrieval
    table.request();
    // writes obj / One could also imagine returning directly obj for more operations on it...
    obj.setRowHeaderWidth("0px");
    document.write(obj);
}

Not possible to provide an example: data directory does not contain any data file with headers.

Best wishes,