2026-06-04 20:30:28 -05:00
<? php
/**
2026-06-11 12:24:27 -05:00
* @package MokoSuiteBackup
* @subpackage com_mokosuitebackup
2026-06-04 20:30:28 -05:00
* @author Moko Consulting <hello@mokoconsulting.tech>
* @copyright Copyright (C) 2026 Moko Consulting. All rights reserved.
* @license GNU General Public License version 3 or later; see LICENSE
*/
2026-06-11 12:24:27 -05:00
namespace Joomla\Component\MokoSuiteBackup\Administrator\Field ;
2026-06-04 20:30:28 -05:00
defined ( '_JEXEC' ) or die ;
2026-06-06 17:52:42 -05:00
use Joomla\CMS\Factory ;
2026-06-04 20:30:28 -05:00
use Joomla\CMS\Form\FormField ;
use Joomla\CMS\Language\Text ;
2026-06-11 12:24:27 -05:00
use Joomla\Component\MokoSuiteBackup\Administrator\Utility\BackupDirectory ;
2026-06-04 20:30:28 -05:00
class FolderPickerField extends FormField
{
protected $type = 'FolderPicker' ;
protected function getInput () : string
{
$value = htmlspecialchars ( $this -> value ?: $this -> default , ENT_QUOTES , 'UTF-8' );
$id = htmlspecialchars ( $this -> id , ENT_QUOTES , 'UTF-8' );
$name = htmlspecialchars ( $this -> name , ENT_QUOTES , 'UTF-8' );
$jRoot = JPATH_ROOT ;
// Resolve to absolute for display
$rawValue = $this -> value ?: $this -> default ;
if ( $rawValue && $rawValue [ 0 ] !== '/' ) {
$absPath = $jRoot . '/' . $rawValue ;
} else {
$absPath = $rawValue ;
}
2026-06-06 17:52:42 -05:00
// Build placeholder map for JS resolution
$hostname = preg_replace ( '/[^a-zA-Z0-9._-]/' , '' , $_SERVER [ 'HTTP_HOST' ] ?? $_SERVER [ 'SERVER_NAME' ] ?? php_uname ( 'n' ));
$siteName = '' ;
try {
$siteName = Factory :: getApplication () -> get ( 'sitename' , '' );
} catch ( \Throwable $e ) {
// fallback
}
$sanitizedSiteName = preg_replace ( '/[^a-zA-Z0-9._-]/' , '' , str_replace ( ' ' , '-' , trim ( $siteName )));
$placeholders = [
2026-06-07 09:38:43 -05:00
'[DEFAULT_DIR]' => BackupDirectory :: getDefaultAbsolute (),
2026-06-11 12:24:27 -05:00
'[HOME]' => BackupDirectory :: getHomeDirectory (),
2026-06-06 17:52:42 -05:00
'[host]' => $hostname ,
'[site_name]' => $sanitizedSiteName ?: 'joomla' ,
'[profile_id]' => '1' ,
'[profile_name]' => 'default' ,
'[type]' => 'full' ,
'[year]' => date ( 'Y' ),
'[month]' => date ( 'm' ),
'[day]' => date ( 'd' ),
'[date]' => date ( 'Ymd' ),
];
$placeholdersJson = json_encode ( $placeholders );
// Resolve placeholders for the status display
$resolvedPath = str_replace ( array_keys ( $placeholders ), array_values ( $placeholders ), $absPath );
2026-06-06 16:32:28 -05:00
$hasPlaceholders = preg_match ( '/\[.+\]/' , $absPath );
if ( $hasPlaceholders ) {
2026-06-06 17:52:42 -05:00
$exists = is_dir ( $resolvedPath );
$statusClass = $exists ? 'text-success' : 'text-info' ;
$statusIcon = $exists ? 'icon-publish' : 'icon-info-circle' ;
2026-06-06 16:32:28 -05:00
$statusText = Text :: _ ( 'COM_MOKOJOOMBACKUP_FOLDER_PLACEHOLDER' );
2026-06-06 17:52:42 -05:00
$resolvedSafe = htmlspecialchars ( $resolvedPath , ENT_QUOTES , 'UTF-8' );
$statusDetail = " { $statusText } : <code> { $resolvedSafe } </code>" ;
2026-06-06 16:32:28 -05:00
} else {
$exists = is_dir ( $absPath );
$statusClass = $exists ? 'text-success' : 'text-danger' ;
$statusIcon = $exists ? 'icon-publish' : 'icon-unpublish' ;
$statusText = $exists
? Text :: _ ( 'COM_MOKOJOOMBACKUP_FOLDER_EXISTS' )
: Text :: _ ( 'COM_MOKOJOOMBACKUP_FOLDER_NOT_FOUND' );
2026-06-06 17:52:42 -05:00
$absPathSafe = htmlspecialchars ( $absPath , ENT_QUOTES , 'UTF-8' );
$statusDetail = " { $statusText } : <code> { $absPathSafe } </code>" ;
2026-06-06 16:32:28 -05:00
}
2026-06-04 20:30:28 -05:00
return <<< HTML
<div class="input-group">
<input type="text" name="{$name}" id="{$id}" value="{$value}"
class="form-control" maxlength="512"
2026-06-11 12:24:27 -05:00
placeholder="[HOME]/backups or [DEFAULT_DIR]" />
2026-06-04 20:30:28 -05:00
<button type="button" class="btn btn-outline-secondary" id="{$id}_btn">
<span class="icon-folder-open" aria-hidden="true"></span>
Browse
</button>
2026-06-11 12:30:23 -05:00
<button type="button" class="btn btn-outline-info" data-bs-toggle="modal" data-bs-target="#{$id}_helpModal" title="Available placeholders">
<span class="icon-question-circle" aria-hidden="true"></span>
</button>
2026-06-04 20:30:28 -05:00
</div>
2026-06-23 10:47:45 -05:00
<div class="mt-1 mb-1" id="{$id}_placeholders" style="display:flex; flex-wrap:wrap; gap:4px;">
<span class="text-muted small me-1" style="line-height:24px;">Insert:</span>
<button type="button" class="btn btn-outline-secondary btn-sm py-0 px-1 moko-ph-insert" data-field="{$id}" data-ph="[HOME]" title="Home directory">[HOME]</button>
<button type="button" class="btn btn-outline-secondary btn-sm py-0 px-1 moko-ph-insert" data-field="{$id}" data-ph="[DEFAULT_DIR]" title="Default backup dir">[DEFAULT_DIR]</button>
<button type="button" class="btn btn-outline-secondary btn-sm py-0 px-1 moko-ph-insert" data-field="{$id}" data-ph="[host]" title="Server hostname">[host]</button>
<button type="button" class="btn btn-outline-secondary btn-sm py-0 px-1 moko-ph-insert" data-field="{$id}" data-ph="[site_name]" title="Joomla site name">[site_name]</button>
<button type="button" class="btn btn-outline-secondary btn-sm py-0 px-1 moko-ph-insert" data-field="{$id}" data-ph="[date]" title="Date (Ymd)">[date]</button>
<button type="button" class="btn btn-outline-secondary btn-sm py-0 px-1 moko-ph-insert" data-field="{$id}" data-ph="[profile_id]" title="Profile ID">[profile_id]</button>
<button type="button" class="btn btn-outline-secondary btn-sm py-0 px-1 moko-ph-insert" data-field="{$id}" data-ph="[profile_name]" title="Profile name">[profile_name]</button>
<button type="button" class="btn btn-outline-secondary btn-sm py-0 px-1 moko-ph-insert" data-field="{$id}" data-ph="[type]" title="Backup type">[type]</button>
</div>
2026-06-06 17:52:42 -05:00
<div class="mt-1" id="{$id}_status">
2026-06-04 20:30:28 -05:00
<small class="{$statusClass}">
<span class="{$statusIcon}" aria-hidden="true"></span>
2026-06-06 17:52:42 -05:00
{$statusDetail}
2026-06-04 20:30:28 -05:00
</small>
</div>
2026-06-23 11:35:48 -05:00
<div class="mt-1" id="{$id}_resolved" style="font-size:0.8rem; line-height:1.6;">
</div>
2026-06-07 06:54:12 -05:00
<div id="{$id}_defaultwarn" class="alert alert-warning alert-sm mt-1 py-1 px-2" style="display:none; font-size:0.85rem;">
<span class="icon-warning-circle" aria-hidden="true"></span>
The default backup directory is inside the web root. Backup archives may be directly downloadable if <code>.htaccess</code> is not supported. For better security, use a path outside the web root.
</div>
2026-06-11 12:30:23 -05:00
<div class="modal fade" id="{$id}_helpModal" tabindex="-1" aria-labelledby="{$id}_helpLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="{$id}_helpLabel">Backup Directory Placeholders</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<p>Use these placeholders in the backup directory path. They are resolved at backup time.</p>
<table class="table table-sm table-striped">
<thead><tr><th>Placeholder</th><th>Description</th><th>Example</th></tr></thead>
<tbody>
<tr><td><code>[HOME]</code></td><td>Home directory of the server user</td><td><code>{$placeholders['[HOME]']}</code></td></tr>
<tr><td><code>[DEFAULT_DIR]</code></td><td>Default backup directory (inside web root)</td><td><code>{$placeholders['[DEFAULT_DIR]']}</code></td></tr>
<tr><td><code>[host]</code></td><td>Server hostname</td><td><code>{$placeholders['[host]']}</code></td></tr>
<tr><td><code>[site_name]</code></td><td>Joomla site name</td><td><code>{$placeholders['[site_name]']}</code></td></tr>
<tr><td><code>[date]</code></td><td>Date (Ymd)</td><td><code>{$placeholders['[date]']}</code></td></tr>
<tr><td><code>[year]</code></td><td>Four-digit year</td><td><code>{$placeholders['[year]']}</code></td></tr>
<tr><td><code>[month]</code></td><td>Two-digit month</td><td><code>{$placeholders['[month]']}</code></td></tr>
<tr><td><code>[day]</code></td><td>Two-digit day</td><td><code>{$placeholders['[day]']}</code></td></tr>
<tr><td><code>[profile_id]</code></td><td>Backup profile ID</td><td><code>1</code></td></tr>
<tr><td><code>[profile_name]</code></td><td>Profile title</td><td><code>default</code></td></tr>
<tr><td><code>[type]</code></td><td>Backup type</td><td><code>full</code></td></tr>
</tbody>
</table>
<h6>Recommended Paths</h6>
<ul class="list-unstyled">
<li><code>[HOME]/backups</code> — Outside web root (recommended)</li>
<li><code>[HOME]/backups/[host]</code> — Per-site subdirectory</li>
<li><code>[DEFAULT_DIR]</code> — Inside web root (protected by .htaccess)</li>
</ul>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
2026-06-04 20:30:28 -05:00
<div id="{$id}_browser" class="card mt-2" style="display:none; max-height:300px; overflow-y:auto;">
<div class="card-body p-2">
<div id="{$id}_tree"></div>
</div>
</div>
<script>
(function() {
2026-06-23 10:47:45 -05:00
/* Clickable placeholder insertion at cursor position */
document.querySelectorAll('.moko-ph-insert[data-field="{$id}"]').forEach(function(btn) {
btn.addEventListener('click', function(e) {
e.preventDefault();
var target = document.getElementById(this.getAttribute('data-field'));
var ph = this.getAttribute('data-ph');
if (!target) return;
var start = target.selectionStart || 0;
var end = target.selectionEnd || 0;
var val = target.value;
target.value = val.substring(0, start) + ph + val.substring(end);
/* Move cursor to after the inserted placeholder */
var newPos = start + ph.length;
target.setSelectionRange(newPos, newPos);
target.focus();
/* Trigger input event so status updates */
target.dispatchEvent(new Event('input', { bubbles: true }));
});
});
2026-06-04 20:30:28 -05:00
var fieldId = '{$id}';
var btn = document.getElementById(fieldId + '_btn');
var browser = document.getElementById(fieldId + '_browser');
var tree = document.getElementById(fieldId + '_tree');
var input = document.getElementById(fieldId);
2026-06-06 17:52:42 -05:00
var placeholders = {$placeholdersJson};
// Resolve placeholders in a path (forward: [site_name] -> actual value)
function resolve(path) {
for (var key in placeholders) {
path = path.split(key).join(placeholders[key]);
}
return path;
}
// Reverse-replace actual values back to placeholders for portable storage
function unresolve(path) {
for (var key in placeholders) {
if (placeholders[key] && placeholders[key].length > 1) {
path = path.split(placeholders[key]).join(key);
}
}
return path;
}
2026-06-04 20:30:28 -05:00
2026-06-07 06:54:12 -05:00
var statusDiv = document.getElementById(fieldId + '_status');
var checkTimer = null;
function setStatus(cssClass, iconClass, message, codePath) {
while (statusDiv.firstChild) statusDiv.removeChild(statusDiv.firstChild);
var small = document.createElement('small');
small.className = cssClass;
var icon = document.createElement('span');
icon.className = iconClass;
icon.setAttribute('aria-hidden', 'true');
small.appendChild(icon);
small.appendChild(document.createTextNode(' ' + message));
if (codePath) {
small.appendChild(document.createTextNode(': '));
var code = document.createElement('code');
code.textContent = codePath;
small.appendChild(code);
}
statusDiv.appendChild(small);
}
function setDefaultDirWarning() {
var warn = document.getElementById(fieldId + '_defaultwarn');
var val = input.value.trim();
2026-06-11 12:39:59 -05:00
var resolved = resolve(val);
var jRoot = placeholders['[DEFAULT_DIR]'].replace(/\/administrator\/components\/com_mokosuitebackup\/backups$/, '');
var isInsideWebRoot = resolved && resolved.indexOf(jRoot) === 0;
var isOldDefault = val === 'administrator/components/com_mokosuitebackup/backups' || val === 'administrator/components/com_mokojoombackup/backups' || val === '[DEFAULT_DIR]';
var showWarning = isOldDefault || isInsideWebRoot;
if (warn) warn.style.display = showWarning ? 'block' : 'none';
2026-06-07 06:54:12 -05:00
}
function checkDirPermissions() {
var val = input.value.trim();
if (!val) return;
setStatus('text-muted', 'icon-spinner icon-spin', 'Checking...', null);
setDefaultDirWarning();
var form = new URLSearchParams();
form.append('task', 'ajax.checkDir');
form.append('path', val);
var tokenName = Joomla.getOptions('csrf.token') || '';
if (tokenName) form.append(tokenName, '1');
2026-06-11 12:24:27 -05:00
fetch('index.php?option=com_mokosuitebackup&format=json', {
2026-06-07 06:54:12 -05:00
method: 'POST',
body: form,
headers: { 'X-Requested-With': 'XMLHttpRequest' }
})
2026-06-07 09:11:39 -05:00
.then(function(r) { if (!r.ok) throw new Error('Server error (HTTP ' + r.status + ')'); return r.json(); })
2026-06-07 06:54:12 -05:00
.then(function(data) {
if (data.error) {
setStatus('text-danger', 'icon-unpublish', data.message || 'Error', null);
return;
}
if (data.placeholder) {
setStatus('text-info', 'icon-info-circle', 'Uses placeholders (resolved at backup time)', data.resolved);
return;
}
if (data.writable) {
setStatus('text-success', 'icon-publish', 'Writable', data.resolved);
} else if (data.exists) {
setStatus('text-warning', 'icon-warning-circle', 'Exists but not writable', data.resolved);
} else {
setStatus('text-danger', 'icon-unpublish', 'Directory not found', data.resolved);
}
})
.catch(function(err) {
setStatus('text-danger', 'icon-unpublish', 'Check failed: ' + err.message, null);
});
}
2026-06-23 11:35:48 -05:00
/* Show which placeholders are in use and their resolved values */
var resolvedDiv = document.getElementById(fieldId + '_resolved');
function updateResolvedDisplay() {
while (resolvedDiv.firstChild) resolvedDiv.removeChild(resolvedDiv.firstChild);
var val = input.value || '';
var found = false;
for (var key in placeholders) {
if (val.indexOf(key) !== -1 && placeholders[key]) {
found = true;
var badge = document.createElement('span');
badge.className = 'badge bg-light text-dark border me-1 mb-1';
badge.style.fontSize = '0.75rem';
badge.style.fontFamily = 'monospace';
var keySpan = document.createElement('strong');
keySpan.textContent = key;
badge.appendChild(keySpan);
badge.appendChild(document.createTextNode(' = '));
var valSpan = document.createElement('span');
valSpan.className = 'text-primary';
valSpan.textContent = placeholders[key];
badge.appendChild(valSpan);
resolvedDiv.appendChild(badge);
}
}
if (found) {
var fullResolved = document.createElement('div');
fullResolved.className = 'mt-1';
var arrow = document.createElement('span');
arrow.className = 'text-muted';
arrow.textContent = 'Resolves to: ';
fullResolved.appendChild(arrow);
var code = document.createElement('code');
code.textContent = resolve(val);
fullResolved.appendChild(code);
resolvedDiv.appendChild(fullResolved);
}
}
2026-06-07 06:54:12 -05:00
input.addEventListener('input', function() {
clearTimeout(checkTimer);
2026-06-23 11:35:48 -05:00
updateResolvedDisplay();
2026-06-07 06:54:12 -05:00
checkTimer = setTimeout(checkDirPermissions, 400);
});
input.addEventListener('change', function() {
clearTimeout(checkTimer);
checkDirPermissions();
});
2026-06-04 20:30:28 -05:00
btn.addEventListener('click', function() {
if (browser.style.display !== 'none') {
browser.style.display = 'none';
return;
}
browser.style.display = 'block';
2026-06-06 17:52:42 -05:00
// Resolve placeholders before browsing so the server sees real paths
loadDir(resolve(input.value || '/'));
2026-06-04 20:30:28 -05:00
});
function loadDir(path) {
tree.textContent = 'Loading...';
var form = new URLSearchParams();
form.append('task', 'ajax.browseDir');
form.append('path', path);
var tokenName = Joomla.getOptions('csrf.token') || '';
if (tokenName) form.append(tokenName, '1');
2026-06-11 12:24:27 -05:00
fetch('index.php?option=com_mokosuitebackup&format=json', {
2026-06-04 20:30:28 -05:00
method: 'POST',
body: form,
headers: { 'X-Requested-With': 'XMLHttpRequest' }
})
2026-06-07 09:11:39 -05:00
.then(function(r) { if (!r.ok) throw new Error('Server error (HTTP ' + r.status + ')'); return r.json(); })
2026-06-04 20:30:28 -05:00
.then(function(data) {
if (data.error) {
tree.textContent = data.message || 'Error loading directory';
return;
}
renderTree(data, path);
})
.catch(function(err) {
tree.textContent = 'Error: ' + err.message;
});
}
function renderTree(data, path) {
while (tree.firstChild) tree.removeChild(tree.firstChild);
var list = document.createElement('div');
list.className = 'list-group list-group-flush';
if (data.parent) {
var up = document.createElement('a');
up.href = '#';
up.className = 'list-group-item list-group-item-action py-1';
var upIcon = document.createElement('span');
upIcon.className = 'icon-arrow-up-4';
upIcon.setAttribute('aria-hidden', 'true');
up.appendChild(upIcon);
up.appendChild(document.createTextNode(' ..'));
up.addEventListener('click', function(e) {
e.preventDefault();
loadDir(data.parent);
});
list.appendChild(up);
}
(data.dirs || []).forEach(function(dir) {
var item = document.createElement('a');
item.href = '#';
item.className = 'list-group-item list-group-item-action py-1';
var icon = document.createElement('span');
icon.className = 'icon-folder';
icon.setAttribute('aria-hidden', 'true');
item.appendChild(icon);
item.appendChild(document.createTextNode(' ' + dir.name));
item.addEventListener('click', function(e) {
e.preventDefault();
2026-06-06 17:52:42 -05:00
// Store with placeholders reversed back in
input.value = unresolve(dir.path);
2026-06-07 06:54:12 -05:00
checkDirPermissions();
2026-06-04 20:30:28 -05:00
loadDir(dir.path);
});
item.addEventListener('dblclick', function(e) {
e.preventDefault();
2026-06-06 17:52:42 -05:00
input.value = unresolve(dir.path);
2026-06-07 06:54:12 -05:00
checkDirPermissions();
2026-06-04 20:30:28 -05:00
browser.style.display = 'none';
});
list.appendChild(item);
});
tree.appendChild(list);
var info = document.createElement('div');
info.className = 'mt-2 p-1';
var small = document.createElement('small');
small.className = 'text-muted';
small.textContent = 'Current: ' + (data.current || path);
info.appendChild(small);
2026-06-06 17:52:42 -05:00
// Show what will be stored (with placeholders)
var stored = document.createElement('small');
stored.className = 'text-info d-block';
stored.textContent = 'Stored as: ' + unresolve(data.current || path);
info.appendChild(stored);
2026-06-04 20:30:28 -05:00
tree.appendChild(info);
}
2026-06-07 06:54:12 -05:00
// Run initial check on page load
setDefaultDirWarning();
2026-06-23 11:35:48 -05:00
updateResolvedDisplay();
2026-06-07 06:54:12 -05:00
checkDirPermissions();
2026-06-04 20:30:28 -05:00
})();
</script>
HTML ;
}
}
