Skip to content

Commit ab37e7b

Browse files
committed
docs: adding wasm webui demo
1 parent e60ac25 commit ab37e7b

File tree

9 files changed

+679
-6
lines changed

9 files changed

+679
-6
lines changed

.gitignore

+1-1
Original file line numberDiff line numberDiff line change
@@ -17,4 +17,4 @@
1717
/bin/
1818
/dist/
1919
coverage.txt
20-
lint-project.sh
20+
lint-project.sh

docs/csvq.wasm

2.71 MB
Binary file not shown.

docs/index.html

+57
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8"/>
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
<title>csvq | Tooling</title>
7+
<script src="./wasm_exec.js"></script>
8+
<script>
9+
const go = new Go();
10+
WebAssembly.instantiateStreaming(fetch("./csvq.wasm"), go.importObject).then((result) => {
11+
go.run(result.instance);
12+
});
13+
</script>
14+
</head>
15+
<body>
16+
<h3>csvq - Reduce CSV files</h3>
17+
<p>
18+
csvq is a Go cli tool for parsing and transforming CSV files. This is useful because often trimming down a CSV file can make processing it easier.
19+
</p>
20+
<form id="csvqform">
21+
<textarea id="csvinput" name="csvinput" cols="150" rows="20" placeholder="Paste your CSV contents here..." required></textarea>
22+
<br />
23+
Delimiter: <input type="text" id="delim" name="delim" value=","/>
24+
Show Headers: <input type="checkbox" id="showHeaders" name="showHeaders" />
25+
Keep Cols: <input type="input" id="keepCols" name="keepCols" />
26+
<br />
27+
<textarea id="csvoutput" name="csvoutput" cols="150" rows="20" readonly></textarea>
28+
<br />
29+
<button type="submit" onclick="run(csvinput.value)">Run csvq</button>
30+
<button type="button" onclick="clearForms()">Clear Forms</button>
31+
</form>
32+
</body>
33+
<script>
34+
const run = function(input) {
35+
csvoutput.value = runner(input, JSON.stringify({
36+
delimiter: delim.value.charCodeAt(),
37+
showHeaders: showHeaders.checked,
38+
keepCols: keepCols.value.split(","),
39+
}));
40+
csvoutput.setSelectionRange(0,0)
41+
csvoutput.focus()
42+
}
43+
44+
const clearForm = function(input) {
45+
csvinput.value = ""
46+
csvoutput.value = ""
47+
delim.value = ","
48+
showHeaders.checked = false
49+
keepCols.value = ""
50+
};
51+
52+
csvqform.addEventListener('submit', (event) => {
53+
event.preventDefault();
54+
run(csvinput.value);
55+
})
56+
</script>
57+
</html>

0 commit comments

Comments
 (0)