-
This commit is contained in:
Ty Clifford
@@ -0,0 +1,17 @@
|
||||
<script charset="utf-8">
|
||||
function showAlert(text) {
|
||||
console.log("[INFO] Function showAlert() called.");
|
||||
$("#alert").html(text);
|
||||
$("#alert").slideDown().delay(<?php echo ALERT_DISAPPEAR_IN*1000 ?>).slideUp();
|
||||
}
|
||||
|
||||
<?php if (Alert::defined()): ?>
|
||||
setTimeout(function(){ showAlert("<?php echo Alert::get() ?>") }, 500);
|
||||
<?php endif; ?>
|
||||
|
||||
$(window).click(function() {
|
||||
$("#alert").hide();
|
||||
});
|
||||
</script>
|
||||
|
||||
<div id="alert" class="alert <?php echo (Alert::status()==ALERT_STATUS_FAIL)?'alert-danger':'alert-success' ?>"></div>
|
||||
@@ -0,0 +1,269 @@
|
||||
<?php
|
||||
// Preload the first chunk of files to avoid an AJAX round-trip the first time
|
||||
// the Media Manager is opened. Scans originals and resolves each thumbnail,
|
||||
// mirroring the shape returned by ajax/list-images.
|
||||
if (IMAGE_RESTRICT) {
|
||||
$mediaImagesPath = PATH_UPLOADS_PAGES.PAGE_IMAGES_KEY.DS;
|
||||
$mediaThumbnailsPath = PATH_UPLOADS_PAGES.PAGE_IMAGES_KEY.DS.'thumbnails'.DS;
|
||||
} else {
|
||||
$mediaImagesPath = PATH_UPLOADS;
|
||||
$mediaThumbnailsPath = PATH_UPLOADS_THUMBNAILS;
|
||||
}
|
||||
$listOfFilesByPage = mediaManagerListImages($mediaImagesPath, $mediaThumbnailsPath, MEDIA_MANAGER_NUMBER_OF_FILES);
|
||||
$preLoadFiles = !empty($listOfFilesByPage[0]) ? $listOfFilesByPage[0] : array();
|
||||
|
||||
// Amount of pages for the paginator
|
||||
$numberOfPages = count($listOfFilesByPage);
|
||||
?>
|
||||
|
||||
<div id="jsmediaManagerModal" class="modal" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog modal-lg">
|
||||
<div class="modal-content">
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="col p-3">
|
||||
|
||||
<!--
|
||||
UPLOAD INPUT
|
||||
-->
|
||||
<h3 class="mt-2 mb-3"><i class="fa fa-image"></i> <?php $L->p('Images'); ?></h3>
|
||||
|
||||
<div id="jsalertMedia" class="alert alert-warning d-none" role="alert"></div>
|
||||
|
||||
<!-- Form and Input file -->
|
||||
<form name="bluditFormUpload" id="jsbluditFormUpload" enctype="multipart/form-data">
|
||||
<div class="custom-file">
|
||||
<input type="file" class="custom-file-input" id="jsimages" name="images[]" multiple>
|
||||
<label class="custom-file-label" for="jsimages"><?php $L->p('Choose images to upload'); ?></label>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<!-- Progress bar -->
|
||||
<div class="progress mt-3">
|
||||
<div id="jsbluditProgressBar" class="progress-bar bg-primary" role="progressbar" style="width:0%"></div>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
IMAGES LIST
|
||||
-->
|
||||
<!-- Table for list files -->
|
||||
<table id="jsbluditMediaTable" class="table mt-3">
|
||||
<tr>
|
||||
<td><?php $L->p('There are no images'); ?></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<!-- Paginator -->
|
||||
<nav id="jsbluditMediaTablePagination"></nav>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
<?php
|
||||
echo 'var preLoadFiles = '.json_encode($preLoadFiles).';';
|
||||
?>
|
||||
|
||||
function openMediaManager() {
|
||||
$('#jsmediaManagerModal').modal('show');
|
||||
}
|
||||
|
||||
function closeMediaManager() {
|
||||
$('#jsmediaManagerModal').modal('hide');
|
||||
}
|
||||
|
||||
// Remove all files from the table
|
||||
function cleanTable() {
|
||||
$('#jsbluditMediaTable').empty();
|
||||
}
|
||||
|
||||
function showMediaAlert(message) {
|
||||
$("#jsalertMedia").html(message).removeClass('d-none');
|
||||
}
|
||||
|
||||
function hideMediaAlert() {
|
||||
$("#jsalertMedia").addClass('d-none');
|
||||
}
|
||||
|
||||
// Show the files in the table
|
||||
function displayFiles(files, numberOfPages = <?= $numberOfPages ?>) {
|
||||
if (!Array.isArray(files)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
// Clean table
|
||||
cleanTable();
|
||||
|
||||
// Regenerate the table
|
||||
if (files.length > 0) {
|
||||
$.each(files, function(key, item) {
|
||||
var filename = item.filename;
|
||||
var image = "<?php echo PAGE_IMAGES_URL; ?>"+filename;
|
||||
// item.thumbnail is empty when no thumbnail file exists (thumbnails
|
||||
// disabled, generation failed, format unsupported by GD). Fall back
|
||||
// to the original image so the preview never 404s.
|
||||
var thumbnail = item.thumbnail ? "<?php echo PAGE_THUMBNAILS_URL; ?>"+item.thumbnail : image;
|
||||
|
||||
tableRow = '<tr id="js'+filename+'">'+
|
||||
'<td style="width:80px"><img class="img-thumbnail" alt="200x200" src="'+thumbnail+'" style="width: 50px; height: 50px;"><\/td>'+
|
||||
'<td class="information">'+
|
||||
'<div class="text-secondary pb-2">'+filename+'<\/div>'+
|
||||
'<div>'+
|
||||
'<a href="#" class="mr-3 text-primary" onClick="editorInsertMedia(\''+image+'\'); closeMediaManager();"><i class="fa fa-plus-circle"></i><?php $L->p('Insert') ?><\/a>'+
|
||||
'<a href="#" class="mr-3 text-primary" onClick="editorInsertMedia(\''+thumbnail+'\'); closeMediaManager();"><i class="fa fa-image"></i><?php $L->p('Insert thumbnail') ?><\/a>'+
|
||||
'<a href="#" class="mr-3 text-primary" onClick="editorInsertLinkedMedia(\''+thumbnail+'\',\''+image+'\'); closeMediaManager();"><i class="fa fa-link"></i><?php $L->p('Insert linked thumbnail') ?><\/a>'+
|
||||
'<a href="#" class="text-primary" onClick="setCoverImage(\''+filename+'\'); closeMediaManager();"><i class="fa fa-desktop"></i><?php $L->p('Set as cover image') ?><\/a>'+
|
||||
'<a href="#" class="float-right text-danger" onClick="deleteMedia(\''+filename+'\')"><i class="fa fa-trash-o"></i><?php $L->p('Delete') ?><\/a>'+
|
||||
'<\/div>'+
|
||||
'<\/td>'+
|
||||
'<\/tr>';
|
||||
$('#jsbluditMediaTable').append(tableRow);
|
||||
});
|
||||
|
||||
mediaPagination = '<ul class="pagination justify-content-center flex-wrap">';
|
||||
for (var i = 1; i <= numberOfPages; i++) {
|
||||
mediaPagination += '<li class="page-item"><button type="button" class="btn btn-link page-link" onClick="getFiles('+i+')">'+i+'</button></li>';
|
||||
}
|
||||
mediaPagination += '</ul>';
|
||||
$('#jsbluditMediaTablePagination').html(mediaPagination);
|
||||
|
||||
}
|
||||
|
||||
if (files.length == 0) {
|
||||
$('#jsbluditMediaTable').html("<p><?php (IMAGE_RESTRICT ? $L->p('There are no images for the page') : $L->p('There are no images')) ?></p>");
|
||||
$('#jsbluditMediaTablePagination').html('');
|
||||
}
|
||||
}
|
||||
|
||||
// Get the list of files via AJAX, filter by the page number
|
||||
function getFiles(pageNumber) {
|
||||
$.post(HTML_PATH_ADMIN_ROOT+"ajax/list-images",
|
||||
{ tokenCSRF: tokenCSRF,
|
||||
pageNumber: pageNumber,
|
||||
uuid: "<?php echo PAGE_IMAGES_KEY ?>",
|
||||
path: "thumbnails" // the paths are defined in ajax/list-images
|
||||
},
|
||||
function(data) { // success function
|
||||
if (data.status==0) {
|
||||
displayFiles(data.files, data.numberOfPages);
|
||||
} else {
|
||||
console.log(data.message);
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
// Delete the file and the thumbnail if exist
|
||||
function deleteMedia(filename) {
|
||||
$.post(HTML_PATH_ADMIN_ROOT+"ajax/delete-image",
|
||||
{ tokenCSRF: tokenCSRF,
|
||||
filename: filename,
|
||||
uuid: "<?php echo PAGE_IMAGES_KEY; ?>"
|
||||
},
|
||||
function(data) { // success function
|
||||
if (data.status==0) {
|
||||
getFiles(1);
|
||||
} else {
|
||||
console.log(data.message);
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
function setCoverImage(filename) {
|
||||
var image = "<?php echo PAGE_IMAGES_URL; ?>"+filename;
|
||||
$("#jscoverImage").val(filename);
|
||||
$("#jscoverImagePreview").attr("src", image);
|
||||
}
|
||||
|
||||
function uploadImages() {
|
||||
// Remove current alerts
|
||||
hideMediaAlert();
|
||||
|
||||
var images = $("#jsimages")[0].files;
|
||||
for (var i=0; i < images.length; i++) {
|
||||
// Check file type/extension
|
||||
const validImageTypes = ['image/gif', 'image/jpeg', 'image/png', 'image/svg+xml', 'image/webp'];
|
||||
if (!validImageTypes.includes(images[i].type)) {
|
||||
showMediaAlert("<?php echo $L->g('File type is not supported. Allowed types:').' '.implode(', ',$GLOBALS['ALLOWED_IMG_EXTENSION']) ?>");
|
||||
return false;
|
||||
}
|
||||
|
||||
// Check file size and compare with PHP upload_max_filesize
|
||||
if (images[i].size > UPLOAD_MAX_FILESIZE) {
|
||||
showMediaAlert("<?php echo $L->g('Maximum load file size allowed:').' '.ini_get('upload_max_filesize') ?>");
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
// Clean progress bar
|
||||
$("#jsbluditProgressBar").removeClass().addClass("progress-bar bg-primary");
|
||||
$("#jsbluditProgressBar").width("0");
|
||||
|
||||
// Data to send via AJAX
|
||||
var formData = new FormData($("#jsbluditFormUpload")[0]);
|
||||
formData.append("uuid", "<?php echo PAGE_IMAGES_KEY ?>");
|
||||
formData.append("tokenCSRF", tokenCSRF);
|
||||
|
||||
$.ajax({
|
||||
url: HTML_PATH_ADMIN_ROOT+"ajax/upload-images",
|
||||
type: "POST",
|
||||
data: formData,
|
||||
cache: false,
|
||||
contentType: false,
|
||||
processData: false,
|
||||
xhr: function() {
|
||||
var xhr = $.ajaxSettings.xhr();
|
||||
if (xhr.upload) {
|
||||
xhr.upload.addEventListener("progress", function(e) {
|
||||
if (e.lengthComputable) {
|
||||
var percentComplete = (e.loaded / e.total)*100;
|
||||
$("#jsbluditProgressBar").width(percentComplete+"%");
|
||||
}
|
||||
}, false);
|
||||
}
|
||||
return xhr;
|
||||
}
|
||||
}).done(function(data) {
|
||||
if (data.status==0) {
|
||||
$("#jsbluditProgressBar").removeClass("bg-primary").addClass("bg-success");
|
||||
// Get the files for the first page, including uploaded files
|
||||
getFiles(1);
|
||||
} else {
|
||||
$("#jsbluditProgressBar").removeClass("bg-primary").addClass("bg-danger");
|
||||
showMediaAlert(data.message);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
// Display the files preloaded for the first time
|
||||
displayFiles(preLoadFiles);
|
||||
|
||||
// Select image event
|
||||
$("#jsimages").on("change", function(e) {
|
||||
uploadImages();
|
||||
});
|
||||
|
||||
// Drag and drop image
|
||||
$(window).on("dragover dragenter", function(e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
openMediaManager();
|
||||
});
|
||||
|
||||
// Drag and drop image
|
||||
$(window).on("drop", function(e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
$("#jsimages").prop("files", e.originalEvent.dataTransfer.files);
|
||||
uploadImages();
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
@@ -0,0 +1,77 @@
|
||||
<nav class="navbar navbar-expand-lg navbar-dark bg-dark text-uppercase d-block d-lg-none">
|
||||
<div class="container">
|
||||
<span class="navbar-brand">
|
||||
<?php echo (defined('BLUDIT_PRO'))?'BLUDIT PRO':'BLUDIT' ?></span>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false"
|
||||
aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="navbarNav">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'dashboard' ?>">
|
||||
<?php $L->p('Dashboard') ?></a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ROOT ?>">
|
||||
<?php $L->p('Website') ?></a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'new-content' ?>">
|
||||
<?php $L->p('New content') ?></a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'content' ?>">
|
||||
<?php $L->p('Content') ?></a>
|
||||
</li>
|
||||
<?php if (!checkRole(array('admin'),false)): ?>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'edit-user/'.$login->username() ?>">
|
||||
<?php $L->p('Profile') ?></a>
|
||||
</li>
|
||||
<?php endif; ?>
|
||||
<?php if (checkRole(array('admin'),false)): ?>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'categories' ?>">
|
||||
<?php $L->p('Categories') ?></a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'users' ?>">
|
||||
<?php $L->p('Users') ?></a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'settings' ?>">
|
||||
<?php $L->p('Settings') ?></a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'plugins' ?>">
|
||||
<?php $L->p('Plugins') ?></a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'themes' ?>">
|
||||
<?php $L->p('Themes') ?></a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'about' ?>">
|
||||
<?php $L->p('About') ?></a>
|
||||
</li>
|
||||
<?php endif; ?>
|
||||
<?php if (checkRole(array('admin'),false)): ?>
|
||||
<?php
|
||||
if (!empty($plugins['adminSidebar'])) {
|
||||
foreach ($plugins['adminSidebar'] as $pluginSidebar) {
|
||||
echo '<li class="nav-item">';
|
||||
echo $pluginSidebar->adminSidebar();
|
||||
echo '</li>';
|
||||
}
|
||||
}
|
||||
?>
|
||||
<?php endif; ?>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'logout' ?>">
|
||||
<?php $L->p('Logout') ?></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
@@ -0,0 +1,83 @@
|
||||
<!-- Use .flex-column to set a vertical direction -->
|
||||
<ul class="nav flex-column pt-4">
|
||||
|
||||
<li class="nav-item mb-4" style="display: flex; align-items: center;">
|
||||
<div style="display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; background: var(--primary-gradient); border-radius: 8px; box-shadow: var(--shadow-sm); flex-shrink: 0;">
|
||||
<img src="<?php echo HTML_PATH_CORE_IMG ?>logo.svg" width="18" height="18" alt="bludit-logo" style="filter: brightness(0) invert(1);">
|
||||
</div>
|
||||
<span style="margin-left: 10px; font-weight: 600; font-size: 1rem; color: var(--text-primary); line-height: 1;"><?php echo (defined('BLUDIT_PRO'))?'BLUDIT PRO':'BLUDIT' ?></span>
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'dashboard' ?>"><span class="fa fa-dashboard"></span><?php $L->p('Dashboard') ?></a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" target="_blank" href="<?php echo HTML_PATH_ROOT ?>"><span class="fa fa-home"></span><?php $L->p('Website') ?></a>
|
||||
</li>
|
||||
|
||||
<li class="nav-item mt-3">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'new-content' ?>"><span class="fa fa-plus-circle text-primary"></span><?php $L->p('New content') ?></a>
|
||||
</li>
|
||||
|
||||
<?php if (!checkRole(array('admin'),false)): ?>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'content' ?>"><span class="fa fa-archive"></span><?php $L->p('Content') ?></a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'edit-user/'.$login->username() ?>"><span class="fa fa-user"></span><?php $L->p('Profile') ?></a>
|
||||
</li>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (checkRole(array('admin'),false)): ?>
|
||||
|
||||
<li class="nav-item mt-3">
|
||||
<h4><?php $L->p('Manage') ?></h4>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'content' ?>"><span class="fa fa-folder"></span><?php $L->p('Content') ?></a>
|
||||
</li>
|
||||
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'categories' ?>"><span class="fa fa-bookmark"></span><?php $L->p('Categories') ?></a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'users' ?>"><span class="fa fa-users"></span><?php $L->p('Users') ?></a>
|
||||
</li>
|
||||
|
||||
<li class="nav-item mt-3">
|
||||
<h4><?php $L->p('Settings') ?></h4>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'settings' ?>"><span class="fa fa-gear"></span><?php $L->p('General') ?></a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'plugins' ?>"><span class="fa fa-puzzle-piece"></span><?php $L->p('Plugins') ?></a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'themes' ?>"><span class="fa fa-desktop"></span><?php $L->p('Themes') ?></a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'about' ?>"><span class="fa fa-info"></span><?php $L->p('About') ?></a>
|
||||
</li>
|
||||
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (checkRole(array('admin', 'editor'),false)): ?>
|
||||
|
||||
<?php
|
||||
if (!empty($plugins['adminSidebar'])) {
|
||||
echo '<li class="nav-item"><hr></li>';
|
||||
foreach ($plugins['adminSidebar'] as $pluginSidebar) {
|
||||
echo '<li class="nav-item">';
|
||||
echo $pluginSidebar->adminSidebar();
|
||||
echo '</li>';
|
||||
}
|
||||
}
|
||||
?>
|
||||
|
||||
<?php endif; ?>
|
||||
|
||||
<li class="nav-item mt-5">
|
||||
<a class="nav-link" href="<?php echo HTML_PATH_ADMIN_ROOT.'logout' ?>"><span class="fa fa-arrow-circle-right"></span><?php $L->p('Logout') ?></a>
|
||||
</li>
|
||||
</ul>
|
||||
Reference in New Issue
Block a user