Add Copy button after every textarea

This commit is contained in:
Hani Rouatbi
2023-02-11 14:51:43 +01:00
parent 5a36380dda
commit c8912ea7c2
2 changed files with 29 additions and 0 deletions

View File

@@ -131,6 +131,28 @@
</IF>
</div>
<script>
function copyText(elementId) {
const copyText = document.getElementById(elementId);
copyText.select();
document.execCommand("copy");
// Show tooltip
const tooltip = document.createElement("div");
tooltip.innerHTML = "Copied!";
tooltip.style.position = "fixed";
tooltip.style.bottom = "10px";
tooltip.style.right = "10px";
tooltip.style.backgroundColor = "lightgreen";
tooltip.style.padding = "10px";
tooltip.style.borderRadius = "5px";
document.body.appendChild(tooltip);
// Remove tooltip after 3 seconds
setTimeout(function() {
document.body.removeChild(tooltip);
}, 3000);
}
function convertSize(size) {
if (size > 1024 * 1024 * 1024) {
size = Math.round(size / (1024 * 1024 * 1024) * 10) / 10 + " Gb";

View File

@@ -10,6 +10,7 @@
<div class="form-group w-100">
<label for="thumb">{b_title}</label>
<textarea id="thumb" readonly="readonly" rows="2" cols="40" class="form-control" tabindex="1">[url={b_url_link}][img]{b_img_link}[/img][/url]</textarea>
<button type="button" class="btn btn-primary btn-sm mt-2" onclick="copyText('thumb')">Copy</button>
</div>
<!-- END image_thumb -->
@@ -21,16 +22,19 @@
<div class="form-group w-100">
<label for="image1">{b_title}</label>
<textarea id="image1" readonly="readonly" rows="1" cols="40" class="form-control" tabindex="2">{b_url_link}</textarea>
<button type="button" class="btn btn-primary btn-sm mt-2" onclick="copyText('image1')">Copy</button>
</div>
<div class="form-group w-100">
<label for="imageBBC">{b_bbc_title}</label>
<textarea id="imageBBC" readonly="readonly" rows="2" cols="40" class="form-control" tabindex="3">[url={siteurl}][img]{b_url_link}[/img][/url]</textarea>
<button type="button" class="btn btn-primary btn-sm mt-2" onclick="copyText('imageBBC')">Copy</button>
</div>
<div class="form-group w-100">
<label for="imageHTML">HTML</label>
<textarea id="imageHTML" readonly="readonly" rows="4" cols="40" class="form-control" tabindex="4">&lt;a href=&quot;{siteurl}&quot; target=&quot;_blank&quot; title=&quot;{siteurl}&quot;&gt;&lt;img src=&quot;{b_url_link}&quot; border=&quot;0&quot; alt=&quot;{b_url_link}&quot; /&gt;&lt;/a&gt;</textarea>
<button type="button" class="btn btn-primary btn-sm mt-2" onclick="copyText('imageHTML')">Copy</button>
</div>
<!-- END image -->
@@ -41,11 +45,13 @@
<div class="form-group w-100">
<label for="file1">{b_title}</label>
<textarea id="file1" readonly="readonly" rows="2" cols="40" class="form-control" tabindex="5">{b_url_link}</textarea>
<button type="button" class="btn btn-primary btn-sm mt-2" onclick="copyText('file1')">Copy</button>
</div>
<div class="form-group w-100">
<label for="fileBBC">{b_bbc_title}</label>
<textarea id="fileBBC" readonly="readonly" rows="2" cols="40" class="form-control" tabindex="6">[url={b_url_link}]{b_url_link}[/url]</textarea>
<button type="button" class="btn btn-primary btn-sm mt-2" onclick="copyText('fileBBC')">Copy</button>
</div>
<!-- END file -->
@@ -58,6 +64,7 @@
<div class="form-group w-100">
<label for="delCode">{b_title}</label>
<textarea id="delCode" readonly="readonly" rows="2" cols="40" class="form-control" tabindex="7">{b_code_link}</textarea>
<button type="button" class="btn btn-primary btn-sm mt-2" onclick="copyText('delCode')">Copy</button>
</div>
<!-- END del_file_code -->