// make dataset globally available
var dz;

// load miso dataset and create table
function load_dataset(data) {
  dz = new Miso.Dataset({
    data: data,
    delimiter: "auto"
  });

  dz.fetch({
    success: create_table,
    error: function(err) { alert(err) }
  });
}

// create a table with column headers, types, and data
function create_table() {
  var dz = this;
  
  // table stats
  var stats = d3.select("#stats")
    .html("")

  stats.append("div")
    .text("Columns: " + dz.columnNames().length)

  stats.append("div")
    .text("Rows: " + dz.length)

  d3.select("#table")
    .html("")
    .append("tr")
    .attr("class","fixed")
    .selectAll("th")
    .data(dz.columnNames())
    .enter().append("th")
      .text(function(d) { return d; });

  d3.select("#table")
    .append("tr")
    .selectAll("th")
    .data(dz.columnNames().map(function(d) { return dz.column(d)["type"]; }))
    .enter().append("th")
      .attr("class", function(d) { return d; })
      .text(function(d) { return d; });

  d3.select("#table")
    .selectAll("tr.row")
      .data(d3.range(dz.length).map(function(d) { return dz.rowByPosition(d); }))
    .enter().append("tr")
      .attr("class", "row")
      .selectAll("td")
      .data(function(d) { return dz.columnNames().map(function(key) { return d[key] }) ; })
      .enter().append("td")
        .text(function(d) { return d; });
}

// handle upload button
function upload_button(el, callback) {
  var uploader = document.getElementById(el);  
  var reader = new FileReader();

  reader.onload = function(e) {
    var contents = e.target.result;
    callback(contents);
  };

  uploader.addEventListener("change", handleFiles, false);  

  function handleFiles() {
    d3.select("#table").text("loading...");
    var file = this.files[0];
    reader.readAsText(file);
  };
};