-
-
Notifications
You must be signed in to change notification settings - Fork 240
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Button for exporting tables as csv #429
base: master
Are you sure you want to change the base?
Changes from 6 commits
ed18dd9
8d2745d
d6ca8e1
63816af
a68c855
c34a858
fc0c9a0
ca7d238
868d11f
4c57a22
fd32dca
f9edc83
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -2,7 +2,9 @@ | |
<html lang="en"> | ||
<head> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title>{{config.PAGE_TITLE}}</title> | ||
<title>Puppetboard</title> | ||
<button id="export" style="clear: right;width:127px;height:50px;color:#0a214a;box-shadow: 4px 4px #0a214a;margin-top: 5 px; margin-left: 5 px">Export data as csv</button> | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. You should move the inline style to the CSS block so it stays organized. |
||
|
||
{% if config.OFFLINE_MODE %} | ||
<style> | ||
@font-face { | ||
|
@@ -19,13 +21,14 @@ | |
<link href="{{ url_for('static', filename='Semantic-UI-2.1.8/semantic.min.css') }}" rel="stylesheet" /> | ||
<link href='//cdnjs.cloudflare.com/ajax/libs/datatables/1.10.13/css/dataTables.semanticui.min.css' rel='stylesheet' type='text/css'> | ||
{% endif %} | ||
<link href="{{ url_for('static', filename='css/c3.min.css') }}" rel="stylesheet" /> | ||
<link href="{{ url_for('static', filename='css/puppetboard.css') }}" rel="stylesheet" /> | ||
|
||
{% if config.OFFLINE_MODE %} | ||
<script src="{{ url_for('static', filename='jquery-2.1.1/jquery.min.js') }}"></script> | ||
<script src="{{ url_for('static', filename='jquery-datatables-1.10.13/jquery.dataTables.min.js') }}"></script> | ||
<script src="{{ url_for('static', filename='jquery-datatables-1.10.13/dataTables.semanticui.min.js') }}"></script> | ||
|
||
|
||
{% if config.LOCALISE_TIMESTAMP %} | ||
<script src="{{ url_for('static', filename='moment.js-2.7.0/moment.min.js') }}"></script> | ||
{% endif %} | ||
|
@@ -45,8 +48,9 @@ | |
<script src="{{ url_for('static', filename='js/scroll.top.js') }}"></script> | ||
<script src="{{url_for('static', filename='js/d3.min.js')}}"></script> | ||
<script src="{{url_for('static', filename='js/c3.min.js')}}"></script> | ||
<script src="{{url_for('static', | ||
filename='jquery-tablesort-v.0.0.11/jquery.tablesort.min.js')}}"></script> | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Lines 48 and 50 are identical. No changes |
||
<script src="{{url_for('static', filename='jquery-tablesort-v.0.0.11/jquery.tablesort.min.js')}}"></script> | ||
|
||
|
||
{% block script %} {% endblock script %} | ||
<script type="text/javascript"> | ||
{% block javascript %} {% endblock javascript %} | ||
|
@@ -56,8 +60,68 @@ | |
$.getScript('{{url_for('static', filename='js/tables.js')}}') | ||
{% block onload_script %} {% endblock onload_script %} | ||
}) | ||
|
||
|
||
$('#export').click(function() { | ||
var titles = []; | ||
var data = []; | ||
|
||
$('.dataTable th').each(function() { | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Moving my comment about indentation, as this where you stopped indenting. If line 67 is indented and no block has ended this should also be indented. Also another small thing lines 66 and 67 should have a 2 space indent as children of the function starting on 65. |
||
titles.push($(this).text()); | ||
}); | ||
|
||
$('.dataTable td').each(function() { | ||
data.push($(this).text()); | ||
}); | ||
|
||
var CSVString = prepCSVRow(titles, titles.length, ''); | ||
CSVString = prepCSVRow(data, titles.length, CSVString); | ||
|
||
var downloadLink = document.createElement("a"); | ||
var blob = new Blob(["\ufeff", CSVString]); | ||
var url = URL.createObjectURL(blob); | ||
downloadLink.href = url; | ||
downloadLink.download = "data.csv"; | ||
|
||
document.body.appendChild(downloadLink); | ||
downloadLink.click(); | ||
document.body.removeChild(downloadLink); | ||
}); | ||
|
||
function prepCSVRow(arr, columnCount, initial) { | ||
var row = ''; // this will hold data | ||
var delimeter = ','; // data slice separator, in excel it's `;`, in usual CSv it's `,` | ||
var newLine = '\r\n'; // newline separator for CSV row | ||
|
||
function splitArray(_arr, _count) { | ||
var splitted = []; | ||
var result = []; | ||
_arr.forEach(function(item, idx) { | ||
if ((idx + 1) % _count === 0) { | ||
splitted.push(item); | ||
result.push(splitted); | ||
splitted = []; | ||
} else { | ||
splitted.push(item); | ||
} | ||
}); | ||
return result; | ||
} | ||
var plainArr = splitArray(arr, columnCount); | ||
plainArr.forEach(function(arrItem) { | ||
arrItem.forEach(function(item, idx) { | ||
row += item + ((idx + 1) === arrItem.length ? '' : delimeter); | ||
}); | ||
row += newLine; | ||
}); | ||
return initial + row; | ||
} | ||
|
||
|
||
</script> | ||
</script> | ||
{% block head %} {% endblock head %} | ||
|
||
</head> | ||
|
||
<body> | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You shouldn't change this line in the commit