MokoSuiteClient/source/packages/mod_mokosuiteclient_cache/tmpl/default.php

<?php
/**
 * MokoSuiteClient Cache & Temp Cleaner — status bar split button
 *
 * Displays "Clear: Cache | Temp" as a single header item with two
 * clickable halves. Uses native Atum header-item markup.
 */

defined('_JEXEC') or die;

use Joomla\CMS\Session\Session;

$token    = Session::getFormToken();
$cacheUrl = 'index.php?option=com_mokosuiteclient&task=clearCache&format=json';
$tempUrl  = 'index.php?option=com_mokosuiteclient&task=clearTemp&format=json';
$domain   = $domain ?? '';
?>

<style>
.mokosuiteclient-cleaner { display:flex; align-items:center; gap:0; padding:0 0.25rem; }
.mokosuiteclient-cleaner-label { font-size:0.8rem; color:var(--template-text-dark,#495057); white-space:nowrap; padding-inline-end:0.35rem; }
.mokosuiteclient-cleaner-btn { cursor:pointer; padding:0.2rem 0.5rem; font-size:0.8rem; border-radius:3px; text-decoration:none; color:var(--template-text-dark,#495057); transition:background 0.15s; white-space:nowrap; }
.mokosuiteclient-cleaner-btn:hover { background:rgba(0,0,0,0.08); color:var(--template-text-dark,#212529); text-decoration:none; }
.mokosuiteclient-cleaner-sep { color:var(--template-text-dark,#adb5bd); padding:0 0.1rem; font-size:0.8rem; }
.mokosuiteclient-domain { font-family:monospace; font-size:0.75rem; color:var(--template-text-dark,#6c757d); cursor:pointer; padding:0.15rem 0.4rem; border-radius:3px; transition:background 0.15s; }
.mokosuiteclient-domain:hover { background:rgba(0,0,0,0.06); }
</style>

<div class="header-item-content mokosuiteclient-cleaner">
	<?php if ($domain): ?>
	<span class="mokosuiteclient-domain" id="mokosuiteclient-domain" title="Support key — click to copy"><?php echo htmlspecialchars($domain); ?></span>
	<span class="mokosuiteclient-cleaner-sep">|</span>
	<?php endif; ?>
	<span class="mokosuiteclient-cleaner-label">Clear:</span>
	<a href="#" class="mokosuiteclient-cleaner-btn" id="mokosuiteclient-clear-cache" title="Clear all Joomla cache">
		<span class="icon-bolt" aria-hidden="true" id="mokosuiteclient-cache-icon"></span> Cache
	</a>
	<span class="mokosuiteclient-cleaner-sep">|</span>
	<a href="#" class="mokosuiteclient-cleaner-btn" id="mokosuiteclient-clear-temp" title="Clear temp directory">
		<span class="icon-trash" aria-hidden="true" id="mokosuiteclient-temp-icon"></span> Temp
	</a>
</div>

<script>
document.addEventListener('DOMContentLoaded', function() {
	function setupCleaner(btnId, iconId, url, token) {
		var btn  = document.getElementById(btnId);
		var icon = document.getElementById(iconId);
		if (!btn || !icon) return;
		var origClass = icon.className;

		btn.addEventListener('click', function(e) {
			e.preventDefault();
			if (btn.dataset.busy) return;
			btn.dataset.busy = '1';
			icon.className = 'icon-spinner icon-spin';

			var formData = new FormData();
			formData.append(token, '1');

			fetch(url, {
				method: 'POST',
				headers: {'X-Requested-With': 'XMLHttpRequest'},
				body: formData
			})
			.then(function(r) { return r.json(); })
			.then(function(data) {
				if (data.success) {
					icon.className = 'icon-check';
					icon.style.color = '#198754';
				} else {
					icon.className = 'icon-times';
					icon.style.color = '#dc3545';
				}
				setTimeout(function() {
					icon.className = origClass;
					icon.style.color = '';
					delete btn.dataset.busy;
				}, 2000);
			})
			.catch(function() {
				icon.className = 'icon-times';
				icon.style.color = '#dc3545';
				setTimeout(function() {
					icon.className = origClass;
					icon.style.color = '';
					delete btn.dataset.busy;
				}, 2000);
			});
		});
	}

	setupCleaner('mokosuiteclient-clear-cache', 'mokosuiteclient-cache-icon', '<?php echo $cacheUrl; ?>', '<?php echo $token; ?>');
	setupCleaner('mokosuiteclient-clear-temp', 'mokosuiteclient-temp-icon', '<?php echo $tempUrl; ?>', '<?php echo $token; ?>');

	// Click-to-copy domain
	var domainEl = document.getElementById('mokosuiteclient-domain');
	if (domainEl) {
		domainEl.addEventListener('click', function() {
			navigator.clipboard.writeText(domainEl.textContent.trim()).then(function() {
				var orig = domainEl.textContent;
				domainEl.textContent = 'Copied!';
				setTimeout(function() { domainEl.textContent = orig; }, 1500);
			});
		});
	}
});
</script>