<div class="container-fluid">
<div class="sticky-top bg-white overflow-x-auto py-1 px-3 mx--3 mb-3 border-bottom">
<ul class="nav nav-pills nav-pills-dark flex-nowrap">
<li class="nav-item">
<a href="<?= go_to(); ?>" class="nav-link rounded-pill active no-wrap --xhr">
<i class="mdi mdi-cart"></i>
<?= phrase('Market'); ?>
</a>
</li>
<li class="nav-item">
<a href="<?= go_to('themes'); ?>" class="nav-link rounded-pill no-wrap --xhr">
<i class="mdi mdi-palette"></i>
<?= phrase('Installed Theme'); ?>
</a>
</li>
<li class="nav-item">
<a href="<?= go_to('modules'); ?>" class="nav-link rounded-pill no-wrap --xhr">
<i class="mdi mdi-puzzle"></i>
<?= phrase('Installed Module'); ?>
</a>
</li>
<li class="nav-item">
<a href="<?= go_to('ftp'); ?>" class="nav-link rounded-pill no-wrap --xhr">
<i class="mdi mdi-console-network"></i>
<?= phrase('FTP Configuration'); ?>
</a>
</li>
</ul>
</div>
<div class="row">
<div class="col-md-4">
<div class="row mb-3">
<div class="col-6">
<a href="<?= go_to(null, ['order' => 'popular']); ?>" class="btn btn-secondary d-block btn-sm --xhr">
<?= phrase('Popular'); ?>
</a>
</div>
<div class="col-6">
<a href="<?= go_to(null, ['order' => 'latest']); ?>" class="btn btn-secondary d-block btn-sm --xhr">
<?= phrase('Latest'); ?>
</a>
</div>
</div>
</div>
<div class="col-md-6 offset-md-2">
<form action="<?= go_to(null, ['per_page' => null]); ?>" method="POST" class="form-horizontal position-relative-form mb-3">
<div class="input-group input-group-sm">
<input type="text" name="q" class="form-control" placeholder="<?= phrase('Search Add-Ons'); ?>" value="<?= (service('request')->getGet('q') ? htmlspecialchars(service('request')->getGet('q')) : null); ?>" />
<button type="submit" class="btn btn-primary">
<i class="mdi mdi-magnify"></i>
</button>
</div>
</form>
</div>
</div>
<hr class="mx--3 mt-0" />
<div class="row addon-listing">
<!-- addon listing -->
</div>
</div>
<script type="text/javascript">
$(document).ready(function() {
$.ajax({
url: '<?= current_page(); ?>',
method: 'POST',
data: {
source: 'market',
order: '<?= (service('request')->getGet('order') ? service('request')->getGet('order') : null); ?>',
keyword: '<?= (service('request')->getGet('q') ? htmlspecialchars(service('request')->getGet('q')) : null); ?>'
},
beforeSend: function() {
$('.addon-listing').html(
'<div class="col-lg-12">' +
'<div class="spinner-border" role="status">' +
'</div>' +
'</div>'
)
},
context: this
})
.done(function(response) {
if (! response || Object.keys(response).length === 0) {
$('.addon-listing').html(
'<div class="col-lg-12">' +
'<div class="alert alert-warning">' +
'<i class="mdi mdi-information-outline"></i>' +
'<?= phrase('No add-ons available for your current Aksara version'); ?>' +
'</div>' +
'</div>'
);
return;
} else if (typeof response.error !== 'undefined') {
$('.addon-listing').html(
'<div class="col-lg-12">' +
'<div class="alert alert-warning">' +
'<i class="mdi mdi-information-outline"></i>' +
response.error +
'</div>' +
'</div>'
);
return;
}
$('.addon-listing').html(''),
$.each(response, function(key, val) {
if (val.addon_type == 'theme') {
$(
'<div class="col-sm-6 col-md-4 col-lg-3">' +
'<div class="card rounded-4 mb-3">' +
'<div class="card-body p-3">' +
'<div class="position-relative mb-3">' +
(val.type == 'backend' ? '<span class="badge bg-warning float-end mt-3 me-3"><?= phrase('Backend Theme'); ?></span>' : '<span class="badge bg-success float-end mt-3 me-3"><?= phrase('Frontend Theme'); ?></span>') +
'<img src="' + val.thumbnail + '" class="img-fluid rounded-4 border" alt="..." />' +
'</div>' +
'<div class="mb-3">' +
'<b data-bs-toggle="tooltip" title="' + val.name + '">' +
val.name +
'</b>' +
'</div>' +
'<div class="row">' +
'<div class="col-6">' +
'<a href="' + val.install_url + '" class="btn btn-primary d-block btn-xs show-progress">' +
'<i class="mdi mdi-plus"></i>' +
'<?= phrase('Install'); ?>' +
'</a>' +
'</div>' +
'<div class="col-6">' +
'<a href="' + val.demo_url + '" class="btn btn-outline-primary d-block btn-xs" target="_blank">' +
'<i class="mdi mdi-magnify"></i>' +
'<?= phrase('Preview'); ?>' +
'</a>' +
'</div>' +
'</div>' +
'</div>' +
'</div>' +
'</div>'
)
.appendTo('.addon-listing')
} else if (val.addon_type == 'module') {
$(
'<div class="col-sm-6 col-md-4 col-lg-3">' +
'<div class="card rounded-4 mb-3">' +
'<div class="card-body p-3">' +
'<div class="position-relative mb-3">' +
'<img src="' + val.thumbnail + '" class="img-fluid rounded-4 border" alt="..." />' +
'</div>' +
'<div class="mb-3">' +
'<b data-bs-toggle="tooltip" title="' + val.name + '">' +
val.name +
'</b>' +
'</div>' +
'<div class="row">' +
'<div class="col-6">' +
'<a href="' + val.install_url + '" class="btn btn-primary d-block btn-xs show-progress">' +
'<i class="mdi mdi-plus"></i>' +
'<?= phrase('Install'); ?>' +
'</a>' +
'</div>' +
'<div class="col-6">' +
'<a href="' + val.demo_url + '" class="btn btn-outline-primary d-block btn-xs" target="_blank">' +
'<i class="mdi mdi-magnify"></i>' +
'<?= phrase('Preview'); ?>' +
'</a>' +
'</div>' +
'</div>' +
'</div>' +
'</div>' +
'</div>'
)
.appendTo('.addon-listing')
}
})
})
.fail(function() {
})
})
</script>
|