Add ability to hide buttons in the editor

This commit is contained in:
Jacob Strieb 2020-05-19 22:13:00 -04:00
parent 801ed5ed85
commit 9d6b7ba2ce
3 changed files with 24 additions and 0 deletions

View file

@ -82,6 +82,17 @@ function showCopyCodePrompt() {
}
/* Hide and show buttons based on checkbox state */
function hideButtons(box) {
let buttons = document.querySelectorAll("button");
if (box.checked) {
buttons.forEach((button) => button.style.display = "none");
} else {
buttons.forEach((button) => button.style.display = "inline");
}
}
/***
* Main procedure functions

View file

@ -15,6 +15,8 @@
</div>
<div id="bottomleft-buttons">
<label for="hide">Hide Buttons</label>
<input type="checkbox" id="hide" onclick="hideButtons(this)" /><br />
<!-- Seemingly random attributes necessary for TinyUrl to accept the request -->
<form action="http://tinyurl.com/create.php" method="get" target="_blank">
<input type="hidden" id="source" name="source" value="indexpage">
@ -25,6 +27,7 @@
<button><a id="getLinkLink" href="" target="_blank">Open Page</a></button>
<button onclick="showCopyCodePrompt()">Copy Code</button>
<button><a id="downloadLink" href="" target="_blank" download="export.html">Download Code</a></button>
<button><a href="https://jstrieb.github.io/link-lock" target="_blank">Add a Password</a></button>
</div>
<div id="topright-buttons">

View file

@ -52,3 +52,13 @@ a, button {
form {
display: inline;
}
label, input[type="checkbox"] {
vertical-align: middle;
}
label {
margin: 5px;
margin-top: 10px;
margin-bottom: 10px;
}