<commit_before><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <title>Conference Tracker</title>

    <!-- Bootstrap core CSS -->
    <link href="assets/css/bootstrap.css" rel="stylesheet">
    <link href="assets/css/custom.css" rel="stylesheet">
    
    <script type='text/javascript' src='https://www.google.com/jsapi'></script>
    <script src="assets/js/miso.ds.deps.0.4.1.js"></script>
     <script src="assets/js/miso.ds.deps.ie.0.4.1.js"></script>
    <script src="assets/js/jquery.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="../../assets/js/html5shiv.js"></script>
      <script src="../../assets/js/respond.min.js"></script>
    <![endif]-->
  </head>
 

  <body>

     <div class="navbar navbar-inverse navbar-fixed-top">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">Conference Tracker</a>
        </div>
        <div class="collapse navbar-collapse">
          <ul class="nav navbar-nav">
            <li class="active"><a href="#">Conferences</a></li>
            <li><a href="journals.html">Journals</a></li>
          </ul>
        </div>
      </div>
    </div>

    <script>
          var ds = new Miso.Dataset({
              importer : Miso.Dataset.Importers.GoogleSpreadsheet,
              parser : Miso.Dataset.Parsers.GoogleSpreadsheet,
              /* put Google spreadsheet key to point to your spreadsheet. Example spreadsheet at https://docs.google.com/spreadsheet/ccc?key=0AsDN-wQf9szhdGpjMThxRGVydkVSR1VIWWI0QWtIOHc&usp=drive_web#gid=0*/
              key : "<KEY>", 
              worksheet : "1"
            });

            var dateformat = /^(0?[1-9]|1[012])[\/\-](0?[1-9]|[12][0-9]|3[01])[\/\-]\d{4}$/; // valid format: mm/dd/yyyy
            var dataRows = [];

            ds.fetch({
              success : function() {
                   this.sort(function(rowA, rowB) {
                        if (new Date(rowA.deadline) > new Date(rowB.deadline)) { 
                          return 1; 
                        }
                        if (new Date(rowA.deadline) < new Date(rowB.deadline)) { 
                          return -1;  
                        }
                        return 0;
                    });   

                   this.each(function(row) {
                      if(row.deadline == null){  
                        return true;
                      }
                      else{
                        if(row.deadline.match(dateformat)){
                          dataRows.push(row);
                        }
                        else{
                          alert('This is not a valid date: '+row.deadline);
                          return;
                        }
                      }
                  });
              },
              error : function() {
                console.log("Cannot access spreadsheet!");
              }
          });


          google.load('visualization', '1.0', {packages:['table','map']});
          google.setOnLoadCallback(draw);

          function draw() {
            

            var data = new google.visualization.DataTable();
            //Setup table
            data.addColumn('string', 'Title');
            data.addColumn('string', 'Description');
            data.addColumn('string', 'Type');
            data.addColumn('string', 'Location');
            data.addColumn('date', 'Deadline');
            data.addColumn('number', 'Lat');
            data.addColumn('number', 'Lon');
            data.addColumn('string','Tooltip');

            var title, description, type, location, date, lat, lon, tooltip;
            var today = new Date ();

            for (var i=0;i<dataRows.length;i++){
                description = dataRows[i].description;
                type = dataRows[i].type;
                location = dataRows[i].location;
                date = new Date(dataRows[i].deadline);
                if(Math.floor((date.getTime() - today.getTime())/(1000*60*60*24)) < 60 && Math.floor((date.getTime() - today.getTime())/(1000*60*60*24)) >0){
                  title = '<span class="label label-warning">Soon</span>'+dataRows[i].title;
                }
                else if(Math.floor((date.getTime() - today.getTime())/(1000*60*60*24)) < 0 ){
                   title = '<span class="label label-danger">Deadline in the past</span>'+dataRows[i].title ;
                }
                else{
                  title = dataRows[i].title;
                }
                
                lat = dataRows[i].latitude;
                lon = dataRows[i].longitude;
                tooltip = '<a href="'+dataRows[i].url+'">'+dataRows[i].title+'</a>: '+dataRows[i].description;

                if(dataRows[i].url!= null){  
                    data.addRows([
                         ['<a href="'+dataRows[i].url+'">'+title+'</a>', description, type, location, date, lat, lon,tooltip]
                    ]); 
                }else{
                    data.addRows([
                         [title, description, type, location, date, lat, lon,tooltip]
                    ]); 

                }
            }

            var mapOptions = {showTip:true, useMapTypeControl:true, mapType:'normal', enableScrollWheel:true};
            var tableOptions = {'showRowNumber': true, 'allowHtml': true/*, 'cssClassNames': cssClassNames*/ };
            tableOptions['page'] = 'enable';
            tableOptions['pageSize'] = 10;
            tableOptions['pagingSymbols'] = {prev: 'prev', next: 'next'};
            tableOptions['pagingButtonsConfiguration'] = 'auto';
            

            var tableView = new google.visualization.DataView(data);
            tableView.setColumns([0,1,2,3,4])
            var table = new google.visualization.Table(document.getElementById('table_div'));
            table.draw(tableView, tableOptions);

            var geoView = new google.visualization.DataView(data);
            geoView.setColumns([5,6,7]);

            var map = new google.visualization.Map(document.getElementById('map_div'));
            map.draw(geoView, mapOptions);
            
            google.visualization.events.addListener(table, 'select',
                function() {
                  map.setSelection(table.getSelection());
                  console.log(map.getSelection());
                });

            google.visualization.events.addListener(map, 'select',
                function() {
                  table.setSelection(map.getSelection());
                });
          }
    </script>

    <div class="container">
      <div class="row">
        <div class="col-md-12" id='table_div'></div>
      </div>
      <div class="spacer35"></div>
      <div class="row">
        <div class="col-md-12" id="map_div" style="height: 400px"></div>
      </div>
    </div> 
  </body>
</html><commit_msg>Add timeline view. Factor out code specific to visualisations from the code for obtaining data.<commit_after><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <title>Conference Tracker</title>

    <!-- Bootstrap core CSS -->
    <link href="assets/css/bootstrap.css" rel="stylesheet">
    <link href="assets/css/custom.css" rel="stylesheet">
    
    <script type='text/javascript' src='https://www.google.com/jsapi'></script>
    <script src="assets/js/miso.ds.deps.0.4.1.js"></script>
     <script src="assets/js/miso.ds.deps.ie.0.4.1.js"></script>
    <script src="assets/js/jquery.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="../../assets/js/html5shiv.js"></script>
      <script src="../../assets/js/respond.min.js"></script>
    <![endif]-->
  </head>
 

  <body>

     <div class="navbar navbar-inverse navbar-fixed-top">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">Conference Tracker</a>
        </div>
        <div class="collapse navbar-collapse">
          <ul class="nav navbar-nav">
            <li class="active"><a href="#">Conferences</a></li>
            <li><a href="journals.html">Journals</a></li>
          </ul>
        </div>
      </div>
    </div>

    <script>
          var ds = new Miso.Dataset({
              importer : Miso.Dataset.Importers.GoogleSpreadsheet,
              parser : Miso.Dataset.Parsers.GoogleSpreadsheet,
              /* put Google spreadsheet key to point to your spreadsheet. Example spreadsheet at https://docs.google.com/spreadsheet/ccc?key=0AsDN-wQf9szhdGpjMThxRGVydkVSR1VIWWI0QWtIOHc&usp=drive_web#gid=0*/
              key : "<KEY>", 
              worksheet : "1"
            });

            var dateformat = /^(0?[1-9]|1[012])[\/\-](0?[1-9]|[12][0-9]|3[01])[\/\-]\d{4}$/; // valid format: mm/dd/yyyy
            var dataRows = [];

            ds.fetch({
              success : function() {
                   this.sort(function(rowA, rowB) {
                        if (new Date(rowA.deadline) > new Date(rowB.deadline)) { 
                          return 1; 
                        }
                        if (new Date(rowA.deadline) < new Date(rowB.deadline)) { 
                          return -1;  
                        }
                        return 0;
                    });   

                   this.each(function(row) {
                      if(row.deadline == null){  
                        return true;
                      }
                      else{
                        if(row.deadline.match(dateformat)){
                          dataRows.push(row);
                        }
                        else{
                          alert('This is not a valid date: '+row.deadline);
                          return;
                        }
                      }
                  });
              },
              error : function() {
                console.log("Cannot access spreadsheet!");
              }
          });
          
          function load() {
            var data = new google.visualization.DataTable();
            //Setup table
            data.addColumn('string', 'Title');
            data.addColumn('string', 'Description');
            data.addColumn('string', 'Type');
            data.addColumn('string', 'Location');
            data.addColumn('date', 'Deadline');
            data.addColumn('date', 'Notification');
            data.addColumn('number', 'Lat');
            data.addColumn('number', 'Lon');
            data.addColumn('string','Website');

            var title, description, type, location, date, lat, lon, tooltip, website;


            for (var i=0;i<dataRows.length;i++){
                description = dataRows[i].description;
                title = dataRows[i].title;
                type = dataRows[i].type;
                location = dataRows[i].location;
                deadline = new Date(dataRows[i].deadline);
                notification = new Date(dataRows[i].notification);
                website = dataRows[i].url
                
                lat = dataRows[i].latitude;
                lon = dataRows[i].longitude;

                data.addRows([
                     [title, description, type, location, deadline, notification, lat, lon, website]
                ]); 
            }
            
            return data;
          }
          

          google.load('visualization', '1.0', {packages:['table','map','timeline']});
          google.setOnLoadCallback(init);

          function draw(data) {
            var mapOptions = {showTip:true, useMapTypeControl:true, mapType:'normal', enableScrollWheel:true};
            
            var tableOptions = {'showRowNumber': true, 'allowHtml': true/*, 'cssClassNames': cssClassNames*/ };
            tableOptions['page'] = 'enable';
            tableOptions['pageSize'] = 10;
            tableOptions['pagingSymbols'] = {prev: 'prev', next: 'next'};
            tableOptions['pagingButtonsConfiguration'] = 'auto';
            

            var tableView = new google.visualization.DataView(data);
            tableView.setColumns([{calc:linkify, type:'string', label:'Title'},1,2,3,{calc:statusify, type:'string', label:'Deadline'},5]);
            function linkify(dataTable, rowNum){
              var title = dataTable.getValue(rowNum, 0);
              var website = dataTable.getValue(rowNum, 8);
              
              return website == null ? title : "\<a href=\"" + website + "\">" + title + "\</a>";
            }
            function statusify(dataTable, rowNum){
              var deadline = dataTable.getValue(rowNum, 4);
              var today = new Date();
              
              if(Math.floor((deadline.getTime() - today.getTime())/(1000*60*60*24)) < 60 && Math.floor((deadline.getTime() - today.getTime())/(1000*60*60*24)) >0){
                return deadline + '<span class="label label-warning">Soon</span>';
              }
              else if(Math.floor((deadline.getTime() - today.getTime())/(1000*60*60*24)) < 0 ){
                 return deadline + '<span class="label label-danger">Closed</span>';
              }
              else{
                return deadline + '<span class="label label-success">Open</span>';
              }
            }
            
            var table = new google.visualization.Table(document.getElementById('table_div'));
            table.draw(tableView, tableOptions);

            var geoView = new google.visualization.DataView(data);
            geoView.setColumns([6,7,{calc:tooltipify, type:'string', label:'Tooltip'}]);
            function tooltipify(dataTable, rowNum){
              var title = dataTable.getValue(rowNum, 0);
              var description = dataTable.getValue(rowNum, 1);
              var website = dataTable.getValue(rowNum, 8);
              
              return '<a href="'+website+'">'+title+'</a>: '+description;
            }
            

            var map = new google.visualization.Map(document.getElementById('map_div'));
            map.draw(geoView, mapOptions);
            
            
            var chartView = new google.visualization.DataView(data);
            chartView.setColumns([0,4,5]);
            
            var chart = new google.visualization.Timeline(document.getElementById('timeline_div'));
            
            var options = {
                timeline: { rowLabelStyle: {fontName: 'Ubuntu'},
                            barLabelStyle: {fontName: 'Ubuntu'} }
              };
            chart.draw(chartView, options);
            
            
            google.visualization.events.addListener(table, 'select',
                function() {
                  console.log(table.getSelection());
                  map.setSelection(table.getSelection());
                  chart.setSelection(table.getSelection());
                });

            google.visualization.events.addListener(map, 'select',
                function() {
                  table.setSelection(map.getSelection());
                  chart.setSelection(map.getSelection());
                });
            
            google.visualization.events.addListener(chart, 'select',
                function() {
                  console.log(chart.getSelection());
                  table.setSelection(chart.getSelection());
                  map.setSelection(chart.getSelection());
                });
          }
          
          function init() {
            draw(load());
          }
    </script>

    <div class="container">
      <div class="row">
        <div class="col-md-12" id='table_div'></div>
      </div>
      <div class="spacer35"></div>
      <div class="row">
        <div class="col-md-12" id="map_div" style="height: 400px"></div>
      </div>
      <div class="row">
        <div class="col-md-12" id='timeline_div'></div>
      </div>
    </div> 
  </body>
</html>
{'fraction_non_alphanumeric': 0.15267629061961624, 'fraction_numerical': 0.013128972850947544, 'mean_word_length': 1.629080118694362, 'pattern_counts': {'":': 0, '<': 179, '<?xml version=': 0, '>': 175, 'https://': 4, 'lorem ipsum': 0, 'www.': 6, 'xml': 2}, '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': '6554737', 'n_tokens_mistral': 4901, 'n_tokens_neox': 4555, 'n_words': 818}