Erster Checkin für die neue Version 2.0
This commit is contained in:
231
css/editor.css
Normal file
231
css/editor.css
Normal file
@@ -0,0 +1,231 @@
|
|||||||
|
#csEditorLayer {
|
||||||
|
position: absolute;
|
||||||
|
z-index: 2000;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
top: 0;
|
||||||
|
background-color: rgba(204, 204, 204, .9);
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorWrapper {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorHeader, #csEditorFooter {
|
||||||
|
height: 50px;
|
||||||
|
background-color: #000;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorHeader h1, #csEditorFooter h1 {
|
||||||
|
font-size: 24px;
|
||||||
|
margin-top: 0;
|
||||||
|
margin-bottom: 0;
|
||||||
|
line-height: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorLayerClose {
|
||||||
|
font-size: 24px;
|
||||||
|
line-height: 50px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorContent {
|
||||||
|
height: calc(100% - 100px);
|
||||||
|
background-color: #fff;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorPageElements {
|
||||||
|
width: 220px;
|
||||||
|
position: fixed;
|
||||||
|
right: 0;
|
||||||
|
top: 300px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorPageElementsTitle {
|
||||||
|
margin-right: 45px;
|
||||||
|
font-weight: bold;
|
||||||
|
cursor: move;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorPageElementsMin {
|
||||||
|
position: absolute;
|
||||||
|
right: 15px;
|
||||||
|
top: 12px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorPageElementsContent h2 {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorPageElementsContent h2, #csEditorPageElementsContent p {
|
||||||
|
font-weight: bold;
|
||||||
|
height: 20px;
|
||||||
|
line-height: 20px;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorPageElementsContent .ImageText-Image {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorPageElementsContent .ImageText-Text {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorPageElementsContent h2, #csEditorPageElementsContent p, #csEditorPageElementsContent .ImageText-Text {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorPageElementsContent .row {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pageWrapper {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pageWrapper .glyphicon-pencil {
|
||||||
|
position: absolute;
|
||||||
|
left: -14px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pageWrapper .glyphicon-trash {
|
||||||
|
position: absolute;
|
||||||
|
left: -42px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pageWrapper .glyphicon-sort {
|
||||||
|
position: absolute;
|
||||||
|
right: -14px;
|
||||||
|
cursor: move;
|
||||||
|
}
|
||||||
|
|
||||||
|
.csEditorSortable .glyphicon-sort {
|
||||||
|
position: absolute;
|
||||||
|
right: 42px;
|
||||||
|
cursor: move;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.csEditorSortable li {
|
||||||
|
position: relative;
|
||||||
|
list-style-type: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.nav {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.nav > .glyphicon-pencil {
|
||||||
|
left: -29px;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.row {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.editableHover {
|
||||||
|
background-color: #f00;
|
||||||
|
opacity: .5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.csEditorStructure ul {
|
||||||
|
padding-left: 20px;
|
||||||
|
font-style: normal;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.csEditorStructure > ul {
|
||||||
|
padding: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.csEditorStructure li {
|
||||||
|
text-decoration: none;
|
||||||
|
list-style-type: none;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.csEditorStructure li.csEditorClosed ul {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.csEditorStructure li.csEditorChosen {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.csEditorStructure li.csEditorInactive {
|
||||||
|
font-style: italic;
|
||||||
|
color: #777;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorContent .csEditorSliderContent {
|
||||||
|
padding-top: 48px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorContent .csEditorSliderContent:not(:first-of-type) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorForm, .csEditorSlider, .csEditorSliderContent, .editFields, .sortFields, .moveFields, .childFields, .siblingFields {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.editFields, .sortFields, .moveFields, .childFields, .siblingFields {
|
||||||
|
padding-top: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#content .sortable {
|
||||||
|
min-height: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorImage {
|
||||||
|
margin-top: 42px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorImagePlaceholder {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorImageCover {
|
||||||
|
position: absolute;
|
||||||
|
box-shadow: inset 0 0 4px #f00;
|
||||||
|
z-index: 50;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorCoverTop, #csEditorCoverRight, #csEditorCoverBottom, #csEditorCoverLeft {
|
||||||
|
position: absolute;
|
||||||
|
background-color: rgba(100, 100, 100, .8);
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
#csEditorContent > div {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.csEditorButtonGroup {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
height: 50px;
|
||||||
|
background-color: #9d9d9d;
|
||||||
|
padding-top: 8px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ui-icon-gripsmall-diagonal-se {
|
||||||
|
position: absolute;
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
bottom: 0px;
|
||||||
|
right: 0px;
|
||||||
|
background-color: #f00;
|
||||||
|
cursor: se-resize;
|
||||||
|
}
|
||||||
1
css/editor.min.css
vendored
Normal file
1
css/editor.min.css
vendored
Normal file
@@ -0,0 +1 @@
|
|||||||
|
#csEditorLayer{position:absolute;z-index:2000;height:100%;width:100%;top:0;background-color:rgba(204,204,204,.9);display:none}#csEditorWrapper{height:100%}#csEditorHeader,#csEditorFooter{height:50px;background-color:#000;color:#fff}#csEditorHeader h1,#csEditorFooter h1{font-size:24px;margin-top:0;margin-bottom:0;line-height:50px}#csEditorLayerClose{font-size:24px;line-height:50px;cursor:pointer}#csEditorContent{height:calc(100% - 100px);background-color:#fff;overflow:auto}#csEditorPageElements{width:220px;position:fixed;right:0;top:300px;overflow:hidden}#csEditorPageElementsTitle{margin-right:45px;font-weight:bold;cursor:move}#csEditorPageElementsMin{position:absolute;right:15px;top:12px;cursor:pointer}#csEditorPageElementsContent h2{font-size:14px}#csEditorPageElementsContent h2,#csEditorPageElementsContent p{font-weight:bold;height:20px;line-height:20px;margin:0;padding:0}#csEditorPageElementsContent .ImageText-Image{display:none}#csEditorPageElementsContent .ImageText-Text{padding:0}#csEditorPageElementsContent h2,#csEditorPageElementsContent p,#csEditorPageElementsContent .ImageText-Text{width:100%}#csEditorPageElementsContent .row{margin:0}.pageWrapper{position:relative}.pageWrapper .glyphicon-pencil{position:absolute;left:-14px;cursor:pointer}.pageWrapper .glyphicon-trash{position:absolute;left:-42px;cursor:pointer}.pageWrapper .glyphicon-sort{position:absolute;right:-14px;cursor:move}.csEditorSortable .glyphicon-sort{position:absolute;right:42px;cursor:move}.csEditorSortable li{position:relative;list-style-type:none}ul.nav{position:relative}ul.nav>.glyphicon-pencil{left:-29px;color:#fff}.row{position:relative}.editableHover{background-color:red;opacity:.5}.csEditorStructure ul{padding-left:20px;font-style:normal;text-decoration:none}.csEditorStructure>ul{padding:15px}.csEditorStructure li{text-decoration:none;list-style-type:none;font-weight:normal}.csEditorStructure li.csEditorClosed ul{display:none}.csEditorStructure li.csEditorChosen{font-weight:bold}.csEditorStructure li.csEditorInactive{font-style:italic;color:#777}#csEditorContent .csEditorSliderContent{padding-top:48px}#csEditorContent .csEditorSliderContent:not(:first-of-type){display:none}#csEditorForm,.csEditorSlider,.csEditorSliderContent,.editFields,.sortFields,.moveFields,.childFields,.siblingFields{height:100%}.editFields,.sortFields,.moveFields,.childFields,.siblingFields{padding-top:24px}#content .sortable{min-height:20px}#csEditorImage{margin-top:42px}#csEditorImagePlaceholder{position:relative}#csEditorImageCover{position:absolute;box-shadow:inset 0 0 4px red;z-index:50}#csEditorCoverTop,#csEditorCoverRight,#csEditorCoverBottom,#csEditorCoverLeft{position:absolute;background-color:rgba(100,100,100,.8);z-index:1}#csEditorContent>div{height:100%}.csEditorButtonGroup{position:absolute;bottom:0;height:50px;background-color:#9d9d9d;padding-top:8px;width:100%}.ui-icon-gripsmall-diagonal-se{position:absolute;width:8px;height:8px;bottom:0;right:0;background-color:red;cursor:se-resize}
|
||||||
37
editor.js.php
Normal file
37
editor.js.php
Normal file
@@ -0,0 +1,37 @@
|
|||||||
|
<?php
|
||||||
|
/**
|
||||||
|
* Created by CS medien- & kommunikationssysteme.
|
||||||
|
* @author Christian Steinle
|
||||||
|
* @date 30.09.2016
|
||||||
|
*
|
||||||
|
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
||||||
|
*/
|
||||||
|
|
||||||
|
header('Content-Type: text/javascript');
|
||||||
|
|
||||||
|
if (file_exists(__DIR__ . '/lang/lang-' . $_GET['lang'] . '.php'))
|
||||||
|
{
|
||||||
|
$includeFile = __DIR__ . '/lang/lang-' . $_GET['lang'] . '.php';
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
$includeFile = __DIR__ . '/lang/lang-de.php';
|
||||||
|
}
|
||||||
|
|
||||||
|
include_once($includeFile);
|
||||||
|
|
||||||
|
?>
|
||||||
|
|
||||||
|
var csEditorLang = <?php echo json_encode($lang, JSON_UNESCAPED_UNICODE); ?>;
|
||||||
|
var csEditorTemplate = '<?php echo str_replace(array("\n", "\r", "\t"), '', file_get_contents('./templates/editorTemplate.html')); ?>';
|
||||||
|
var csEditorPageElements = '<?php echo str_replace(array("\n", "\r", "\t"), '', file_get_contents('./templates/editorPageElements.html')); ?>';
|
||||||
|
|
||||||
|
<?php
|
||||||
|
|
||||||
|
echo file_get_contents(__DIR__ . '/js/csEditor.js');
|
||||||
|
echo file_get_contents(__DIR__ . '/js/navigationEditor.js');
|
||||||
|
echo file_get_contents(__DIR__ . '/js/headlineEditor.js');
|
||||||
|
echo file_get_contents(__DIR__ . '/js/sublineEditor.js');
|
||||||
|
echo file_get_contents(__DIR__ . '/js/textEditor.js');
|
||||||
|
echo file_get_contents(__DIR__ . '/js/imageTextEditor.js');
|
||||||
|
echo file_get_contents(__DIR__ . '/js/keyVisualEditor.js');
|
||||||
566
js/csEditor.js
Normal file
566
js/csEditor.js
Normal file
@@ -0,0 +1,566 @@
|
|||||||
|
/**
|
||||||
|
* CS-Editor
|
||||||
|
* Stellt die Grundsätzlichen Funktionen des Editors her.
|
||||||
|
* Bindet die einzelnen Editoren bei Aufruf ein.
|
||||||
|
*
|
||||||
|
* Created by CS medien- & kommunikationssysteme.
|
||||||
|
* @author Christian Steinle
|
||||||
|
* @date 30.09.2016
|
||||||
|
*
|
||||||
|
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
||||||
|
*/
|
||||||
|
|
||||||
|
var CS = new Object({
|
||||||
|
/**
|
||||||
|
* Standard-Variablen für den Editor
|
||||||
|
*/
|
||||||
|
editorType: '',
|
||||||
|
editorTemplate: '',
|
||||||
|
editorTitle: '',
|
||||||
|
editorName: '',
|
||||||
|
editorHtml: '',
|
||||||
|
editorDataID: 0,
|
||||||
|
editorData: null,
|
||||||
|
editor: null,
|
||||||
|
preventSortStop: false,
|
||||||
|
|
||||||
|
/**
|
||||||
|
* jQuery-Elemente für den Editor
|
||||||
|
*/
|
||||||
|
pageElement: null,
|
||||||
|
editorConfirmElement: null,
|
||||||
|
layerElement: null,
|
||||||
|
waitingElement: null,
|
||||||
|
titleElement: null,
|
||||||
|
closeElement: null,
|
||||||
|
contentElement: null,
|
||||||
|
editableElement: null,
|
||||||
|
editableHoverClassName: '',
|
||||||
|
sortableElement: null,
|
||||||
|
editorOpenElement: null,
|
||||||
|
editorSortElement: null,
|
||||||
|
editorTrashElement: null,
|
||||||
|
|
||||||
|
/**
|
||||||
|
* jQuery-Elemente für neue Seiten-Inhalte
|
||||||
|
*/
|
||||||
|
newObjectElement: null,
|
||||||
|
newObjectTitleElement: null,
|
||||||
|
newObjectMinElement: null,
|
||||||
|
newSubLineElement: null,
|
||||||
|
newTextElement: null,
|
||||||
|
newTextImageElement: null,
|
||||||
|
newTextImageTextElement: null,
|
||||||
|
newTextImageImageElement: null,
|
||||||
|
newElementsClass: null,
|
||||||
|
newElementsClassName: '',
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Initialisiert die Icons und deren Funktionen, die bei $(document).ready gesetzt werden.
|
||||||
|
* onclick Events... werden sonst mehrfach gefeuert
|
||||||
|
*/
|
||||||
|
initPermanentFunctions: function () {
|
||||||
|
/**
|
||||||
|
* Editor Schließen
|
||||||
|
*/
|
||||||
|
CS.closeElement.on('click', function () {
|
||||||
|
CS.closeEditor();
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Minimieren / Maximieren der Box mit neuen Seiten-Elementen
|
||||||
|
*/
|
||||||
|
CS.newObjectElement.on('click', CS.newObjectMinElement, function (event) {
|
||||||
|
if (!$(event.target).hasClass('glyphicon')) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (CS.newObjectTitleElement.html() !== ' ') {
|
||||||
|
CS.newObjectTitleElement.html(' ');
|
||||||
|
CS.newObjectMinElement.removeClass('glyphicon-chevron-right');
|
||||||
|
CS.newObjectMinElement.addClass('glyphicon-chevron-left');
|
||||||
|
$(this).css({width: 45, height: 42});
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
CS.newObjectTitleElement.html(csEditorLang.newContent.title);
|
||||||
|
CS.newObjectMinElement.removeClass('glyphicon-chevron-left');
|
||||||
|
CS.newObjectMinElement.addClass('glyphicon-chevron-right');
|
||||||
|
$(this).css({width: '', height: ''});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Initialisiert den Editor
|
||||||
|
*/
|
||||||
|
initEditor: function () {
|
||||||
|
CS.initElements();
|
||||||
|
CS.initEvents();
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Initialisiert die jQuery Elemente
|
||||||
|
* zum Bearbeiten und Einfügen neuer Inhalte
|
||||||
|
*/
|
||||||
|
initElements: function () {
|
||||||
|
CS.pageElement = $('.sortable', '#content');
|
||||||
|
CS.editorConfirmElement = $('#csEditorConfirm');
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Elemente des Editor-Layers
|
||||||
|
*/
|
||||||
|
CS.layerElement = $('#csEditorLayer');
|
||||||
|
CS.waitingElement = $('#csEditorWaiting');
|
||||||
|
CS.titleElement = $('#csEditorTitle');
|
||||||
|
CS.closeElement = $('#csEditorLayerClose');
|
||||||
|
CS.contentElement = $('#csEditorContent');
|
||||||
|
CS.editableElement = $('[data-editor]');
|
||||||
|
CS.editableHoverClassName = 'editableHover';
|
||||||
|
CS.sortableElement = $('[data-editor]', '.sortable');
|
||||||
|
CS.editorTitle = CS.titleElement.html();
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Elemente für neue Seiten-Inhalte
|
||||||
|
*/
|
||||||
|
CS.newObjectElement = $('#csEditorPageElements');
|
||||||
|
CS.newObjectTitleElement = $('#csEditorPageElementsTitle', CS.newObjectElement);
|
||||||
|
CS.newObjectMinElement = $('#csEditorPageElementsMin', CS.newObjectElement);
|
||||||
|
CS.newSubLineElement = $('[data-editor="Subline"] h2', CS.newObjectElement);
|
||||||
|
CS.newTextElement = $('[data-editor="Text"] p', CS.newObjectElement);
|
||||||
|
CS.newTextImageElement = $('[data-editor="ImageText"]', CS.newObjectElement);
|
||||||
|
CS.newTextImageTextElement = $('p', CS.newTextImageElement);
|
||||||
|
CS.newTextImageImageElement = $('img', CS.newTextImageElement);
|
||||||
|
CS.newElementsClassName = 'btn btn-default btn-block';
|
||||||
|
CS.newElementsClass = $('.' + CS.newElementsClassName.replace(/ /g, '.'));
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Texte und Daten für neue Seiten-Inhalte
|
||||||
|
*/
|
||||||
|
CS.newObjectTitleElement.html(csEditorLang.newContent.title);
|
||||||
|
CS.newSubLineElement.html(csEditorLang.newContent.subline);
|
||||||
|
CS.newTextElement.html(csEditorLang.newContent.text);
|
||||||
|
CS.newTextImageTextElement.html(csEditorLang.newContent.textImage);
|
||||||
|
CS.newTextImageImageElement.attr('src', csEditorParams.imageDimension.image.standardImage);
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Initialisiert die Events für den Editor
|
||||||
|
* - Bearbeitung
|
||||||
|
* - Sortierung
|
||||||
|
* - Einfügen neuer Inhalte
|
||||||
|
* - Speichern
|
||||||
|
* - Abbrechen
|
||||||
|
* - Vor / Zurück
|
||||||
|
*/
|
||||||
|
initEvents: function () {
|
||||||
|
CS.initIcons();
|
||||||
|
CS.initIconFunctions();
|
||||||
|
CS.initEditorFunctions();
|
||||||
|
CS.initNewElementFunctions();
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Editier-, Sortier- und Lösch-Icons setzen
|
||||||
|
*/
|
||||||
|
initIcons: function () {
|
||||||
|
$('.glyphicon.glyphicon-pencil, .glyphicon.glyphicon-sort, .glyphicon.glyphicon-trash').remove();
|
||||||
|
CS.editableElement.each(function () {
|
||||||
|
if ($(this).parents('#csEditorPageElements').length > 0) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
var style = (this.dataset.editor === 'Headline' || this.dataset.editor === 'Navigation' || this.dataset.editor === 'Subline') ? ' style="margin-top:24px;"' : '';
|
||||||
|
$(this).append('<span' + style + ' class="glyphicon glyphicon-pencil"></span>');
|
||||||
|
});
|
||||||
|
|
||||||
|
if (CS.sortableElement.length > 1) {
|
||||||
|
CS.sortableElement.each(function () {
|
||||||
|
var style = (this.dataset.editor === 'Subline') ? ' style="margin-top:24px;"' : '';
|
||||||
|
$(this).append('<span' + style + ' class="glyphicon glyphicon-sort"></span>');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
CS.sortableElement.each(function () {
|
||||||
|
var style = (this.dataset.editor === 'Subline') ? ' style="margin-top:24px;"' : '';
|
||||||
|
$(this).append('<span' + style + ' class="glyphicon glyphicon-trash"></span>');
|
||||||
|
});
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Funktionalität auf die Icons legen
|
||||||
|
*/
|
||||||
|
initIconFunctions: function () {
|
||||||
|
CS.editorOpenElement = $('.glyphicon-pencil');
|
||||||
|
CS.editorSortElement = $('.glyphicon-sort');
|
||||||
|
CS.editorTrashElement = $('.glyphicon-trash');
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Hover Effekte
|
||||||
|
*/
|
||||||
|
CS.editorOpenElement.on('mouseenter', function () {
|
||||||
|
$(this).parent('[data-editor]').addClass(CS.editableHoverClassName);
|
||||||
|
});
|
||||||
|
|
||||||
|
CS.editorOpenElement.on('mouseleave', function () {
|
||||||
|
$(this).parent('[data-editor]').removeClass(CS.editableHoverClassName);
|
||||||
|
});
|
||||||
|
|
||||||
|
CS.editorSortElement.on('mouseenter', function () {
|
||||||
|
$(this).parent('[data-editor]').addClass(CS.editableHoverClassName);
|
||||||
|
});
|
||||||
|
|
||||||
|
CS.editorSortElement.on('mouseleave', function () {
|
||||||
|
$(this).parent('[data-editor]').removeClass(CS.editableHoverClassName);
|
||||||
|
});
|
||||||
|
|
||||||
|
CS.editorTrashElement.on('mouseenter', function () {
|
||||||
|
$(this).parent('[data-editor]').addClass(CS.editableHoverClassName);
|
||||||
|
});
|
||||||
|
|
||||||
|
CS.editorTrashElement.on('mouseleave', function () {
|
||||||
|
$(this).parent('[data-editor]').removeClass(CS.editableHoverClassName);
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Sortierung der Seiten-Elemente und Einordnen neuer Elemente
|
||||||
|
*/
|
||||||
|
CS.pageElement.sortable({
|
||||||
|
axis: 'y',
|
||||||
|
forcePlaceholderSize: true,
|
||||||
|
handle: '.glyphicon-sort',
|
||||||
|
placeholder: CS.editableHoverClassName,
|
||||||
|
receive: function (event, ui) {
|
||||||
|
CS.preventSortStop = true;
|
||||||
|
ui.helper.removeAttr('style');
|
||||||
|
|
||||||
|
var sortOrder = CS.pageElement.sortable('toArray', {attribute: 'data-element'});
|
||||||
|
var formData = new FormData();
|
||||||
|
formData.append('request', 'insertContent');
|
||||||
|
formData.append('navID', csEditorParams.navID);
|
||||||
|
formData.append('token', csEditorParams.token);
|
||||||
|
formData.append('sortOrder', sortOrder);
|
||||||
|
|
||||||
|
var returnData = CS.sendRequest(formData, true);
|
||||||
|
if (!isNaN(returnData.responseJSON)) {
|
||||||
|
/**
|
||||||
|
* Arbeiten auf Attributen, data-Elemente funktionieren sonst in der stop-Funktion nicht!
|
||||||
|
*/
|
||||||
|
$(ui.helper).attr('data-id', returnData.responseJSON);
|
||||||
|
$(ui.helper).attr('data-element', $(ui.helper).attr('data-editor') + '_' + returnData.responseJSON);
|
||||||
|
|
||||||
|
CS.initEditor();
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
alert('Fehler beim Einfügen des neuen Seiten-Inhalts');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
stop: function () {
|
||||||
|
|
||||||
|
if (CS.preventSortStop === true) {
|
||||||
|
CS.preventSortStop = false;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var sortOrder = CS.pageElement.sortable('toArray', {attribute: 'data-element'});
|
||||||
|
var formData = new FormData();
|
||||||
|
formData.append('request', 'updateContentSort');
|
||||||
|
formData.append('navID', csEditorParams.navID);
|
||||||
|
formData.append('token', csEditorParams.token);
|
||||||
|
formData.append('sortOrder', sortOrder);
|
||||||
|
CS.sendRequest(formData);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Funktionalität im Editor-Layer festlegen
|
||||||
|
*/
|
||||||
|
initEditorFunctions: function () {
|
||||||
|
/**
|
||||||
|
* Editor öffnen
|
||||||
|
*/
|
||||||
|
CS.editorOpenElement.on('click', function () {
|
||||||
|
CS.editorType = $(this).parent('[data-editor]').data('editor');
|
||||||
|
CS.editorTemplate = CS.editorType.toLowerCase() + '.php';
|
||||||
|
CS.editorDataID = $(this).parent('[data-editor]').data('id');
|
||||||
|
CS.editorTitle = CS.titleElement.html();
|
||||||
|
CS.editorName = CS.editorType.toUpperCase();
|
||||||
|
CS.titleElement.html(CS.editorTitle.replace('%%editor%%', CS.editorName));
|
||||||
|
|
||||||
|
if (CS.callEditor() === false) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
CS.waitingElement.show();
|
||||||
|
CS.layerElement.show();
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Dialog vor dem Löschen
|
||||||
|
*/
|
||||||
|
CS.editorConfirmElement.dialog({
|
||||||
|
autoOpen: false,
|
||||||
|
resizable: false,
|
||||||
|
classes: {
|
||||||
|
'ui-dialog': 'panel panel-primary',
|
||||||
|
'ui-dialog-titlebar': 'panel-heading',
|
||||||
|
'ui-dialog-titlebar-close': 'glyphicon glyphicon-remove',
|
||||||
|
'ui-dialog-content': 'panel-body',
|
||||||
|
'ui-dialog-buttonpane': 'panel-footer',
|
||||||
|
},
|
||||||
|
height: 'auto',
|
||||||
|
width: 400,
|
||||||
|
modal: true,
|
||||||
|
closeOnEscape: true,
|
||||||
|
buttons: [
|
||||||
|
{
|
||||||
|
text: csEditorLang.button.delete,
|
||||||
|
click: function () {
|
||||||
|
var formData = new FormData();
|
||||||
|
formData.append('token', csEditorParams.token);
|
||||||
|
formData.append('request', 'deleteContentElement');
|
||||||
|
formData.append('navID', csEditorParams.navID);
|
||||||
|
formData.append('editorType', CS.editorType);
|
||||||
|
formData.append('editorDataID', CS.editorDataID);
|
||||||
|
var returnData = CS.sendRequest(formData, true);
|
||||||
|
if (!isNaN(returnData.responseJSON) && returnData.responseJSON > 0) {
|
||||||
|
$('div[data-element="' + CS.editorType + '_' + CS.editorDataID + '"]').remove();
|
||||||
|
$(this).dialog('close');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: csEditorLang['button']['cancel'],
|
||||||
|
click: function () {
|
||||||
|
$(this).dialog('close');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.ui-icon-alert', CS.editorConfirmElement).addClass('glyphicon glyphicon-alert');
|
||||||
|
$('button', '.ui-dialog-buttonset').addClass('btn btn-default');
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Löschen von Elementen, danach kommt der Dialog
|
||||||
|
*/
|
||||||
|
CS.editorTrashElement.on('click', function () {
|
||||||
|
CS.editorDataID = $(this).parent().data('id');
|
||||||
|
CS.editorType = $(this).parent().data('editor');
|
||||||
|
CS.editorConfirmElement.dialog('open');
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Zur Sicherheit Funktionen von den Handlern entfernen
|
||||||
|
* Ansonsten werden diese Events mehrfach getriggert, wenn neue Seitenelement hinzugefügt werden
|
||||||
|
*/
|
||||||
|
CS.contentElement.off('click', '.formCancel');
|
||||||
|
CS.contentElement.off('click', '.formNext');
|
||||||
|
CS.contentElement.off('click', '.formPrev');
|
||||||
|
CS.contentElement.off('click', '.formSubmit');
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Button zum Absenden der Daten
|
||||||
|
*/
|
||||||
|
CS.contentElement.on('click', '.formSubmit', function () {
|
||||||
|
/**
|
||||||
|
* Update der CKEditor-Instanzen, rückschreiben in die Textareas
|
||||||
|
*/
|
||||||
|
$.each(CKEDITOR.instances, function (key) {
|
||||||
|
CKEDITOR.instances[key].updateElement();
|
||||||
|
});
|
||||||
|
|
||||||
|
var form = document.getElementById('csEditorForm');
|
||||||
|
var formData = new FormData(form);
|
||||||
|
formData.append('token', csEditorParams.token);
|
||||||
|
|
||||||
|
var returnData = CS.sendRequest(formData, true);
|
||||||
|
if (!isNaN(returnData.responseJSON) && returnData.responseJSON > 0) {
|
||||||
|
CS.resetEditor();
|
||||||
|
CS.callEditor();
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
/**
|
||||||
|
* TODO: Fehlermeldung mit Übersetzung
|
||||||
|
*/
|
||||||
|
alert('Fehler beim Speichern der Daten');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Button zum Abbrechen, schließt den Editor
|
||||||
|
*/
|
||||||
|
CS.contentElement.on('click', '.formCancel', function () {
|
||||||
|
CS.closeEditor();
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Weiter, benötigt für Editoren mit mehreren Seiten
|
||||||
|
*/
|
||||||
|
CS.contentElement.on('click', '.formNext', function () {
|
||||||
|
var actualInnerSlider = $(this).parents('.csEditorSliderContent');
|
||||||
|
actualInnerSlider.hide();
|
||||||
|
actualInnerSlider.next('.csEditorSliderContent').show();
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Zurück, benötigt für Editoren mit mehreren Seiten
|
||||||
|
*/
|
||||||
|
CS.contentElement.on('click', '.formPrev', function () {
|
||||||
|
var actualInnerSlider = $(this).parents('.csEditorSliderContent');
|
||||||
|
actualInnerSlider.hide();
|
||||||
|
actualInnerSlider.prev('.csEditorSliderContent').show();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
initNewElementFunctions: function () {
|
||||||
|
/**
|
||||||
|
* Verschiebbarkeit der Box
|
||||||
|
*/
|
||||||
|
CS.newObjectElement.draggable({
|
||||||
|
addClasses: false,
|
||||||
|
handle: CS.newObjectTitleElement,
|
||||||
|
stop: function () {
|
||||||
|
CS.newObjectElement.css({
|
||||||
|
left: 'auto',
|
||||||
|
right: ($(document).innerWidth - CS.newObjectElement.position().left - CS.newObjectElement.innerWidth)
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Hinzufügen neuer Seiten-Inhalte
|
||||||
|
* TODO: Ausblenden nicht vorhandener Neuer Elemente anhand der Konfiguration
|
||||||
|
*/
|
||||||
|
CS.newElementsClass.draggable({
|
||||||
|
connectToSortable: CS.pageElement,
|
||||||
|
helper: 'clone',
|
||||||
|
start: function (event, ui) {
|
||||||
|
ui.helper.removeClass(CS.newElementsClassName);
|
||||||
|
ui.helper.removeClass(CS.editableHoverClassName);
|
||||||
|
$('div', ui.helper).removeClass(CS.editableHoverClassName);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
callEditor: function () {
|
||||||
|
switch (CS.editorType) {
|
||||||
|
case 'Navigation':
|
||||||
|
CS.editor = Navigation;
|
||||||
|
break;
|
||||||
|
|
||||||
|
case 'Headline':
|
||||||
|
CS.editor = Headline;
|
||||||
|
break;
|
||||||
|
|
||||||
|
case 'Subline':
|
||||||
|
CS.editor = Subline;
|
||||||
|
break;
|
||||||
|
|
||||||
|
case 'Text':
|
||||||
|
CS.editor = Text;
|
||||||
|
break;
|
||||||
|
|
||||||
|
case 'ImageText':
|
||||||
|
CS.editor = ImageText;
|
||||||
|
break;
|
||||||
|
|
||||||
|
case 'KeyVisual':
|
||||||
|
CS.editor = KeyVisual;
|
||||||
|
break;
|
||||||
|
|
||||||
|
default:
|
||||||
|
alert('JavaScript Funktionalität ist für diesen Editoren-Typ (' + CS.editorType + ') noch nicht implementiert!');
|
||||||
|
return false;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
if (CS.editor !== null) {
|
||||||
|
CS.fetchHTML();
|
||||||
|
CS.fetchData();
|
||||||
|
CS.editor.fillEditorContent();
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
resetEditor: function () {
|
||||||
|
CS.editor.close();
|
||||||
|
CS.contentElement.html('');
|
||||||
|
|
||||||
|
CS.editorHtml = '';
|
||||||
|
CS.editorData = null;
|
||||||
|
},
|
||||||
|
|
||||||
|
closeEditor: function () {
|
||||||
|
CS.resetEditor();
|
||||||
|
CS.titleElement.html(CS.editorTitle);
|
||||||
|
|
||||||
|
CS.editorTitle = '';
|
||||||
|
CS.editorType = '';
|
||||||
|
CS.editorTemplate = '';
|
||||||
|
CS.editorName = '';
|
||||||
|
CS.editorDataID = 0;
|
||||||
|
CS.editor = null;
|
||||||
|
|
||||||
|
CS.waitingElement.hide();
|
||||||
|
CS.layerElement.hide();
|
||||||
|
location.reload();
|
||||||
|
},
|
||||||
|
|
||||||
|
sendRequest: function (formData, sync) {
|
||||||
|
sync = (sync) ? sync : false;
|
||||||
|
|
||||||
|
return $.ajax({
|
||||||
|
url: csEditorParams.backendUrl,
|
||||||
|
data: formData,
|
||||||
|
dataType: 'json',
|
||||||
|
method: 'post',
|
||||||
|
async: !sync,
|
||||||
|
processData: false,
|
||||||
|
contentType: false,
|
||||||
|
error: function (jqXHR, textStatus, errorThrown) {
|
||||||
|
alert(csEditorLang.error.sendData + '\n' + csEditorLang.error.status + '"' + textStatus + '"\n' + csEditorLang.error.errorMessage + '"' + errorThrown + '"');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
fetchHTML: function () {
|
||||||
|
$.ajax({
|
||||||
|
url: csEditorParams.editorUrl + csEditorParams.editorVersion + '/templates/' + CS.editorTemplate,
|
||||||
|
data: {lang: csEditorParams.sessionLanguage},
|
||||||
|
dataType: 'html',
|
||||||
|
method: 'post',
|
||||||
|
error: function () {
|
||||||
|
alert(csEditorLang.error.template + '\n' + CS.editorTemplate);
|
||||||
|
},
|
||||||
|
success: function (editorHtml) {
|
||||||
|
CS.editorHtml = editorHtml;
|
||||||
|
CS.contentElement.html(editorHtml);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
fetchData: function () {
|
||||||
|
$.ajax({
|
||||||
|
url: csEditorParams.backendUrl,
|
||||||
|
data: {token: csEditorParams.token, request: 'get' + CS.editorType, ID: CS.editorDataID},
|
||||||
|
dataType: 'json',
|
||||||
|
method: 'post',
|
||||||
|
error: function (jqXHR, textStatus, errorThrown) {
|
||||||
|
alert(csEditorLang.error.fetchData + '\n' + csEditorLang.error.status + '"' + textStatus + '"\n' + csEditorLang.error.errorMessage + '"' + errorThrown + '"');
|
||||||
|
},
|
||||||
|
success: function (editorData) {
|
||||||
|
CS.editorData = editorData;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
$(document).ready(function () {
|
||||||
|
var body = $('body');
|
||||||
|
body.prepend(csEditorTemplate);
|
||||||
|
body.append(csEditorPageElements);
|
||||||
|
CS.initEditor();
|
||||||
|
CS.initPermanentFunctions();
|
||||||
|
});
|
||||||
1341
js/editor.js
1341
js/editor.js
File diff suppressed because it is too large
Load Diff
75
js/headlineEditor.js
Normal file
75
js/headlineEditor.js
Normal file
@@ -0,0 +1,75 @@
|
|||||||
|
/**
|
||||||
|
* Headline-Editor
|
||||||
|
* Stellt die Funktionalität für die Bearbeitung der Überschriften zur Verfügung
|
||||||
|
*
|
||||||
|
* Created by CS medien- & kommunikationssysteme.
|
||||||
|
* @author Christian Steinle
|
||||||
|
* @date 11.10.2016
|
||||||
|
*
|
||||||
|
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
||||||
|
*/
|
||||||
|
|
||||||
|
var Headline = {
|
||||||
|
headlineEditor: null,
|
||||||
|
|
||||||
|
headlineElement: null,
|
||||||
|
|
||||||
|
init: function() {
|
||||||
|
Headline.initElements();
|
||||||
|
},
|
||||||
|
|
||||||
|
initElements: function() {
|
||||||
|
Headline.headlineElement = $('#navHeadline');
|
||||||
|
},
|
||||||
|
|
||||||
|
fillEditorContent: function () {
|
||||||
|
if (CS.editorData === null || CS.editorHtml === '') {
|
||||||
|
window.setTimeout('Headline.fillEditorContent()', 50);
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
Headline.init();
|
||||||
|
|
||||||
|
CS.editorData.navHeadline = '<h1>' + CS.editorData.navHeadline + '</h1>';
|
||||||
|
$.each(CS.editorData, function (key, value) {
|
||||||
|
$("input[type='text'][name='" + key + "'], input[type='hidden'][name='" + key + "'], select[name='" + key + "'], textarea[name='" + key + "']", CS.contentElement).val(value);
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#navName').html(CS.editorData.navName);
|
||||||
|
|
||||||
|
Headline.headlineEditor = Headline.headlineElement.ckeditor({
|
||||||
|
extraPlugins: 'divarea',
|
||||||
|
height: '70px',
|
||||||
|
removeButtons: 'Redo,Font,FontSize',
|
||||||
|
removePlugins: 'elementspath',
|
||||||
|
resize_enabled: false,
|
||||||
|
stylesSet: [
|
||||||
|
{name: 'small', element: 'small'}
|
||||||
|
],
|
||||||
|
toolbarGroups: [
|
||||||
|
{name: 'clipboard', groups: ['clipboard', 'undo']},
|
||||||
|
{name: 'styles', groups: ['styles']}
|
||||||
|
]
|
||||||
|
}).editor;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Entfernen des Format-DropDowns über Instanziierung nicht möglich, da die Styles der Überschrift sonst nicht angewendet wird
|
||||||
|
*/
|
||||||
|
Headline.headlineElement.ckeditor().on('instanceReady.ckeditor', function() {
|
||||||
|
$('.cke_combo.cke_combo__format.cke_combo_off').hide();
|
||||||
|
});
|
||||||
|
|
||||||
|
Headline.headlineEditor.on('key', function (event) {
|
||||||
|
if (event.data.keyCode === 13) {
|
||||||
|
event.cancel();
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
close: function () {
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
306
js/imageTextEditor.js
Normal file
306
js/imageTextEditor.js
Normal file
@@ -0,0 +1,306 @@
|
|||||||
|
/**
|
||||||
|
* ImageText-Editor
|
||||||
|
* Stellt die Funktionalität für die Bearbeitung des zusammengesetzten Editors Bild + Text zur Verfügung
|
||||||
|
*
|
||||||
|
* Created by CS medien- & kommunikationssysteme.
|
||||||
|
* @author Christian Steinle
|
||||||
|
* @date 13.10.2016
|
||||||
|
*
|
||||||
|
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
||||||
|
*/
|
||||||
|
|
||||||
|
var ImageText = {
|
||||||
|
textEditor: null,
|
||||||
|
editorImage: null,
|
||||||
|
|
||||||
|
textInput: null,
|
||||||
|
nameInput: null,
|
||||||
|
extensionInput: null,
|
||||||
|
origNameInput: null,
|
||||||
|
titleInput: null,
|
||||||
|
formatInput: null,
|
||||||
|
topInput: null,
|
||||||
|
leftInput: null,
|
||||||
|
heightInput: null,
|
||||||
|
widthInput: null,
|
||||||
|
uploadFileInput: null,
|
||||||
|
|
||||||
|
placeHolderElement: null,
|
||||||
|
imageElement: null,
|
||||||
|
previewElement: null,
|
||||||
|
coverElement: null,
|
||||||
|
coverTopElement: null,
|
||||||
|
coverRightElement: null,
|
||||||
|
coverBottomElement: null,
|
||||||
|
coverLeftElement: null,
|
||||||
|
|
||||||
|
previewWidth: 0,
|
||||||
|
previewHeight: 0,
|
||||||
|
imageWidth: 0,
|
||||||
|
imageHeight: 0,
|
||||||
|
imageFormat: 0,
|
||||||
|
coverTop: 0,
|
||||||
|
coverLeft: 0,
|
||||||
|
coverWidth: 0,
|
||||||
|
coverHeight: 0,
|
||||||
|
minWidth: 0,
|
||||||
|
minHeight: 0,
|
||||||
|
|
||||||
|
uploadFileName: '',
|
||||||
|
uploadFileExtension: '',
|
||||||
|
|
||||||
|
init: function () {
|
||||||
|
ImageText.initElements();
|
||||||
|
},
|
||||||
|
|
||||||
|
initElements: function () {
|
||||||
|
ImageText.textInput = $('#text');
|
||||||
|
ImageText.nameInput = $('#imageName');
|
||||||
|
ImageText.extensionInput = $('#imageExtension');
|
||||||
|
ImageText.origNameInput = $('#imageOrigName');
|
||||||
|
ImageText.titleInput = $('#imageTitle');
|
||||||
|
ImageText.formatInput = $('#imageFormat');
|
||||||
|
ImageText.topInput = $('#imageTop');
|
||||||
|
ImageText.leftInput = $('#imageLeft');
|
||||||
|
ImageText.heightInput = $('#imageHeight');
|
||||||
|
ImageText.widthInput = $('#imageWidth');
|
||||||
|
ImageText.uploadFileInput = $('#changeUploadFile');
|
||||||
|
|
||||||
|
ImageText.placeHolderElement = $('#csEditorImagePlaceholder');
|
||||||
|
ImageText.imageElement = $('#csEditorImage');
|
||||||
|
ImageText.previewElement = $('#csEditorImagePreview');
|
||||||
|
ImageText.coverElement = $('#csEditorImageCover');
|
||||||
|
ImageText.coverTopElement = $('#csEditorCoverTop');
|
||||||
|
ImageText.coverRightElement = $('#csEditorCoverRight');
|
||||||
|
ImageText.coverBottomElement = $('#csEditorCoverBottom');
|
||||||
|
ImageText.coverLeftElement = $('#csEditorCoverLeft');
|
||||||
|
},
|
||||||
|
|
||||||
|
fillEditorContent: function () {
|
||||||
|
if (CS.editorData === null || CS.editorHtml === '') {
|
||||||
|
window.setTimeout('ImageText.fillEditorContent()', 50);
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
ImageText.init();
|
||||||
|
|
||||||
|
$('#navID').val(csEditorParams.navID);
|
||||||
|
CS.editorData.text = '<p>' + CS.editorData.text + '</p>';
|
||||||
|
$.each(CS.editorData, function (key, value) {
|
||||||
|
$("input[type='text'][name='" + key + "'], input[type='hidden'][name='" + key + "'], select[name='" + key + "'], textarea[name='" + key + "']", CS.contentElement).val(value);
|
||||||
|
});
|
||||||
|
|
||||||
|
ImageText.imageFormat = CS.editorData.imageWidth / CS.editorData.imageHeight;
|
||||||
|
ImageText.setFormatInput();
|
||||||
|
|
||||||
|
ImageText.formatInput.on('click', function () {
|
||||||
|
$(this).data('current', $(this).val());
|
||||||
|
});
|
||||||
|
|
||||||
|
ImageText.formatInput.on('change', function () {
|
||||||
|
var selectedFormat = $(this).val();
|
||||||
|
ImageText.setImageFormat(selectedFormat);
|
||||||
|
});
|
||||||
|
|
||||||
|
ImageText.textEditor = ImageText.textInput.ckeditor({
|
||||||
|
enterMode: CKEDITOR.ENTER_BR,
|
||||||
|
extraPlugins: 'divarea',
|
||||||
|
height: '240px',
|
||||||
|
removeButtons: 'Redo,Font,FontSize',
|
||||||
|
removePlugins: 'elementspath',
|
||||||
|
toolbarGroups: [
|
||||||
|
{name: 'clipboard', groups: ['clipboard', 'undo']},
|
||||||
|
{name: 'editing', groups: ['find', 'selection', 'spellchecker']},
|
||||||
|
{name: 'basicstyles', groups: ['basicstyles', 'cleanup']},
|
||||||
|
{name: 'paragraph', groups: ['list']},
|
||||||
|
{name: 'links'}
|
||||||
|
]
|
||||||
|
}).editor;
|
||||||
|
|
||||||
|
ImageText.uploadFileInput.on('change', function (event) {
|
||||||
|
var file = event.currentTarget.files[0];
|
||||||
|
if ($.inArray(file.type, csEditorParams.imageTypes) === -1) {
|
||||||
|
alert('Wrong file type');
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
ImageText.imageFormat = 3 / 2;
|
||||||
|
ImageText.setFormatInput();
|
||||||
|
|
||||||
|
ImageText.uploadFileExtension = csEditorParams.fileExtensions[file.type];
|
||||||
|
var nameParts = file.name.split('.');
|
||||||
|
if (nameParts.length > 1) {
|
||||||
|
nameParts.pop();
|
||||||
|
}
|
||||||
|
ImageText.uploadFileName = nameParts.join('.');
|
||||||
|
|
||||||
|
var reader = new FileReader();
|
||||||
|
reader.onloadend = function () {
|
||||||
|
ImageText.editorImage.src = reader.result;
|
||||||
|
};
|
||||||
|
reader.readAsDataURL(file);
|
||||||
|
});
|
||||||
|
|
||||||
|
ImageText.imageElement.attr('src', csEditorParams.mediaPrefix + csEditorParams.navID + '/' + CS.editorData.imageName + '.' + CS.editorData.imageExtension);
|
||||||
|
|
||||||
|
ImageText.editorImage = new Image();
|
||||||
|
ImageText.editorImage.onload = function () {
|
||||||
|
ImageText.imageWidth = ImageText.editorImage.naturalWidth;
|
||||||
|
ImageText.imageHeight = ImageText.editorImage.naturalHeight;
|
||||||
|
ImageText.previewWidth = csEditorParams.imageDimension.image.width;
|
||||||
|
ImageText.previewHeight = ImageText.previewWidth * ImageText.imageHeight / ImageText.imageWidth;
|
||||||
|
ImageText.coverLeft = parseFloat(CS.editorData.imageLeft);
|
||||||
|
ImageText.coverTop = parseFloat(CS.editorData.imageTop);
|
||||||
|
ImageText.coverWidth = parseFloat(CS.editorData.imageWidth);
|
||||||
|
ImageText.coverHeight = parseFloat(CS.editorData.imageHeight);
|
||||||
|
ImageText.minWidth = ImageText.previewWidth * ImageText.previewWidth / csEditorParams.imageDimension.orig.width;
|
||||||
|
ImageText.minHeight = ImageText.minWidth / ImageText.imageFormat;
|
||||||
|
|
||||||
|
if (ImageText.previewWidth > ImageText.imageWidth || ImageText.previewWidth / ImageText.imageFormat > ImageText.imageHeight) {
|
||||||
|
alert(csEditorLang.error.wrongImageDimension.replace('%width%', ImageText.previewWidth).replace('%height%', ImageText.previewWidth / ImageText.imageFormat));
|
||||||
|
ImageText.uploadFileExtension = '';
|
||||||
|
ImageText.uploadFileName = '';
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (ImageText.uploadFileName !== '') {
|
||||||
|
ImageText.nameInput.val(ImageText.uploadFileName);
|
||||||
|
ImageText.extensionInput.val(ImageText.uploadFileExtension);
|
||||||
|
ImageText.origNameInput.val(ImageText.uploadFileName);
|
||||||
|
ImageText.titleInput.val(ImageText.uploadFileName);
|
||||||
|
}
|
||||||
|
|
||||||
|
ImageText.previewElement.attr('src', ImageText.editorImage.src);
|
||||||
|
ImageText.setCover();
|
||||||
|
ImageText.setResizable();
|
||||||
|
ImageText.setDraggable();
|
||||||
|
};
|
||||||
|
ImageText.editorImage.src = csEditorParams.mediaPrefix + csEditorParams.navID + '/' + CS.editorData.imageName + '_orig.' + CS.editorData.imageExtension;
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
close: function () {
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
setCover: function () {
|
||||||
|
if (ImageText.coverHeight > ImageText.previewHeight) {
|
||||||
|
ImageText.coverHeight = ImageText.previewHeight;
|
||||||
|
ImageText.coverWidth = ImageText.coverHeight * ImageText.imageFormat;
|
||||||
|
}
|
||||||
|
|
||||||
|
ImageText.placeHolderElement.css({width: ImageText.previewWidth, height: ImageText.previewHeight});
|
||||||
|
ImageText.coverElement.css({
|
||||||
|
left: ImageText.coverLeft + 'px',
|
||||||
|
top: ImageText.coverTop + 'px',
|
||||||
|
width: ImageText.coverWidth,
|
||||||
|
height: ImageText.coverHeight
|
||||||
|
});
|
||||||
|
ImageText.coverTopElement.css({
|
||||||
|
left: 0,
|
||||||
|
top: 0,
|
||||||
|
width: ImageText.previewWidth,
|
||||||
|
height: ImageText.coverTop
|
||||||
|
});
|
||||||
|
ImageText.coverRightElement.css({
|
||||||
|
right: 0,
|
||||||
|
top: ImageText.coverTop + 'px',
|
||||||
|
width: ImageText.previewWidth - ImageText.coverLeft - ImageText.coverWidth,
|
||||||
|
height: ImageText.coverHeight
|
||||||
|
});
|
||||||
|
ImageText.coverBottomElement.css({
|
||||||
|
left: 0,
|
||||||
|
bottom: 0,
|
||||||
|
width: ImageText.previewWidth,
|
||||||
|
height: ImageText.previewHeight - ImageText.coverTop - ImageText.coverHeight
|
||||||
|
});
|
||||||
|
ImageText.coverLeftElement.css({
|
||||||
|
left: 0,
|
||||||
|
top: ImageText.coverTop + 'px',
|
||||||
|
width: ImageText.coverLeft,
|
||||||
|
height: ImageText.coverHeight
|
||||||
|
});
|
||||||
|
|
||||||
|
ImageText.topInput.val(ImageText.coverTop);
|
||||||
|
ImageText.leftInput.val(ImageText.coverLeft);
|
||||||
|
ImageText.heightInput.val(ImageText.coverHeight);
|
||||||
|
ImageText.widthInput.val(ImageText.coverWidth);
|
||||||
|
},
|
||||||
|
|
||||||
|
setFormatInput: function () {
|
||||||
|
if (ImageText.imageFormat < 1) {
|
||||||
|
ImageText.formatInput.val('portrait');
|
||||||
|
}
|
||||||
|
else if (ImageText.imageFormat === 1) {
|
||||||
|
ImageText.formatInput.val('square');
|
||||||
|
}
|
||||||
|
else if (ImageText.imageFormat > 1) {
|
||||||
|
ImageText.formatInput.val('landscape');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
setResizable: function () {
|
||||||
|
ImageText.coverElement.resizable({
|
||||||
|
aspectRatio: false,
|
||||||
|
containment: ImageText.placeHolderElement,
|
||||||
|
handles: 'se',
|
||||||
|
minWidth: ImageText.minWidth,
|
||||||
|
create: function () {
|
||||||
|
if (ImageText.coverWidth < ImageText.minWidth) {
|
||||||
|
ImageText.coverWidth = ImageText.minWidth;
|
||||||
|
ImageText.coverHeight = ImageText.previewHeight * ImageText.previewHeight / ImageText.previewWidth;
|
||||||
|
ImageText.coverLeft = Math.min(ImageText.coverLeft, (ImageText.previewWidth - ImageText.coverWidth));
|
||||||
|
ImageText.coverTop = Math.min(ImageText.coverTop, (ImageText.previewHeight - ImageText.coverHeight));
|
||||||
|
}
|
||||||
|
ImageText.setCover();
|
||||||
|
},
|
||||||
|
resize: function (event, ui) {
|
||||||
|
ui.size.height = ui.size.width * ImageText.coverHeight / ImageText.coverWidth;
|
||||||
|
if (ui.position.top + ui.size.height > ImageText.previewHeight) {
|
||||||
|
ui.size.height = ImageText.previewHeight - ui.position.top;
|
||||||
|
ui.size.width = ui.size.height * ImageText.imageFormat;
|
||||||
|
}
|
||||||
|
ImageText.coverWidth = ui.size.width;
|
||||||
|
ImageText.coverHeight = ui.size.height;
|
||||||
|
ImageText.setCover();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
setDraggable: function () {
|
||||||
|
ImageText.coverElement.draggable({
|
||||||
|
containment: ImageText.placeHolderElement,
|
||||||
|
cursor: 'crosshair',
|
||||||
|
drag: function (event, ui) {
|
||||||
|
ImageText.coverLeft = ui.position.left;
|
||||||
|
ImageText.coverTop = ui.position.top;
|
||||||
|
ImageText.setCover();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
setImageFormat: function (selectedFormat) {
|
||||||
|
var tempFormat;
|
||||||
|
switch (selectedFormat) {
|
||||||
|
case 'portrait':
|
||||||
|
tempFormat = 2 / 3;
|
||||||
|
break;
|
||||||
|
case 'square':
|
||||||
|
tempFormat = 1;
|
||||||
|
break;
|
||||||
|
case 'landscape':
|
||||||
|
tempFormat = 3 / 2;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (ImageText.imageHeight < ImageText.minWidth / tempFormat) {
|
||||||
|
alert(csEditorLang.error.wrongImageDimension.replace('%width%', ImageText.previewWidth).replace('%height%', ImageText.previewWidth / tempFormat));
|
||||||
|
ImageText.formatInput.val(ImageText.formatInput.data('current'));
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
ImageText.imageFormat = tempFormat;
|
||||||
|
ImageText.minHeight = ImageText.minWidth / ImageText.imageFormat;
|
||||||
|
ImageText.coverHeight = ImageText.coverWidth / ImageText.imageFormat;
|
||||||
|
ImageText.setCover();
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
347
js/keyVisualEditor.js
Normal file
347
js/keyVisualEditor.js
Normal file
@@ -0,0 +1,347 @@
|
|||||||
|
/**
|
||||||
|
* KeyVisual-Editor
|
||||||
|
* Stellt die Funktionalität für die Bearbeitung des KeyVisual-Bereichs zur Verfügung
|
||||||
|
*
|
||||||
|
* Created by CS medien- & kommunikationssysteme.
|
||||||
|
* @author Christian Steinle
|
||||||
|
* @date 13.12.2016
|
||||||
|
*
|
||||||
|
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
||||||
|
*/
|
||||||
|
|
||||||
|
var KeyVisual = {
|
||||||
|
type: '',
|
||||||
|
editorImages: null,
|
||||||
|
editorImage: null,
|
||||||
|
imageTypes: null,
|
||||||
|
imageParams: null,
|
||||||
|
origParams: null,
|
||||||
|
thumbParams: null,
|
||||||
|
fileExtension: null,
|
||||||
|
uploadFileName: '',
|
||||||
|
mediaPath: '',
|
||||||
|
chosenImageID: 0,
|
||||||
|
|
||||||
|
nameInput: null,
|
||||||
|
extensionInput: null,
|
||||||
|
origNameInput: null,
|
||||||
|
titleInput: null,
|
||||||
|
topInput: null,
|
||||||
|
leftInput: null,
|
||||||
|
heightInput: null,
|
||||||
|
widthInput: null,
|
||||||
|
uploadFileInput: null,
|
||||||
|
requestInput: null,
|
||||||
|
|
||||||
|
thumbElement: null,
|
||||||
|
typeChooser: null,
|
||||||
|
placeHolderElement: null,
|
||||||
|
imageElement: null,
|
||||||
|
previewElement: null,
|
||||||
|
coverElement: null,
|
||||||
|
coverTopElement: null,
|
||||||
|
coverRightElement: null,
|
||||||
|
coverBottomElement: null,
|
||||||
|
coverLeftElement: null,
|
||||||
|
|
||||||
|
previewWidth: 0,
|
||||||
|
previewHeight: 0,
|
||||||
|
imageWidth: 0,
|
||||||
|
imageHeight: 0,
|
||||||
|
imageFormat: 0,
|
||||||
|
coverTop: 0,
|
||||||
|
coverLeft: 0,
|
||||||
|
coverWidth: 0,
|
||||||
|
coverHeight: 0,
|
||||||
|
minWidth: 0,
|
||||||
|
minHeight: 0,
|
||||||
|
placeHolderWidth: 0,
|
||||||
|
editorScale: 1,
|
||||||
|
|
||||||
|
init: function () {
|
||||||
|
KeyVisual.initElements();
|
||||||
|
KeyVisual.initVariables();
|
||||||
|
KeyVisual.initFunctions();
|
||||||
|
},
|
||||||
|
|
||||||
|
initElements: function () {
|
||||||
|
KeyVisual.thumbElement = $('#csEditorThumb');
|
||||||
|
KeyVisual.typeChooser = $('#Type');
|
||||||
|
KeyVisual.nameInput = $('#imageName');
|
||||||
|
KeyVisual.extensionInput = $('#imageExtension');
|
||||||
|
KeyVisual.origNameInput = $('#imageOrigName');
|
||||||
|
KeyVisual.titleInput = $('#imageTitle');
|
||||||
|
KeyVisual.placeHolderElement = $('#csEditorImagePlaceholder');
|
||||||
|
KeyVisual.imageElement = $('#csEditorImage');
|
||||||
|
KeyVisual.previewElement = $('#csEditorImagePreview');
|
||||||
|
KeyVisual.coverElement = $('#csEditorImageCover');
|
||||||
|
KeyVisual.coverTopElement = $('#csEditorCoverTop');
|
||||||
|
KeyVisual.coverRightElement = $('#csEditorCoverRight');
|
||||||
|
KeyVisual.coverBottomElement = $('#csEditorCoverBottom');
|
||||||
|
KeyVisual.coverLeftElement = $('#csEditorCoverLeft');
|
||||||
|
|
||||||
|
KeyVisual.topInput = $('#imageTop');
|
||||||
|
KeyVisual.leftInput = $('#imageLeft');
|
||||||
|
KeyVisual.heightInput = $('#imageHeight');
|
||||||
|
KeyVisual.widthInput = $('#imageWidth');
|
||||||
|
KeyVisual.uploadFileInput = $('#changeUploadFile');
|
||||||
|
KeyVisual.requestInput = $('#request');
|
||||||
|
},
|
||||||
|
|
||||||
|
initVariables: function () {
|
||||||
|
KeyVisual.type = CS.editorData.Type;
|
||||||
|
KeyVisual.editorImages = CS.editorData.images;
|
||||||
|
KeyVisual.imageParams = csEditorParams.imageDimension.keyVisual;
|
||||||
|
KeyVisual.origParams = csEditorParams.imageDimension.orig;
|
||||||
|
KeyVisual.thumbParams = csEditorParams.imageDimension.thumb;
|
||||||
|
KeyVisual.fileExtension = csEditorParams.fileExtensions;
|
||||||
|
KeyVisual.mediaPath = csEditorParams.mediaPrefix + csEditorParams.navID + '/';
|
||||||
|
KeyVisual.chosenImageID = CS.editorData.IDs[0];
|
||||||
|
KeyVisual.imageFormat = KeyVisual.imageParams.width / KeyVisual.imageParams.height;
|
||||||
|
KeyVisual.editorImages[0] = {};
|
||||||
|
$.each(KeyVisual.editorImages[KeyVisual.chosenImageID], function(key, value) {
|
||||||
|
KeyVisual.editorImages[0][key] = '0';
|
||||||
|
});
|
||||||
|
$('#navID').val(csEditorParams.navID);
|
||||||
|
},
|
||||||
|
|
||||||
|
initFunctions: function () {
|
||||||
|
KeyVisual.typeChooser.on('change', function () {
|
||||||
|
KeyVisual.type = $(this).val();
|
||||||
|
KeyVisual.showElementsForType();
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
fillEditorContent: function () {
|
||||||
|
if (CS.editorData === null || CS.editorHtml === '') {
|
||||||
|
window.setTimeout('KeyVisual.fillEditorContent()', 50);
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
KeyVisual.init();
|
||||||
|
KeyVisual.fillThumbs();
|
||||||
|
|
||||||
|
$.each(CS.editorData, function (key, value) {
|
||||||
|
$("input[type='text'][name='" + key + "'], input[type='hidden'][name='" + key + "'], select[name='" + key + "'], textarea[name='" + key + "']", CS.contentElement).val(value);
|
||||||
|
});
|
||||||
|
|
||||||
|
KeyVisual.uploadFileInput.on('change', function (event) {
|
||||||
|
var file = event.currentTarget.files[0];
|
||||||
|
if ($.inArray(file.type, csEditorParams.imageTypes) === -1) {
|
||||||
|
alert('Wrong file type');
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
KeyVisual.uploadFileExtension = csEditorParams.fileExtensions[file.type];
|
||||||
|
var nameParts = file.name.split('.');
|
||||||
|
if (nameParts.length > 1) {
|
||||||
|
nameParts.pop();
|
||||||
|
}
|
||||||
|
KeyVisual.uploadFileName = nameParts.join('.');
|
||||||
|
|
||||||
|
var reader = new FileReader();
|
||||||
|
reader.onloadend = function () {
|
||||||
|
KeyVisual.editorImage.src = reader.result;
|
||||||
|
};
|
||||||
|
reader.readAsDataURL(file);
|
||||||
|
});
|
||||||
|
|
||||||
|
KeyVisual.imageElement.attr('src', csEditorParams.mediaPrefix + csEditorParams.navID + '/' + CS.editorData.imageName + '.' + CS.editorData.imageExtension);
|
||||||
|
|
||||||
|
KeyVisual.editorImage = new Image();
|
||||||
|
KeyVisual.editorImage.onload = function () {
|
||||||
|
KeyVisual.placeHolderWidth = KeyVisual.placeHolderElement.innerWidth();
|
||||||
|
KeyVisual.editorScale = csEditorParams.imageDimension.keyVisual.width / KeyVisual.placeHolderWidth;
|
||||||
|
|
||||||
|
KeyVisual.imageWidth = KeyVisual.editorImage.naturalWidth;
|
||||||
|
KeyVisual.imageHeight = KeyVisual.editorImage.naturalHeight;
|
||||||
|
KeyVisual.previewWidth = KeyVisual.placeHolderWidth;
|
||||||
|
KeyVisual.previewHeight = KeyVisual.placeHolderWidth * KeyVisual.imageHeight / KeyVisual.imageWidth;
|
||||||
|
|
||||||
|
KeyVisual.coverLeft = parseFloat(KeyVisual.editorImages[KeyVisual.chosenImageID].imageLeft) / KeyVisual.editorScale;
|
||||||
|
KeyVisual.coverTop = parseFloat(KeyVisual.editorImages[KeyVisual.chosenImageID].imageTop) / KeyVisual.editorScale;
|
||||||
|
KeyVisual.coverWidth = parseFloat(KeyVisual.editorImages[KeyVisual.chosenImageID].imageWidth) / KeyVisual.editorScale;
|
||||||
|
KeyVisual.coverHeight = parseFloat(KeyVisual.editorImages[KeyVisual.chosenImageID].imageHeight) / KeyVisual.editorScale;
|
||||||
|
KeyVisual.minWidth = KeyVisual.previewWidth * csEditorParams.imageDimension.keyVisual.width / csEditorParams.imageDimension.orig.width;
|
||||||
|
KeyVisual.minHeight = KeyVisual.minWidth * csEditorParams.imageDimension.keyVisual.height / csEditorParams.imageDimension.keyVisual.width;
|
||||||
|
|
||||||
|
if (KeyVisual.previewWidth > KeyVisual.imageWidth || KeyVisual.previewHeight > KeyVisual.imageHeight) {
|
||||||
|
alert(csEditorLang.error.wrongImageDimension.replace('%width%', csEditorParams.imageDimension.keyVisual.width).replace('%height%', csEditorParams.imageDimension.keyVisual.height));
|
||||||
|
KeyVisual.uploadFileExtension = '';
|
||||||
|
KeyVisual.uploadFileName = '';
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (KeyVisual.uploadFileName !== '') {
|
||||||
|
KeyVisual.nameInput.val(KeyVisual.uploadFileName);
|
||||||
|
KeyVisual.extensionInput.val(KeyVisual.uploadFileExtension);
|
||||||
|
KeyVisual.origNameInput.val(KeyVisual.uploadFileName);
|
||||||
|
KeyVisual.titleInput.val(KeyVisual.uploadFileName);
|
||||||
|
}
|
||||||
|
|
||||||
|
KeyVisual.previewElement.attr('src', KeyVisual.editorImage.src);
|
||||||
|
KeyVisual.setCover();
|
||||||
|
KeyVisual.setResizable();
|
||||||
|
KeyVisual.setDraggable();
|
||||||
|
};
|
||||||
|
},
|
||||||
|
|
||||||
|
fillThumbs: function () {
|
||||||
|
$.each(KeyVisual.editorImages, function (key, value) {
|
||||||
|
if (key === '0') {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
KeyVisual.thumbElement.append('<img onclick="KeyVisual.chosenImageID = ' + key + '; KeyVisual.fillImageEditArea();" class="formNext" src="' + KeyVisual.mediaPath + value.imageName + '_thumb.' + value.imageExtension + '" width="' + KeyVisual.thumbParams.width + '"/>');
|
||||||
|
});
|
||||||
|
KeyVisual.thumbElement.append('<img onclick="KeyVisual.chosenImageID = 0; KeyVisual.fillImageEditArea();" class="formNext" src="' + KeyVisual.imageParams.standardImage + '" width="' + KeyVisual.thumbParams.width + '"/>');
|
||||||
|
|
||||||
|
KeyVisual.showElementsForType();
|
||||||
|
},
|
||||||
|
|
||||||
|
fillImageEditArea: function () {
|
||||||
|
if (KeyVisual.chosenImageID > 0) {
|
||||||
|
KeyVisual.requestInput.val('updateImage');
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
KeyVisual.requestInput.val('appendKeyVisual');
|
||||||
|
}
|
||||||
|
|
||||||
|
var image = KeyVisual.editorImages[KeyVisual.chosenImageID];
|
||||||
|
$.each(image, function (key, value) {
|
||||||
|
$("input[type='text'][name='" + key + "'], input[type='hidden'][name='" + key + "'], select[name='" + key + "'], textarea[name='" + key + "']", CS.contentElement).val(value);
|
||||||
|
});
|
||||||
|
|
||||||
|
KeyVisual.editorImage.src = csEditorParams.mediaPrefix + csEditorParams.navID + '/' + image.imageName + '_orig.' + image.imageExtension;
|
||||||
|
},
|
||||||
|
|
||||||
|
showForSingle: function () {
|
||||||
|
$('img:not(:first)', KeyVisual.thumbElement).hide();
|
||||||
|
$('.kenburns').hide();
|
||||||
|
$('select', '.kenburns').prop('disabled', true);
|
||||||
|
},
|
||||||
|
|
||||||
|
showForKenburns: function () {
|
||||||
|
KeyVisual.showForMultiple();
|
||||||
|
$('.kenburns').show();
|
||||||
|
$('select', '.kenburns').prop('disabled', false);
|
||||||
|
},
|
||||||
|
|
||||||
|
showForSlider: function () {
|
||||||
|
KeyVisual.showForMultiple();
|
||||||
|
$('.kenburns').hide();
|
||||||
|
$('select', '.kenburns').prop('disabled', true);
|
||||||
|
},
|
||||||
|
|
||||||
|
showForMultiple: function () {
|
||||||
|
$('img', KeyVisual.thumbElement).show();
|
||||||
|
},
|
||||||
|
|
||||||
|
showElementsForType: function () {
|
||||||
|
switch (KeyVisual.type) {
|
||||||
|
case 'Single':
|
||||||
|
KeyVisual.showForSingle();
|
||||||
|
break;
|
||||||
|
case 'Kenburns':
|
||||||
|
KeyVisual.showForKenburns();
|
||||||
|
break;
|
||||||
|
case 'Slider':
|
||||||
|
KeyVisual.showForSlider();
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
setCover: function () {
|
||||||
|
if (KeyVisual.coverHeight > KeyVisual.previewHeight) {
|
||||||
|
KeyVisual.coverHeight = KeyVisual.previewHeight;
|
||||||
|
KeyVisual.coverWidth = KeyVisual.coverHeight * KeyVisual.imageFormat;
|
||||||
|
}
|
||||||
|
|
||||||
|
KeyVisual.placeHolderElement.css({
|
||||||
|
width: KeyVisual.placeHolderWidth,
|
||||||
|
height: KeyVisual.placeHolderWidth * KeyVisual.editorImage.naturalHeight / KeyVisual.editorImage.naturalWidth
|
||||||
|
});
|
||||||
|
KeyVisual.coverElement.css({
|
||||||
|
left: KeyVisual.coverLeft + 'px',
|
||||||
|
top: KeyVisual.coverTop + 'px',
|
||||||
|
width: KeyVisual.coverWidth,
|
||||||
|
height: KeyVisual.coverHeight
|
||||||
|
});
|
||||||
|
KeyVisual.coverTopElement.css({
|
||||||
|
left: 0,
|
||||||
|
top: 0,
|
||||||
|
width: KeyVisual.previewWidth,
|
||||||
|
height: KeyVisual.coverTop
|
||||||
|
});
|
||||||
|
KeyVisual.coverRightElement.css({
|
||||||
|
right: 0,
|
||||||
|
top: KeyVisual.coverTop + 'px',
|
||||||
|
width: KeyVisual.previewWidth - KeyVisual.coverLeft - KeyVisual.coverWidth,
|
||||||
|
height: KeyVisual.coverHeight
|
||||||
|
});
|
||||||
|
KeyVisual.coverBottomElement.css({
|
||||||
|
left: 0,
|
||||||
|
bottom: 0,
|
||||||
|
width: KeyVisual.previewWidth,
|
||||||
|
height: KeyVisual.previewHeight - KeyVisual.coverTop - KeyVisual.coverHeight
|
||||||
|
});
|
||||||
|
KeyVisual.coverLeftElement.css({
|
||||||
|
left: 0,
|
||||||
|
top: KeyVisual.coverTop + 'px',
|
||||||
|
width: KeyVisual.coverLeft,
|
||||||
|
height: KeyVisual.coverHeight
|
||||||
|
});
|
||||||
|
|
||||||
|
KeyVisual.topInput.val(KeyVisual.coverTop * KeyVisual.editorScale);
|
||||||
|
KeyVisual.leftInput.val(KeyVisual.coverLeft * KeyVisual.editorScale);
|
||||||
|
KeyVisual.heightInput.val(KeyVisual.coverHeight * KeyVisual.editorScale);
|
||||||
|
KeyVisual.widthInput.val(KeyVisual.coverWidth * KeyVisual.editorScale);
|
||||||
|
console.log(KeyVisual.heightInput);
|
||||||
|
console.log(KeyVisual.heightInput.val());
|
||||||
|
console.log(KeyVisual.widthInput);
|
||||||
|
console.log(KeyVisual.widthInput.val());
|
||||||
|
},
|
||||||
|
|
||||||
|
setResizable: function () {
|
||||||
|
KeyVisual.coverElement.resizable({
|
||||||
|
aspectRatio: false,
|
||||||
|
containment: KeyVisual.placeHolderElement,
|
||||||
|
handles: 'se',
|
||||||
|
minWidth: KeyVisual.minWidth,
|
||||||
|
create: function () {
|
||||||
|
if (KeyVisual.coverWidth < KeyVisual.minWidth) {
|
||||||
|
KeyVisual.coverWidth = KeyVisual.minWidth;
|
||||||
|
KeyVisual.coverHeight = KeyVisual.minHeight;
|
||||||
|
KeyVisual.coverLeft = Math.min(KeyVisual.coverLeft, (KeyVisual.previewWidth - KeyVisual.coverWidth));
|
||||||
|
KeyVisual.coverTop = Math.min(KeyVisual.coverTop, (KeyVisual.previewHeight - KeyVisual.coverHeight));
|
||||||
|
}
|
||||||
|
KeyVisual.setCover();
|
||||||
|
},
|
||||||
|
resize: function (event, ui) {
|
||||||
|
ui.size.height = ui.size.width * KeyVisual.coverHeight / KeyVisual.coverWidth;
|
||||||
|
if (ui.position.top + ui.size.height > KeyVisual.previewHeight) {
|
||||||
|
ui.size.height = KeyVisual.previewHeight - ui.position.top;
|
||||||
|
ui.size.width = ui.size.height * KeyVisual.imageFormat;
|
||||||
|
}
|
||||||
|
KeyVisual.coverWidth = ui.size.width;
|
||||||
|
KeyVisual.coverHeight = ui.size.height;
|
||||||
|
KeyVisual.setCover();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
setDraggable: function () {
|
||||||
|
KeyVisual.coverElement.draggable({
|
||||||
|
containment: KeyVisual.placeHolderElement,
|
||||||
|
cursor: 'crosshair',
|
||||||
|
drag: function (event, ui) {
|
||||||
|
KeyVisual.coverLeft = ui.position.left;
|
||||||
|
KeyVisual.coverTop = ui.position.top;
|
||||||
|
KeyVisual.setCover();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
close: function () {
|
||||||
|
|
||||||
|
}
|
||||||
|
};
|
||||||
444
js/navigationEditor.js
Normal file
444
js/navigationEditor.js
Normal file
@@ -0,0 +1,444 @@
|
|||||||
|
/**
|
||||||
|
* Navigation-Editor
|
||||||
|
* Stellt die Funktionalität für die Bearbeitung der Navigations-Struktur zur Verfügung
|
||||||
|
*
|
||||||
|
* Created by CS medien- & kommunikationssysteme.
|
||||||
|
* @author Christian Steinle
|
||||||
|
* @date 06.10.2016
|
||||||
|
*
|
||||||
|
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
||||||
|
*/
|
||||||
|
|
||||||
|
var Navigation = {
|
||||||
|
structureHtml: '',
|
||||||
|
chosenNavID: 0,
|
||||||
|
chosenNavPath: [],
|
||||||
|
chosenBreadCrumb: '',
|
||||||
|
|
||||||
|
/**
|
||||||
|
* jQuery-Variablen des Navigations-Editors
|
||||||
|
*/
|
||||||
|
structureElement: null,
|
||||||
|
moveStructureElement: null,
|
||||||
|
breadCrumbElement: null,
|
||||||
|
tokenElement: null,
|
||||||
|
buttonEditElement: null,
|
||||||
|
buttonSortElement: null,
|
||||||
|
buttonMoveElement: null,
|
||||||
|
buttonChildElement: null,
|
||||||
|
buttonSiblingElement: null,
|
||||||
|
|
||||||
|
init: function () {
|
||||||
|
Navigation.initElements();
|
||||||
|
Navigation.initIconFunctions();
|
||||||
|
},
|
||||||
|
|
||||||
|
initElements: function () {
|
||||||
|
Navigation.structureElement = $('#csEditorStructure');
|
||||||
|
Navigation.moveStructureElement = $('#csEditorMoveStructure');
|
||||||
|
Navigation.breadCrumbElement = $('.csEditorBreadCrumb');
|
||||||
|
Navigation.buttonEditElement = $('.formEdit');
|
||||||
|
Navigation.buttonSortElement = $('.formSort');
|
||||||
|
Navigation.buttonMoveElement = $('.formMove');
|
||||||
|
Navigation.buttonChildElement = $('.formChild');
|
||||||
|
Navigation.buttonSiblingElement = $('.formSibling');
|
||||||
|
},
|
||||||
|
|
||||||
|
initIconFunctions: function () {
|
||||||
|
Navigation.structureElement.on('click', '.glyphicon-folder-close', function () {
|
||||||
|
$(this).removeClass('glyphicon-folder-close').addClass('glyphicon-folder-open');
|
||||||
|
$(this).parent('li').removeClass('csEditorClosed').addClass('csEditorOpen');
|
||||||
|
});
|
||||||
|
|
||||||
|
Navigation.structureElement.on('click', '.glyphicon-folder-open', function (event) {
|
||||||
|
if (event.target !== this) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
$(this).removeClass('glyphicon-folder-open').addClass('glyphicon-folder-close');
|
||||||
|
$(this).parent('li').removeClass('csEditorOpen').addClass('csEditorClosed');
|
||||||
|
});
|
||||||
|
|
||||||
|
Navigation.structureElement.on('click', 'li', function () {
|
||||||
|
if (event.target !== this) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
$('li', Navigation.structureElement).removeClass('csEditorChosen');
|
||||||
|
$(this).addClass('csEditorChosen');
|
||||||
|
$(this).parents('li').addClass('csEditorChosen');
|
||||||
|
Navigation.setChosenElements(this);
|
||||||
|
});
|
||||||
|
|
||||||
|
Navigation.moveStructureElement.on('click', '.glyphicon-folder-close', function () {
|
||||||
|
$(this).removeClass('glyphicon-folder-close').addClass('glyphicon-folder-open');
|
||||||
|
$(this).parent('li').removeClass('csEditorClosed').addClass('csEditorOpen');
|
||||||
|
});
|
||||||
|
|
||||||
|
Navigation.moveStructureElement.on('click', '.glyphicon-folder-open', function (event) {
|
||||||
|
if (event.target !== this) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
$(this).removeClass('glyphicon-folder-open').addClass('glyphicon-folder-close');
|
||||||
|
$(this).parent('li').removeClass('csEditorOpen').addClass('csEditorClosed');
|
||||||
|
});
|
||||||
|
|
||||||
|
Navigation.moveStructureElement.on('click', 'li:not(.csEditorNotEditable)', function () {
|
||||||
|
if (event.target !== this) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
var navStart = $(this).data('navstart');
|
||||||
|
var navID = $(this).data('navid');
|
||||||
|
if (navID !== 0) {
|
||||||
|
var actualNavElement = CS.editorData['navStart_' + navStart]['navID_' + navID];
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
var actualNavElement = {navName: '/'};
|
||||||
|
}
|
||||||
|
|
||||||
|
var maxNavSort = 0;
|
||||||
|
if (CS.editorData['navStart_' + navID] != undefined) {
|
||||||
|
$.each(CS.editorData['navStart_' + navID], function (key, navPoint) {
|
||||||
|
maxNavSort = Math.max(navPoint.navSort, maxNavSort);
|
||||||
|
});
|
||||||
|
++maxNavSort;
|
||||||
|
}
|
||||||
|
$('.moveSubmit').show();
|
||||||
|
$('li', Navigation.moveStructureElement).removeClass('csEditorChosen');
|
||||||
|
$(this).addClass('csEditorChosen');
|
||||||
|
$("input[name='navStart']", $('.moveFields')).val(navID);
|
||||||
|
$("input[name='navSort']", $('.moveFields')).val(maxNavSort);
|
||||||
|
$('#csEditorMoveToItem').html(actualNavElement['navName']);
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
fillEditorContent: function () {
|
||||||
|
if (CS.editorData === null || CS.editorHtml === '') {
|
||||||
|
window.setTimeout('Navigation.fillEditorContent()', 50);
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
Navigation.init();
|
||||||
|
|
||||||
|
Navigation.chosenNavID = csEditorParams.navID;
|
||||||
|
Navigation.chosenNavPath = csEditorParams.navigationPath;
|
||||||
|
Navigation.buildStructureHtml(0);
|
||||||
|
Navigation.structureElement.html(Navigation.structureHtml);
|
||||||
|
Navigation.breadCrumbElement.html(Navigation.chosenBreadCrumb);
|
||||||
|
Navigation.fillForm();
|
||||||
|
},
|
||||||
|
|
||||||
|
buildStructureHtml: function (navStart) {
|
||||||
|
var actualNavStartElements = CS.editorData['navStart_' + navStart];
|
||||||
|
if (navStart === 0) {
|
||||||
|
Navigation.structureHtml += '<ul class="well"><li data-navid="0" class="csEditorOpen csEditorChosen"><span class="glyphicon glyphicon-folder-open"></span> /';
|
||||||
|
Navigation.chosenBreadCrumb += '/ ';
|
||||||
|
}
|
||||||
|
Navigation.structureHtml += '<ul>';
|
||||||
|
|
||||||
|
$.each(actualNavStartElements, function (key, actualNavElement) {
|
||||||
|
var liClass = '';
|
||||||
|
var spanClass = '';
|
||||||
|
|
||||||
|
if ($.inArray(actualNavElement['navID'], Navigation.chosenNavPath) !== -1) {
|
||||||
|
liClass += 'csEditorOpen ';
|
||||||
|
spanClass = 'glyphicon glyphicon-folder-open';
|
||||||
|
Navigation.chosenBreadCrumb += '> ' + actualNavElement['navName'] + ' ';
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
liClass += 'csEditorClosed ';
|
||||||
|
spanClass = 'glyphicon glyphicon-folder-close';
|
||||||
|
}
|
||||||
|
|
||||||
|
if (CS.editorData['navStart_' + actualNavElement['navID']] == undefined) {
|
||||||
|
liClass += 'csEditorEmpty ';
|
||||||
|
spanClass = 'glyphicon glyphicon-align-justify';
|
||||||
|
}
|
||||||
|
|
||||||
|
if (actualNavElement['navActive'] !== 'yes') {
|
||||||
|
liClass += 'csEditorInactive ';
|
||||||
|
}
|
||||||
|
if (actualNavElement['navID'] == csEditorParams.navID) {
|
||||||
|
liClass += 'csEditorChosen';
|
||||||
|
}
|
||||||
|
Navigation.structureHtml += '<li data-navstart="' + navStart + '" data-navid="' + actualNavElement['navID'] + '" class="' + liClass + '"><span class="' + spanClass + '"></span> ' + actualNavElement['navName'];
|
||||||
|
if (CS.editorData['navStart_' + actualNavElement['navID']] != undefined) {
|
||||||
|
Navigation.buildStructureHtml(actualNavElement['navID']);
|
||||||
|
}
|
||||||
|
Navigation.structureHtml += '</li>';
|
||||||
|
});
|
||||||
|
|
||||||
|
if (navStart === 0) {
|
||||||
|
Navigation.structureHtml += '</li>';
|
||||||
|
}
|
||||||
|
Navigation.structureHtml += '</ul>';
|
||||||
|
},
|
||||||
|
|
||||||
|
setChosenElements: function (element) {
|
||||||
|
Navigation.chosenNavID = element.dataset.navid;
|
||||||
|
Navigation.buildBreadCrumb(element);
|
||||||
|
Navigation.buildNavPath(element);
|
||||||
|
Navigation.fillForm();
|
||||||
|
},
|
||||||
|
|
||||||
|
fillForm: function () {
|
||||||
|
if (Navigation.chosenNavID == 0) {
|
||||||
|
Navigation.enableRootButtons();
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
Navigation.enableAllButtons();
|
||||||
|
}
|
||||||
|
var navStart = Navigation.chosenNavPath[Navigation.chosenNavPath.length - 2];
|
||||||
|
var chosenNavElement = CS.editorData['navStart_' + navStart]['navID_' + Navigation.chosenNavID];
|
||||||
|
$.each(chosenNavElement, function (key, value) {
|
||||||
|
$("input[type='text'][name='" + key + "'], input[type='hidden'][name='" + key + "'], select[name='" + key + "'], textarea[name='" + key + "']", CS.contentElement).val(value);
|
||||||
|
if (value !== null) {
|
||||||
|
$("input[type='radio'][name='" + key + "'][value='" + value.replace(/\'/g, '\\') + "']", CS.contentElement).prop('checked', true);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
Navigation.fillSpecial();
|
||||||
|
},
|
||||||
|
|
||||||
|
fillSpecial: function () {
|
||||||
|
if (Navigation.chosenNavID > 0) {
|
||||||
|
Navigation.fillMove();
|
||||||
|
Navigation.fillSibling();
|
||||||
|
}
|
||||||
|
Navigation.fillSort();
|
||||||
|
Navigation.fillChild();
|
||||||
|
},
|
||||||
|
|
||||||
|
fillSort: function () {
|
||||||
|
if (CS.editorData['navStart_' + Navigation.chosenNavID] == undefined) {
|
||||||
|
$('.csEditorSortable').html('Keine Untermenü-Punkte zum Sortieren vorhanden!');
|
||||||
|
$('.sortSubmit').hide();
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
var sortHtml = '<ul>';
|
||||||
|
$('.sortSubmit').show();
|
||||||
|
$.each(CS.editorData['navStart_' + Navigation.chosenNavID], function (key, navPoint) {
|
||||||
|
sortHtml += '<li data-id="' + navPoint['navID'] + '">' + navPoint['navName'] + '<span class="glyphicon glyphicon-sort"></span></li>';
|
||||||
|
});
|
||||||
|
sortHtml += '</ul>';
|
||||||
|
$("input[name='navStart']", '.sortFields').val(Navigation.chosenNavID);
|
||||||
|
|
||||||
|
$('.csEditorSortable').html(sortHtml);
|
||||||
|
$('ul', '.csEditorSortable').sortable({
|
||||||
|
axis: 'y',
|
||||||
|
forcePlaceholderSize: true,
|
||||||
|
handle: '.glyphicon-sort',
|
||||||
|
stop: function () {
|
||||||
|
var order = $('ul', '.csEditorSortable').sortable('toArray', {attribute: 'data-id'});
|
||||||
|
$("input[name='sortOrder']", '.sortFields').val(order);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
fillMove: function () {
|
||||||
|
Navigation.moveStructureElement.html(Navigation.structureHtml);
|
||||||
|
var ownItem = $("li[data-navid='" + Navigation.chosenNavID + "']", Navigation.moveStructureElement);
|
||||||
|
$(ownItem.parents('li')[0]).addClass('csEditorNotEditable');
|
||||||
|
$("li[data-navid='" + Navigation.chosenNavID + "']", Navigation.moveStructureElement).remove();
|
||||||
|
$("input[name='navSort']", '.moveFields').val(0);
|
||||||
|
$('.moveSubmit').hide();
|
||||||
|
},
|
||||||
|
|
||||||
|
fillChild: function () {
|
||||||
|
$("input[name='navStart']", '.childFields').val(Navigation.chosenNavID);
|
||||||
|
$("input[name='navName']", '.childFields').val('');
|
||||||
|
$("input[name='navTitle']", '.childFields').val('');
|
||||||
|
$("input[name='navSort']", '.childFields').val(0);
|
||||||
|
$("input[name='navActive']", '.childFields').val('yes');
|
||||||
|
},
|
||||||
|
|
||||||
|
fillSibling: function () {
|
||||||
|
var navStart = Navigation.chosenNavPath[Navigation.chosenNavPath.length - 2];
|
||||||
|
var chosenNavElement = CS.editorData['navStart_' + navStart]['navID_' + Navigation.chosenNavID];
|
||||||
|
$("input[name='navSort']", '.siblingFields').val(parseInt(chosenNavElement.navSort) + 1);
|
||||||
|
$("input[name='navName']", '.siblingFields').val('');
|
||||||
|
$("input[name='navTitle']", '.siblingFields').val('');
|
||||||
|
$("input[name='navActive']", '.siblingFields').val('yes');
|
||||||
|
},
|
||||||
|
|
||||||
|
buildBreadCrumb: function (element) {
|
||||||
|
Navigation.breadCrumb = '>' + $(element)[0].childNodes[1].textContent;
|
||||||
|
|
||||||
|
$.each($(element).parents('li'), function () {
|
||||||
|
Navigation.breadCrumb = '>' + ($(this)[0].childNodes[1].textContent) + ' ' + Navigation.breadCrumb;
|
||||||
|
});
|
||||||
|
|
||||||
|
Navigation.breadCrumb = Navigation.breadCrumb.substr(2);
|
||||||
|
Navigation.breadCrumbElement.html(Navigation.breadCrumb);
|
||||||
|
},
|
||||||
|
|
||||||
|
buildNavPath: function (element) {
|
||||||
|
var path = [];
|
||||||
|
path.push(element.dataset.navid);
|
||||||
|
|
||||||
|
$.each($(element).parents('li'), function () {
|
||||||
|
path.push(this.dataset.navid);
|
||||||
|
});
|
||||||
|
|
||||||
|
path.push('0');
|
||||||
|
Navigation.chosenNavPath = path.reverse();
|
||||||
|
},
|
||||||
|
|
||||||
|
enableEdit: function () {
|
||||||
|
Navigation.disableSort();
|
||||||
|
Navigation.disableMove();
|
||||||
|
Navigation.disableSibling();
|
||||||
|
Navigation.disableChild();
|
||||||
|
Navigation.disableDelete();
|
||||||
|
|
||||||
|
$('input', '.editFields').prop('disabled', false);
|
||||||
|
$('.editFields').show();
|
||||||
|
},
|
||||||
|
|
||||||
|
enableSort: function () {
|
||||||
|
Navigation.disableEdit();
|
||||||
|
Navigation.disableMove();
|
||||||
|
Navigation.disableSibling();
|
||||||
|
Navigation.disableChild();
|
||||||
|
Navigation.disableDelete();
|
||||||
|
|
||||||
|
$('input', '.sortFields').prop('disabled', false);
|
||||||
|
$('.sortFields').show();
|
||||||
|
},
|
||||||
|
|
||||||
|
enableMove: function () {
|
||||||
|
Navigation.disableEdit();
|
||||||
|
Navigation.disableSort();
|
||||||
|
Navigation.disableSibling();
|
||||||
|
Navigation.disableChild();
|
||||||
|
Navigation.disableDelete();
|
||||||
|
|
||||||
|
$('input', '.moveFields').prop('disabled', false);
|
||||||
|
$('.moveFields').show();
|
||||||
|
},
|
||||||
|
|
||||||
|
enableSibling: function () {
|
||||||
|
Navigation.disableEdit();
|
||||||
|
Navigation.disableSort();
|
||||||
|
Navigation.disableMove();
|
||||||
|
Navigation.disableChild();
|
||||||
|
Navigation.disableDelete();
|
||||||
|
|
||||||
|
$('input', '.siblingFields').prop('disabled', false);
|
||||||
|
$('.siblingFields').show();
|
||||||
|
},
|
||||||
|
|
||||||
|
enableChild: function () {
|
||||||
|
Navigation.disableEdit();
|
||||||
|
Navigation.disableSort();
|
||||||
|
Navigation.disableMove();
|
||||||
|
Navigation.disableSibling();
|
||||||
|
Navigation.disableDelete();
|
||||||
|
|
||||||
|
$('input', '.childFields').prop('disabled', false);
|
||||||
|
$('.childFields').show();
|
||||||
|
},
|
||||||
|
|
||||||
|
enableDelete: function () {
|
||||||
|
Navigation.disableEdit();
|
||||||
|
Navigation.disableSort();
|
||||||
|
Navigation.disableMove();
|
||||||
|
Navigation.disableSibling();
|
||||||
|
Navigation.disableChild();
|
||||||
|
|
||||||
|
$('input', '.deleteFields').prop('disabled', false);
|
||||||
|
$('.deleteFields').show();
|
||||||
|
},
|
||||||
|
|
||||||
|
disableEdit: function () {
|
||||||
|
$('input', '.editFields').prop('disabled', true);
|
||||||
|
$('.editFields').hide();
|
||||||
|
},
|
||||||
|
|
||||||
|
disableSort: function () {
|
||||||
|
/* TODO: Destroy Sortable;
|
||||||
|
if (imgEditor.imgThumbElement.is(':ui-sortable')) {
|
||||||
|
imgEditor.imgThumbElement.sortable('destroy');
|
||||||
|
*/
|
||||||
|
|
||||||
|
$('input', '.sortFields').prop('disabled', true);
|
||||||
|
$('.sortFields').hide();
|
||||||
|
},
|
||||||
|
|
||||||
|
disableMove: function () {
|
||||||
|
$('input', '.moveFields').prop('disabled', true);
|
||||||
|
$('.moveFields').hide();
|
||||||
|
},
|
||||||
|
|
||||||
|
disableSibling: function () {
|
||||||
|
$('input', '.siblingFields').prop('disabled', true);
|
||||||
|
$('.siblingFields').hide();
|
||||||
|
},
|
||||||
|
|
||||||
|
disableChild: function () {
|
||||||
|
$('input', '.childFields').prop('disabled', true);
|
||||||
|
$('.childFields').hide();
|
||||||
|
},
|
||||||
|
|
||||||
|
disableDelete: function () {
|
||||||
|
$('input', '.deleteFields').prop('disabled', true);
|
||||||
|
$('.deleteFields').hide();
|
||||||
|
},
|
||||||
|
|
||||||
|
enableAllButtons: function () {
|
||||||
|
Navigation.disableAllButtons();
|
||||||
|
|
||||||
|
Navigation.buttonEditElement.removeClass('disabled');
|
||||||
|
Navigation.buttonMoveElement.removeClass('disabled');
|
||||||
|
Navigation.buttonSiblingElement.removeClass('disabled');
|
||||||
|
|
||||||
|
Navigation.buttonEditElement.on('click', Navigation.enableEdit);
|
||||||
|
Navigation.buttonSortElement.on('click', Navigation.enableSort);
|
||||||
|
Navigation.buttonMoveElement.on('click', Navigation.enableMove);
|
||||||
|
Navigation.buttonChildElement.on('click', Navigation.enableChild);
|
||||||
|
Navigation.buttonSiblingElement.on('click', Navigation.enableSibling);
|
||||||
|
},
|
||||||
|
|
||||||
|
enableRootButtons: function () {
|
||||||
|
Navigation.disableAllButtons();
|
||||||
|
|
||||||
|
Navigation.buttonEditElement.addClass('disabled');
|
||||||
|
Navigation.buttonMoveElement.addClass('disabled');
|
||||||
|
Navigation.buttonSiblingElement.addClass('disabled');
|
||||||
|
|
||||||
|
Navigation.buttonEditElement.on('click', function () {
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
Navigation.buttonSortElement.on('click', Navigation.enableSort);
|
||||||
|
Navigation.buttonMoveElement.on('click', function () {
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
Navigation.buttonChildElement.on('click', Navigation.enableChild);
|
||||||
|
Navigation.buttonSiblingElement.on('click', function () {
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
disableAllButtons: function () {
|
||||||
|
Navigation.buttonEditElement.off();
|
||||||
|
Navigation.buttonSortElement.off();
|
||||||
|
Navigation.buttonMoveElement.off();
|
||||||
|
Navigation.buttonChildElement.off();
|
||||||
|
Navigation.buttonSiblingElement.off();
|
||||||
|
},
|
||||||
|
|
||||||
|
close: function () {
|
||||||
|
Navigation.structureHtml = '';
|
||||||
|
Navigation.chosenNavID = 0;
|
||||||
|
Navigation.chosenNavPath = [];
|
||||||
|
Navigation.chosenBreadCrumb = '';
|
||||||
|
|
||||||
|
Navigation.structureElement = null;
|
||||||
|
Navigation.moveStructureElement = null;
|
||||||
|
Navigation.breadCrumbElement = null;
|
||||||
|
Navigation.tokenElement = null;
|
||||||
|
Navigation.buttonEditElement = null;
|
||||||
|
Navigation.buttonSortElement = null;
|
||||||
|
Navigation.buttonMoveElement = null;
|
||||||
|
Navigation.buttonChildElement = null;
|
||||||
|
Navigation.buttonSiblingElement = null;
|
||||||
|
}
|
||||||
|
};
|
||||||
75
js/sublineEditor.js
Normal file
75
js/sublineEditor.js
Normal file
@@ -0,0 +1,75 @@
|
|||||||
|
/**
|
||||||
|
* Subline-Editor
|
||||||
|
* Stellt die Funktionalität für die Bearbeitung der Überschriften zur Verfügung
|
||||||
|
*
|
||||||
|
* Created by CS medien- & kommunikationssysteme.
|
||||||
|
* @author Christian Steinle
|
||||||
|
* @date 15.10.2016
|
||||||
|
*
|
||||||
|
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
||||||
|
*/
|
||||||
|
|
||||||
|
var Subline = {
|
||||||
|
subLineEditor: null,
|
||||||
|
|
||||||
|
subLineElement: null,
|
||||||
|
|
||||||
|
init: function() {
|
||||||
|
Subline.initElements();
|
||||||
|
},
|
||||||
|
|
||||||
|
initElements: function() {
|
||||||
|
Subline.subLineElement = $('#text');
|
||||||
|
},
|
||||||
|
|
||||||
|
fillEditorContent: function () {
|
||||||
|
if (CS.editorData === null || CS.editorHtml === '') {
|
||||||
|
window.setTimeout('Subline.fillEditorContent()', 50);
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
Subline.init();
|
||||||
|
|
||||||
|
CS.editorData.text = '<h2>' + CS.editorData.text + '</h2>';
|
||||||
|
$.each(CS.editorData, function (key, value) {
|
||||||
|
$("input[type='text'][name='" + key + "'], input[type='hidden'][name='" + key + "'], select[name='" + key + "'], textarea[name='" + key + "']", CS.contentElement).val(value);
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#navName').html(CS.editorData.navName);
|
||||||
|
|
||||||
|
Subline.subLineEditor = Subline.subLineElement.ckeditor({
|
||||||
|
extraPlugins: 'divarea',
|
||||||
|
height: '70px',
|
||||||
|
removeButtons: 'Redo,Font,FontSize',
|
||||||
|
removePlugins: 'elementspath',
|
||||||
|
resize_enabled: false,
|
||||||
|
stylesSet: [
|
||||||
|
{name: 'small', element: 'small'}
|
||||||
|
],
|
||||||
|
toolbarGroups: [
|
||||||
|
{name: 'clipboard', groups: ['clipboard', 'undo']},
|
||||||
|
{name: 'styles', groups: ['styles']}
|
||||||
|
]
|
||||||
|
}).editor;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Entfernen des Format-DropDowns über Instanziierung nicht möglich, da die Styles der Überschrift sonst nicht angewendet wird
|
||||||
|
*/
|
||||||
|
Subline.subLineElement.ckeditor().on('instanceReady.ckeditor', function() {
|
||||||
|
$('.cke_combo.cke_combo__format.cke_combo_off').hide();
|
||||||
|
});
|
||||||
|
|
||||||
|
Subline.subLineEditor.on('key', function (event) {
|
||||||
|
if (event.data.keyCode === 13) {
|
||||||
|
event.cancel();
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
close: function () {
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
57
js/textEditor.js
Normal file
57
js/textEditor.js
Normal file
@@ -0,0 +1,57 @@
|
|||||||
|
/**
|
||||||
|
* Text-Editor
|
||||||
|
* Stellt die Funktionalität für die Bearbeitung der Texte zur Verfügung
|
||||||
|
*
|
||||||
|
* Created by CS medien- & kommunikationssysteme.
|
||||||
|
* @author Christian Steinle
|
||||||
|
* @date 13.10.2016
|
||||||
|
*
|
||||||
|
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
||||||
|
*/
|
||||||
|
|
||||||
|
var Text = {
|
||||||
|
textEditor: null,
|
||||||
|
|
||||||
|
textElement: null,
|
||||||
|
|
||||||
|
init: function() {
|
||||||
|
Text.initElements();
|
||||||
|
},
|
||||||
|
|
||||||
|
initElements: function() {
|
||||||
|
Text.textInput = $('#text');
|
||||||
|
},
|
||||||
|
|
||||||
|
fillEditorContent: function () {
|
||||||
|
if (CS.editorData === null || CS.editorHtml === '') {
|
||||||
|
window.setTimeout('Text.fillEditorContent()', 50);
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
Text.init();
|
||||||
|
|
||||||
|
CS.editorData.text = '<p>' + CS.editorData.text + '</p>';
|
||||||
|
$.each(CS.editorData, function (key, value) {
|
||||||
|
$("input[type='text'][name='" + key + "'], input[type='hidden'][name='" + key + "'], select[name='" + key + "'], textarea[name='" + key + "']", CS.contentElement).val(value);
|
||||||
|
});
|
||||||
|
|
||||||
|
Text.textEditor = Text.textInput.ckeditor({
|
||||||
|
enterMode: CKEDITOR.ENTER_BR,
|
||||||
|
extraPlugins: 'divarea',
|
||||||
|
height: '500px',
|
||||||
|
removeButtons: 'Redo,Font,FontSize',
|
||||||
|
removePlugins: 'elementspath',
|
||||||
|
toolbarGroups: [
|
||||||
|
{name: 'clipboard', groups: ['clipboard', 'undo']},
|
||||||
|
{name: 'editing', groups: ['find', 'selection', 'spellchecker']},
|
||||||
|
{name: 'basicstyles', groups: ['basicstyles', 'cleanup']},
|
||||||
|
{name: 'paragraph', groups: ['list']},
|
||||||
|
{name: 'links'},
|
||||||
|
{name: 'about'}
|
||||||
|
]
|
||||||
|
}).editor;
|
||||||
|
},
|
||||||
|
|
||||||
|
close: function () {
|
||||||
|
|
||||||
|
}
|
||||||
|
};
|
||||||
113
lang/lang-de.php
113
lang/lang-de.php
@@ -7,6 +7,9 @@
|
|||||||
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
$lang['common']['yes'] = 'Ja';
|
||||||
|
$lang['common']['no'] = 'Nein';
|
||||||
|
|
||||||
$lang['newContent']['title'] = 'Neue Elemente';
|
$lang['newContent']['title'] = 'Neue Elemente';
|
||||||
$lang['newContent']['text'] = 'Text';
|
$lang['newContent']['text'] = 'Text';
|
||||||
$lang['newContent']['subline'] = 'Überschrift';
|
$lang['newContent']['subline'] = 'Überschrift';
|
||||||
@@ -30,47 +33,64 @@ $lang['spielbericht']['vorschau'] = 'Vorschau';
|
|||||||
$lang['spielbericht']['date'] = 'Spiel vom:';
|
$lang['spielbericht']['date'] = 'Spiel vom:';
|
||||||
$lang['spielbericht']['delayed'] = 'Verschoben auf:';
|
$lang['spielbericht']['delayed'] = 'Verschoben auf:';
|
||||||
|
|
||||||
|
$lang['headline']['editHeadline'] = 'Überschrift der Seite <small><span id="navName"></span></small>';
|
||||||
|
|
||||||
$lang['struktur']['editing'] = 'Bearbeitung des gewählten Navigationspunkts:';
|
$lang['navigation']['headline'] = 'Bearbeitung der Seiten Struktur';
|
||||||
$lang['struktur']['rename'] = 'Umbenennen';
|
$lang['navigation']['structure'] = 'Seiten Struktur';
|
||||||
$lang['struktur']['renameHelper'] = 'Änderung des angezeigten Namens in der Navigation';
|
$lang['navigation']['edit'] = 'Bearbeiten';
|
||||||
$lang['struktur']['activate'] = 'Aktivieren';
|
$lang['navigation']['editHelper'] = 'Bearbeitung des gewählten Navigationspunkts';
|
||||||
$lang['struktur']['activateHelper'] = 'Aktiviert den gewählten Navigations-Punkt, so dass dessen Inhalte auf der Homepage wieder angezeigt werden';
|
$lang['navigation']['rename'] = 'Umbenennen';
|
||||||
$lang['struktur']['deactivate'] = 'Deaktivieren';
|
$lang['navigation']['renameHelper'] = 'Änderung des angezeigten Namens in der Navigation';
|
||||||
$lang['struktur']['deactivateHelper'] = 'Deaktiviert den gewählten Navigations-Punkt, so dass dessen Inhalte auf der Homepage nicht mehr angezeigt werden';
|
$lang['navigation']['activate'] = 'Aktivieren';
|
||||||
$lang['struktur']['sort'] = 'Sortieren';
|
$lang['navigation']['activateHelper'] = 'Aktiviert den gewählten Navigations-Punkt, so dass dessen Inhalte auf der Homepage wieder angezeigt werden';
|
||||||
$lang['struktur']['sortHelper'] = 'Änderung der Anzeige-Reihefolge der Navigations-Punkte';
|
$lang['navigation']['deactivate'] = 'Deaktivieren';
|
||||||
$lang['struktur']['move'] = 'Verschieben';
|
$lang['navigation']['deactivateHelper'] = 'Deaktiviert den gewählten Navigations-Punkt, so dass dessen Inhalte auf der Homepage nicht mehr angezeigt werden';
|
||||||
$lang['struktur']['moveHelper'] = 'Verschieben des gewählten Menüpunktes unter einen neuen Navigations-Punkt';
|
$lang['navigation']['sort'] = 'Sortieren';
|
||||||
$lang['struktur']['submenu'] = 'Untermenü';
|
$lang['navigation']['sortHelper'] = 'Sortieren der Untermenü-Punkte des gewählten Navigations-Punkts';
|
||||||
$lang['struktur']['submenuHelper'] = 'Legt einen neuen Navigations-Punkt als erstes Element unter dem gewählten Punkt an';
|
$lang['navigation']['move'] = 'Verschieben';
|
||||||
$lang['struktur']['menu'] = 'Menüpunkt';
|
$lang['navigation']['moveHelper'] = 'Verschieben des gewählten Menüpunktes unter einen neuen Navigations-Punkt';
|
||||||
$lang['struktur']['menuHelper'] = 'Legt einen neuen Navigations-Punkt nach dem gewählten Punkt auf gleicher Ebene an';
|
$lang['navigation']['subMenu'] = 'Untermenü';
|
||||||
|
$lang['navigation']['subMenuHelper'] = 'Legt einen neuen Navigations-Punkt als erstes Element unter dem gewählten Punkt an';
|
||||||
|
$lang['navigation']['menu'] = 'Menüpunkt';
|
||||||
|
$lang['navigation']['menuHelper'] = 'Legt einen neuen Navigations-Punkt nach dem gewählten Punkt auf gleicher Ebene an';
|
||||||
|
|
||||||
$lang['struktur']['navNameRename'] = 'Neuer Name:';
|
$lang['navigation']['name'] = 'Name:';
|
||||||
$lang['struktur']['navNameEnable'] = 'Folgender Navigations-Punkt wird aktiviert:';
|
$lang['navigation']['title'] = 'Titel:';
|
||||||
$lang['struktur']['navNameDisable'] = 'Folgender Navigations-Punkt wird deaktiviert:';
|
$lang['navigation']['active'] = 'Aktivieren:';
|
||||||
$lang['struktur']['navNameMove'][0] = 'Folgender Navigations-Punkt';
|
$lang['navigation']['choseAction'] = 'Aktion wählen:';
|
||||||
$lang['struktur']['navNameMove'][1] = 'wird als Unterpunkt in den gewählten Punkt verschoben';
|
|
||||||
$lang['struktur']['newSubMenu'] = 'Neues Untermenü unter folgendem Navigations-Punkt anlegen:';
|
|
||||||
$lang['struktur']['newMenu'] = 'Neuen Menü-Punkt nach folgendem Navigations-Punkt anlegen:';
|
|
||||||
$lang['struktur']['newSort'] = 'Umsortierung der folgenden Navigationspunkte:';
|
|
||||||
$lang['struktur']['newNavName'] = 'Neuer Seiten-Name:';
|
|
||||||
$lang['struktur']['newNavType'] = 'Neuer Seiten-Typ:';
|
|
||||||
|
|
||||||
$lang['struktur']['content'] = 'Standard-Seite';
|
$lang['navigation']['newLinkName'] = 'Link-Name der neuen Seite in der Navigation';
|
||||||
$lang['struktur']['uebersicht'] = 'Übersicht-Seite';
|
$lang['navigation']['newTitle'] = 'Titel der neuen Seite';
|
||||||
$lang['struktur']['spielbericht'] = 'Spielbericht (Punkt-, Pokalspiel)';
|
$lang['navigation']['chosenNavPoint'] = 'Gewählter Navigationspunkt:';
|
||||||
$lang['struktur']['turnier'] = 'Turnier-Seite (mit mehreren Spielberichten)';
|
|
||||||
$lang['struktur']['widget'] = 'Widget (z.B. Tabelle)';
|
$lang['navigation']['navNameEnable'] = 'Folgender Navigations-Punkt wird aktiviert:';
|
||||||
|
$lang['navigation']['navNameDisable'] = 'Folgender Navigations-Punkt wird deaktiviert:';
|
||||||
|
$lang['navigation']['navNameMove'] = 'Folgender Navigations-Punkt wird als Unterpunkt in den gewählten Punkt verschoben:';
|
||||||
|
$lang['navigation']['newSubMenu'] = 'Neues Untermenü unter folgendem Navigations-Punkt anlegen:';
|
||||||
|
$lang['navigation']['newMenu'] = 'Neuen Menü-Punkt nach folgendem Navigations-Punkt anlegen:';
|
||||||
|
$lang['navigation']['newSort'] = 'Umsortierung der folgenden Navigationspunkte:';
|
||||||
|
$lang['navigation']['newNavName'] = 'Neuer Seiten-Name:';
|
||||||
|
$lang['navigation']['newNavType'] = 'Neuer Seiten-Typ:';
|
||||||
|
|
||||||
|
$lang['navigation']['content'] = 'Standard-Seite';
|
||||||
|
$lang['navigation']['uebersicht'] = 'Übersicht-Seite';
|
||||||
|
$lang['navigation']['spielbericht'] = 'Spielbericht (Punkt-, Pokalspiel)';
|
||||||
|
$lang['navigation']['turnier'] = 'Turnier-Seite (mit mehreren Spielberichten)';
|
||||||
|
$lang['navigation']['widget'] = 'Widget (z.B. Tabelle)';
|
||||||
|
|
||||||
|
|
||||||
$lang['widget']['wettbewerb'] = 'Wettbewerbs-ID:';
|
$lang['widget']['wettbewerb'] = 'Wettbewerbs-ID:';
|
||||||
|
|
||||||
|
$lang['imageText']['headline'] = 'Auf das Bild klick';
|
||||||
|
|
||||||
|
|
||||||
$lang['image']['editHeadline'] = 'Bearbeitung der Bilder';
|
$lang['image']['editHeadline'] = 'Bearbeitung der Bilder';
|
||||||
$lang['image']['editHint'] = 'Durch Klick auf ein Vorschaubild, können die Daten des Einzelbildes bearbeitet werden.<br/>Um ein neues Bild hochzuladen, muss das "Dummy"-Bild angeklickt werden.<br/>Zur Umsortierung der bestehenden Bilder hier klicken:<br/>';
|
$lang['image']['editHint'] = 'Durch Klick auf ein Vorschaubild, können die Daten des Einzelbildes bearbeitet werden.<br/>Um ein neues Bild hochzuladen, muss das "Dummy"-Bild angeklickt werden.<br/>Zur Umsortierung der bestehenden Bilder hier klicken:<br/>';
|
||||||
$lang['image']['sort'] = 'Sortieren';
|
$lang['image']['sort'] = 'Sortieren';
|
||||||
|
$lang['image']['imageFormat'] = 'Bildformat';
|
||||||
|
$lang['image']['portrait'] = 'hoch';
|
||||||
|
$lang['image']['square'] = 'quadratisch';
|
||||||
|
$lang['image']['landscape'] = 'quer';
|
||||||
$lang['image']['imageName'] = 'Bildname';
|
$lang['image']['imageName'] = 'Bildname';
|
||||||
$lang['image']['imageTitle'] = 'Bildtitel';
|
$lang['image']['imageTitle'] = 'Bildtitel';
|
||||||
$lang['image']['keyvisualType'] = 'Keyvisual-Typ';
|
$lang['image']['keyvisualType'] = 'Keyvisual-Typ';
|
||||||
@@ -84,10 +104,41 @@ $lang['image']['sortHeadLine'] = 'Speichern der Bildreihenfolge!';
|
|||||||
$lang['image']['sortHint'] = 'Nach Abschluß der Sortierung kann die neue Reichenfolge gespeichert werden.';
|
$lang['image']['sortHint'] = 'Nach Abschluß der Sortierung kann die neue Reichenfolge gespeichert werden.';
|
||||||
$lang['image']['uploadHeadLine'] = 'Upload eines Bildes!';
|
$lang['image']['uploadHeadLine'] = 'Upload eines Bildes!';
|
||||||
$lang['image']['uploadHint'] = 'Wählen Sie ein neues Bild zum Upload aus. Dieses kann in einem weiteren Schritt bearbeitet werden.<br/>';
|
$lang['image']['uploadHint'] = 'Wählen Sie ein neues Bild zum Upload aus. Dieses kann in einem weiteren Schritt bearbeitet werden.<br/>';
|
||||||
$lang['image']['newUpload'] = 'Neues Bild:';
|
$lang['image']['newUpload'] = 'Neues Bild';
|
||||||
|
$lang['image']['imageZoom'] = 'Zoomrichtung';
|
||||||
|
$lang['image']['imageZoomIn'] = 'hinein zoomen';
|
||||||
|
$lang['image']['imageZoomOut'] = 'heraus zoomen';
|
||||||
|
$lang['image']['imageZoomDirection'] = 'Startpunkt';
|
||||||
|
$lang['image']['nw'] = 'Oben links';
|
||||||
|
$lang['image']['n'] = 'Oben mitte';
|
||||||
|
$lang['image']['ne'] = 'Oben rechts';
|
||||||
|
$lang['image']['e'] = 'Mitte rechts';
|
||||||
|
$lang['image']['se'] = 'Unten rechts';
|
||||||
|
$lang['image']['s'] = 'Unten mitte';
|
||||||
|
$lang['image']['sw'] = 'Unten links';
|
||||||
|
$lang['image']['w'] = 'Mitte links';
|
||||||
|
$lang['image']['c'] = 'Zentrum';
|
||||||
|
|
||||||
|
$lang['keyVisual']['generalHelp'] = 'Eine Vorschau anklicken, um das Bild zu bearbeiten oder auszutauschen.<br/>';
|
||||||
|
$lang['keyVisual']['type'] = 'KeyVisual Typ';
|
||||||
|
$lang['keyVisual']['typeSlider'] = 'Slider';
|
||||||
|
$lang['keyVisual']['typeKenBurns'] = 'KenBurns';
|
||||||
|
$lang['keyVisual']['typeSingle'] = 'Einzel-Bild';
|
||||||
|
/*$lang['keyVisual'][''] = '';
|
||||||
|
$lang['keyVisual'][''] = '';
|
||||||
|
$lang['keyVisual'][''] = '';*/
|
||||||
|
|
||||||
|
|
||||||
$lang['button']['cancel'] = 'Abbrechen';
|
$lang['button']['cancel'] = 'Abbrechen';
|
||||||
$lang['button']['prev'] = 'Zurück';
|
$lang['button']['prev'] = 'Zurück';
|
||||||
$lang['button']['next'] = 'Weiter';
|
$lang['button']['next'] = 'Weiter';
|
||||||
$lang['button']['save'] = 'Speichern';
|
$lang['button']['save'] = 'Speichern';
|
||||||
|
$lang['button']['delete'] = 'Löschen';
|
||||||
|
|
||||||
|
$lang['error']['template'] = 'Fehler beim Holen des Editor-Templates!';
|
||||||
|
$lang['error']['sendData'] = 'Fehler beim Senden der Daten!';
|
||||||
|
$lang['error']['fetchData'] = 'Fehler beim Holen der Editor-Daten!';
|
||||||
|
$lang['error']['status'] = 'Status: ';
|
||||||
|
$lang['error']['errorMessage'] = 'Fehlermeldung: ';
|
||||||
|
$lang['error']['wrongFileType'] = 'Der Datei-Typ kann nicht verwendet werden!';
|
||||||
|
$lang['error']['wrongImageDimension'] = 'Das ausgewählte Bild entspricht nicht den erforderlichen Mindestmaßen:' . "\n" . 'Breite: %width%' . "\n" . 'Höhe: %height%';
|
||||||
21
templates/editorPageElements.html
Normal file
21
templates/editorPageElements.html
Normal file
@@ -0,0 +1,21 @@
|
|||||||
|
<div id="csEditorPageElements" class="panel panel-default">
|
||||||
|
<div class="panel-heading">
|
||||||
|
<div id="csEditorPageElementsTitle"></div>
|
||||||
|
<span id="csEditorPageElementsMin" class="glyphicon glyphicon-chevron-right pull-right"></span>
|
||||||
|
</div>
|
||||||
|
<div id="csEditorPageElementsContent" class="panel-body">
|
||||||
|
<div class="row btn btn-default btn-block" data-editor="Subline" data-id="0" data-element="Subline_0">
|
||||||
|
<h2 class="col-md-12"></h2>
|
||||||
|
</div>
|
||||||
|
<div class="row btn btn-default btn-block" data-editor="Text" data-id="0" data-element="Text_0">
|
||||||
|
<p class="col-md-12"></p>
|
||||||
|
</div>
|
||||||
|
<div class="row btn btn-default btn-block" data-editor="ImageText" data-id="0" data-element="ImageText_0">
|
||||||
|
<div class="col-md-4 col-sm-6 col-xs-8 col-xs-offset-2 col-sm-offset-0 ImageText-Image"><img class="img-responsive" src=""></div>
|
||||||
|
<div class="col-md-8 col-sm-6 col-xs-12 ImageText-Text">
|
||||||
|
<p></p>
|
||||||
|
</div>
|
||||||
|
<div class="clearfix"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
25
templates/editorTemplate.html
Normal file
25
templates/editorTemplate.html
Normal file
@@ -0,0 +1,25 @@
|
|||||||
|
<div id="csEditorConfirm" title="Wirklich Löschen">
|
||||||
|
<p><span class="ui-icon ui-icon-alert" style="float:left; margin:12px 12px 20px 0;"></span>These items will be permanently deleted and cannot be recovered. Are you sure?</p>
|
||||||
|
</div>
|
||||||
|
<div id="csEditorLayer">
|
||||||
|
<div id="csEditorWrapper" class="container">
|
||||||
|
<div id="csEditorWaiting"></div>
|
||||||
|
<div id="csEditorHeader" class="row">
|
||||||
|
<h1 id="csEditorTitle" class="col-md-11">R!ST
|
||||||
|
<small>%%editor%% Editor</small>
|
||||||
|
</h1>
|
||||||
|
<div class="col-md-1 text-right"><span id="csEditorLayerClose" class="glyphicon glyphicon-remove"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="csEditorContent" class="row"></div>
|
||||||
|
<div id="csEditorFooter" class="row">
|
||||||
|
<h1 class="col-md-4">R!ST
|
||||||
|
<small>Editors</small>
|
||||||
|
</h1>
|
||||||
|
<h1 class="col-md-8 text-right">
|
||||||
|
<small>powered by</small>
|
||||||
|
CS internet solutions
|
||||||
|
</h1>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
@@ -17,14 +17,19 @@ $includeFile = dirname(__DIR__) . '/lang/lang-' . $_POST['lang'] . '.php';
|
|||||||
include_once($includeFile);
|
include_once($includeFile);
|
||||||
|
|
||||||
?>
|
?>
|
||||||
<form id="editor_form" action="" method="post">
|
<div class="col-md-12">
|
||||||
<input type="hidden" name="userId" id="userId" value=""/>
|
<form id="csEditorForm" class="" action="" method="">
|
||||||
<input type="hidden" name="prefix" id="prefix" value=""/>
|
<input type="hidden" name="request" value="updateHeadline"/>
|
||||||
<input type="hidden" name="dataSet" id="dataSet" value=""/>
|
<input type="hidden" name="navID" id="navID" value=""/>
|
||||||
<input type="hidden" name="request" id="request" value="updateData"/>
|
<div class="clearfix"></div>
|
||||||
|
<h2><?php echo $lang['headline']['editHeadline']; ?></h2>
|
||||||
<input type="text" name="content" id="content" value="" class="headline"/>
|
<textarea class="col-md-12" name="navHeadline" id="navHeadline"></textarea>
|
||||||
<div class="bottom">
|
<div class="col-md-12"> </div>
|
||||||
<input type="button" class="submitButton formSubmit" value="<?php echo $lang['button']['save']; ?>">
|
<div class="row csEditorButtonGroup">
|
||||||
|
<div class="col-md-12">
|
||||||
|
<span class="formCancel btn btn-default pull-left"><?php echo $lang['button']['cancel']; ?></span>
|
||||||
|
<span class="formSubmit btn btn-default pull-right"><?php echo $lang['button']['save']; ?></span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
</div>
|
||||||
91
templates/imagetext.php
Normal file
91
templates/imagetext.php
Normal file
@@ -0,0 +1,91 @@
|
|||||||
|
<?php
|
||||||
|
/**
|
||||||
|
* Created by CS medien- & kommunikationssysteme.
|
||||||
|
* @author Christian Steinle
|
||||||
|
* @date 12.10.2016
|
||||||
|
*
|
||||||
|
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
||||||
|
*/
|
||||||
|
header('Access-Control-Allow-Origin: *');
|
||||||
|
|
||||||
|
$includeFile = dirname(__DIR__) . '/lang/lang-' . $_POST['lang'] . '.php';
|
||||||
|
if (file_exists(dirname(__DIR__) . '/lang/lang-' . $_POST['lang'] . '.php'))
|
||||||
|
{
|
||||||
|
$includeFile = dirname(__DIR__) . '/lang/lang-' . $_POST['lang'] . '.php';
|
||||||
|
}
|
||||||
|
|
||||||
|
include_once($includeFile);
|
||||||
|
|
||||||
|
?>
|
||||||
|
<div class="col-md-12">
|
||||||
|
<form id="csEditorForm" class="form-horizontal" action="" method="">
|
||||||
|
<div class="row csEditorSlider">
|
||||||
|
<div class="col-md-12 csEditorSliderContent">
|
||||||
|
<div class="row">
|
||||||
|
<input type="hidden" name="request" value="updateImageText"/>
|
||||||
|
<input type="hidden" name="navID" id="navID" value=""/>
|
||||||
|
<input type="hidden" name="imageTextID" value=""/>
|
||||||
|
<input type="hidden" name="imageID" value=""/>
|
||||||
|
<input type="hidden" id="imageExtension" name="imageExtension" value=""/>
|
||||||
|
<input type="hidden" id="imageOrigName" name="imageOrigName" value=""/>
|
||||||
|
<input type="hidden" id="imageTop" name="imageTop" value=""/>
|
||||||
|
<input type="hidden" id="imageLeft" name="imageLeft" value=""/>
|
||||||
|
<input type="hidden" id="imageHeight" name="imageHeight" value=""/>
|
||||||
|
<input type="hidden" id="imageWidth" name="imageWidth" value=""/>
|
||||||
|
<div class="col-md-4">
|
||||||
|
<img id="csEditorImage" src="" class="img-responsive"/>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-8">
|
||||||
|
<textarea name="text" id="text"></textarea>
|
||||||
|
</div>
|
||||||
|
<div class="clearfix"></div>
|
||||||
|
<div class="col-md-12"> </div>
|
||||||
|
</div>
|
||||||
|
<span class="formCancel btn btn-default pull-left"><?php echo $lang['button']['cancel']; ?></span>
|
||||||
|
<span class="formNext btn btn-default pull-right"><?php echo $lang['button']['next']; ?></span>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-12 csEditorSliderContent">
|
||||||
|
<div id="csEditorImagePlaceholder">
|
||||||
|
<div id="csEditorImageCover"></div>
|
||||||
|
<div id="csEditorCoverTop"></div>
|
||||||
|
<div id="csEditorCoverRight"></div>
|
||||||
|
<div id="csEditorCoverBottom"></div>
|
||||||
|
<div id="csEditorCoverLeft"></div>
|
||||||
|
<img src="" id="csEditorImagePreview" class="img-responsive"/>
|
||||||
|
</div>
|
||||||
|
<div class="row"> </div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-2 control-label" for="imageFormat"><?php echo $lang['image']['imageFormat']; ?></label>
|
||||||
|
<div class="col-md-10">
|
||||||
|
<select class="form-control" data-current="" name="imageFormat" id="imageFormat">
|
||||||
|
<option value="landscape"><?php echo $lang['image']['landscape']; ?></option>
|
||||||
|
<option value="square"><?php echo $lang['image']['square']; ?></option>
|
||||||
|
<option value="portrait"><?php echo $lang['image']['portrait']; ?></option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-2 control-label" for="imageName"><?php echo $lang['image']['imageName']; ?></label>
|
||||||
|
<div class="col-md-10">
|
||||||
|
<input class="form-control" type="text" name="imageName" id="imageName" value=""/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-2 control-label" for="imageTitle"><?php echo $lang['image']['imageTitle']; ?></label>
|
||||||
|
<div class="col-md-10">
|
||||||
|
<input class="form-control" type="text" name="imageTitle" id="imageTitle" value=""/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-2 control-label" for="changeUploadFile"><?php echo $lang['image']['newUpload']; ?></label>
|
||||||
|
<div class="col-md-10">
|
||||||
|
<input class="uploadFile form-control" type="file" name="changeUploadFile" id="changeUploadFile" value=""/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-12"> </div>
|
||||||
|
<span class="formPrev btn btn-default pull-left"><?php echo $lang['button']['prev']; ?></span>
|
||||||
|
<span class="formSubmit btn btn-default pull-right"><?php echo $lang['button']['save']; ?></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
@@ -2,7 +2,7 @@
|
|||||||
/**
|
/**
|
||||||
* Created by CS medien- & kommunikationssysteme.
|
* Created by CS medien- & kommunikationssysteme.
|
||||||
* @author Christian Steinle
|
* @author Christian Steinle
|
||||||
* @date 09.09.2016
|
* @date 17.12.2016
|
||||||
*
|
*
|
||||||
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
||||||
*/
|
*/
|
||||||
@@ -17,89 +17,106 @@ if (file_exists(dirname(__DIR__) . '/lang/lang-' . $_POST['lang'] . '.php'))
|
|||||||
include_once($includeFile);
|
include_once($includeFile);
|
||||||
|
|
||||||
?>
|
?>
|
||||||
<form id="editor_form" action="" method="post">
|
<div class="col-md-12">
|
||||||
<input type="hidden" name="userId" id="userId" value=""/>
|
<form id="csEditorForm" class="form-horizontal" action="" method="">
|
||||||
<input type="hidden" name="prefix" id="prefix" value=""/>
|
<div class="row csEditorSlider">
|
||||||
<input type="hidden" name="navId" id="navId" value=""/>
|
<div class="col-md-12 csEditorSliderContent">
|
||||||
<input type="hidden" name="dataSet" id="dataSet" value=""/>
|
<p><?php echo $lang['keyVisual']['generalHelp']; ?></p>
|
||||||
<input type="hidden" name="request" id="request" value="updateData"/>
|
<div class="row">
|
||||||
|
<input type="hidden" name="request" id="request" value="updateKeyVisual"/>
|
||||||
|
<input type="hidden" name="navID" id="navID" value=""/>
|
||||||
|
<input type="hidden" name="imageID" value=""/>
|
||||||
|
<input type="hidden" name="keyVisualID" value=""/>
|
||||||
|
<input type="hidden" id="imageExtension" name="imageExtension" value=""/>
|
||||||
|
<input type="hidden" id="imageOrigName" name="imageOrigName" value=""/>
|
||||||
|
<input type="hidden" id="imageTop" name="imageTop" value=""/>
|
||||||
|
<input type="hidden" id="imageLeft" name="imageLeft" value=""/>
|
||||||
|
<input type="hidden" id="imageHeight" name="imageHeight" value=""/>
|
||||||
|
<input type="hidden" id="imageWidth" name="imageWidth" value=""/>
|
||||||
|
<div id="csEditorThumb" class="col-md-2"></div>
|
||||||
|
<div class="col-md-9 col-md-offset-1">
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-3 control-label" for="Type"><?php echo $lang['keyVisual']['type']; ?></label>
|
||||||
|
<div class="col-md-9">
|
||||||
|
<select class="form-control" name="Type" id="Type">
|
||||||
|
<option value="Slider"><?php echo $lang['keyVisual']['typeSlider']; ?></option>
|
||||||
|
<option value="Kenburns"><?php echo $lang['keyVisual']['typeKenBurns']; ?></option>
|
||||||
|
<option value="Single"><?php echo $lang['keyVisual']['typeSingle']; ?></option>
|
||||||
|
</select>
|
||||||
|
<span class="formSubmit btn btn-default pull-right"><?php echo $lang['button']['save']; ?></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="well col-md-3 col-md-offset-3">
|
||||||
|
<span onclick="CS.editor.enableSort();" class="formNext btn btn-default btn-sm btn-block" title="<?php echo $lang['navigation']['sortHelper']; ?>"><?php echo $lang['navigation']['sort']; ?></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-12 csEditorSliderContent">
|
||||||
|
<div id="csEditorImagePlaceholder">
|
||||||
|
<div id="csEditorImageCover"></div>
|
||||||
|
<div id="csEditorCoverTop"></div>
|
||||||
|
<div id="csEditorCoverRight"></div>
|
||||||
|
<div id="csEditorCoverBottom"></div>
|
||||||
|
<div id="csEditorCoverLeft"></div>
|
||||||
|
<img src="" id="csEditorImagePreview" class="img-responsive"/>
|
||||||
|
</div>
|
||||||
|
<div class="row"> </div>
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-6">
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-3 control-label" for="imageName"><?php echo $lang['image']['imageName']; ?></label>
|
||||||
|
<div class="col-md-9">
|
||||||
|
<input class="form-control" type="text" name="imageName" id="imageName" value="fuck you"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-3 control-label" for="imageTitle"><?php echo $lang['image']['imageTitle']; ?></label>
|
||||||
|
<div class="col-md-9">
|
||||||
|
<input class="form-control" type="text" name="imageTitle" id="imageTitle" value=""/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-3 control-label" for="changeUploadFile"><?php echo $lang['image']['newUpload']; ?></label>
|
||||||
|
<div class="col-md-9">
|
||||||
|
<input class="uploadFile form-control" type="file" name="changeUploadFile" id="changeUploadFile" value=""/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6 kenburns">
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-3 control-label" for="imageZoom"><?php echo $lang['image']['imageZoom']; ?></label>
|
||||||
|
<div class="col-md-9">
|
||||||
|
<select class="form-control" name="imageZoom" id="imageZoom">
|
||||||
|
<option value="in"><?php echo $lang['image']['imageZoomIn']; ?></option>
|
||||||
|
<option value="out"><?php echo $lang['image']['imageZoomOut']; ?></option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-3 control-label" for="imageZoomDirection"><?php echo $lang['image']['imageZoomDirection']; ?></label>
|
||||||
|
<div class="col-md-9">
|
||||||
|
<select class="form-control" name="imageZoomDirection" id="imageZoomDirection">
|
||||||
|
<option value="nw"><?php echo $lang['image']['nw']; ?></option>
|
||||||
|
<option value="n"><?php echo $lang['image']['n']; ?></option>
|
||||||
|
<option value="ne"><?php echo $lang['image']['ne']; ?></option>
|
||||||
|
<option value="e"><?php echo $lang['image']['e']; ?></option>
|
||||||
|
<option value="se"><?php echo $lang['image']['se']; ?></option>
|
||||||
|
<option value="s"><?php echo $lang['image']['s']; ?></option>
|
||||||
|
<option value="sw"><?php echo $lang['image']['sw']; ?></option>
|
||||||
|
<option value="w"><?php echo $lang['image']['w']; ?></option>
|
||||||
|
<option value="c"><?php echo $lang['image']['c']; ?></option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<input type="hidden" name="imgExtension" id="imgExtension" value=""/>
|
</div>
|
||||||
<input type="hidden" name="imgOrigname" id="imgOrigname" value=""/>
|
|
||||||
<input type="hidden" name="previewHeight" id="previewHeight" value=""/>
|
|
||||||
<input type="hidden" name="previewLeft" id="previewLeft" value=""/>
|
|
||||||
<input type="hidden" name="previewTop" id="previewTop" value=""/>
|
|
||||||
<input type="hidden" name="previewWidth" id="previewWidth" value=""/>
|
|
||||||
|
|
||||||
<input type="hidden" name="uploadFile" id="uploadFile" value="" disabled="disabled"/>
|
|
||||||
|
|
||||||
<input type="hidden" name="sliderContent" id="sliderContent" value=""/>
|
|
||||||
<input type="hidden" name="formAction" id="formAction" value=""/>
|
|
||||||
|
|
||||||
<div class="editor_slider">
|
|
||||||
<div class="inner">
|
|
||||||
<div id="newSort_box" class="box">
|
|
||||||
<ul id="imgThumbs"></ul>
|
|
||||||
</div>
|
|
||||||
<div class="rightBox editFields box">
|
|
||||||
<h1><?php echo $lang['image']['editHeadline']; ?></h1>
|
|
||||||
<p><?php echo $lang['image']['editHint']; ?></p>
|
|
||||||
<input id="sortButton" type="button" class="submitButton" value="<?php echo $lang['image']['sort']; ?>"/>
|
|
||||||
<br class="fix"/> <br/>
|
|
||||||
</div>
|
|
||||||
<div class="rightBox deleteFields box">
|
|
||||||
<h1><?php echo $lang['image']['deleteHeadLine']; ?></h1>
|
|
||||||
<p><?php echo $lang['image']['deleteHint']; ?></p>
|
|
||||||
<input type="hidden" name="firstImage" id="firstImage" value=""/>
|
|
||||||
<div>
|
|
||||||
<input type="button" class="submitButton formSubmit" value="<?php echo $lang['button']['save']; ?>">
|
|
||||||
<input type="button" id="deleteCancel" class="submitButton" value="<?php echo $lang['button']['cancel']; ?>">
|
|
||||||
</div>
|
|
||||||
<br class="fix"/> <br/>
|
|
||||||
</div>
|
|
||||||
<div class="rightBox sortFields box">
|
|
||||||
<h1><?php echo $lang['image']['sortHeadLine']; ?></h1>
|
|
||||||
<p><?php echo $lang['image']['sortHint']; ?></p>
|
|
||||||
<input type="hidden" name="hasSlider" value="Y"/>
|
|
||||||
<div>
|
|
||||||
<input type="button" id="sortSave" class="submitButton formSubmit" value="<?php echo $lang['button']['save']; ?>">
|
|
||||||
<input type="button" id="sortCancel" class="submitButton" value="<?php echo $lang['button']['cancel']; ?>">
|
|
||||||
</div>
|
|
||||||
<br class="fix"/> <br/>
|
|
||||||
</div>
|
|
||||||
<div class="rightBox uploadFields box">
|
|
||||||
<h1><?php echo $lang['image']['uploadHeadLine']; ?></h1>
|
|
||||||
<p><?php echo $lang['image']['uploadHint']; ?></p><br/>
|
|
||||||
<label for="newUploadFile"><?php echo $lang['image']['newUpload']; ?></label><input type="file" name="newUploadFile" id="newUploadFile" class="uploadFile"/><br/>
|
|
||||||
<input type="button" class="submitButton hidden" value="<?php echo $lang['button']['save']; ?>">
|
|
||||||
<input type="button" id="uploadCancel" class="submitButton" value="<?php echo $lang['button']['cancel']; ?>">
|
|
||||||
<br class="fix"/> <br/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="inner">
|
|
||||||
<div id="imagePlaceholder">
|
|
||||||
<div id="imageCover">
|
|
||||||
<div id="coverTop"></div>
|
|
||||||
<div id="coverRight"></div>
|
|
||||||
<div id="coverBottom"></div>
|
|
||||||
<div id="coverLeft"></div>
|
|
||||||
</div>
|
|
||||||
<div id="imagePreview"></div>
|
|
||||||
</div>
|
|
||||||
<div class="editFields">
|
|
||||||
<label for="imgName"><?php echo $lang['image']['imageName']; ?></label><input type="text" name="imgName" id="imgName" value=""/><br/>
|
|
||||||
<label for="imgTitle"><?php echo $lang['image']['imageTitle']; ?></label><input type="text" name="imgTitle" id="imgTitle" value=""/><br/>
|
|
||||||
<div id="imageSlider">
|
|
||||||
<label><?php echo $lang['image']['keyvisualType']; ?></label>
|
|
||||||
<input type="radio" name="hasSlider" id="hasSlider_N" value="N"/><label for="hasSlider_N"><?php echo $lang['image']['imageSingle']; ?></label>
|
|
||||||
<input type="radio" name="hasSlider" id="hasSlider_Y" value="Y"/><label for="hasSlider_Y"><?php echo $lang['image']['imageSlider']; ?></label><br/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<label for="changeUploadFile"><?php echo $lang['image']['newUpload']; ?></label><input type="file" name="changeUploadFile" id="changeUploadFile" class="uploadFile"/><br/>
|
|
||||||
<div class="bottom">
|
|
||||||
<input type="button" class="submitButton formSubmit" value="<?php echo $lang['button']['save']; ?>">
|
|
||||||
<input type="button" class="submitButton formPrev" value="<?php echo $lang['button']['prev']; ?>">
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="col-md-12"> </div>
|
||||||
|
<span class="formPrev btn btn-default pull-left"><?php echo $lang['button']['prev']; ?></span>
|
||||||
|
<span class="formSubmit btn btn-default pull-right"><?php echo $lang['button']['save']; ?></span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
</div>
|
||||||
173
templates/navigation.php
Normal file
173
templates/navigation.php
Normal file
@@ -0,0 +1,173 @@
|
|||||||
|
<?php
|
||||||
|
/**
|
||||||
|
* Created by CS medien- & kommunikationssysteme.
|
||||||
|
* @author Christian Steinle
|
||||||
|
* @date 09.09.2016
|
||||||
|
*
|
||||||
|
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
||||||
|
*/
|
||||||
|
header('Access-Control-Allow-Origin: *');
|
||||||
|
|
||||||
|
$includeFile = dirname(__DIR__) . '/lang/lang-' . $_POST['lang'] . '.php';
|
||||||
|
if (file_exists(dirname(__DIR__) . '/lang/lang-' . $_POST['lang'] . '.php'))
|
||||||
|
{
|
||||||
|
$includeFile = dirname(__DIR__) . '/lang/lang-' . $_POST['lang'] . '.php';
|
||||||
|
}
|
||||||
|
|
||||||
|
include_once($includeFile);
|
||||||
|
|
||||||
|
?>
|
||||||
|
<div class="col-md-12">
|
||||||
|
<form id="csEditorForm" class="form-horizontal" action="" method="">
|
||||||
|
<div class="row csEditorSlider">
|
||||||
|
<div class="csEditorSliderContent">
|
||||||
|
<div class="col-md-12"> </div>
|
||||||
|
<div class="col-md-5">
|
||||||
|
<p><?php echo $lang['navigation']['structure']; ?></p>
|
||||||
|
<div id="csEditorStructure" class="csEditorStructure"></div>
|
||||||
|
</div>
|
||||||
|
<div id="csEditorNavpoint" class="col-md-6 col-md-offset-1">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-md-12"><b><p class="csEditorBreadCrumb"></p></b></div>
|
||||||
|
<div class="col-md-4"><?php echo $lang['navigation']['choseAction']; ?></div>
|
||||||
|
<div class="well col-md-4">
|
||||||
|
<span class="formNext formEdit btn btn-default btn-sm btn-block" title="<?php echo $lang['navigation']['editHelper']; ?>"><?php echo $lang['navigation']['edit']; ?></span>
|
||||||
|
<span class="formNext formSort btn btn-default btn-sm btn-block" title="<?php echo $lang['navigation']['sortHelper']; ?>"><?php echo $lang['navigation']['sort']; ?></span>
|
||||||
|
<span class="formNext formMove btn btn-default btn-sm btn-block" title="<?php echo $lang['navigation']['moveHelper']; ?>"><?php echo $lang['navigation']['move']; ?></span>
|
||||||
|
<span class="formNext formChild btn btn-default btn-sm btn-block" title="<?php echo $lang['navigation']['subMenuHelper']; ?>"><?php echo $lang['navigation']['subMenu']; ?></span>
|
||||||
|
<span class="formNext formSibling btn btn-default btn-sm btn-block" title="<?php echo $lang['navigation']['menuHelper']; ?>"><?php echo $lang['navigation']['menu']; ?></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="csEditorButtonGroup">
|
||||||
|
<div class="col-md-12">
|
||||||
|
<span class="formCancel btn btn-default pull-left"><?php echo $lang['button']['cancel']; ?></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="csEditorSliderContent">
|
||||||
|
<div class="editFields col-md-12">
|
||||||
|
<div><b><p class="csEditorBreadCrumb"></p></b></div>
|
||||||
|
<input type="hidden" name="request" value="updateNavigation"/>
|
||||||
|
<input type="hidden" name="navID" value=""/>
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-3 control-label" for="editNavName"><?php echo $lang['navigation']['name']; ?></label>
|
||||||
|
<div class="col-md-9">
|
||||||
|
<input class="form-control" type="text" name="navName" id="editNavName" value=""/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-3 control-label" for="editNavTitle"><?php echo $lang['navigation']['title']; ?></label>
|
||||||
|
<div class="col-md-9">
|
||||||
|
<input class="form-control" type="text" name="navTitle" id="editNavTitle" value=""/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-3 control-label"><?php echo $lang['navigation']['active']; ?></label>
|
||||||
|
<div class="col-md-9">
|
||||||
|
<label class="radio-inline">
|
||||||
|
<input type="radio" name="navActive" value="yes"> <?php echo $lang['common']['yes']; ?>
|
||||||
|
</label>
|
||||||
|
<label class="radio-inline">
|
||||||
|
<input type="radio" name="navActive" value="no"> <?php echo $lang['common']['no']; ?>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row csEditorButtonGroup">
|
||||||
|
<div class="col-md-12">
|
||||||
|
<span class="formPrev btn btn-default pull-left"><?php echo $lang['button']['prev']; ?></span>
|
||||||
|
<span class="formSubmit btn btn-default pull-right"><?php echo $lang['button']['save']; ?></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="sortFields col-md-12">
|
||||||
|
<p><?php echo $lang['navigation']['newSort']; ?></p>
|
||||||
|
<div><b><span class="csEditorBreadCrumb"></span></b><br/> <br/></div>
|
||||||
|
<input type="hidden" name="request" value="updateNavigationSort"/>
|
||||||
|
<input type="hidden" name="sortOrder" value=""/>
|
||||||
|
<div class="csEditorSortable col-md-4 well"></div>
|
||||||
|
<div class="clearfix"></div>
|
||||||
|
<div class="row csEditorButtonGroup">
|
||||||
|
<div class="col-md-12">
|
||||||
|
<span class="formPrev btn btn-default pull-left"><?php echo $lang['button']['prev']; ?></span>
|
||||||
|
<span class="sortSubmit formSubmit btn btn-default pull-right"><?php echo $lang['button']['save']; ?></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="moveFields col-md-12">
|
||||||
|
<p><?php echo $lang['navigation']['navNameMove']; ?></p>
|
||||||
|
<div><b><span class="csEditorBreadCrumb"></span></b><br/> <br/></div>
|
||||||
|
<input type="hidden" name="request" value="updateNavigation"/>
|
||||||
|
<input type="hidden" name="navStart" value=""/>
|
||||||
|
<input type="hidden" name="navID" value=""/>
|
||||||
|
<input type="hidden" name="navSort" value=""/>
|
||||||
|
<div class="row">
|
||||||
|
<div id="csEditorMoveStructure" class="csEditorStructure col-md-6"></div>
|
||||||
|
<div class="col-md-6">
|
||||||
|
<p><?php echo $lang['navigation']['chosenNavPoint']; ?></p>
|
||||||
|
<b><span id="csEditorMoveToItem"></span></b>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row csEditorButtonGroup">
|
||||||
|
<div class="col-md-12">
|
||||||
|
<span class="formPrev btn btn-default pull-left"><?php echo $lang['button']['prev']; ?></span>
|
||||||
|
<span class="moveSubmit formSubmit btn btn-default pull-right"><?php echo $lang['button']['save']; ?></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="childFields col-md-12">
|
||||||
|
<p><?php echo $lang['navigation']['newSubMenu']; ?></p>
|
||||||
|
<div><b><span class="csEditorBreadCrumb"></span></b><br/> <br/></div>
|
||||||
|
<input type="hidden" name="request" value="insertNavigation"/>
|
||||||
|
<input type="hidden" name="navStart" value=""/>
|
||||||
|
<input type="hidden" name="navSort" value=""/>
|
||||||
|
<input type="hidden" name="navActive" value=""/>
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-3 control-label" for="childNavName"><?php echo $lang['navigation']['name']; ?></label>
|
||||||
|
<div class="col-md-9">
|
||||||
|
<input class="form-control" type="text" name="navName" id="childNavName" value="" placeholder="<?php echo $lang['navigation']['newLinkName']; ?>"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-3 control-label" for="childNavTitle"><?php echo $lang['navigation']['title']; ?></label>
|
||||||
|
<div class="col-md-9">
|
||||||
|
<input class="form-control" type="text" name="navTitle" id="childNavTitle" value="" placeholder="<?php echo $lang['navigation']['newTitle']; ?>"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row csEditorButtonGroup">
|
||||||
|
<div class="col-md-12">
|
||||||
|
<span class="formPrev btn btn-default pull-left"><?php echo $lang['button']['prev']; ?></span>
|
||||||
|
<span class="formSubmit btn btn-default pull-right"><?php echo $lang['button']['save']; ?></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="siblingFields col-md-12">
|
||||||
|
<p><?php echo $lang['navigation']['newMenu']; ?></p>
|
||||||
|
<div><b><span class="csEditorBreadCrumb"></span></b><br/> <br/></div>
|
||||||
|
<input type="hidden" name="request" value="insertNavigation"/>
|
||||||
|
<input type="hidden" name="navStart" value=""/>
|
||||||
|
<input type="hidden" name="navSort" value=""/>
|
||||||
|
<input type="hidden" name="navActive" value=""/>
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-3 control-label" for="childNavName"><?php echo $lang['navigation']['name']; ?></label>
|
||||||
|
<div class="col-md-9">
|
||||||
|
<input class="form-control" type="text" name="navName" id="childNavName" value="" placeholder="<?php echo $lang['navigation']['newLinkName']; ?>"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label class="col-md-3 control-label" for="childNavTitle"><?php echo $lang['navigation']['title']; ?></label>
|
||||||
|
<div class="col-md-9">
|
||||||
|
<input class="form-control" type="text" name="navTitle" id="childNavTitle" value="" placeholder="<?php echo $lang['navigation']['newTitle']; ?>"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row csEditorButtonGroup">
|
||||||
|
<div class="col-md-12">
|
||||||
|
<span class="formPrev btn btn-default pull-left"><?php echo $lang['button']['prev']; ?></span>
|
||||||
|
<span class="formSubmit btn btn-default pull-right"><?php echo $lang['button']['save']; ?></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
@@ -1,127 +0,0 @@
|
|||||||
<?php
|
|
||||||
/**
|
|
||||||
* Created by CS medien- & kommunikationssysteme.
|
|
||||||
* @author Christian Steinle
|
|
||||||
* @date 09.09.2016
|
|
||||||
*
|
|
||||||
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
|
||||||
*/
|
|
||||||
header('Access-Control-Allow-Origin: *');
|
|
||||||
|
|
||||||
$includeFile = dirname(__DIR__) . '/lang/lang-' . $_POST['lang'] . '.php';
|
|
||||||
if (file_exists(dirname(__DIR__) . '/lang/lang-' . $_POST['lang'] . '.php'))
|
|
||||||
{
|
|
||||||
$includeFile = dirname(__DIR__) . '/lang/lang-' . $_POST['lang'] . '.php';
|
|
||||||
}
|
|
||||||
|
|
||||||
include_once($includeFile);
|
|
||||||
|
|
||||||
?>
|
|
||||||
<form id="editor_form" action="" method="post">
|
|
||||||
<input type="hidden" name="userId" id="userId" value=""/>
|
|
||||||
<input type="hidden" name="prefix" id="prefix" value=""/>
|
|
||||||
<input type="hidden" name="siteId" id="siteId" value=""/>
|
|
||||||
<input type="hidden" name="dataSet" id="dataSet" value=""/>
|
|
||||||
<input type="hidden" name="navStart" id="navStart" value=""/>
|
|
||||||
<input type="hidden" name="navId" id="navId" value=""/>
|
|
||||||
<div id="struktur"></div>
|
|
||||||
<div id="navPoint" class="box">
|
|
||||||
<p class="headline"><b><?php echo $lang['struktur']['editing']; ?></b></p>
|
|
||||||
<p id="breadCrumb"></p>
|
|
||||||
<div id="showAction">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
<div id="actionTemplates" class="hidden">
|
|
||||||
<div class="actionChooser">
|
|
||||||
<span data-show="Rename" class="submitButton" title="<?php echo $lang['struktur']['renameHelper']; ?>"><?php echo $lang['struktur']['rename']; ?></span><br class="fix"/>
|
|
||||||
<span data-show="Activate" class="submitButton" title="<?php echo $lang['struktur']['activateHelper']; ?>"><?php echo $lang['struktur']['activate']; ?></span><br class="fix"/>
|
|
||||||
<span data-show="Deactivate" class="submitButton" title="<?php echo $lang['struktur']['deactivateHelper']; ?>"><?php echo $lang['struktur']['deactivate']; ?></span><br class="fix"/>
|
|
||||||
<span data-show="Sort" class="submitButton checkSort" title="<?php echo $lang['struktur']['sortHelper']; ?>"><?php echo $lang['struktur']['sort']; ?></span><br class="fix"/>
|
|
||||||
<span data-show="Move" class="submitButton" title="<?php echo $lang['struktur']['moveHelper']; ?>"><?php echo $lang['struktur']['move']; ?></span><br class="fix"/>
|
|
||||||
<span data-show="Submenu" class="submitButton" title="<?php echo $lang['struktur']['submenuHelper']; ?>"><?php echo $lang['struktur']['submenu']; ?></span><br class="fix"/>
|
|
||||||
<span data-show="Menu" class="submitButton" title="<?php echo $lang['struktur']['menuHelper']; ?>"><?php echo $lang['struktur']['menu']; ?></span><br class="fix"/>
|
|
||||||
</div>
|
|
||||||
<div class="actionRename">
|
|
||||||
<input type="hidden" name="formAction" value="renameNavPoint"/>
|
|
||||||
<input type="hidden" name="request" value="updateData"/>
|
|
||||||
<label for="navName"><?php echo $lang['struktur']['navNameRename']; ?></label><input type="text" name="navName" id="navName" value=""/>
|
|
||||||
<div id="bottom">
|
|
||||||
<input type="button" class="submitButton formSubmit" value="<?php echo $lang['button']['save']; ?>">
|
|
||||||
<input data-show="Chooser" type="button" class="submitButton" value="<?php echo $lang['button']['cancel']; ?>"/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="actionActivate">
|
|
||||||
<input type="hidden" name="formAction" value="updateActive"/>
|
|
||||||
<input type="hidden" name="request" value="updateData"/>
|
|
||||||
<input type="hidden" name="navActive" value="Y"/>
|
|
||||||
<p><?php echo $lang['struktur']['navNameEnable']; ?></p>
|
|
||||||
<input type="text" name="navName" id="navName" value="" disabled="disabled"/>
|
|
||||||
<div id="bottom">
|
|
||||||
<input type="button" class="submitButton formSubmit" value="<?php echo $lang['button']['save']; ?>">
|
|
||||||
<input data-show="Chooser" type="button" class="submitButton" value="<?php echo $lang['button']['cancel']; ?>"/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="actionDeactivate">
|
|
||||||
<input type="hidden" name="formAction" value="updateActive"/>
|
|
||||||
<input type="hidden" name="request" value="updateData"/>
|
|
||||||
<input type="hidden" name="navActive" value="N"/>
|
|
||||||
<p><?php echo $lang['struktur']['navNameDisable']; ?></p>
|
|
||||||
<input type="text" name="navName" id="navName" value="" disabled="disabled"/>
|
|
||||||
<div id="bottom">
|
|
||||||
<input type="button" class="submitButton formSubmit" value="<?php echo $lang['button']['save']; ?>">
|
|
||||||
<input data-show="Chooser" type="button" class="submitButton" value="<?php echo $lang['button']['cancel']; ?>"/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="actionSort">
|
|
||||||
<input type="hidden" name="formAction" value="sortNavPoint"/>
|
|
||||||
<input type="hidden" name="request" value="updateData"/>
|
|
||||||
<input type="hidden" name="newSort" class="newSort" value=""/>
|
|
||||||
<p><?php echo $lang['struktur']['newSort']; ?></p>
|
|
||||||
<div>
|
|
||||||
<ul class="navSort box"></ul>
|
|
||||||
</div>
|
|
||||||
<div id="bottom">
|
|
||||||
<input type="button" class="submitButton formSubmit hidden" value="<?php echo $lang['button']['save']; ?>"/>
|
|
||||||
<input data-show="Chooser" type="button" class="submitButton" value="<?php echo $lang['button']['cancel']; ?>"/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="actionMove">
|
|
||||||
<input type="hidden" name="formAction" value="moveNavPoint"/>
|
|
||||||
<input type="hidden" name="request" value="updateData"/>
|
|
||||||
<p><?php echo $lang['struktur']['navNameMove'][0]; ?></p>
|
|
||||||
<input type="text" name="navName" id="navName" value="" disabled="disabled"/><br class="fix"/>
|
|
||||||
<p><?php echo $lang['struktur']['navNameMove'][1]; ?></p>
|
|
||||||
<input type="text" name="parentNavName" id="parentNavName" value="" disabled="disabled"/><br class="fix"/>
|
|
||||||
<div id="otherMain_box">
|
|
||||||
</div>
|
|
||||||
<div id="bottom">
|
|
||||||
<input type="button" class="submitButton formSubmit" value="<?php echo $lang['button']['save']; ?>">
|
|
||||||
<input data-show="Chooser" type="button" class="submitButton" value="<?php echo $lang['button']['cancel']; ?>"/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="actionSubmenu">
|
|
||||||
<input type="hidden" name="formAction" value="addSubNav"/>
|
|
||||||
<input type="hidden" name="request" value="insertData"/>
|
|
||||||
<p><?php echo $lang['struktur']['newSubMenu']; ?></p>
|
|
||||||
<input type="text" name="navName" id="navName" value="" disabled="disabled"/><br class="fix"/>
|
|
||||||
<label for="new_subnavName"><?php echo $lang['struktur']['newNavName']; ?></label><input type="text" name="new_subnavName" id="new_subnavName" value=""/><br class="fix"/>
|
|
||||||
<label for="new_subnavType"><?php echo $lang['struktur']['newNavType']; ?></label><select name="new_subnavType" id="new_subnavType" class="navigationType"></select><br class="fix"/>
|
|
||||||
<div id="bottom">
|
|
||||||
<input type="button" class="submitButton formSubmit" value="<?php echo $lang['button']['save']; ?>">
|
|
||||||
<input data-show="Chooser" type="button" class="submitButton" value="<?php echo $lang['button']['cancel']; ?>"/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="actionMenu">
|
|
||||||
<input type="hidden" name="formAction" value="addNavPoint"/>
|
|
||||||
<input type="hidden" name="request" value="insertData"/>
|
|
||||||
<p><?php echo $lang['struktur']['newMenu']; ?></p>
|
|
||||||
<input type="text" name="navName" id="navName" value="" disabled="disabled"/><br class="fix"/>
|
|
||||||
<label for="new_navName"><?php echo $lang['struktur']['newNavName']; ?></label><input type="text" name="new_navName" id="new_navName" value=""/><br class="fix"/>
|
|
||||||
<label for="new_navType"><?php echo $lang['struktur']['newNavType']; ?></label><select name="new_navType" id="new_navType" class="navigationType"></select><br class="fix"/>
|
|
||||||
<div id="bottom">
|
|
||||||
<input type="button" class="submitButton formSubmit" value="<?php echo $lang['button']['save']; ?>">
|
|
||||||
<input data-show="Chooser" type="button" class="submitButton" value="<?php echo $lang['button']['cancel']; ?>"/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
@@ -17,14 +17,18 @@ if (file_exists(dirname(__DIR__) . '/lang/lang-' . $_POST['lang'] . '.php'))
|
|||||||
include_once($includeFile);
|
include_once($includeFile);
|
||||||
|
|
||||||
?>
|
?>
|
||||||
<form id="editor_form" action="" method="post">
|
<div class="col-md-12">
|
||||||
<input type="hidden" name="userId" id="userId" value=""/>
|
<form id="csEditorForm" class="" action="" method="">
|
||||||
<input type="hidden" name="prefix" id="prefix" value=""/>
|
<input type="hidden" name="request" value="updateSubline"/>
|
||||||
<input type="hidden" name="dataSet" id="dataSet" value=""/>
|
<input type="hidden" name="sublineID" value=""/>
|
||||||
<input type="hidden" name="request" id="request" value="updateData"/>
|
<div class="row"> </div>
|
||||||
|
<textarea class="col-md-12" name="text" id="text"></textarea>
|
||||||
<input type="text" name="content" id="content" value="" class="subline"/>
|
<div class="clearfix"></div>
|
||||||
<div class="bottom">
|
<div class="row csEditorButtonGroup">
|
||||||
<input type="button" class="submitButton formSubmit" value="<?php echo $lang['button']['save']; ?>">
|
<div class="col-md-12">
|
||||||
|
<span class="formCancel btn btn-default pull-left"><?php echo $lang['button']['cancel']; ?></span>
|
||||||
|
<span class="formSubmit btn btn-default pull-right"><?php echo $lang['button']['save']; ?></span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
</div>
|
||||||
@@ -2,11 +2,10 @@
|
|||||||
/**
|
/**
|
||||||
* Created by CS medien- & kommunikationssysteme.
|
* Created by CS medien- & kommunikationssysteme.
|
||||||
* @author Christian Steinle
|
* @author Christian Steinle
|
||||||
* @date 09.09.2016
|
* @date 12.10.2016
|
||||||
*
|
*
|
||||||
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
* @copyright CS medien- & kommunikationssysteme (http://www.steinle-computer.de)
|
||||||
*/
|
*/
|
||||||
|
|
||||||
header('Access-Control-Allow-Origin: *');
|
header('Access-Control-Allow-Origin: *');
|
||||||
|
|
||||||
$includeFile = dirname(__DIR__) . '/lang/lang-' . $_POST['lang'] . '.php';
|
$includeFile = dirname(__DIR__) . '/lang/lang-' . $_POST['lang'] . '.php';
|
||||||
@@ -18,39 +17,18 @@ if (file_exists(dirname(__DIR__) . '/lang/lang-' . $_POST['lang'] . '.php'))
|
|||||||
include_once($includeFile);
|
include_once($includeFile);
|
||||||
|
|
||||||
?>
|
?>
|
||||||
<form id="editor_form" action="" method="post">
|
<div class="col-md-12">
|
||||||
<input type="hidden" name="userId" id="userId" value=""/>
|
<form id="csEditorForm" class="" action="" method="">
|
||||||
<input type="hidden" name="prefix" id="prefix" value=""/>
|
<input type="hidden" name="request" value="updateText"/>
|
||||||
<input type="hidden" name="dataSet" id="dataSet" value=""/>
|
<input type="hidden" name="textID" value=""/>
|
||||||
<input type="hidden" name="request" id="request" value="updateData"/>
|
<div class="row"> </div>
|
||||||
|
<textarea class="col-md-12" name="text" id="text"></textarea>
|
||||||
<textarea class="ckeditor" name="content" id="content"></textarea>
|
<div class="clearfix"></div>
|
||||||
<div class="bottom">
|
<div class="row csEditorButtonGroup">
|
||||||
<input type="button" class="submitButton formSubmit" value="<?php echo $lang['button']['save']; ?>">
|
<div class="col-md-12">
|
||||||
<input type="button" class="submitButton formCancel" value="<?php echo $lang['button']['cancel']; ?>">
|
<span class="formCancel btn btn-default pull-left"><?php echo $lang['button']['cancel']; ?></span>
|
||||||
|
<span class="formSubmit btn btn-default pull-right"><?php echo $lang['button']['save']; ?></span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<script>
|
|
||||||
initEditor();
|
|
||||||
|
|
||||||
function initEditor() {
|
|
||||||
if (editor.contentData === null) {
|
|
||||||
window.setTimeout(initEditor, 50);
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
CKEDITOR.replace('content', {
|
|
||||||
enterMode: CKEDITOR.ENTER_P,
|
|
||||||
extraPlugins: 'divarea',
|
|
||||||
height: '500px',
|
|
||||||
language: '<?php echo $_POST['lang']; ?>',
|
|
||||||
toolbarGroups: [
|
|
||||||
{name: 'clipboard', groups: ['clipboard', 'undo']},
|
|
||||||
{name: 'editing', groups: ['find', 'selection', 'spellchecker']},
|
|
||||||
{name: 'basicstyles', groups: ['basicstyles', 'cleanup']},
|
|
||||||
{name: 'paragraph', groups: ['list']},
|
|
||||||
{name: 'links'},
|
|
||||||
{name: 'about'}
|
|
||||||
]
|
|
||||||
});
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
</form>
|
</form>
|
||||||
|
</div>
|
||||||
Reference in New Issue
Block a user