fix: convert inline modals to Bootstrap 5, fix language keys, ntfy default, and MokoRestore error handling
Universal: PR Check / Branch Policy (pull_request) Successful in 1s
Universal: PR Check / Validate PR (pull_request) Failing after 5s
Universal: Pre-Release / Build Pre-Release (${{ inputs.stability || github.ref_name }}) (push) Successful in 19s
Universal: PR Check / Secret Scan (pull_request) Successful in 9s
Joomla: Metadata Validation / Validate Joomla Metadata (pull_request) Successful in 29s
Universal: PR Check / Build RC Package (pull_request) Has been cancelled
Universal: PR Check / Report Issues (pull_request) Has been cancelled

- Convert 10 inline CSS modals to Bootstrap 5 (backups: 7, snapshots: 3)
- Replace style.display show/hide with Bootstrap Modal API
- Fix JFIELD_ORDERING_LABEL_ASC → JFIELD_ORDERING_ASC in profile filter
- Add COM_MOKOJOOMBACKUP_CONFIGURATION key for Options page title
- Change ntfy default server to ntfy.mokoconsulting.tech
- Add profile ID to dropdown labels across backups, dashboard, cpanel module
- Add error handling to MokoRestore post() and runPreflight() to prevent UI stalling
- Remove outdated SSH auth pattern references from field descriptions
This commit is contained in:
2026-06-25 08:35:40 -05:00
parent bb8e4a258a
commit 3742477aef
8 changed files with 374 additions and 347 deletions
@@ -245,7 +245,7 @@
type="text"
label="COM_MOKOJOOMBACKUP_CONFIG_NTFY_SERVER"
description="COM_MOKOJOOMBACKUP_CONFIG_NTFY_SERVER_DESC"
default="https://ntfy.sh"
default="https://ntfy.mokoconsulting.tech"
filter="url"
/>
<field
@@ -27,7 +27,7 @@
default="a.ordering ASC"
onchange="this.form.submit();"
>
<option value="a.ordering ASC">JFIELD_ORDERING_LABEL_ASC</option>
<option value="a.ordering ASC">JFIELD_ORDERING_ASC</option>
<option value="a.title ASC">COM_MOKOJOOMBACKUP_HEADING_TITLE_ASC</option>
<option value="a.title DESC">COM_MOKOJOOMBACKUP_HEADING_TITLE_DESC</option>
<option value="a.id DESC">JGRID_HEADING_ID_DESC</option>
@@ -5,6 +5,7 @@
; @license GPL-3.0-or-later
COM_MOKOJOOMBACKUP="MokoSuiteBackup"
COM_MOKOJOOMBACKUP_CONFIGURATION="MokoSuiteBackup Options"
COM_MOKOJOOMBACKUP_DESCRIPTION="Full-site backup and restore for Joomla"
; Submenu
@@ -275,9 +276,9 @@ COM_MOKOJOOMBACKUP_FIELD_SFTP_PORT_DESC="SSH port (default: 22)"
COM_MOKOJOOMBACKUP_FIELD_SFTP_USERNAME="SSH Username"
COM_MOKOJOOMBACKUP_FIELD_SFTP_USERNAME_DESC="Username for SSH authentication"
COM_MOKOJOOMBACKUP_FIELD_SFTP_PASSWORD="SSH Password"
COM_MOKOJOOMBACKUP_FIELD_SFTP_PASSWORD_DESC="Password for SSH authentication. Leave blank if using a key file."
COM_MOKOJOOMBACKUP_FIELD_SFTP_PASSWORD_DESC="Password for SSH authentication."
COM_MOKOJOOMBACKUP_FIELD_SFTP_KEY="SSH Private Key"
COM_MOKOJOOMBACKUP_FIELD_SFTP_KEY_DESC="Upload your SSH private key (id_rsa, id_ed25519). Stored base64-encoded in DB, written to temp file during upload only. Leave blank for password auth."
COM_MOKOJOOMBACKUP_FIELD_SFTP_KEY_DESC="Upload your SSH private key (id_rsa, id_ed25519). Stored base64-encoded in DB, written to temp file during upload only."
COM_MOKOJOOMBACKUP_FIELD_SFTP_KEY_UPLOAD="Upload Key File"
COM_MOKOJOOMBACKUP_FIELD_SFTP_KEY_REPLACE="Replace Key"
COM_MOKOJOOMBACKUP_FIELD_SFTP_KEY_LOADED="Key loaded"
@@ -1769,8 +1769,23 @@ async function post(action, extra) {
form.append(k, v);
}
}
const res = await fetch('restore.php', { method: 'POST', body: form });
return res.json();
var res;
try {
res = await fetch('restore.php', { method: 'POST', body: form });
} catch (e) {
log('Network error: ' + e.message);
return { success: false, message: 'Network error: ' + e.message, checks: [] };
}
if (!res.ok) {
log('Server error: HTTP ' + res.status);
return { success: false, message: 'Server error (HTTP ' + res.status + ')', checks: [] };
}
try {
return await res.json();
} catch (e) {
log('Invalid response from server (not JSON)');
return { success: false, message: 'Invalid server response — check PHP error log', checks: [] };
}
}
function goStep(n) {
@@ -1845,42 +1860,57 @@ async function runPreflight() {
setBtnLoading(btn, true);
log('Running pre-flight checks...');
const r = await post('preflight');
const list = document.getElementById('checkList');
while (list.firstChild) list.removeChild(list.firstChild);
try {
const r = await post('preflight');
r.checks.forEach(function(c) {
const li = document.createElement('li');
const icon = document.createElement('span');
icon.className = 'mr-check-icon ' + (c.ok ? 'mr-check-ok' : 'mr-check-fail');
icon.textContent = c.ok ? '\u2713' : '\u2717';
if (!r.success && !r.checks.length) {
log('Pre-flight error: ' + (r.message || 'Unknown error'));
setBtnLoading(btn, false);
btn.textContent = 'Re-check';
setStatus('checkList', r.message || 'Pre-flight check failed', 'error');
return;
}
const label = document.createElement('span');
label.className = 'mr-check-label';
label.textContent = c.label;
const list = document.getElementById('checkList');
while (list.firstChild) list.removeChild(list.firstChild);
const val = document.createElement('span');
val.className = 'mr-check-value';
val.textContent = c.value;
r.checks.forEach(function(c) {
const li = document.createElement('li');
const icon = document.createElement('span');
icon.className = 'mr-check-icon ' + (c.ok ? 'mr-check-ok' : 'mr-check-fail');
icon.textContent = c.ok ? '\u2713' : '\u2717';
li.appendChild(icon);
li.appendChild(label);
li.appendChild(val);
list.appendChild(li);
const label = document.createElement('span');
label.className = 'mr-check-label';
label.textContent = c.label;
log(' ' + (c.ok ? 'OK' : 'FAIL') + ': ' + c.label + ' = ' + c.value);
});
const val = document.createElement('span');
val.className = 'mr-check-value';
val.textContent = c.value;
setBtnLoading(btn, false);
li.appendChild(icon);
li.appendChild(label);
li.appendChild(val);
list.appendChild(li);
if (r.success) {
btn.textContent = 'Next \u2192';
btn.onclick = function() { goStep(2); };
btn.className = 'mr-btn mr-btn-success';
log('All checks passed');
} else {
log(' ' + (c.ok ? 'OK' : 'FAIL') + ': ' + c.label + ' = ' + c.value);
});
setBtnLoading(btn, false);
if (r.success) {
btn.textContent = 'Next \u2192';
btn.onclick = function() { goStep(2); };
btn.className = 'mr-btn mr-btn-success';
log('All checks passed');
} else {
btn.textContent = 'Re-check';
log('Some checks failed');
}
} catch (e) {
log('Pre-flight error: ' + e.message);
setBtnLoading(btn, false);
btn.textContent = 'Re-check';
log('Some checks failed');
}
}
@@ -42,6 +42,7 @@ $listDirn = $this->escape($this->state->get('list.direction'));
<select id="mb-profile-select" class="form-select" style="max-width:300px;">
<?php foreach ($this->profiles as $profile) : ?>
<option value="<?php echo (int) $profile->id; ?>">
#<?php echo (int) $profile->id; ?> —
<?php echo $this->escape($profile->title); ?>
(<?php echo $this->escape($profile->backup_type); ?>)
</option>
@@ -188,18 +189,24 @@ $listDirn = $this->escape($this->state->get('list.direction'));
</form>
<!-- Stepped Backup Modal (for shared hosting) -->
<div id="mokosuitebackup-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
<div style="max-width:500px; margin:10% auto; background:#fff; border-radius:8px; padding:2rem; box-shadow:0 4px 20px rgba(0,0,0,0.3);">
<h3 id="mb-modal-title" style="margin:0 0 1rem;">Backup in Progress</h3>
<div class="alert alert-warning py-1 px-2 mb-2" style="font-size:0.85rem;">
<span class="icon-warning-circle" aria-hidden="true"></span>
<strong>Do not navigate away or close this window</strong> while the backup is running.
<div class="modal fade" id="mokosuitebackup-modal" tabindex="-1" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="mb-modal-title">Backup in Progress</h5>
</div>
<div class="modal-body">
<div class="alert alert-warning py-1 px-2 mb-2" style="font-size:0.85rem;">
<span class="icon-warning-circle" aria-hidden="true"></span>
<strong>Do not navigate away or close this window</strong> while the backup is running.
</div>
<div class="progress mb-2" style="height:24px;">
<div id="mb-progress-bar" class="progress-bar" role="progressbar" style="width:0%;">0%</div>
</div>
<p id="mb-status" class="text-muted mb-1" style="font-size:0.9rem;">Initializing...</p>
<p id="mb-phase" class="text-muted mb-0" style="font-size:0.8rem;">Phase: init</p>
</div>
</div>
<div style="background:#e9ecef; border-radius:4px; overflow:hidden; height:24px; margin-bottom:0.5rem;">
<div id="mb-progress-bar" style="height:100%; background:#0d6efd; transition:width 0.3s; width:0%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:0.8rem; font-weight:bold;">0%</div>
</div>
<p id="mb-status" style="color:#666; font-size:0.9rem; margin:0.5rem 0;">Initializing...</p>
<p id="mb-phase" style="color:#999; font-size:0.8rem; margin:0;">Phase: init</p>
</div>
</div>
@@ -235,12 +242,12 @@ $listDirn = $this->escape($this->state->get('list.direction'));
function showModal() {
backupRunning = true;
document.getElementById('mokosuitebackup-modal').style.display = 'block';
bootstrap.Modal.getOrCreateInstance(document.getElementById('mokosuitebackup-modal')).show();
}
function hideModal() {
backupRunning = false;
document.getElementById('mokosuitebackup-modal').style.display = 'none';
bootstrap.Modal.getInstance(document.getElementById('mokosuitebackup-modal'))?.hide();
}
function updateProgress(progress, message, phase) {
@@ -344,31 +351,26 @@ $listDirn = $this->escape($this->state->get('list.direction'));
return false;
}
document.getElementById('mb-restore-record-id').value = checked[0].value;
document.getElementById('mb-restore-modal').style.display = 'block';
bootstrap.Modal.getOrCreateInstance(document.getElementById('mb-restore-modal')).show();
return false;
}, true);
}
});
// Close restore modal
document.addEventListener('click', function(e) {
if (e.target.classList.contains('mb-restore-close') || e.target.id === 'mb-restore-modal') {
document.getElementById('mb-restore-modal').style.display = 'none';
}
});
// Close restore modal handled by Bootstrap data-bs-dismiss
// AJAX stepped restore
var restoreRunning = false;
function showRestoreProgress() {
restoreRunning = true;
document.getElementById('mb-restore-modal').style.display = 'none';
document.getElementById('mb-restore-progress-modal').style.display = 'block';
bootstrap.Modal.getInstance(document.getElementById('mb-restore-modal'))?.hide();
bootstrap.Modal.getOrCreateInstance(document.getElementById('mb-restore-progress-modal')).show();
}
function hideRestoreProgress() {
restoreRunning = false;
document.getElementById('mb-restore-progress-modal').style.display = 'none';
bootstrap.Modal.getInstance(document.getElementById('mb-restore-progress-modal'))?.hide();
}
function updateRestoreProgress(progress, message, phase) {
@@ -466,7 +468,7 @@ $listDirn = $this->escape($this->state->get('list.direction'));
var modal = document.getElementById('mb-log-modal');
var body = document.getElementById('mb-log-body');
body.textContent = 'Loading...';
modal.style.display = 'block';
bootstrap.Modal.getOrCreateInstance(modal).show();
var form = new URLSearchParams();
form.append('task', 'ajax.viewLog');
@@ -491,11 +493,7 @@ $listDirn = $this->escape($this->state->get('list.direction'));
});
});
document.addEventListener('click', function(e) {
if (e.target.id === 'mb-log-modal' || e.target.classList.contains('mb-log-close')) {
document.getElementById('mb-log-modal').style.display = 'none';
}
});
// Log modal close handled by Bootstrap data-bs-dismiss
// Browse Archive modal handler
function formatFileSize(bytes) {
@@ -551,7 +549,7 @@ $listDirn = $this->escape($this->state->get('list.direction'));
var summary = document.getElementById('mb-browse-summary');
browseSetMessage(tbody, 'Loading...');
summary.textContent = '';
modal.style.display = 'block';
bootstrap.Modal.getOrCreateInstance(modal).show();
postAjax({ task: 'ajax.browseArchive', id: recordId })
.then(function(data) {
@@ -578,119 +576,127 @@ $listDirn = $this->escape($this->state->get('list.direction'));
});
});
document.addEventListener('click', function(e) {
if (e.target.id === 'mb-browse-modal' || e.target.classList.contains('mb-browse-close')) {
document.getElementById('mb-browse-modal').style.display = 'none';
}
});
// Browse modal close handled by Bootstrap data-bs-dismiss
})();
</script>
<!-- Restore Confirmation Modal -->
<div id="mb-restore-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
<div style="max-width:500px; margin:8% auto; background:#fff; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.3);">
<div style="display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #dee2e6;">
<h4 style="margin:0;"><?php echo Text::_('COM_MOKOJOOMBACKUP_TOOLBAR_RESTORE'); ?></h4>
<button type="button" class="btn-close mb-restore-close" aria-label="Close"></button>
<div class="modal fade" id="mb-restore-modal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title"><?php echo Text::_('COM_MOKOJOOMBACKUP_TOOLBAR_RESTORE'); ?></h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=backups.restore'); ?>" method="post" id="mb-restore-form">
<input type="hidden" name="id" id="mb-restore-record-id" value="">
<div class="modal-body">
<div class="alert alert-danger">
<span class="icon-warning-circle" aria-hidden="true"></span>
<strong><?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_CONFIRM'); ?></strong>
</div>
<div class="mb-3">
<div class="form-check">
<input class="form-check-input" type="checkbox" name="restore_files" value="1" id="mb-restore-files" checked>
<label class="form-check-label" for="mb-restore-files">
<?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_FILES'); ?>
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="restore_db" value="1" id="mb-restore-db" checked>
<label class="form-check-label" for="mb-restore-db">
<?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_DATABASE'); ?>
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="preserve_config" value="1" id="mb-restore-config" checked>
<label class="form-check-label" for="mb-restore-config">
<?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_PRESERVE_CONFIG'); ?>
<small class="text-muted d-block"><?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_PRESERVE_CONFIG_DESC'); ?></small>
</label>
</div>
</div>
<div class="mb-3">
<label for="mb-restore-password" class="form-label"><?php echo Text::_('COM_MOKOJOOMBACKUP_FIELD_ENCRYPTION_PASSWORD'); ?></label>
<input type="password" class="form-control" id="mb-restore-password" name="encryption_password"
placeholder="<?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_PASSWORD_PLACEHOLDER'); ?>" autocomplete="off">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><?php echo Text::_('JCANCEL'); ?></button>
<button type="submit" class="btn btn-danger">
<span class="icon-upload" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_TOOLBAR_RESTORE'); ?>
</button>
</div>
<?php echo HTMLHelper::_('form.token'); ?>
</form>
</div>
<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=backups.restore'); ?>" method="post" id="mb-restore-form">
<input type="hidden" name="id" id="mb-restore-record-id" value="">
<div style="padding:1.5rem;">
<div class="alert alert-danger">
<span class="icon-warning-circle" aria-hidden="true"></span>
<strong><?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_CONFIRM'); ?></strong>
</div>
<div class="mb-3">
<div class="form-check">
<input class="form-check-input" type="checkbox" name="restore_files" value="1" id="mb-restore-files" checked>
<label class="form-check-label" for="mb-restore-files">
<?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_FILES'); ?>
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="restore_db" value="1" id="mb-restore-db" checked>
<label class="form-check-label" for="mb-restore-db">
<?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_DATABASE'); ?>
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="preserve_config" value="1" id="mb-restore-config" checked>
<label class="form-check-label" for="mb-restore-config">
<?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_PRESERVE_CONFIG'); ?>
<small class="text-muted d-block"><?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_PRESERVE_CONFIG_DESC'); ?></small>
</label>
</div>
</div>
<div class="mb-3">
<label for="mb-restore-password" class="form-label"><?php echo Text::_('COM_MOKOJOOMBACKUP_FIELD_ENCRYPTION_PASSWORD'); ?></label>
<input type="password" class="form-control" id="mb-restore-password" name="encryption_password"
placeholder="<?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_PASSWORD_PLACEHOLDER'); ?>" autocomplete="off">
</div>
</div>
<div style="padding:0 1.5rem 1.5rem; text-align:right;">
<button type="button" class="btn btn-secondary mb-restore-close"><?php echo Text::_('JCANCEL'); ?></button>
<button type="submit" class="btn btn-danger">
<span class="icon-upload" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_TOOLBAR_RESTORE'); ?>
</button>
</div>
<?php echo HTMLHelper::_('form.token'); ?>
</form>
</div>
</div>
<!-- Restore Progress Modal -->
<div id="mb-restore-progress-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
<div style="max-width:500px; margin:10% auto; background:#fff; border-radius:8px; padding:2rem; box-shadow:0 4px 20px rgba(0,0,0,0.3);">
<h3 id="mb-restore-title" style="margin:0 0 1rem;">Restore in Progress</h3>
<div style="background:#e9ecef; border-radius:4px; overflow:hidden; height:24px; margin-bottom:0.5rem;">
<div id="mb-restore-progress-bar" style="height:100%; background:#dc3545; transition:width 0.3s; width:0%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:0.8rem; font-weight:bold;">0%</div>
<div class="modal fade" id="mb-restore-progress-modal" tabindex="-1" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="mb-restore-title">Restore in Progress</h5>
</div>
<div class="modal-body">
<div class="progress mb-2" style="height:24px;">
<div id="mb-restore-progress-bar" class="progress-bar bg-danger" role="progressbar" style="width:0%;">0%</div>
</div>
<p id="mb-restore-status" class="text-muted mb-1" style="font-size:0.9rem;">Initializing...</p>
<p id="mb-restore-phase" class="text-muted mb-0" style="font-size:0.8rem;">Phase: init</p>
</div>
</div>
<p id="mb-restore-status" style="color:#666; font-size:0.9rem; margin:0.5rem 0;">Initializing...</p>
<p id="mb-restore-phase" style="color:#999; font-size:0.8rem; margin:0;">Phase: init</p>
</div>
</div>
<!-- Log Viewer Modal -->
<div id="mb-log-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
<div style="max-width:700px; margin:5% auto; background:#fff; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.3); display:flex; flex-direction:column; max-height:80vh;">
<div style="display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #dee2e6;">
<h4 style="margin:0;"><?php echo Text::_('COM_MOKOJOOMBACKUP_VIEW_LOG'); ?></h4>
<button type="button" class="btn-close mb-log-close" aria-label="Close"></button>
<div class="modal fade" id="mb-log-modal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title"><?php echo Text::_('COM_MOKOJOOMBACKUP_VIEW_LOG'); ?></h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body" style="max-height:60vh; overflow-y:auto;">
<pre id="mb-log-body" style="white-space:pre-wrap; word-break:break-word; font-size:0.85rem; margin:0; background:#f8f9fa; padding:1rem; border-radius:4px;"></pre>
</div>
</div>
<div style="padding:1rem 1.5rem; overflow-y:auto; flex:1;">
<pre id="mb-log-body" style="white-space:pre-wrap; word-break:break-word; font-size:0.85rem; margin:0; background:#f8f9fa; padding:1rem; border-radius:4px;"></pre>
</div>
</div>
</div>
<!-- Archive Browser Modal -->
<div id="mb-browse-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
<div style="max-width:800px; margin:5% auto; background:#fff; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.3); display:flex; flex-direction:column; max-height:80vh;">
<div style="display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #dee2e6;">
<h4 style="margin:0;">
<span class="icon-folder-open" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_BROWSE_ARCHIVE'); ?>
</h4>
<button type="button" class="btn-close mb-browse-close" aria-label="Close"></button>
</div>
<div style="padding:0.75rem 1.5rem; border-bottom:1px solid #dee2e6; background:#f8f9fa;">
<small id="mb-browse-summary" class="text-muted"></small>
</div>
<div style="padding:0; overflow-y:auto; flex:1;">
<table class="table table-sm table-striped mb-0">
<thead>
<tr>
<th><?php echo Text::_('COM_MOKOJOOMBACKUP_BROWSE_COL_NAME'); ?></th>
<th class="text-end" style="width:100px;"><?php echo Text::_('COM_MOKOJOOMBACKUP_BROWSE_COL_SIZE'); ?></th>
<th class="text-end" style="width:120px;"><?php echo Text::_('COM_MOKOJOOMBACKUP_BROWSE_COL_COMPRESSED'); ?></th>
</tr>
</thead>
<tbody id="mb-browse-tbody">
</tbody>
</table>
<div class="modal fade" id="mb-browse-modal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">
<span class="icon-folder-open" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_BROWSE_ARCHIVE'); ?>
</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body p-0">
<div class="px-3 py-2 bg-light border-bottom">
<small id="mb-browse-summary" class="text-muted"></small>
</div>
<div style="max-height:60vh; overflow-y:auto;">
<table class="table table-sm table-striped mb-0">
<thead>
<tr>
<th><?php echo Text::_('COM_MOKOJOOMBACKUP_BROWSE_COL_NAME'); ?></th>
<th class="text-end" style="width:100px;"><?php echo Text::_('COM_MOKOJOOMBACKUP_BROWSE_COL_SIZE'); ?></th>
<th class="text-end" style="width:120px;"><?php echo Text::_('COM_MOKOJOOMBACKUP_BROWSE_COL_COMPRESSED'); ?></th>
</tr>
</thead>
<tbody id="mb-browse-tbody">
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
@@ -698,69 +704,73 @@ $listDirn = $this->escape($this->state->get('list.direction'));
<!-- Purge Backups Modal -->
<?php $canDelete = $user->authorise('core.delete', 'com_mokosuitebackup'); ?>
<?php if ($canDelete) : ?>
<div id="mb-purge-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
<div style="max-width:500px; margin:8% auto; background:#fff; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.3);">
<div style="display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #dee2e6;">
<h4 style="margin:0;">
<span class="icon-trash" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_TITLE'); ?>
</h4>
<button type="button" class="btn-close mb-purge-close" aria-label="Close"></button>
</div>
<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=backups.purge'); ?>" method="post" id="mb-purge-form">
<div style="padding:1.5rem;">
<p><?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_DESC'); ?></p>
<div class="mb-3">
<label for="mb-purge-date" class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_DATE_LABEL'); ?></label>
<input type="date" class="form-control" id="mb-purge-date" name="purge_date" required>
</div>
<div id="mb-purge-count-wrapper" style="display:none;">
<div class="alert alert-danger mb-0" id="mb-purge-count-msg"></div>
</div>
<div id="mb-purge-none-wrapper" style="display:none;">
<div class="alert alert-info mb-0"><?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_NONE_FOUND'); ?></div>
</div>
</div>
<div style="padding:0 1.5rem 1.5rem; text-align:right;">
<button type="button" class="btn btn-secondary mb-purge-close"><?php echo Text::_('JCANCEL'); ?></button>
<button type="submit" class="btn btn-danger" id="mb-purge-submit" disabled>
<div class="modal fade" id="mb-purge-modal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">
<span class="icon-trash" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_SUBMIT'); ?>
</button>
<?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_TITLE'); ?>
</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<?php echo HTMLHelper::_('form.token'); ?>
</form>
<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=backups.purge'); ?>" method="post" id="mb-purge-form">
<div class="modal-body">
<p><?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_DESC'); ?></p>
<div class="mb-3">
<label for="mb-purge-date" class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_DATE_LABEL'); ?></label>
<input type="date" class="form-control" id="mb-purge-date" name="purge_date" required>
</div>
<div id="mb-purge-count-wrapper" style="display:none;">
<div class="alert alert-danger mb-0" id="mb-purge-count-msg"></div>
</div>
<div id="mb-purge-none-wrapper" style="display:none;">
<div class="alert alert-info mb-0"><?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_NONE_FOUND'); ?></div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><?php echo Text::_('JCANCEL'); ?></button>
<button type="submit" class="btn btn-danger" id="mb-purge-submit" disabled>
<span class="icon-trash" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_SUBMIT'); ?>
</button>
</div>
<?php echo HTMLHelper::_('form.token'); ?>
</form>
</div>
</div>
</div>
<?php endif; ?>
<!-- Backup Comparison Modal -->
<div id="mb-compare-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
<div style="max-width:800px; margin:5% auto; background:#fff; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.3); display:flex; flex-direction:column; max-height:85vh;">
<div style="display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #dee2e6;">
<h4 style="margin:0;">
<span class="icon-copy" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_TITLE'); ?>
</h4>
<button type="button" class="btn-close mb-compare-close" aria-label="Close"></button>
</div>
<div style="padding:1rem 1.5rem; overflow-y:auto; flex:1;">
<div id="mb-compare-loading" style="text-align:center; padding:2rem;">
<span class="icon-spinner icon-spin" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_LOADING'); ?>
<div class="modal fade" id="mb-compare-modal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">
<span class="icon-copy" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_TITLE'); ?>
</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body" style="max-height:65vh; overflow-y:auto;">
<div id="mb-compare-loading" class="text-center py-4">
<span class="icon-spinner icon-spin" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_LOADING'); ?>
</div>
<div id="mb-compare-error" style="display:none;" class="alert alert-danger"></div>
<table id="mb-compare-table" class="table table-striped" style="display:none;">
<thead>
<tr>
<th><?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_FIELD'); ?></th>
<th><?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_BACKUP'); ?> 1</th>
<th><?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_BACKUP'); ?> 2</th>
<th><?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_DELTA'); ?></th>
</tr>
</thead>
<tbody id="mb-compare-body"></tbody>
</table>
</div>
<div id="mb-compare-error" style="display:none;" class="alert alert-danger"></div>
<table id="mb-compare-table" class="table table-striped" style="display:none;">
<thead>
<tr>
<th><?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_FIELD'); ?></th>
<th><?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_BACKUP'); ?> 1</th>
<th><?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_BACKUP'); ?> 2</th>
<th><?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_DELTA'); ?></th>
</tr>
</thead>
<tbody id="mb-compare-body"></tbody>
</table>
</div>
</div>
</div>
@@ -807,7 +817,7 @@ $listDirn = $this->escape($this->state->get('list.direction'));
var table = document.getElementById('mb-compare-table');
var body = document.getElementById('mb-compare-body');
modal.style.display = 'block';
bootstrap.Modal.getOrCreateInstance(modal).show();
loading.style.display = 'block';
errorEl.style.display = 'none';
table.style.display = 'none';
@@ -874,12 +884,7 @@ $listDirn = $this->escape($this->state->get('list.direction'));
});
}
// Close compare modal
document.addEventListener('click', function(e) {
if (e.target.id === 'mb-compare-modal' || e.target.classList.contains('mb-compare-close')) {
document.getElementById('mb-compare-modal').style.display = 'none';
}
});
// Compare modal close handled by Bootstrap data-bs-dismiss
// Intercept Compare toolbar button
document.addEventListener('DOMContentLoaded', function() {
@@ -922,7 +927,7 @@ $listDirn = $this->escape($this->state->get('list.direction'));
document.getElementById('mb-purge-count-wrapper').style.display = 'none';
document.getElementById('mb-purge-none-wrapper').style.display = 'none';
document.getElementById('mb-purge-submit').disabled = true;
document.getElementById('mb-purge-modal').style.display = 'block';
bootstrap.Modal.getOrCreateInstance(document.getElementById('mb-purge-modal')).show();
return false;
}, true);
}
@@ -936,12 +941,7 @@ $listDirn = $this->escape($this->state->get('list.direction'));
});
}
// Close modal
document.addEventListener('click', function(e) {
if (e.target.id === 'mb-purge-modal' || e.target.classList.contains('mb-purge-close')) {
document.getElementById('mb-purge-modal').style.display = 'none';
}
});
// Purge modal close handled by Bootstrap data-bs-dismiss
// Confirm on submit
var purgeForm = document.getElementById('mb-purge-form');
@@ -238,6 +238,7 @@ document.querySelectorAll('.mb-tile').forEach(function(tile) {
<select id="mb-profile-select" class="form-select mb-2">
<?php foreach ($this->profiles as $profile) : ?>
<option value="<?php echo (int) $profile->id; ?>">
#<?php echo (int) $profile->id; ?> —
<?php echo $this->escape($profile->title); ?>
(<?php echo $this->escape($profile->backup_type); ?>)
</option>
@@ -132,117 +132,121 @@ $listDirn = $this->escape($this->state->get('list.direction'));
</form>
<!-- Create Snapshot Modal -->
<div id="mb-snapshot-create-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
<div style="max-width:500px; margin:8% auto; background:#fff; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.3);">
<div style="display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #dee2e6;">
<h4 style="margin:0;"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_CREATE'); ?></h4>
<button type="button" class="btn-close mb-modal-close" aria-label="Close"></button>
<div class="modal fade" id="mb-snapshot-create-modal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_CREATE'); ?></h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=snapshots.create'); ?>" method="post" id="mb-snapshot-create-form">
<div class="modal-body">
<div class="mb-3">
<label for="mb-snap-desc" class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_HEADING_DESCRIPTION'); ?></label>
<input type="text" class="form-control" id="mb-snap-desc" name="description" placeholder="<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_DESC_PLACEHOLDER'); ?>">
</div>
<div class="mb-3">
<label class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_SELECT_TYPES'); ?></label>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="content_types[]" value="articles" id="mb-snap-articles" checked>
<label class="form-check-label" for="mb-snap-articles">
<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_ARTICLES'); ?>
<small class="text-muted">(<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_ARTICLES_DESC'); ?>)</small>
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="content_types[]" value="categories" id="mb-snap-categories" checked>
<label class="form-check-label" for="mb-snap-categories">
<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_CATEGORIES'); ?>
<small class="text-muted">(<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_CATEGORIES_DESC'); ?>)</small>
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="content_types[]" value="modules" id="mb-snap-modules" checked>
<label class="form-check-label" for="mb-snap-modules">
<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODULES'); ?>
<small class="text-muted">(<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODULES_DESC'); ?>)</small>
</label>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><?php echo Text::_('JCANCEL'); ?></button>
<button type="submit" class="btn btn-primary">
<span class="icon-camera" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_CREATE'); ?>
</button>
</div>
<?php echo HTMLHelper::_('form.token'); ?>
</form>
</div>
<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=snapshots.create'); ?>" method="post" id="mb-snapshot-create-form">
<div style="padding:1.5rem;">
<div class="mb-3">
<label for="mb-snap-desc" class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_HEADING_DESCRIPTION'); ?></label>
<input type="text" class="form-control" id="mb-snap-desc" name="description" placeholder="<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_DESC_PLACEHOLDER'); ?>">
</div>
<div class="mb-3">
<label class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_SELECT_TYPES'); ?></label>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="content_types[]" value="articles" id="mb-snap-articles" checked>
<label class="form-check-label" for="mb-snap-articles">
<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_ARTICLES'); ?>
<small class="text-muted">(<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_ARTICLES_DESC'); ?>)</small>
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="content_types[]" value="categories" id="mb-snap-categories" checked>
<label class="form-check-label" for="mb-snap-categories">
<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_CATEGORIES'); ?>
<small class="text-muted">(<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_CATEGORIES_DESC'); ?>)</small>
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="content_types[]" value="modules" id="mb-snap-modules" checked>
<label class="form-check-label" for="mb-snap-modules">
<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODULES'); ?>
<small class="text-muted">(<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODULES_DESC'); ?>)</small>
</label>
</div>
</div>
</div>
<div style="padding:0 1.5rem 1.5rem; text-align:right;">
<button type="button" class="btn btn-secondary mb-modal-close"><?php echo Text::_('JCANCEL'); ?></button>
<button type="submit" class="btn btn-primary">
<span class="icon-camera" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_CREATE'); ?>
</button>
</div>
<?php echo HTMLHelper::_('form.token'); ?>
</form>
</div>
</div>
<!-- Restore Snapshot Modal -->
<div id="mb-snapshot-restore-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
<div style="max-width:500px; margin:8% auto; background:#fff; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.3);">
<div style="display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #dee2e6;">
<h4 style="margin:0;"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE'); ?></h4>
<button type="button" class="btn-close mb-modal-close" aria-label="Close"></button>
<div class="modal fade" id="mb-snapshot-restore-modal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE'); ?></h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=snapshots.restore'); ?>" method="post" id="mb-snapshot-restore-form">
<input type="hidden" name="id" id="mb-restore-id" value="">
<div class="modal-body">
<p id="mb-restore-desc" class="fw-bold"></p>
<div class="mb-3">
<label class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE_MODE'); ?></label>
<div class="form-check">
<input class="form-check-input" type="radio" name="restore_mode" value="replace" id="mb-mode-replace" checked>
<label class="form-check-label" for="mb-mode-replace">
<strong><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODE_REPLACE'); ?></strong>
<br><small class="text-muted"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODE_REPLACE_DESC'); ?></small>
</label>
</div>
<div class="form-check mt-2">
<input class="form-check-input" type="radio" name="restore_mode" value="merge" id="mb-mode-merge">
<label class="form-check-label" for="mb-mode-merge">
<strong><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODE_MERGE'); ?></strong>
<br><small class="text-muted"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODE_MERGE_DESC'); ?></small>
</label>
</div>
</div>
<div class="mb-3" id="mb-restore-types-container">
<label class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE_TYPES'); ?></label>
</div>
<div class="alert alert-warning mb-0" id="mb-replace-warning">
<span class="icon-warning-circle" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_REPLACE_WARNING'); ?>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><?php echo Text::_('JCANCEL'); ?></button>
<button type="submit" class="btn btn-danger">
<span class="icon-upload" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE'); ?>
</button>
</div>
<?php echo HTMLHelper::_('form.token'); ?>
</form>
</div>
<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=snapshots.restore'); ?>" method="post" id="mb-snapshot-restore-form">
<input type="hidden" name="id" id="mb-restore-id" value="">
<div style="padding:1.5rem;">
<p id="mb-restore-desc" class="fw-bold"></p>
<div class="mb-3">
<label class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE_MODE'); ?></label>
<div class="form-check">
<input class="form-check-input" type="radio" name="restore_mode" value="replace" id="mb-mode-replace" checked>
<label class="form-check-label" for="mb-mode-replace">
<strong><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODE_REPLACE'); ?></strong>
<br><small class="text-muted"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODE_REPLACE_DESC'); ?></small>
</label>
</div>
<div class="form-check mt-2">
<input class="form-check-input" type="radio" name="restore_mode" value="merge" id="mb-mode-merge">
<label class="form-check-label" for="mb-mode-merge">
<strong><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODE_MERGE'); ?></strong>
<br><small class="text-muted"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODE_MERGE_DESC'); ?></small>
</label>
</div>
</div>
<div class="mb-3" id="mb-restore-types-container">
<label class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE_TYPES'); ?></label>
<!-- Populated by JS from data-types -->
</div>
<div class="alert alert-warning mb-0" id="mb-replace-warning">
<span class="icon-warning-circle" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_REPLACE_WARNING'); ?>
</div>
</div>
<div style="padding:0 1.5rem 1.5rem; text-align:right;">
<button type="button" class="btn btn-secondary mb-modal-close"><?php echo Text::_('JCANCEL'); ?></button>
<button type="submit" class="btn btn-danger">
<span class="icon-upload" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE'); ?>
</button>
</div>
<?php echo HTMLHelper::_('form.token'); ?>
</form>
</div>
</div>
<!-- Browse Snapshot Detail Modal -->
<div id="mb-snapshot-browse-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
<div style="max-width:800px; margin:5% auto; background:#fff; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.3); max-height:80vh; display:flex; flex-direction:column;">
<div style="display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #dee2e6;">
<h4 style="margin:0;" id="mb-browse-title"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_BROWSE'); ?></h4>
<button type="button" class="btn-close mb-modal-close" aria-label="Close"></button>
</div>
<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=snapshots.restoreSelected'); ?>" method="post" id="mb-snapshot-browse-form">
<input type="hidden" name="id" id="mb-browse-id" value="">
<div style="padding:1rem 1.5rem; overflow-y:auto; flex:1;">
<div class="modal fade" id="mb-snapshot-browse-modal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="mb-browse-title"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_BROWSE'); ?></h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=snapshots.restoreSelected'); ?>" method="post" id="mb-snapshot-browse-form">
<input type="hidden" name="id" id="mb-browse-id" value="">
<div class="modal-body" style="max-height:60vh; overflow-y:auto;">
<div id="mb-browse-loading" class="text-center py-4">
<span class="spinner-border spinner-border-sm" role="status"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_LOADING'); ?>
@@ -331,8 +335,8 @@ $listDirn = $this->escape($this->state->get('list.direction'));
</div>
</div>
</div>
<div style="padding:0.75rem 1.5rem; border-top:1px solid #dee2e6; text-align:right;">
<button type="button" class="btn btn-secondary mb-modal-close"><?php echo Text::_('JCANCEL'); ?></button>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><?php echo Text::_('JCANCEL'); ?></button>
<button type="submit" class="btn btn-success" id="mb-browse-restore-btn" disabled>
<span class="icon-upload" aria-hidden="true"></span>
<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE_SELECTED'); ?>
@@ -340,6 +344,7 @@ $listDirn = $this->escape($this->state->get('list.direction'));
</div>
<?php echo HTMLHelper::_('form.token'); ?>
</form>
</div>
</div>
</div>
@@ -352,7 +357,7 @@ $listDirn = $this->escape($this->state->get('list.direction'));
createBtn.addEventListener('click', function(e) {
e.preventDefault();
e.stopPropagation();
document.getElementById('mb-snapshot-create-modal').style.display = 'block';
bootstrap.Modal.getOrCreateInstance(document.getElementById('mb-snapshot-create-modal')).show();
return false;
}, true);
}
@@ -413,7 +418,7 @@ $listDirn = $this->escape($this->state->get('list.direction'));
// Show/hide replace warning based on mode
toggleReplaceWarning();
document.getElementById('mb-snapshot-restore-modal').style.display = 'block';
bootstrap.Modal.getOrCreateInstance(document.getElementById('mb-snapshot-restore-modal')).show();
});
// Toggle warning when mode changes
@@ -454,7 +459,7 @@ $listDirn = $this->escape($this->state->get('list.direction'));
tab.show();
}
document.getElementById('mb-snapshot-browse-modal').style.display = 'block';
bootstrap.Modal.getOrCreateInstance(document.getElementById('mb-snapshot-browse-modal')).show();
// Fetch snapshot content via AJAX
var token = <?php echo json_encode(Session::getFormToken()); ?>;
@@ -617,16 +622,6 @@ $listDirn = $this->escape($this->state->get('list.direction'));
: <?php echo json_encode(Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE_SELECTED')); ?>;
}
// Close modals
document.addEventListener('click', function(e) {
if (e.target.classList.contains('mb-modal-close') ||
e.target.id === 'mb-snapshot-create-modal' ||
e.target.id === 'mb-snapshot-restore-modal' ||
e.target.id === 'mb-snapshot-browse-modal') {
document.getElementById('mb-snapshot-create-modal').style.display = 'none';
document.getElementById('mb-snapshot-restore-modal').style.display = 'none';
document.getElementById('mb-snapshot-browse-modal').style.display = 'none';
}
});
// Modal close handled by Bootstrap data-bs-dismiss
})();
</script>
@@ -120,7 +120,7 @@ $moduleId = 'mod-msb-cpanel-' . $displayData['module']->id;
class="btn btn-sm btn-outline-primary msb-cpanel-backup-btn"
data-profile-id="<?php echo (int) $profile->id; ?>"
data-module-id="<?php echo $moduleId; ?>">
<?php echo htmlspecialchars($profile->title); ?>
#<?php echo (int) $profile->id; ?> <?php echo htmlspecialchars($profile->title); ?>
<span class="badge bg-secondary ms-1"><?php echo htmlspecialchars($profile->backup_type); ?></span>
</button>
<?php endforeach; ?>