improve UI a bit
This commit is contained in:
parent
b38540d1ff
commit
38b89c9a29
2 changed files with 31 additions and 4 deletions
26
directory.js
26
directory.js
|
|
@ -9,15 +9,25 @@ function appendLink(nonEmptyGroup) {
|
|||
|
||||
var row_header = document.createElement("th");
|
||||
row_header.textContent = "Trombi";
|
||||
row_header.classList.add("kf-trombi_row_header");
|
||||
|
||||
var row_links = document.createElement("td");
|
||||
|
||||
if (nonEmptyGroup) {
|
||||
|
||||
var link = document.createElement("a");
|
||||
link.textContent = "Toggle";
|
||||
link.id = "kf-trombi_link";
|
||||
link.textContent = "Show";
|
||||
link.href="#";
|
||||
link.addEventListener("click", toggleTrombi);
|
||||
|
||||
const inputContainer = document.createElement("span");
|
||||
inputContainer.id = "kf-trombi_input_container";
|
||||
inputContainer.classList.add("hidden");
|
||||
|
||||
const sliderContainer = document.createElement("span");
|
||||
sliderContainer.id = "kf-trombi_slider_container";
|
||||
|
||||
var slider = document.createElement("input");
|
||||
slider.id = "kf-trombi_columns_slider";
|
||||
slider.type = "range";
|
||||
|
|
@ -38,20 +48,23 @@ function appendLink(nonEmptyGroup) {
|
|||
trombi.classList.add(`kf-trombi_trombi_${slider.value}`);
|
||||
})
|
||||
|
||||
sliderContainer.append(slider, column_nr, column_label);
|
||||
|
||||
enhanced_checkbox = document.createElement("input");
|
||||
enhanced_checkbox.id = "kf-trombi_enhanced_checkbox";
|
||||
enhanced_checkbox.type = "checkbox";
|
||||
enhanced_checkbox.checked = true;
|
||||
|
||||
var enhance_label = document.createElement("label");
|
||||
enhance_label.textContent = " enhance";
|
||||
enhance_label.textContent = " Enhance for printing";
|
||||
enhance_label.htmlFor = "kf-trombi_enhanced_checkbox";
|
||||
|
||||
enhanced_checkbox.addEventListener("input", (event) => {
|
||||
const trombi = document.getElementById("kf-trombi_trombi");
|
||||
trombi.classList.toggle('kf-trombi_enhanced');
|
||||
})
|
||||
row_links.append(link, slider, column_nr, column_label, enhanced_checkbox, enhance_label);
|
||||
inputContainer.append(sliderContainer, enhanced_checkbox, enhance_label);
|
||||
row_links.append(link, inputContainer);
|
||||
} else {
|
||||
row_links.textContent = "empty group!"
|
||||
}
|
||||
|
|
@ -92,8 +105,15 @@ function generateCard(student, col) {
|
|||
function toggleTrombi() {
|
||||
const trombi = document.getElementById("kf-trombi_trombi");
|
||||
const form = document.getElementById("idTNListe");
|
||||
const link = document.getElementById("kf-trombi_link");
|
||||
const inputContainer = document.getElementById("kf-trombi_input_container");
|
||||
trombi.classList.toggle("hidden");
|
||||
form.classList.toggle("hidden");
|
||||
if(inputContainer.classList.toggle("hidden")) {
|
||||
link.textContent = "Show";
|
||||
} else {
|
||||
link.textContent = "Hide";
|
||||
}
|
||||
}
|
||||
|
||||
function generateTrombi() {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue