From 6eff44636b560a332866f220130c99524c280608 Mon Sep 17 00:00:00 2001
From: Conrad Zelck <git@simpel.cc>
Date: Fri, 6 Oct 2023 19:04:39 +0200
Subject: [PATCH] feat: en-/disable convert and copy button
There are a lot of stati where it's not good to have those bottons en-
abled. So check it on every bodies load, change, click or keyup.
Signed-off-by: Conrad Zelck <git@simpel.cc>
---
index.php | 6 +++---
script.js | 39 +++++++++++++++++++++++++++++++++++++++
2 files changed, 42 insertions(+), 3 deletions(-)
diff --git a/index.php b/index.php
index 45c0d93..3c9a991 100644
--- a/index.php
+++ b/index.php
@@ -11,7 +11,7 @@
</script>
</head>
-<body>
+<body onload="setMainButtonsAppearance()" onchange="setMainButtonsAppearance()" onclick="setMainButtonsAppearance()" onkeyup="setMainButtonsAppearance()">
<header>
<?php include dirname($_SERVER['DOCUMENT_ROOT']) . "/simpel.cc/php/header.php"; ?>
</header>
@@ -206,7 +206,7 @@
<div class="left">
<div class="flex-space-between">
<label for="input" id="label-inputfield" class="labelLikeHeading">Input field</label>
- <button type="button" id="convert" name="convert" title="Convert input.
+ <button type="button" disabled id="convert" name="convert" title="Convert input.
You can use this shortcut:
OSX: [ Ctrl ] + [ Opt ] + [ p ]
WIN: [ Alt ] + [ p ]" accesskey="p" onclick="pandoc(true)">Convert [p]</button>
@@ -218,7 +218,7 @@ WIN: [ Alt ] + [ p ]" accesskey="p" onclick="pandoc(true)">Convert [p]</button>
<div class="right">
<div class="flex-space-between">
<p id="label-outputfield" class="label">Output field</p>
- <button type="button" id="copy" name="copy" title="Copy output text.
+ <button type="button" disabled id="copy" name="copy" title="Copy output text.
You can use this shortcut:
OSX: [ Ctrl ] + [ Opt ] + [ c ]
WIN: [ Alt ] + [ c ]" accesskey="c" onclick="copyOutput()">Copy output field [c]</button>
diff --git a/script.js b/script.js
index e65dd25..21cb582 100644
--- a/script.js
+++ b/script.js
@@ -117,6 +117,7 @@ function pandoc(alert) {
document.getElementById("output").appendChild(node);
node.innerText = content;
}
+ setMainButtonsAppearance();
// close the busy dialog
dialog.close()
}
@@ -143,11 +144,49 @@ function toggleToc() {
}
}
+function setMainButtonsAppearance() {
+ console.log('main buttons');
+ const convertButton = document.getElementById('convert');
+ const copyButton = document.getElementById('copy');
+ const from = document.getElementById('from').value;
+ const useInputFile = document.getElementById('cb-inputfile').checked;
+ let inputFile = false;
+ if (useInputFile) {
+ inputFile = document.getElementById('inputfile').files[0];
+ }
+ var input = document.getElementById('input').value;
+ const output = document.getElementById('output');
+
+ // convert button setting
+ if (from === "none") {
+ convertButton.setAttribute('disabled', 'disabled');
+ } else if (!inputFile && useInputFile) {
+ convertButton.setAttribute('disabled', 'disabled');
+ } else if (isEmpty(input) && !useInputFile) {
+ convertButton.setAttribute('disabled', 'disabled');
+ output.innerText = "";
+ } else {
+ convertButton.removeAttribute('disabled');
+ }
+
+ const outputText = document.getElementById('output').innerText;
+
+ // copy button setting
+ if (typeof outputText === 'undefined') {
+ copyButton.setAttribute('disabled', 'disabled')
+ } else if (isEmpty(outputText)) {
+ copyButton.setAttribute('disabled', 'disabled')
+ } else {
+ copyButton.removeAttribute('disabled')
+ }
+}
+
function checkInputFile() {
if (document.getElementById('cb-inputfile').checked === true) {
document.getElementById('inputfile').removeAttribute("disabled");
document.getElementById('input').setAttribute("disabled", "disabled");
document.getElementById('label-inputfield').classList.add("disabled");
+ document.getElementById('output').innerText = "";
} else {
document.getElementById('inputfile').setAttribute("disabled", "disabled");
document.getElementById('input').removeAttribute("disabled");
--
GitLab