Mirror
/
CyberChef
mirror of https://github.com/gchq/CyberChef.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fixed boolean arg checkboxes

This commit is contained in:
n1474335 2018-06-17 13:49:32 +01:00
parent 4147ec719b
commit ab9bc7e390
3 changed files with 22 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/web/HTMLIngredient.mjs
View File

@ -105,15 +105,15 @@ class HTMLIngredient {
case "boolean": case "boolean":
html += `<div class="form-group inline"> html += `<div class="form-group inline">
<div class="checkbox"> <div class="checkbox">
<label> <label>
<input type="checkbox" <input type="checkbox"
class="arg" class="arg"
id="${this.id}" id="${this.id}"
arg-name="${this.name}" arg-name="${this.name}"
${this.value ? " checked='checked' " : ""} ${this.value ? " checked" : ""}
${this.disabled ? " disabled='disabled'" : ""} ${this.disabled ? " disabled" : ""}
value="${this.name}"> ${this.name} value="${this.name}"> ${this.name}
</label> </label>
</div> </div>
</div>`; </div>`;
break; break;
@ -243,6 +243,8 @@ class HTMLIngredient {
input = link.parentNode.parentNode.parentNode.querySelector("input"); input = link.parentNode.parentNode.parentNode.querySelector("input");
input.value = link.getAttribute("value"); input.value = link.getAttribute("value");
const evt = new Event("change");
input.dispatchEvent(evt);
this.manager.recipe.ingChange(); this.manager.recipe.ingChange();
} }

12
src/web/html/index.html
View File

@ -446,42 +446,42 @@
</select> </select>
</div> </div>
<div class="switch option-item"> <div class="checkbox option-item">
<label for="updateUrl"> <label for="updateUrl">
<input type="checkbox" option="updateUrl" id="updateUrl" checked> <input type="checkbox" option="updateUrl" id="updateUrl" checked>
Update the URL when the input or recipe changes Update the URL when the input or recipe changes
</label> </label>
</div> </div>
<div class="switch option-item"> <div class="checkbox option-item">
<label for="showHighlighter"> <label for="showHighlighter">
<input type="checkbox" option="showHighlighter" id="showHighlighter" checked> <input type="checkbox" option="showHighlighter" id="showHighlighter" checked>
Highlight selected bytes in output and input (when possible) Highlight selected bytes in output and input (when possible)
</label> </label>
</div> </div>
<div class="switch option-item"> <div class="checkbox option-item">
<label for="treatAsUtf8"> <label for="treatAsUtf8">
<input type="checkbox" option="treatAsUtf8" id="treatAsUtf8" checked> <input type="checkbox" option="treatAsUtf8" id="treatAsUtf8" checked>
Treat output as UTF-8 if possible Treat output as UTF-8 if possible
</label> </label>
</div> </div>
<div class="switch option-item"> <div class="checkbox option-item">
<label for="wordWrap"> <label for="wordWrap">
<input type="checkbox" option="wordWrap" id="wordWrap" checked> <input type="checkbox" option="wordWrap" id="wordWrap" checked>
Word wrap the input and output Word wrap the input and output
</label> </label>
</div> </div>
<div class="switch option-item"> <div class="checkbox option-item">
<label for="showErrors"> <label for="showErrors">
<input type="checkbox" option="showErrors" id="showErrors" checked> <input type="checkbox" option="showErrors" id="showErrors" checked>
Operation error reporting (recommended) Operation error reporting (recommended)
</label> </label>
</div> </div>
<div class="switch option-item"> <div class="checkbox option-item">
<label for="useMetaKey"> <label for="useMetaKey">
<input type="checkbox" option="useMetaKey" id="useMetaKey"> <input type="checkbox" option="useMetaKey" id="useMetaKey">
Use meta key for keybindings (Windows ⊞/Command ⌘) Use meta key for keybindings (Windows ⊞/Command ⌘)

7
src/web/stylesheets/layout/_operations.css
View File

@ -34,6 +34,7 @@
.operation input.form-control, .operation input.form-control,
.operation select.form-control, .operation select.form-control,
.operation textarea,
.operation .bmd-label-floating, .operation .bmd-label-floating,
.operation .bmd-label-static { .operation .bmd-label-static {
padding-left: 5px; padding-left: 5px;
@ -41,14 +42,16 @@
} }
.operation [class^='bmd-label'], .operation [class^='bmd-label'],
.operation [class*=' bmd-label'] { .operation [class*=' bmd-label'],
.operation label {
color: #388e3c; color: #388e3c;
} }
.operation .is-focused [class^='bmd-label'], .operation .is-focused [class^='bmd-label'],
.operation .is-focused [class*=' bmd-label'], .operation .is-focused [class*=' bmd-label'],
.operation .is-focused [class^='bmd-label'], .operation .is-focused [class^='bmd-label'],
.operation .is-focused [class*=' bmd-label'] { .operation .is-focused [class*=' bmd-label'],
.operation .is-focused label {
color: #1976d2; color: #1976d2;
} }