<commit_before><!DOCTYPE HTML>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  <title>CSVView</title>
  <link rel="stylesheet" href="SlickGrid/slick.grid.css" type="text/css"/>
  <link rel="stylesheet" href="SlickGrid/css/smoothness/jquery-ui-1.8.16.custom.css" type="text/css"/>
  <link rel="stylesheet" href="SlickGrid/examples/examples.css" type="text/css"/>
  <style>
    .cell-story {
      white-space: normal !important;
      line-height: 19px !important;
    }

    .loading-indicator {
      display: inline-block;
      padding: 12px;
      background: white;
      -opacity: 0.5;
      color: black;
      font-weight: bold;
      z-index: 9999;
      border: 1px solid red;
      -moz-border-radius: 10px;
      -webkit-border-radius: 10px;
      -moz-box-shadow: 0 0 5px red;
      -webkit-box-shadow: 0px 0px 5px red;
      -text-shadow: 1px 1px 1px white;
    }

    .loading-indicator label {
      padding-left: 20px;
      background: url('SlickGrid/images/ajax-loader-small.gif') no-repeat center left;
    }
  </style>
</head>
<body>
<div style="width:100%;float:left;">
  <div id="myGrid" style="width:100%;height:800px;"></div>
</div>

<script src="SlickGrid/lib/firebugx.js"></script>

<script src="SlickGrid/lib/jquery-1.7.min.js"></script>
<script src="SlickGrid/lib/jquery-ui-1.8.16.custom.min.js"></script>
<script src="SlickGrid/lib/jquery.event.drag-2.2.js"></script>
<script src="SlickGrid/lib/jquery.jsonp-2.4.min.js"></script>

<script src="SlickGrid/slick.core.js"></script>
<script src="SlickGrid/slick.grid.js"></script>
<script src="csvview.remotemodel.js"></script>
<!-- <script src="bart-columns.js"></script> -->

<script>
  var grid;
  var loader = new CSVView.Data.RemoteModel("${table_name}");

  var options = {
    editable: false,
    enableAddRow: false,
    enableCellNavigation: false
  };

  var loadingIndicator = null;

  /* Create a grid from the specified set of columns */
  function createGrid( columns ) 
  {
    grid = new Slick.Grid("#myGrid", loader.data, columns, options);

    grid.onViewportChanged.subscribe(function (e, args) {
      var vp = grid.getViewport();
      loader.ensureData(vp.top, vp.bottom);
    });

    grid.onSort.subscribe(function (e, args) {
      loader.setSort(args.sortCol.field, args.sortAsc ? 1 : -1);
      var vp = grid.getViewport();
      loader.ensureData(vp.top, vp.bottom);
    });

    loader.onDataLoading.subscribe(function () {
      if (!loadingIndicator) {
        loadingIndicator = $("<span class='loading-indicator'><label>Buffering...</label></span>").appendTo(document.body);
        var $g = $("#myGrid");

        loadingIndicator
            .css("position", "absolute")
            .css("top", $g.position().top + $g.height() / 2 - loadingIndicator.height() / 2)
            .css("left", $g.position().left + $g.width() / 2 - loadingIndicator.width() / 2);
      }

      loadingIndicator.show();
    });

    loader.onDataLoaded.subscribe(function (e, args) {
      for (var i = args.from; i <= args.to; i++) {
        grid.invalidateRow(i);
      }

      grid.updateRowCount();
      grid.render();

      loadingIndicator.fadeOut();
    });

    // load the first page
    grid.onViewportChanged.notify();
  };

  function onInitialImage( response ) {
    // let's approximate the column width:
    var colWidths = {};
    var rowData = response.results;
    for ( var i = 0; i < rowData.length; i++ ) {
      var row = rowData[ i ];
      var cnm;
      for ( cnm in row ) {
        var cellVal = row[ cnm ];
        if( cellVal )
          colWidths[ cnm ] = Math.max( colWidths[ cnm ] || 0, 16 + ( 6 * cellVal.toString().length ) );
      }
    }
    var ci = response.columnInfo;
    for (var i = 0; i < ci.length; i++) {
      ci[i].toolTip = ci[i].name;
      ci[i].sortable = true;
      ci[i].width = colWidths[ ci[i].field ];
    }
    createGrid( ci );
  };

  $(function () {
      var url = "tables/${table_name}";
      req = $.get( url, 
                  { startRow: 0, rowLimit: 50 },
                  onInitialImage );
  });
</script><commit_msg>Better column sizing<commit_after><!DOCTYPE HTML>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  <title>CSVView</title>
  <link rel="stylesheet" href="SlickGrid/slick.grid.css" type="text/css"/>
  <link rel="stylesheet" href="SlickGrid/css/smoothness/jquery-ui-1.8.16.custom.css" type="text/css"/>
  <link rel="stylesheet" href="SlickGrid/examples/examples.css" type="text/css"/>
  <style>
    body {
      margin: 16px;
      margin-top: 8px;
    }
    .cell-story {
      white-space: normal !important;
      line-height: 19px !important;
    }

    .loading-indicator {
      display: inline-block;
      padding: 12px;
      background: white;
      -opacity: 0.5;
      color: black;
      font-weight: bold;
      z-index: 9999;
      border: 1px solid red;
      -moz-border-radius: 10px;
      -webkit-border-radius: 10px;
      -moz-box-shadow: 0 0 5px red;
      -webkit-box-shadow: 0px 0px 5px red;
      -text-shadow: 1px 1px 1px white;
    }

    .loading-indicator label {
      padding-left: 20px;
      background: url('SlickGrid/images/ajax-loader-small.gif') no-repeat center left;
    }
  </style>
</head>
<body>
<div style="width:100%;float:left;">
  <div id="myGrid" style="width:100%;height:800px;"></div>
</div>

<script src="SlickGrid/lib/firebugx.js"></script>

<script src="SlickGrid/lib/jquery-1.7.min.js"></script>
<script src="SlickGrid/lib/jquery-ui-1.8.16.custom.min.js"></script>
<script src="SlickGrid/lib/jquery.event.drag-2.2.js"></script>
<script src="SlickGrid/lib/jquery.jsonp-2.4.min.js"></script>

<script src="SlickGrid/slick.core.js"></script>
<script src="SlickGrid/slick.grid.js"></script>
<script src="csvview.remotemodel.js"></script>
<!-- <script src="bart-columns.js"></script> -->

<script>
  var grid;
  var loader = new CSVView.Data.RemoteModel("${table_name}");

  var options = {
    editable: false,
    enableAddRow: false,
    enableCellNavigation: false
  };

  var loadingIndicator = null;

  /* Create a grid from the specified set of columns */
  function createGrid( columns ) 
  {
    grid = new Slick.Grid("#myGrid", loader.data, columns, options);

    grid.onViewportChanged.subscribe(function (e, args) {
      var vp = grid.getViewport();
      loader.ensureData(vp.top, vp.bottom);
    });

    grid.onSort.subscribe(function (e, args) {
      loader.setSort(args.sortCol.field, args.sortAsc ? 1 : -1);
      var vp = grid.getViewport();
      loader.ensureData(vp.top, vp.bottom);
    });

    loader.onDataLoading.subscribe(function () {
      if (!loadingIndicator) {
        loadingIndicator = $("<span class='loading-indicator'><label>Buffering...</label></span>").appendTo(document.body);
        var $g = $("#myGrid");

        loadingIndicator
            .css("position", "absolute")
            .css("top", $g.position().top + $g.height() / 2 - loadingIndicator.height() / 2)
            .css("left", $g.position().left + $g.width() / 2 - loadingIndicator.width() / 2);
      }

      loadingIndicator.show();
    });

    loader.onDataLoaded.subscribe(function (e, args) {
      for (var i = args.from; i <= args.to; i++) {
        grid.invalidateRow(i);
      }

      grid.updateRowCount();
      grid.render();

      loadingIndicator.fadeOut();
    });

    /*$(window).resize(function () {
        grid.resizeCanvas();
    });
    */

    // load the first page
    grid.onViewportChanged.notify();
  };

  function onInitialImage( response ) {
    // let's approximate the column width:
    var MINCOLWIDTH = 44;
    var GRIDWIDTHPAD = 16;
    var gridWidth = 0;  // initial padding amount
    var colWidths = {};
    var rowData = response.results;
    for ( var i = 0; i < rowData.length; i++ ) {
      var row = rowData[ i ];
      var cnm;
      for ( cnm in row ) {
        var cellVal = row[ cnm ];
        if( cellVal )
          colWidths[ cnm ] = Math.max( colWidths[ cnm ] || MINCOLWIDTH, 8 + ( 6 * cellVal.toString().length ) );
      }
    }
    var ci = response.columnInfo;
    for (var i = 0; i < ci.length; i++) {
      ci[i].toolTip = ci[i].name;
      ci[i].sortable = true;
      ci[i].width = colWidths[ ci[i].field ];
      if( i==ci.length - 1 ) {
        // pad out last column to allow for dynamic scrollbar
        ci[i].width += GRIDWIDTHPAD;
      }
      gridWidth += ci[i].width;
    }
    createGrid( ci );

    $("#myGrid").css( 'width', gridWidth+'px' );
  };



  $(function () {
      var url = "tables/${table_name}";
      req = $.get( url, 
                  { startRow: 0, rowLimit: 50 },
                  onInitialImage );
  });
</script>
{'fraction_non_alphanumeric': 0.17153326462842095, 'fraction_numerical': 0.0166036871636322, 'mean_word_length': 2.624066390041494, 'pattern_counts': {'":': 0, '<': 93, '<?xml version=': 0, '>': 87, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6501851', 'n_tokens_mistral': 3110, 'n_tokens_neox': 2949, 'n_words': 599}