added copy-to-clipboard-button

This commit is contained in:
Mirjan Hoffmann 2023-05-25 14:13:52 +02:00
parent dd75357e9b
commit b1e86929a1
3 changed files with 25 additions and 0 deletions

View file

@ -2,6 +2,8 @@
"FORM_HEADING": "OER Metadaten Formular",
"LABEL_CHOOSE": "Wähle ...",
"LABEL_CLOSE": "Schließen",
"LABEL_COPIED_TO_CLIPBOARD": "In die Zwischenablage kopiert",
"LABEL_COPY": "Kopieren",
"LABEL_CREATOR": "Autor",
"LABEL_CREATOR_ADD": "weiteren Autor hinzufügen",
"LABEL_CREATOR_GIVEN_NAME": "Vorname",

View file

@ -2,6 +2,8 @@
"FORM_HEADING": "OER Metadata Form",
"LABEL_CHOOSE": "Choose ...",
"LABEL_CLOSE": "Close",
"LABEL_COPIED_TO_CLIPBOARD": "Copied to Clipboard",
"LABEL_COPY": "Copy",
"LABEL_CREATOR": "Author",
"LABEL_CREATOR_ADD": "add Author",
"LABEL_CREATOR_GIVEN_NAME": "Firstname",

View file

@ -232,6 +232,8 @@
<button type="button" onclick="generate()" class="btn btn-primary"><i class="fa fa-arrow-down"></i> <span data-i18n="LABEL_GENERATE">Generieren</span>
</button>
<button type="button" disabled onclick="copy_generated_output()" class="btn btn-primary" id="button_copy_generated_output"><i class="fa fa-copy"></i> <span data-i18n="LABEL_COPY">Kopieren</span>
</button>
<div class="form-group">
<label for="comment" data-i18n="LABEL_YAML_METADATA">YAML Metadaten</label>
<textarea class="form-control" rows="15" id="comment"></textarea>
@ -239,6 +241,11 @@
</form>
</div>
<div id="copied_to_clipboard_toast" class="toast hide" role="alert" aria-live="assertive" aria-atomic="true">
<div class="toast-body"><span data-i18n="LABEL_COPIED_TO_CLIPBOARD">In die Zwischenablage kopiert</span></div>
<button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
<footer class="bg-light text-center">
<div class="text-center p-3">
GitLab:
@ -548,6 +555,17 @@
return creators;
}
function copy_generated_output() {
if (!navigator.clipboard) {
return;
}
navigator.clipboard.writeText(document.getElementById("comment").value).then(function() {
$("#copied_to_clipboard_toast").toast("show");
}, function(err) {
console.error('Async: Could not copy text: ', err);
});
}
function generate() {
const creators = getCreators()
const selectedLanguages = $('#inputLanguage').val();
@ -583,6 +601,9 @@
meta.educationalLevel = selectedEducationalLevel.map((t) => ({id: t}))
}
document.getElementById("comment").value = jsyaml.dump(meta);
if (navigator.clipboard) {
document.getElementById("button_copy_generated_output").disabled = false
}
}
function setCreators(creators) {