185 lines
5.9 KiB
HTML
185 lines
5.9 KiB
HTML
<!-- SPDX-License-Identifier: Beerware -->
|
|
<!-- Wolfgang Kroener wrote this file. As long as you retain this notice -->
|
|
<!-- you can do whatever you want with this stuff. If we meet some day, -->
|
|
<!-- and you think this stuff is worth it, you can buy me a beer in return -->
|
|
|
|
<!doctype html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>band plan</title>
|
|
<style>
|
|
body>div {
|
|
padding-bottom: 1em;
|
|
}
|
|
div#togglebuttons>button {
|
|
margin: 0 0.1em;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<link href="https://unpkg.com/tabulator-tables/dist/css/tabulator.min.css" rel="stylesheet">
|
|
<script src="https://unpkg.com/browser-cjs/require.min.js"></script>
|
|
<script src="https://unpkg.com/tabulator-tables/dist/js/tabulator.min.js"></script>
|
|
<script src="https://unpkg.com/jspdf/dist/jspdf.umd.min.js"></script>
|
|
<script src="https://unpkg.com/jspdf-autotable/dist/jspdf.plugin.autotable.min.js"></script>
|
|
<script>
|
|
// require in browser-cjs
|
|
// eslint-disable-next-line no-undef
|
|
const yaml = require('https://unpkg.com/js-yaml/dist/js-yaml.min.js');
|
|
// eslint-disable-next-line no-undef
|
|
const Measures = require('https://unpkg.com/measures/dist/measures.cjs.js');
|
|
// eslint-disable-next-line no-undef
|
|
const path = require('https://unpkg.com/path-browserify/index.js');
|
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
update_plan();
|
|
|
|
document.getElementById("sel_plan").addEventListener("keydown", (event) => {
|
|
if (event.key === 'Enter') {
|
|
update_plan()
|
|
}
|
|
});
|
|
});
|
|
|
|
// eslint-disable-next-line no-unused-vars
|
|
function filter_with_not(headerValue, rowValue, rowData, filterParams){
|
|
if (headerValue.startsWith('!')) {
|
|
// filter not
|
|
const str = headerValue.slice(1);
|
|
if ((str.length > 0) && (typeof rowValue !== "undefined")) {
|
|
return !rowValue.toString().includes(str);
|
|
} else {
|
|
return true;
|
|
}
|
|
} else {
|
|
// filter normal
|
|
if (typeof rowValue !== "undefined") {
|
|
return rowValue.toString().includes(headerValue);
|
|
} else {
|
|
return false;
|
|
}
|
|
}
|
|
}
|
|
|
|
function display_error(e) {
|
|
let t = document.getElementById("data-table");
|
|
t.innerHTML = "";
|
|
t.removeAttribute("class");
|
|
console.log(e);
|
|
document.getElementById("error").innerText = e;
|
|
}
|
|
|
|
function update_plan() {
|
|
fetch(document.getElementById('sel_plan').value, {
|
|
mode: 'cors'
|
|
}).then((response) => {
|
|
if (!response.ok) {
|
|
throw new Error(response.status);
|
|
}
|
|
return response.text();
|
|
}).then((data) => {
|
|
try {
|
|
const bands = yaml.load(data);
|
|
var tdata = [];
|
|
bands.forEach((band) => {
|
|
band.parts.forEach((part) => {
|
|
tdata.push({
|
|
"band": band.band,
|
|
"mode": band.mode,
|
|
//"band_start": band.start,
|
|
//"band_end": band.end,
|
|
"bandwidth": band.bandwidth,
|
|
"description": part.description,
|
|
"frequency": typeof part.at !== "undefined" ? part.at : part.start + '\u2013' + part.end ,
|
|
});
|
|
});
|
|
});
|
|
|
|
// require in tabular-tables
|
|
// eslint-disable-next-line no-undef
|
|
var table = new Tabulator("#data-table", {
|
|
layout: "fitDataTable",
|
|
initialSort: [
|
|
{column: "frequency", dir: "asc"},
|
|
{column: "band", dir: "desc"},
|
|
],
|
|
selectableRows: true,
|
|
data: tdata,
|
|
columns: [
|
|
// eslint-disable-next-line no-unused-vars
|
|
{title: "band", field: "band", headerFilter: "input", sorter: function(a, b, aRow, bRow, column, dir, sorterParams){
|
|
return parseFloat(new Measures().from(a).to('m')) - parseFloat(new Measures().from(b).to('m'));
|
|
}},
|
|
{title: "frequency/kHz", field: "frequency", sorter: "number", headerFilter: "input", headerFilterFunc: filter_with_not},
|
|
{title: "bandwidth/Hz", field: "bandwidth", headerFilter: "input", headerFilterFunc: filter_with_not},
|
|
{title: "mode", field: "mode", headerFilter: "input", headerFilterFunc: filter_with_not},
|
|
//{title: "band_start", field: "band_start", headerFilter: "input"},
|
|
//{title: "band_end", field: "band_end", headerFilter: "input"},
|
|
{title: "description", field: "description", headerFilter: "input", headerFilterFunc: filter_with_not},
|
|
],
|
|
});
|
|
|
|
document.getElementById("download").addEventListener("click", () => {
|
|
let download_range = "all";
|
|
if (table.getSelectedRows().length > 0) {
|
|
download_range = "selected";
|
|
}
|
|
table.download(
|
|
"pdf",
|
|
path.basename(document.getElementById('sel_plan').value, '.yml') + '.pdf',
|
|
{ orientation:"portrait" },
|
|
download_range);
|
|
});
|
|
|
|
table.on("tableBuilt", () => {
|
|
var div_togglebuttons = document.getElementById("togglebuttons");
|
|
div_togglebuttons.innerHTML = "<span>Toggle column:</span>";
|
|
table.getColumns().forEach((col) => {
|
|
let col_name = col.getField();
|
|
let b = document.createElement("button");
|
|
b.innerText = col_name;
|
|
b.addEventListener("click", () => {
|
|
table.toggleColumn(col_name);
|
|
});
|
|
div_togglebuttons.appendChild(b);
|
|
});
|
|
});
|
|
document.getElementById("error").innerText = "";
|
|
} catch (e) {
|
|
display_error(e);
|
|
}
|
|
}).catch((e) => {
|
|
display_error(e);
|
|
});
|
|
}
|
|
|
|
// used in button
|
|
// eslint-disable-next-line no-unused-vars
|
|
function help() {
|
|
alert(
|
|
'Plan: use your own yml file for a band plan, URLs are possible, CORS needs to be allowed for the file\n'
|
|
+ 'Filter rows with text in column headings, use filter starting with "!" as exclusion\n'
|
|
+ 'Download list: saves .pdf of the current list\n'
|
|
+ 'Selection of rows with mouse possible'
|
|
);
|
|
}
|
|
</script>
|
|
<div>
|
|
<label>Plan:
|
|
<input name="plan" id="sel_plan" type="text" value="plan-de.yml">
|
|
</label>
|
|
<button onclick="update_plan()">Change plan</button>
|
|
</div>
|
|
<div id="togglebuttons"></div>
|
|
<div>
|
|
<button id="download">Download list</button>
|
|
<button onclick="help()">Help</button>
|
|
</div>
|
|
<div id="data-table"></div>
|
|
<div id="error"></div>
|
|
</body>
|
|
</html>
|