2018-04-15 22:23:11 +02:00
|
|
|
<!-- TABS -->
|
|
|
|
<ul class="nav nav-tabs" id="dynamicTab" role="tablist">
|
|
|
|
<li class="nav-item">
|
2018-06-03 21:51:47 +02:00
|
|
|
<a class="nav-link active" id="content-tab" data-toggle="tab" href="#content" role="tab" aria-controls="content" aria-selected="true">Editor</a>
|
2018-04-15 22:23:11 +02:00
|
|
|
</li>
|
|
|
|
<li class="nav-item">
|
|
|
|
<a class="nav-link" id="images-tab" data-toggle="tab" href="#images" role="tab" aria-controls="images" aria-selected="false">Images</a>
|
|
|
|
</li>
|
|
|
|
<li class="nav-item">
|
|
|
|
<a class="nav-link " id="options-tab" data-toggle="tab" href="#options" role="tab" aria-controls="options" aria-selected="false">Options</a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
<?php
|
2018-05-08 00:15:40 +02:00
|
|
|
echo Bootstrap::formOpen(array(
|
|
|
|
'id'=>'jsform',
|
2018-06-03 21:51:47 +02:00
|
|
|
'class'=>'tab-content mt-1'
|
2018-05-08 00:15:40 +02:00
|
|
|
));
|
|
|
|
|
2018-04-15 22:23:11 +02:00
|
|
|
// Token CSRF
|
|
|
|
echo Bootstrap::formInputHidden(array(
|
|
|
|
'name'=>'tokenCSRF',
|
|
|
|
'value'=>$Security->getTokenCSRF()
|
|
|
|
));
|
|
|
|
|
|
|
|
// Parent
|
|
|
|
echo Bootstrap::formInputHidden(array(
|
|
|
|
'name'=>'parent',
|
|
|
|
'value'=>''
|
|
|
|
));
|
|
|
|
|
2018-05-08 00:15:40 +02:00
|
|
|
// UUID
|
|
|
|
echo Bootstrap::formInputHidden(array(
|
|
|
|
'name'=>'uuid',
|
|
|
|
'value'=>$dbPages->generateUUID()
|
|
|
|
));
|
|
|
|
|
2018-04-15 22:23:11 +02:00
|
|
|
// Status = published, draft, sticky, static
|
|
|
|
echo Bootstrap::formInputHidden(array(
|
|
|
|
'name'=>'status',
|
|
|
|
'value'=>'published'
|
|
|
|
));
|
2018-05-08 23:25:18 +02:00
|
|
|
|
|
|
|
// Cover image
|
|
|
|
echo Bootstrap::formInputHidden(array(
|
|
|
|
'name'=>'coverImage',
|
|
|
|
'value'=>''
|
|
|
|
));
|
2018-07-03 23:04:08 +02:00
|
|
|
|
|
|
|
// Content
|
|
|
|
echo Bootstrap::formInputHidden(array(
|
|
|
|
'name'=>'content',
|
|
|
|
'value'=>''
|
|
|
|
));
|
2018-04-15 22:23:11 +02:00
|
|
|
?>
|
|
|
|
|
|
|
|
<!-- TABS CONTENT -->
|
|
|
|
<div class="tab-pane show active" id="content" role="tabpanel" aria-labelledby="content-tab">
|
|
|
|
|
2018-06-03 21:51:47 +02:00
|
|
|
<div class="form-group m-0">
|
|
|
|
<input value="" class="form-control form-control-lg rounded-0 " id="jstitle" name="title" placeholder="Enter title" type="text">
|
|
|
|
</div>
|
2018-04-15 22:23:11 +02:00
|
|
|
|
2018-07-07 12:04:34 +02:00
|
|
|
<div class="form-group m-0 mt-1">
|
|
|
|
<button id="jsmediaManagerButton" type="button" class="btn btn-form btn-sm" data-toggle="modal" data-target="#jsbluditMediaModal"><span class="oi oi-image"></span> Media Manager</button>
|
|
|
|
<button id="jscategoryButton" type="button" class="btn btn-form btn-sm" data-toggle="modal" data-target="#jscategoryModal"><span class="oi oi-tags"></span> Category: <span class="option">-</span></button>
|
|
|
|
<button id="jsdescriptionButton" type="button" class="btn btn-form btn-sm" data-toggle="modal" data-target="#jsdescriptionModal"><span class="oi oi-tags"></span> Description: <span class="option">-</span></button>
|
|
|
|
</div>
|
|
|
|
|
2018-06-03 21:51:47 +02:00
|
|
|
<div class="form-group mt-1">
|
2018-07-07 12:04:34 +02:00
|
|
|
<textarea id="jseditor" style="display:none;"></textarea>
|
2018-04-15 22:23:11 +02:00
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="form-group mt-2">
|
2018-07-03 23:04:08 +02:00
|
|
|
<button id="jsbuttonSave" type="button" class="btn btn-primary"><?php echo $L->g('Publish') ?></button>
|
2018-06-25 23:17:43 +02:00
|
|
|
<button id="jsbuttonDraft" type="button" class="btn btn-secondary"><?php echo $L->g('Save as draft') ?></button>
|
|
|
|
<a href="<?php echo HTML_PATH_ADMIN_ROOT ?>dashboard" class="btn btn-secondary"><?php echo $L->g('Cancel') ?></a>
|
2018-04-15 22:23:11 +02:00
|
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<!-- TABS IMAGES -->
|
|
|
|
<div class="tab-pane" id="images" role="tabpanel" aria-labelledby="images-tab">
|
|
|
|
|
|
|
|
<?php
|
|
|
|
echo Bootstrap::formTitle(array('title'=>'Cover image'));
|
|
|
|
?>
|
|
|
|
|
2018-05-14 00:00:10 +02:00
|
|
|
<img id="jscoverImagePreview" style="width: 350px; height: 200px;" class="img-thumbnail" alt="coverImagePreview" src="<?php echo HTML_PATH_ADMIN_THEME_IMG ?>default.svg" />
|
2018-04-15 22:23:11 +02:00
|
|
|
|
|
|
|
<?php
|
2018-05-14 00:00:10 +02:00
|
|
|
echo Bootstrap::formTitle(array('title'=>$L->g('External Cover Image')));
|
2018-04-15 22:23:11 +02:00
|
|
|
?>
|
|
|
|
|
|
|
|
<?php
|
|
|
|
echo Bootstrap::formInputTextBlock(array(
|
|
|
|
'name'=>'externalCoverImage',
|
2018-05-14 00:00:10 +02:00
|
|
|
'placeholder'=>"https://",
|
2018-07-10 18:37:46 +02:00
|
|
|
'value'=>'',
|
|
|
|
'tip'=>'Set a cover image from external URL, such as a CDN or some server dedicate for images.'
|
2018-04-15 22:23:11 +02:00
|
|
|
));
|
|
|
|
?>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<!-- TABS OPTIONS -->
|
|
|
|
<div class="tab-pane" id="options" role="tabpanel" aria-labelledby="options-tab">
|
|
|
|
<?php
|
2018-07-10 18:37:46 +02:00
|
|
|
echo Bootstrap::formTitle(array('title'=>'SEO'));
|
2018-04-15 22:23:11 +02:00
|
|
|
|
|
|
|
// Tags
|
|
|
|
echo Bootstrap::formInputText(array(
|
|
|
|
'name'=>'tags',
|
|
|
|
'label'=>'Tags',
|
2018-07-10 18:37:46 +02:00
|
|
|
'placeholder'=>'',
|
|
|
|
'tip'=>'Write the tags separeted by comma'
|
|
|
|
));
|
|
|
|
|
|
|
|
// Friendly URL
|
|
|
|
echo Bootstrap::formInputText(array(
|
|
|
|
'name'=>'slug',
|
|
|
|
'tip'=>$L->g('URL associated with the content'),
|
|
|
|
'label'=>$L->g('Friendly URL'),
|
|
|
|
'placeholder'=>'Leave empty for automaticly complete'
|
|
|
|
));
|
|
|
|
|
|
|
|
echo '<hr>';
|
|
|
|
|
|
|
|
echo Bootstrap::formCheckbox(array(
|
|
|
|
'name'=>'noindex',
|
|
|
|
'label'=>'Robots',
|
|
|
|
'labelForCheckbox'=>'Apply <code>noindex</code> to this page',
|
|
|
|
'placeholder'=>'',
|
|
|
|
'tip'=>'This tells search engines not to show this page in their search results.'
|
|
|
|
));
|
|
|
|
|
|
|
|
echo Bootstrap::formCheckbox(array(
|
|
|
|
'name'=>'nofollow',
|
|
|
|
'label'=>'',
|
|
|
|
'labelForCheckbox'=>'Apply <code>nofollow</code> to this page',
|
|
|
|
'placeholder'=>'',
|
|
|
|
'tip'=>'This tells search engines not to follow links on this page.'
|
|
|
|
));
|
|
|
|
|
|
|
|
echo Bootstrap::formCheckbox(array(
|
|
|
|
'name'=>'noarchive',
|
|
|
|
'label'=>'',
|
|
|
|
'labelForCheckbox'=>'Apply <code>noarchive</code> to this page',
|
|
|
|
'placeholder'=>'',
|
|
|
|
'tip'=>'This tells search engines not to save a cached copy of this page.'
|
2018-04-15 22:23:11 +02:00
|
|
|
));
|
|
|
|
|
2018-07-10 18:37:46 +02:00
|
|
|
echo '<hr>';
|
|
|
|
|
|
|
|
echo Bootstrap::formTitle(array('title'=>'Advanced'));
|
|
|
|
|
2018-04-15 22:23:11 +02:00
|
|
|
// Date
|
|
|
|
echo Bootstrap::formInputText(array(
|
|
|
|
'name'=>'date',
|
|
|
|
'label'=>'Date',
|
2018-05-08 00:15:40 +02:00
|
|
|
'placeholder'=>'YYYY-MM-DD hh:mm:ss',
|
|
|
|
'value'=>Date::current(DB_DATE_FORMAT)
|
2018-04-15 22:23:11 +02:00
|
|
|
));
|
|
|
|
|
|
|
|
// Type
|
|
|
|
echo Bootstrap::formSelect(array(
|
|
|
|
'name'=>'type',
|
|
|
|
'label'=>'Type',
|
|
|
|
'selected'=>'',
|
|
|
|
'options'=>array(
|
|
|
|
''=>'- Default -',
|
|
|
|
'sticky'=>'Sticky',
|
|
|
|
'static'=>'Static'
|
|
|
|
)
|
|
|
|
));
|
|
|
|
|
|
|
|
// Parent
|
|
|
|
echo Bootstrap::formInputText(array(
|
|
|
|
'name'=>'parentTMP',
|
2018-05-14 00:00:10 +02:00
|
|
|
'label'=>$L->g('Parent'),
|
2018-07-11 19:40:58 +02:00
|
|
|
'tip'=>'Start typing a page title to see a list of suggestions.'
|
2018-04-15 22:23:11 +02:00
|
|
|
));
|
|
|
|
|
|
|
|
// Position
|
|
|
|
echo Bootstrap::formInputText(array(
|
|
|
|
'name'=>'position',
|
2018-05-14 00:00:10 +02:00
|
|
|
'label'=>$L->g('Position'),
|
|
|
|
'tip'=>$L->g('This field is used when you order the content by position'),
|
|
|
|
'value'=>$dbPages->nextPositionNumber()
|
2018-04-15 22:23:11 +02:00
|
|
|
));
|
|
|
|
|
|
|
|
// Template
|
|
|
|
echo Bootstrap::formInputText(array(
|
|
|
|
'name'=>'template',
|
|
|
|
'label'=>'Template',
|
|
|
|
'placeholder'=>''
|
|
|
|
));
|
|
|
|
?>
|
|
|
|
|
|
|
|
</div>
|
2018-07-07 12:04:34 +02:00
|
|
|
|
|
|
|
<!-- Modal for Categories -->
|
|
|
|
<div id="jscategoryModal" class="modal fade" tabindex="-1" role="dialog">
|
|
|
|
<div class="modal-dialog">
|
|
|
|
<div class="modal-content">
|
|
|
|
<div class="modal-header">
|
|
|
|
<h5 class="modal-title">Category</h5>
|
|
|
|
</div>
|
|
|
|
<div class="modal-body">
|
|
|
|
<?php
|
|
|
|
echo Bootstrap::formSelectBlock(array(
|
|
|
|
'name'=>'category',
|
|
|
|
'label'=>'',
|
|
|
|
'selected'=>'',
|
|
|
|
'class'=>'',
|
|
|
|
'emptyOption'=>'- Without category -',
|
|
|
|
'options'=>$dbCategories->getKeyNameArray()
|
|
|
|
));
|
|
|
|
?>
|
|
|
|
</div>
|
|
|
|
<div class="modal-footer">
|
|
|
|
<button type="button" class="btn btn-primary" data-dismiss="modal">Done</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<script>
|
2018-07-10 18:37:46 +02:00
|
|
|
$(document).ready(function() {
|
|
|
|
function setCategoryBox(value) {
|
|
|
|
var selected = $("#jscategory option:selected");
|
|
|
|
var value = selected.val().trim();
|
|
|
|
if (value) {
|
|
|
|
$("#jscategoryButton").find("span.option").html(selected.text());
|
|
|
|
} else {
|
|
|
|
$("#jscategoryButton").find("span.option").html("-");
|
2018-07-07 12:04:34 +02:00
|
|
|
}
|
2018-07-10 18:37:46 +02:00
|
|
|
}
|
2018-07-07 12:04:34 +02:00
|
|
|
|
2018-07-10 18:37:46 +02:00
|
|
|
// Set the current category selected
|
|
|
|
setCategoryBox();
|
2018-07-07 12:04:34 +02:00
|
|
|
|
2018-07-10 18:37:46 +02:00
|
|
|
// When the user select the category update the category button
|
|
|
|
$("#jscategory").on("change", function() {
|
|
|
|
setCategoryBox();
|
2018-07-07 12:04:34 +02:00
|
|
|
});
|
2018-07-10 18:37:46 +02:00
|
|
|
});
|
2018-07-07 12:04:34 +02:00
|
|
|
</script>
|
|
|
|
|
|
|
|
<!-- Modal for Description -->
|
|
|
|
<div id="jsdescriptionModal" class="modal fade" tabindex="-1" role="dialog">
|
|
|
|
<div class="modal-dialog">
|
|
|
|
<div class="modal-content">
|
|
|
|
<div class="modal-header">
|
|
|
|
<h5 class="modal-title">Description</h5>
|
|
|
|
</div>
|
|
|
|
<div class="modal-body">
|
|
|
|
<?php
|
|
|
|
echo Bootstrap::formTextareaBlock(array(
|
|
|
|
'name'=>'description',
|
|
|
|
'label'=>'',
|
|
|
|
'selected'=>'',
|
|
|
|
'class'=>'',
|
|
|
|
'value'=>'',
|
|
|
|
'rows'=>3,
|
|
|
|
'placeholder'=>$Language->get('this-field-can-help-describe-the-content')
|
|
|
|
));
|
|
|
|
?>
|
|
|
|
</div>
|
|
|
|
<div class="modal-footer">
|
|
|
|
<button type="button" class="btn btn-primary" data-dismiss="modal">Done</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<script>
|
2018-07-10 18:37:46 +02:00
|
|
|
$(document).ready(function() {
|
|
|
|
function setDescriptionBox(value) {
|
|
|
|
var value = $("#jsdescription").val();
|
|
|
|
if (!value) {
|
|
|
|
value = '-';
|
|
|
|
} else {
|
|
|
|
value = jQuery.trim(value).substring(0, 60).split(" ").slice(0, -1).join(" ") + "...";
|
2018-07-07 12:04:34 +02:00
|
|
|
}
|
2018-07-10 18:37:46 +02:00
|
|
|
$("#jsdescriptionButton").find("span.option").html(value);
|
|
|
|
}
|
2018-07-07 12:04:34 +02:00
|
|
|
|
2018-07-10 18:37:46 +02:00
|
|
|
// Set the current description
|
|
|
|
setDescriptionBox();
|
2018-07-07 12:04:34 +02:00
|
|
|
|
2018-07-10 18:37:46 +02:00
|
|
|
// When the user write the description update the description button
|
|
|
|
$("#jsdescription").on("change", function() {
|
|
|
|
setDescriptionBox();
|
2018-07-07 12:04:34 +02:00
|
|
|
});
|
2018-07-10 18:37:46 +02:00
|
|
|
});
|
2018-07-07 12:04:34 +02:00
|
|
|
</script>
|
2018-04-15 22:23:11 +02:00
|
|
|
</form>
|
2015-05-05 03:00:01 +02:00
|
|
|
|
2018-07-10 18:37:46 +02:00
|
|
|
<!-- Modal for Media Manager -->
|
|
|
|
<?php include(PATH_ADMIN_THEMES.'booty/html/media.php'); ?>
|
|
|
|
|
2015-05-05 03:00:01 +02:00
|
|
|
<script>
|
2018-04-15 22:23:11 +02:00
|
|
|
$(document).ready(function() {
|
2017-01-10 17:43:38 +01:00
|
|
|
|
2018-07-11 19:40:58 +02:00
|
|
|
// Datepicker
|
|
|
|
$("#jsdate").datetimepicker({format:DB_DATE_FORMAT});
|
|
|
|
|
2018-05-08 23:25:18 +02:00
|
|
|
// Button Save
|
|
|
|
$("#jsbuttonSave").on("click", function() {
|
|
|
|
$("#jsstatus").val("published");
|
2018-07-03 23:04:08 +02:00
|
|
|
$("#jscontent").val( editorGetContent() );
|
2018-05-08 23:25:18 +02:00
|
|
|
$("#jsform").submit();
|
|
|
|
});
|
|
|
|
|
2017-01-10 17:43:38 +01:00
|
|
|
// Button Save as draft
|
2018-05-08 23:25:18 +02:00
|
|
|
$("#jsbuttonDraft").on("click", function() {
|
2017-01-10 17:43:38 +01:00
|
|
|
$("#jsstatus").val("draft");
|
2018-07-03 23:04:08 +02:00
|
|
|
$("#jscontent").val( editorGetContent() );
|
2018-05-08 00:15:40 +02:00
|
|
|
$("#jsform").submit();
|
2017-01-10 17:43:38 +01:00
|
|
|
});
|
|
|
|
|
2018-05-08 23:25:18 +02:00
|
|
|
// External cover image
|
|
|
|
$("#jsexternalCoverImage").change(function() {
|
|
|
|
$("#jscoverImage").val( $(this).val() );
|
|
|
|
});
|
|
|
|
|
2018-05-08 00:15:40 +02:00
|
|
|
// Type selector modified the status hidden field
|
2018-04-15 22:23:11 +02:00
|
|
|
$("#jstype").on("change", function() {
|
|
|
|
var status = $("#jstype option:selected").val();
|
|
|
|
$("#jsstatus").val(status);
|
|
|
|
});
|
2017-01-10 17:43:38 +01:00
|
|
|
|
2018-05-08 00:15:40 +02:00
|
|
|
// Generate slug when the user type the title
|
|
|
|
$("#jstitle").keyup(function() {
|
|
|
|
var text = $(this).val();
|
|
|
|
var parent = $("#jsparent").val();
|
|
|
|
var currentKey = "";
|
|
|
|
var ajax = new bluditAjax();
|
|
|
|
ajax.generateSlug(text, parent, currentKey, $("#jsslug"));
|
|
|
|
});
|
|
|
|
|
|
|
|
// Autosave interval
|
2018-06-03 21:51:47 +02:00
|
|
|
// Autosave works when the content of the page is bigger than 100 characters
|
2018-05-08 00:15:40 +02:00
|
|
|
setInterval(function() {
|
|
|
|
var uuid = $("#jsuuid").val();
|
|
|
|
var title = $("#jstitle").val();
|
|
|
|
var content = editorGetContent();
|
|
|
|
var ajax = new bluditAjax();
|
|
|
|
// showAlert is the function to display an alert defined in alert.php
|
|
|
|
ajax.autosave(uuid, title, content, showAlert);
|
2018-07-07 12:04:34 +02:00
|
|
|
},1000*60*AUTOSAVE_INTERVAL);
|
2018-05-08 00:15:40 +02:00
|
|
|
|
2018-04-15 22:23:11 +02:00
|
|
|
// Template autocomplete
|
|
|
|
$('input[name="template"]').autoComplete({
|
|
|
|
minChars: 2,
|
|
|
|
source: function(term, suggest){
|
|
|
|
term = term.toLowerCase();
|
|
|
|
var choices = ['ActionScript', 'Acti', 'Asp'];
|
|
|
|
var matches = [];
|
|
|
|
for (i=0; i<choices.length; i++)
|
|
|
|
if (~choices[i].toLowerCase().indexOf(term)) matches.push(choices[i]);
|
|
|
|
suggest(matches);
|
2017-01-10 17:43:38 +01:00
|
|
|
}
|
|
|
|
});
|
2015-05-05 03:00:01 +02:00
|
|
|
|
2018-04-15 22:23:11 +02:00
|
|
|
// Parent autocomplete
|
|
|
|
var parentsXHR;
|
|
|
|
var parentsList; // Keep the parent list returned to get the key by the title page
|
|
|
|
$("#jsparentTMP").autoComplete({
|
2018-05-14 00:00:10 +02:00
|
|
|
minChars: 1,
|
2018-04-15 22:23:11 +02:00
|
|
|
source: function(term, response) {
|
|
|
|
// Prevent call inmediatly another ajax request
|
|
|
|
try { parentsXHR.abort(); } catch(e){}
|
2018-05-14 00:00:10 +02:00
|
|
|
parentsXHR = $.getJSON(HTML_PATH_ADMIN_ROOT+"ajax/get-parents", {query: term},
|
2018-04-15 22:23:11 +02:00
|
|
|
function(data) {
|
|
|
|
parentsList = data;
|
|
|
|
term = term.toLowerCase();
|
|
|
|
var matches = [];
|
|
|
|
for (var title in data) {
|
|
|
|
if (~title.toLowerCase().indexOf(term))
|
|
|
|
matches.push(title);
|
|
|
|
}
|
|
|
|
response(matches);
|
|
|
|
});
|
|
|
|
},
|
|
|
|
onSelect: function(e, term, item) {
|
2018-05-14 00:00:10 +02:00
|
|
|
// parentsList = array( pageTitle => pageKey )
|
2018-04-15 22:23:11 +02:00
|
|
|
var parentKey = parentsList[term];
|
|
|
|
$("#jsparent").attr("value", parentKey);
|
2018-01-21 23:23:22 +01:00
|
|
|
}
|
|
|
|
});
|
|
|
|
|
2015-05-05 03:00:01 +02:00
|
|
|
});
|
2018-04-15 22:23:11 +02:00
|
|
|
</script>
|