ri-st/editors
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Abschluss: Wiederherstellung der Editoren-Technik (Behandlung von Bildern im Text), Korrektur Bilderhandling beim Löschen eines Keyvisual-Slider Elementes

Browse Source
This commit is contained in:
Christian Steinle
2016-09-28 13:27:09 +00:00
parent 3863497787
commit 0df5788f11
4 changed files with 127 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
js/editor.js
View File

@@ -119,10 +119,13 @@ var editor = new Object({
if (event.target.tagName === 'A' || event.target.tagName === 'SPAN') {
return true;
}
editor.type = event.currentTarget.dataset.editable;
if (editor.type === 'textimage') {
var tmpEditorType = event.currentTarget.dataset.editable;
if (tmpEditorType === 'textimage') {
return true;
}
editor.type = tmpEditorType;
editor.waitingElement.show();
editor.name = editor.type.toUpperCase();
editor.element = $(event.currentTarget).attr('id');
@@ -335,11 +338,15 @@ var editor = new Object({
editor.name = '';
editor.contentHtml = '';
editor.contentData = null;
editor.formElement = null;
editor.preventSortStop = false;
editor.element = null;
editor.titleElement.html(editor.title);
editor.layerElement.hide();
editor.contentElement.html('');
editor.waitingElement.hide();
},
callEditor: function () {
@@ -385,6 +392,7 @@ var editor = new Object({
dataType: 'json',
error: function () {
console.log(webserviceUrl);
console.log(editor.type);
alert('Fehler beim Holen der Editor-Daten!');
},
success: function (data) {
@@ -396,7 +404,7 @@ var editor = new Object({
fillHtml: function () {
if (editor.contentHtml === '' || editor.contentData === null) {
window.setTimeout(editor.fillHtml, 100);
window.setTimeout(editor.fillHtml, 50);
return;
}
@@ -404,9 +412,8 @@ var editor = new Object({
editor.fillSpielBericht();
editor.fillStandard();
}
else if (editor.type === 'keyvisual') {
else if (editor.type === 'keyvisual' || editor.type === 'image') {
imgEditor.setData(editor.contentData);
//editor.fillStandard();
}
else if (editor.type === 'struktur') {
navEditor.setData(editor.contentData);
@@ -755,7 +762,6 @@ var navEditor = new Object({
},
close: function () {
navEditor.structureHtml = '';
navEditor.navData = null;
navEditor.navPath = [];
navEditor.structureHtml = '';
@@ -886,8 +892,8 @@ var imgEditor = new Object({
imgEditor.sortCancelElement.click(function () {
imgEditor.enableEdit();
});
imgEditor.sortBoxElement.on('click', '.del_handle', function () {
imgEditor.enableDelete();
imgEditor.sortBoxElement.on('click', '.del_handle', function (event) {
imgEditor.enableDelete(event);
});
imgEditor.deleteCancelElement.click(function () {
imgEditor.enableEdit();
@@ -933,13 +939,24 @@ var imgEditor = new Object({
$('#navId', editor.contentElement).val(navigationId);
if (editor.type === 'keyvisual') {
$.each(imgEditor.imgIDs, function (key, value) {
if (key === 0) {
imgEditor.imgThumbElement.append('<li id="sort_' + value + '"><img src="' + imgEditor.imgPath + imgEditor.imgData[value].imgName + imgEditor.thumbSuffix + '.' + imgEditor.imgData[value].imgExtension + '" onclick="imgEditor.fillForm(' + value + ', ' + key + ');"/></li>');
return true;
}
imgEditor.imgThumbElement.append('<li id="sort_' + value + '"><img src="' + imgEditor.imgPath + imgEditor.imgData[value].imgName + imgEditor.thumbSuffix + '.' + imgEditor.imgData[value].imgExtension + '" onclick="imgEditor.fillForm(' + value + ', ' + key + ');"/><span class="del_handle">&nbsp;</span></li>');
});
if (imgEditor.imgCount === 0 || imgEditor.imgData[imgEditor.imgIDs[0]].hasSlider === 'Y') {
if (imgEditor.imgData[imgEditor.imgIDs[0]].hasSlider === 'Y') {
imgEditor.sortBoxElement.append('<img src="' + imgEditor.imgDummy.replace(imgEditor.imgDummyExtension, imgEditor.thumbSuffix + imgEditor.imgDummyExtension) + '" onclick="imgEditor.enableUpload();"/>');
}
}
else if (editor.type === 'image') {
imgEditor.imgData[imgEditor.imgIDs[0]].sliderContent = '';
imgEditor.imgData[imgEditor.imgIDs[0]].hasSlider = 'N';
imgEditor.fillForm(imgEditor.imgIDs[0], 0);
}
},
getSliderContent: function (sliderContents) {
@@ -1009,6 +1026,14 @@ var imgEditor = new Object({
containment: imgEditor.imagePlaceholder,
handles: 'se',
minWidth: (imgEditor.imgDimension.width * imgEditor.imgDimension.width / imgEditor.imgOrigDimension.width),
create: function() {
if(imgEditor.imagePreview.innerHeight() > imgEditor.editImage.innerHeight()) {
imgEditor.imagePreview.css({width: (imgEditor.imagePreview.innerWidth() * imgEditor.editImage.innerHeight() / imgEditor.imagePreview.innerHeight()), height: imgEditor.editImage.innerHeight() });
imgEditor.previewHeight.val(imgEditor.editImage.innerHeight());
imgEditor.previewWidth.val(imgEditor.imagePreview.innerWidth() * imgEditor.editImage.innerHeight() / imgEditor.imagePreview.innerHeight());
imgEditor.setCover();
}
},
resize: function (event, ui) {
imgEditor.previewHeight.val(ui.size.height);
imgEditor.previewWidth.val(ui.size.width);
@@ -1072,16 +1097,22 @@ var imgEditor = new Object({
imgEditor.disableUpload();
imgEditor.disableSorting();
imgEditor.formActionElement.val('updateData');
$('input', '.editFields').prop('disabled', false);
$('.editFields').show();
},
enableDelete: function () {
enableDelete: function (event) {
imgEditor.deleteActive = true;
imgEditor.disableEdit();
imgEditor.disableUpload();
imgEditor.disableSorting();
$('#dataSet').val($(event.target).parent('li').attr('id').replace('sort', editor.type));
$('#firstImage').val($('li:first-of-type', imgEditor.imgThumbElement).attr('id').replace('sort_', ''));
$('#request').val('deleteData');
$('input', '.deleteFields').prop('disabled', false);
$('.deleteFields').show();
},
@@ -1096,6 +1127,8 @@ var imgEditor = new Object({
imgEditor.disableDelete();
imgEditor.disableSorting();
imgEditor.formActionElement.val('updateData');
$('input', '.uploadFields').prop('disabled', false);
$('.uploadFields').show();
},
@@ -1146,6 +1179,10 @@ var imgEditor = new Object({
}
imgEditor.uploadSource = fileEvent.target.result;
if (imgEditor.imgThumbElement.is(':ui-resizable')) {
imgEditor.imgThumbElement.resizable('destroy');
}
imgEditor.enableEdit();
imgEditor.fillForm(-1, -1);
@@ -1229,8 +1266,10 @@ var imgEditor = new Object({
if (imgEditor.imgThumbElement.is(':ui-sortable')) {
imgEditor.imgThumbElement.sortable('destroy');
$.each($('li', imgEditor.imgThumbElement), function () {
$.each($('li', imgEditor.imgThumbElement), function (key) {
if (key > 0) {
$(this).append('<span class="del_handle">&nbsp;</span>');
}
$('.sort_handle', this).remove();
});
}
@@ -1242,7 +1281,7 @@ var imgEditor = new Object({
close: function () {
imgEditor.isFirst = true;
imgEditor.imgCount = 1;
imgEditor.imgCount = 0;
imgEditor.imgIDs = [];
imgEditor.imgData = {};
imgEditor.imgPath = '';
@@ -1253,9 +1292,14 @@ var imgEditor = new Object({
imgEditor.imgDimension = {};
imgEditor.imgOrigDimension = {};
imgEditor.thumbDimension = {};
imgEditor.coverDimension = {};
imgEditor.uploadSource = '';
imgEditor.chosenThumb = -1;
imgEditor.editActive = true;
imgEditor.sortActive = false;
imgEditor.deleteActive = false;
imgEditor.uploadActive = false;
imgEditor.imgThumbElement = null;
imgEditor.dataSetElement = null;
@@ -1264,7 +1308,6 @@ var imgEditor = new Object({
imgEditor.sortButtonElement = null;
imgEditor.sortCancelElement = null;
imgEditor.deleteCancelElement = null;
imgEditor.uploadCancelElement = null;
imgEditor.rightBoxElement = null;
imgEditor.formActionElement = null;
imgEditor.imagePlaceholder = null;
@@ -1280,6 +1323,4 @@ var imgEditor = new Object({
imgEditor.previewWidth = null;
imgEditor.editImage = null;
}
});

4
lang/lang-de.php
View File

@@ -73,9 +73,11 @@ $lang['image']['editHint'] = 'Durch Klick auf ein Vorschaubild, können die Date
$lang['image']['sort'] = 'Sortieren';
$lang['image']['imageName'] = 'Bildname';
$lang['image']['imageTitle'] = 'Bildtitel';
$lang['image']['imageType'] = 'Keyvisual-Typ';
$lang['image']['keyvisualType'] = 'Keyvisual-Typ';
$lang['image']['imageType'] = 'Bild-Typ';
$lang['image']['imageSingle'] = 'Einzelbild';
$lang['image']['imageSlider'] = 'Slider';
$lang['image']['imageMore'] = 'Weitere Galeriebilder';
$lang['image']['deleteHeadLine'] = 'Löschen eines Bildes!';
$lang['image']['deleteHint'] = 'Wollen Sie das ausgewählte Bild wirklich löschen?<br/>';
$lang['image']['sortHeadLine'] = 'Speichern der Bildreihenfolge!';

56
templates/image.php Normal file
View File

@@ -0,0 +1,56 @@
<?php
/**
* Created by CS medien- & kommunikationssysteme.
* @author Christian Steinle
* @date 27.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="navId" id="navId" value=""/>
<input type="hidden" name="dataSet" id="dataSet" value=""/>
<input type="hidden" name="request" id="request" value="updateData"/>
<input type="hidden" name="imgExtension" id="imgExtension" value=""/>
<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="hasSlider" value="N"/>
<input type="hidden" name="sliderContent" value=""/>
<div>
<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>
<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/>
<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 formCancel" value="<?php echo $lang['button']['cancel']; ?>">
</div>
</div>

7
templates/keyvisual.php
View File

@@ -50,8 +50,11 @@ include_once($includeFile);
<div class="rightBox deleteFields box">
<h1><?php echo $lang['image']['deleteHeadLine']; ?></h1>
<p><?php echo $lang['image']['deleteHint']; ?></p>
<input type="button" class="submitButton" value="<?php echo $lang['button']['save']; ?>">
<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"/>&nbsp;<br/>
</div>
<div class="rightBox sortFields box">
@@ -87,7 +90,7 @@ include_once($includeFile);
<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']['imageType']; ?></label>
<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>