Difference between revisions of "Dev/Results"

(Removed index column stuff. Plugged in AJAX data source. Hope it works.)
(paste from igem.org)
Line 1: Line 1:
 
{{2015Top}}
 
{{2015Top}}
 
<html>                                       
 
<html>                                       
 +
<!--put 2015Top above here-->
  
−
<script src='https://igem.org/common/DataTables-1.10.7/media/js/jquery.dataTables.min.js'></script>
+
<script src='https://igem.org/common/DataTables-1.10.7/media/js/jquery.dataTables.js'></script>
 
<link rel='stylesheet' type='text/css' href='https://igem.org/common/DataTables-1.10.7/media/css/jquery.dataTables.css'>
 
<link rel='stylesheet' type='text/css' href='https://igem.org/common/DataTables-1.10.7/media/css/jquery.dataTables.css'>
−
<link rel='stylesheet' type='text/css' href='https://igem.org/cgi/misc_css/hq_teams.css'>
+
 
 +
<style type="text/css">
 +
/* Additional style for the +/- buttons */
 +
td.details-control {
 +
background: url('../resources/details_open.png') no-repeat center center;
 +
cursor: pointer;
 +
}
 +
tr.shown td.details-control {
 +
background: url('../resources/details_close.png') no-repeat center center;
 +
}
 +
</style>
  
 
<script>
 
<script>
−
    jQuery(document).ready(function() {
+
 
 +
//Function to generate the supplementary-info child rows
 +
function childRowFormat(data) {
 +
return '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">'+
 +
'<tr>'+
 +
'<td><a target="_blank" href="https://2015.igem.org/Team:' + data.team_name + '">Wiki</a></td>'+
 +
'<td><a target="_blank" href="https://igem.org/Team.cgi?id=' + data.team_id + '">Team Profile</td>'+
 +
'</tr>'+
 +
'</table>';
 +
}
 +
 
 +
jQuery(document).ready(function() {
 
var t = jQuery('#table_team').DataTable( {
 
var t = jQuery('#table_team').DataTable( {
−
            'lengthMenu': [[10, 25, 50, 100, -1],[10, 25, 50, 100, 'All']],
+
'lengthMenu': [[10, 25, 50, 100, -1],[10, 25, 50, 100, 'All']],
−
            'pageLength': -1,
+
'pageLength': -1,
−
            'deferRender': true, //improves performance
+
'deferRender': true, //improves performance
−
            'ajax': 'https://igem.org/awards/json_dump.cgi',
+
'ajax': {
−
            'columns': [
+
'url': 'https://igem.org/awards/json_dump.cgi',
−
            {'data': 'team_name'},
+
'dataSrc': ''
−
            {'data': 'region'},
+
},
−
            {'data': 'section'},
+
'columns': [
−
            {'data': 'medal'}
+
{ //Child-table control element
−
            ],
+
'className': 'details-control',
−
//'scrollY':        '2000px',
+
'orderable': false,
−
//'scrollCollapse': true,
+
'data': null,
−
//'paging':        true,
+
'defaultContent': ''
−
} ); // close DataTable
+
},
 +
{'data': 'team_name'},
 +
{'data': 'region'},
 +
{'data': 'section'},
 +
{'data': 'medal'}
 +
],
 +
'order': [[1, 'asc']] //This came in with the child-table control element but I don't know why
 +
} );
 +
 +
// Add event listener for opening and closing details
 +
$('#table_team tbody').on('click', 'td.details-control', function () {
 +
var tr = $(this).closest('tr');
 +
var row = t.row( tr );
 +
 +
if ( row.child.isShown() ) {
 +
// This row is already open - close it
 +
row.child.hide();
 +
tr.removeClass('shown');
 +
}
 +
else {
 +
// Open this row
 +
row.child( childRowFormat(row.data()) ).show();
 +
tr.addClass('shown');
 +
}
 +
} );
  
−
        jQuery('#table_team').addClass('hover');
+
jQuery('#table_team').addClass('hover');
  
−
    });
+
});
 
</script>
 
</script>
  
Line 39: Line 85:
 
<h2>Comprehensive Results from iGEM 2015</h2>
 
<h2>Comprehensive Results from iGEM 2015</h2>
  
−
<p>This page requires Javascript. Please enable Javascript in your browser, then reload this page.</p>
+
<p>View: [All Teams] [Award Winners] [other?]</p>
−
 
+
−
<p>(This is where there were links to change region/year/etc. For me, I'd probably have links to quickly view award winners, all teams, and maybe a couple other categories)</p>
+
  
  
Line 47: Line 91:
 
<THEAD>
 
<THEAD>
 
<TR>
 
<TR>
 +
<TH></TH>
 
<TH>Team</TH>
 
<TH>Team</TH>
 
<TH>Region</TH>
 
<TH>Region</TH>
Line 58: Line 103:
  
 
<!-- end of content ---------------------------------------->
 
<!-- end of content ---------------------------------------->
 +
 +
 
</div>
 
</div>
 
<div class="clear"></div>
 
<div class="clear"></div>

Revision as of 16:09, 23 September 2015

Comprehensive Results from iGEM 2015

View: [All Teams] [Award Winners] [other?]

Team Region Section Medal