1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
|
/*
* Read the file content and set the `data-preview-content` attribute on the
* file element
*/
function read_first_n_lines(event,
fileelement,
numlines,
firstlineheading = true) {
var thefile = fileelement.files[0];
var reader = new FileReader();
reader.addEventListener("load", (event) => {
var filecontent = event.target.result.split(
"\n").slice(
0, (numlines + (firstlineheading ? 1 : 0))).map(
(line) => {return line.trim("\r");});
fileelement.setAttribute(
"data-preview-content", JSON.stringify(filecontent));
display_preview(event);
})
reader.readAsText(thefile);
}
function remove_rows(preview_table) {
var table_body = preview_table.getElementsByTagName("tbody")[0];
while(table_body.children.length > 0) {
table_body.removeChild(table_body.children.item(0));
}
}
/*
* Display error row
*/
function display_error_row(preview_table, error_message) {
remove_rows(preview_table);
row = document.createElement("tr");
cell = document.createElement("td");
cell.setAttribute("colspan", 4);
cell.innerHTML = error_message;
row.appendChild(cell);
preview_table.getElementsByTagName("tbody")[0].appendChild(row);
}
function strip(str, chars) {
var end = str.length;
var start = 0
for(var j = str.length; j > 0; j--) {
if(!chars.includes(str[j - 1])) {
break;
}
end = end - 1;
}
for(var i = 0; i < end; i++) {
if(!chars.includes(str[i])) {
break;
}
start = start + 1;
}
return str.slice(start, end);
}
function process_preview_data(preview_data, separator, delimiter) {
return preview_data.map((line) => {
return line.split(separator).map((field) => {
return strip(field, delimiter);
});
});
}
function render_preview(preview_table, preview_data) {
remove_rows(preview_table);
var table_body = preview_table.getElementsByTagName("tbody")[0];
preview_data.forEach((line) => {
var row = document.createElement("tr");
line.forEach((field) => {
var cell = document.createElement("td");
cell.innerHTML = field;
row.appendChild(cell);
});
table_body.appendChild(row);
});
}
/*
* Display a preview of the data, relying on the user's selection.
*/
function display_preview(event) {
var data_preview_table = document.getElementById("tbl:samples-preview");
remove_rows(data_preview_table);
var separator = document.getElementById("select:separator").value;
if(separator === "other") {
separator = document.getElementById("txt:separator").value;
}
if(separator == "") {
display_error_row(data_preview_table, "Please provide a separator.");
return false;
}
var delimiter = document.getElementById("txt:delimiter").value;
var firstlineheading = document.getElementById("chk:heading").checked;
var fileelement = document.getElementById("file:samples");
var preview_data = JSON.parse(
fileelement.getAttribute("data-preview-content") || "[]");
if(preview_data.length == 0) {
display_error_row(
data_preview_table,
"No file data to preview. Check that file is provided.");
}
render_preview(data_preview_table, process_preview_data(
preview_data.slice(0 + (firstlineheading ? 1 : 0)),
separator,
delimiter));
}
document.getElementById("chk:heading").addEventListener(
"change", display_preview);
document.getElementById("select:separator").addEventListener(
"change", display_preview);
document.getElementById("txt:separator").addEventListener(
"keyup", display_preview);
document.getElementById("txt:delimiter").addEventListener(
"keyup", display_preview);
document.getElementById("file:samples").addEventListener(
"change", (event) => {
read_first_n_lines(event,
document.getElementById("file:samples"),
30,
document.getElementById("chk:heading").checked);
});
|
