Fixed copty to cliboard without https and moved the javascript to seperate file

This commit is contained in:
Szymon Porwolik
2025-11-12 23:46:08 +01:00
parent fa8f4b4e9e
commit f11a0bf1fa
3 changed files with 97 additions and 15 deletions

View File

@@ -16,7 +16,7 @@
<li><a href="https://github.com/wavelog/Wavelog/wiki/Third-Party-Tools" target="_thirdparty"><?=__("More Tools")?></a></li>
</ul>
</p>
<p class="card-text"><span class="badge text-bg-warning"><?= __("API URL"); ?></span> <?= __("The API URL for this Wavelog instance is"); ?>: <span class="api-url" id="apiUrl"><code class="ms-3 me-3"><?php echo site_url(); ?></code></span><span data-bs-toggle="tooltip" title="<?= __("Copy to clipboard"); ?>" onClick='copyApiUrl()'><i class="copy-icon fas fa-copy"></i></span></p>
<p class="card-text"><span class="badge text-bg-warning"><?= __("API URL"); ?></span> <?= __("The API URL for this Wavelog instance is"); ?>: <span class="api-url" id="apiUrl"><code class="ms-3 me-3"><?php echo site_url(); ?></code></span><span data-bs-toggle="tooltip" title="<?= __("Copy to clipboard"); ?>" onClick='copyApiUrl(apiSiteUrl)'><i class="copy-icon fas fa-copy"></i></span></p>
<p class="card-text"><span class="badge text-bg-info"><?= __("Info"); ?></span> <?= __("It's good practice to delete a key if you are no longer using the associated application."); ?></p>
<?php if ($clubmode) { ?>
<p class="card-text"><span class="badge text-bg-danger"><?= __("Important"); ?></span> <?= __("On Clubstations the API Keys are personal and not shared. Clubstation users can only see their own keys."); ?></p>
@@ -41,7 +41,7 @@
<tbody>
<?php foreach ($api_keys->result() as $row) { ?>
<tr>
<?php if ($clubmode && $row->user_callsign !== $this->session->userdata('cd_src_call')) {
<?php if ($clubmode && $row->user_callsign !== $this->session->userdata('cd_src_call')) {
$api_key = substr($row->key, 0, 2) . str_repeat('*', strlen($row->key) - 6) . substr($row->key, -4);
$masked = true;
} else {
@@ -72,10 +72,10 @@
<td>
<?php if (!$masked) { ?>
<a href="<?php echo site_url('api/edit'); ?>/<?php echo $api_key; ?>" class="btn btn-outline-primary btn-sm"><?= __("Edit"); ?></a>
<a href="<?php echo site_url('api/auth/' . $api_key); ?>" target="_blank" class="btn btn-primary btn-sm"><?= __("Test"); ?></a>
<?php
<?php
$cfnm_delete = sprintf(__("Are you sure you want delete the API Key %s?"), '&quot;'.($row->description ?? '<noname>').'&quot;');
?>
<a href="<?php echo site_url('api/delete/' . $api_key); ?>" class="btn btn-danger btn-sm" onclick="return confirm('<?php echo $cfnm_delete; ?>');"><?= __("Delete"); ?></a>

View File

@@ -436,22 +436,61 @@ $(function () {
<script type="text/javascript">
function copyApiKey(apiKey) {
var apiKeyField = $('#'+apiKey);
navigator.clipboard.writeText(apiKey).then(function() {
});
apiKeyField.addClass('flash-copy')
.delay('1000').queue(function() {
apiKeyField.removeClass('flash-copy').dequeue();
if (navigator.clipboard && navigator.clipboard.writeText) {
navigator.clipboard.writeText(apiKey).then(function() {
apiKeyField.addClass('flash-copy')
.delay('1000').queue(function() {
apiKeyField.removeClass('flash-copy').dequeue();
});
}).catch(function(err) {
console.error('Failed to copy: ', err);
alert('Failed to copy to clipboard');
});
} else {
// Fallback for browsers that don't support clipboard API
var tempInput = document.createElement('input');
tempInput.value = apiKey;
document.body.appendChild(tempInput);
tempInput.select();
document.execCommand('copy');
document.body.removeChild(tempInput);
apiKeyField.addClass('flash-copy')
.delay('1000').queue(function() {
apiKeyField.removeClass('flash-copy').dequeue();
});
}
}
function copyApiUrl() {
var apiUrlField = $('#apiUrl');
navigator.clipboard.writeText("<?php echo site_url(); ?>").then(function() {
});
apiUrlField.addClass('flash-copy')
.delay('1000').queue(function() {
apiUrlField.removeClass('flash-copy').dequeue();
var urlText = "<?php echo site_url(); ?>";
if (navigator.clipboard && navigator.clipboard.writeText) {
navigator.clipboard.writeText(urlText).then(function() {
apiUrlField.addClass('flash-copy')
.delay('1000').queue(function() {
apiUrlField.removeClass('flash-copy').dequeue();
});
}).catch(function(err) {
console.error('Failed to copy: ', err);
alert('Failed to copy to clipboard');
});
} else {
// Fallback for browsers that don't support clipboard API
var tempInput = document.createElement('input');
tempInput.value = urlText;
document.body.appendChild(tempInput);
tempInput.select();
document.execCommand('copy');
document.body.removeChild(tempInput);
apiUrlField.addClass('flash-copy')
.delay('1000').queue(function() {
apiUrlField.removeClass('flash-copy').dequeue();
});
}
}
$(function () {

43
assets/js/sections/api.js Normal file
View File

@@ -0,0 +1,43 @@
// API page clipboard functions
function copyToClipboard(text, targetElement) {
if (navigator.clipboard && navigator.clipboard.writeText) {
// Modern Clipboard API
navigator.clipboard.writeText(text).then(function() {
targetElement.addClass('flash-copy')
.delay('1000').queue(function() {
targetElement.removeClass('flash-copy').dequeue();
});
}).catch(function(err) {
console.error('Failed to copy: ', err);
alert('Failed to copy to clipboard');
});
} else {
// Fallback for browsers that don't support clipboard API
var tempInput = document.createElement('input');
tempInput.value = text;
document.body.appendChild(tempInput);
tempInput.select();
document.execCommand('copy');
document.body.removeChild(tempInput);
targetElement.addClass('flash-copy')
.delay('1000').queue(function() {
targetElement.removeClass('flash-copy').dequeue();
});
}
}
function copyApiKey(apiKey) {
var apiKeyField = $('#'+apiKey);
copyToClipboard(apiKey, apiKeyField);
}
function copyApiUrl(urlText) {
var apiUrlField = $('#apiUrl');
copyToClipboard(urlText, apiUrlField);
}
$(function () {
$('[data-bs-toggle="tooltip"]').tooltip({'delay': { show: 500, hide: 0 }, 'placement': 'right'});
});