commit f627409aabb9ddc37a36b673eb855a22b2ad3574
Author: Marcos Venteo <mventeo gmail com>
Date: Sat May 27 19:13:00 2017 +0200
When player, station or exercise is selected then the column is hidden.
chronojump-flask/templates/results.html | 241 +++++++++++++++++++------------
1 files changed, 145 insertions(+), 96 deletions(-)
---
diff --git a/chronojump-flask/templates/results.html b/chronojump-flask/templates/results.html
index 8a44d76..80a7433 100644
--- a/chronojump-flask/templates/results.html
+++ b/chronojump-flask/templates/results.html
@@ -1,19 +1,19 @@
-{% extends "base.html" %}
-
-{% block extra_stylesheet %}
-<link href="{{ url_for('static', filename='DataTables/media/css/dataTables.bootstrap.min.css') }}"
rel="stylesheet"/>
-{% endblock %}
-
-{% block extra_js %}
+{% extends "base.html" %} {% block extra_stylesheet %}
+<link href="{{ url_for('static', filename='DataTables/media/css/dataTables.bootstrap.min.css') }}"
rel="stylesheet" /> {% endblock %} {% block extra_js %}
<script src="{{ url_for('static', filename='DataTables/media/js/jquery.dataTables.min.js') }}"></script>
<script src="{{ url_for('static', filename='DataTables/media/js/dataTables.bootstrap.min.js') }}"></script>
<script type="text/javascript">
$(document).ready(function() {
// Initialize datatable with results
var table = $('#results').DataTable({
- "columns" : [
- { type: "num", title: "id", visible:false},
- { type : "date" , title : "Data",
+ "columns": [{
+ type: "num",
+ title: "id",
+ visible: false
+ },
+ {
+ type: "date",
+ title: "Data",
render: function(value) {
// Compare with today
today = new Date();
@@ -30,116 +30,165 @@
if (dd == dd2 && mm == mm2 && yy == yy2) {
// Today, show the result hours and minute
return hh + ":" + MM;
- } else if ( yy == yy2 ) {
+ } else if (yy == yy2) {
// Same year
- return dd2 + "/" + (mm2 +1) + " " + hh + ":" + MM;
+ return dd2 + "/" + (mm2 + 1) + " " + hh + ":" + MM;
} else {
- return dd2 + "/" + (mm2 +1) + "/"+ yy2 + " " + hh +
":" + MM;
+ return dd2 + "/" + (mm2 + 1) + "/" + yy2 + " " + hh +
":" + MM;
}
}
- },
- { type : "html" , title : "Jugador"},
- { type : "html" , title : "Estació" },
- { type : "html" , title: "Exercici"},
- { type : "num" , title: "Càrrega", render: $.fn.dataTable.render.number( '',
',', 2 )},
- { type : "num" , title: "n" },
- { type : "num" , title: "Pèrdua" },
- { type : "num" , title: "[rep" },
- { type : "num" , title: "rang", render: $.fn.dataTable.render.number( '',
',', 2 )},
- { type : "num" , title: "Vm", render: $.fn.dataTable.render.number( '', ',',
2 )},
- { type : "num" , title: "VM", render: $.fn.dataTable.render.number( '', ',',
2 )},
- { type : "num" , title: "Pm", render: $.fn.dataTable.render.number( '', ',',
2 )},
- { type : "num" , title: "PM]", render: $.fn.dataTable.render.number( '', ',',
2 )}
- ],
- "pageLength": 10,
- "order" : [ [ 0, 'desc' ]],
- "ajax" : "/api/v1/results",
- "processing" : true,
- "severSide" : true,
+ },
+ {
+ type: "html",
+ title: "Jugador"
+ },
+ {
+ type: "html",
+ title: "Estació"
+ },
+ {
+ type: "html",
+ title: "Exercici"
+ },
+ {
+ type: "num",
+ title: "Càrrega",
+ render: $.fn.dataTable.render.number('', ',', 2)
+ },
+ {
+ type: "num",
+ title: "n"
+ },
+ {
+ type: "num",
+ title: "Pèrdua"
+ },
+ {
+ type: "num",
+ title: "[rep"
+ },
+ {
+ type: "num",
+ title: "rang",
+ render: $.fn.dataTable.render.number('', ',', 2)
+ },
+ {
+ type: "num",
+ title: "Vm",
+ render: $.fn.dataTable.render.number('', ',', 2)
+ },
+ {
+ type: "num",
+ title: "VM",
+ render: $.fn.dataTable.render.number('', ',', 2)
+ },
+ {
+ type: "num",
+ title: "Pm",
+ render: $.fn.dataTable.render.number('', ',', 2)
+ },
+ {
+ type: "num",
+ title: "PM]",
+ render: $.fn.dataTable.render.number('', ',', 2)
+ }
+ ],
+ "pageLength": 10,
+ "order": [
+ [0, 'desc']
+ ],
+ "ajax": "/api/v1/results",
+ "processing": true,
+ "severSide": true,
"language": {
- "lengthMenu": "Mostrant _MENU_ resultats per pàgina",
- "zeroRecords": "No hi han resultats per mostrar",
- "info": "Mostrant els resultats _START_ a _END_ d'un total de _TOTAL_",
- "infoEmpty": "La busqueda no ha retornat resultats",
- "infoFiltered": "(filtrat de _MAX_ resultats)",
- "decimal": ",",
- "thousands": ".",
- "paginate": {
- "first": '<i class="fa fa-fast-backward"></i>',
- "last" : '<i class="fa fa-fast-forward"></i>',
- "next" : '<i class="fa fa-forward"></i>',
- "previous": '<i class="fa fa-backward"></i>'
- },
- "search" : "Cerca:"
- },
- initComplete: function () {
- this.api().columns().every( function () {
-
- var column = this;
+ "lengthMenu": "Mostrant _MENU_ resultats per pàgina",
+ "zeroRecords": "No hi han resultats per mostrar",
+ "info": "Mostrant els resultats _START_ a _END_ d'un total de _TOTAL_",
+ "infoEmpty": "La busqueda no ha retornat resultats",
+ "infoFiltered": "(filtrat de _MAX_ resultats)",
+ "decimal": ",",
+ "thousands": ".",
+ "paginate": {
+ "first": '<i class="fa fa-fast-backward"></i>',
+ "last": '<i class="fa fa-fast-forward"></i>',
+ "next": '<i class="fa fa-forward"></i>',
+ "previous": '<i class="fa fa-backward"></i>'
+ },
+ "search": "Cerca:"
+ },
+ initComplete: function() {
+ this.api().columns().every(function() {
+
+ var column = this;
var idx = column.index();
if (idx == 2) {
var select = $('<select class="form-control"><option
value="">Tots els jugadors</option></select>')
- .appendTo( $('#filterByPlayer') )
- .on( 'change', function () {
- var val = $.fn.dataTable.util.escapeRegex(
- $(this).val()
- );
-
- column
- .search( val ? '^'+val+'$' : '', true, false )
- .draw();
- } );
-
- column.data().unique().sort().each( function ( d, j ) {
- select.append( '<option value="'+d+'">'+d+'</option>' )
- } );
- } else if (idx == 3 ){
+ .appendTo($('#filterByPlayer'))
+ .on('change', function() {
+ // Player selected
+
+ var val = $.fn.dataTable.util.escapeRegex(
+ $(this).val()
+ );
+
+ column
+ .search(val ? '^' + val + '$' : '',
true, false)
+ .draw();
+ // Hide column if is a selected Player
+ //console.log(val);
+ column.visible(val == '');
+ });
+
+ column.data().unique().sort().each(function(d, j) {
+ select.append('<option value="' + d + '">' + d +
'</option>')
+ });
+ } else if (idx == 3) {
var select = $('<select class="form-control"><option
value="">Totes les estacions</option></select>')
- .appendTo( $('#filterByStation') )
- .on( 'change', function () {
- var val = $.fn.dataTable.util.escapeRegex(
- $(this).val()
- );
-
- column
- .search( val ? '^'+val+'$' : '', true, false )
- .draw();
- } );
-
- column.data().unique().sort().each( function ( d, j ) {
- select.append( '<option value="'+d+'">'+d+'</option>' )
- } );
- } else if (idx== 4) {
+ .appendTo($('#filterByStation'))
+ .on('change', function() {
+ var val = $.fn.dataTable.util.escapeRegex(
+ $(this).val()
+ );
+
+ column
+ .search(val ? '^' + val + '$' : '',
true, false)
+ .draw();
+ column.visible(val == '');
+ });
+
+ column.data().unique().sort().each(function(d, j) {
+ select.append('<option value="' + d + '">' + d +
'</option>')
+ });
+ } else if (idx == 4) {
var select = $('<select class="form-control"><option
value="">Tots els exercicis</option></select>')
- .appendTo( $('#filterByExercice') )
- .on( 'change', function () {
- var val = $.fn.dataTable.util.escapeRegex(
- $(this).val()
- );
-
- column
- .search( val ? '^'+val+'$' : '', true, false )
- .draw();
- } );
-
- column.data().unique().sort().each( function ( d, j ) {
- select.append( '<option value="'+d+'">'+d+'</option>' )
- } );
+ .appendTo($('#filterByExercice'))
+ .on('change', function() {
+ var val = $.fn.dataTable.util.escapeRegex(
+ $(this).val()
+ );
+
+ column
+ .search(val ? '^' + val + '$' : '',
true, false)
+ .draw();
+ column.visible(val == '');
+ });
+
+ column.data().unique().sort().each(function(d, j) {
+ select.append('<option value="' + d + '">' + d +
'</option>')
+ });
}
- } );
- }
+ });
+ }
});
- setInterval( function () {
- table.ajax.reload( null, false );
- }, 5000 );
+ setInterval(function() {
+ table.ajax.reload(null, false);
+ }, 5000);
});
</script>
-{% endblock %}
-
-{% block main_content %}
+{% endblock %} {% block main_content %}
<h2>Resultats</h2>
<div class="row" style="margin-top: 15px;">
<div class="col-sm-3">