first commit
This commit is contained in:
salam committed
commit
1218dd1517
12716 files changed
+989233
No files matched your search
@@ -0,0 +1,13 @@
|
||||
/*!
|
||||
* This file is part of the TYPO3 CMS project.
|
||||
*
|
||||
* It is free software; you can redistribute it and/or modify it under
|
||||
* the terms of the GNU General Public License, either version 2
|
||||
* of the License, or any later version.
|
||||
*
|
||||
* For the full copyright and license information, please read the
|
||||
* LICENSE.txt file that was distributed with this source code.
|
||||
*
|
||||
* The TYPO3 project - inspiring people to share!
|
||||
*/
|
||||
body{overflow-y:scroll}.t3-form-x-component{position:absolute;top:0;height:100%;line-height:normal;background:#f5f5f5}.t3-form-x-component a{text-decoration:none}.t3-form-x-component ol,.t3-form-x-component ul:not(.dropdown-menu){list-style:none;padding:0}.t3-form-x-component .ui-sortable-placeholder{outline-offset:-1px!important}.t3-form-x-component-inner-wrapper{position:relative;padding:1.5em}#t3-form-navigation-component{overflow:hidden;left:0}#t3-form-structure-panel{overflow:auto;padding-top:65px;height:100%}#t3-form-structure-panel .icon{z-index:1}#t3-form-structure-panel #t3-form-navigation-component-tree-root-container,#t3-form-structure-panel .tree li>div{border:1px solid transparent;cursor:pointer}#t3-form-structure-panel .tree .svg-wrapper svg{overflow:visible;position:relative;top:-.8em;left:.6em}#t3-form-structure-panel .tree .svg-wrapper path{fill:none;shape-rendering:crispEdges;stroke:#ddd;stroke-width:1}#t3-form-structure-panel .tree li{white-space:nowrap}#t3-form-structure-panel .tree li .icon-actions-pagetree-collapse{margin-right:.3em}#t3-form-structure-panel .tree li .icon-actions-pagetree-collapse img{-webkit-transform:rotate(90deg);transform:rotate(90deg);-webkit-transition:-webkit-transform .2s;transition:-webkit-transform .2s;transition:transform .2s;transition:transform .2s,-webkit-transform .2s}#t3-form-structure-panel .tree li.mjs-nestedSortable-collapsed>ol{display:none}#t3-form-structure-panel .tree li.mjs-nestedSortable-collapsed .icon-actions-pagetree-collapse img{-webkit-transform:rotate(0);transform:rotate(0);-webkit-transition:-webkit-transform .2s;transition:-webkit-transform .2s;transition:transform .2s;transition:transform .2s,-webkit-transform .2s}#t3-form-structure-panel .tree li small{padding-left:.5em;font-size:80%}#t3-form-structure-panel .tree .t3-form-icon{margin-right:.5em;margin-left:.5em}#t3-form-structure-panel .tree .t3-form-element-has-children>div .t3-form-icon{margin-left:.1em}#t3-form-structure-panel .tree .sortable-hover{outline:1px solid #aaa}#t3-form-structure-panel .icon{margin-top:1px}#t3-form-structure-panel #t3-form-navigation-component-tree-root-container,#t3-form-structure-panel .tree li>div{height:20px}#t3-form-structure-panel #t3-form-navigation-component-tree-root-container>span,#t3-form-structure-panel .tree li>div>span{display:inline-block;vertical-align:top;line-height:20px}#t3-form-structure-panel #t3-form-navigation-component-tree-root{width:90%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#t3-form-structure-panel #t3-form-navigation-component-tree-root-container:hover,#t3-form-structure-panel .t3-form-form-element-selected,#t3-form-structure-panel .t3-form-root-element-selected,#t3-form-structure-panel .tree li>div:hover{background-color:#f2f2f2;border-color:#dcdbdb;border-radius:2px;margin-left:-20px;padding-left:20px;margin-right:-1.3em}#t3-form-structure-panel #t3-form-navigation-component-tree-root-container.t3-form-root-element-selected,#t3-form-structure-panel #t3-form-navigation-component-tree-root-container.t3-form-root-element-selected:hover,#t3-form-structure-panel .tree li>.t3-form-form-element-selected,#t3-form-structure-panel .tree li>.t3-form-form-element-selected:hover{background-color:#fff;border-color:#dcdbdb}#t3-form-structure-panel .t3-form-x-component-inner-wrapper{padding-top:2.5em}#t3-form-structure-panel .ui-sortable-helper #t3-form-navigation-component-tree-root-container:hover,#t3-form-structure-panel .ui-sortable-helper .t3-form-form-element-selected,#t3-form-structure-panel .ui-sortable-helper .t3-form-root-element-selected,#t3-form-structure-panel .ui-sortable-helper>div:hover{background-color:transparent!important;border-color:transparent!important}#t3-form-structure-panel .ui-sortable-helper svg{opacity:0}#t3-form-structure-panel .mjs-nestedSortable-branch span[data-identifier=treeExpander]{margin-left:-1.7em}#t3-form-structure-panel .mjs-nestedSortable-leaf span.t3-form-icon{margin-left:initial}.form-group.t3-form-collection-element-remove-button,.form-group.t3-form-inspector-validators-editor-removeButton,.t3-form-inspector-finishers-editor-removeButton{margin:0!important;font-size:0}#t3-form-inspector-panels-container{overflow:hidden;right:0;padding-top:65px}#t3-form-inspector-panels{overflow:auto;height:100%}#t3-form-inspector{padding:1em .5em}#t3-form-inspector h2,#t3-form-inspector h3,#t3-form-inspector h4{margin:0;padding:.1em .2em .2em .5em;border-top:1px solid #c3c3c3;clear:both;font:inherit;font-weight:700}#t3-form-inspector h2{padding-bottom:1em;border:none;border-bottom:1px solid #c3c3c3}#t3-form-inspector>h2:first-child{border-top:none}#t3-form-inspector h3{color:#000;padding-top:.3em;border:none}#t3-form-inspector h4{padding:.8em 3em .8em 4em;font-weight:500;background-color:#ddd}#t3-form-inspector h4 span[data-template-property=label]{vertical-align:top}#t3-form-inspector .icon-size-small{line-height:1.5}#t3-form-inspector .input-group-btn{position:static}#t3-form-inspector .t3-Line truncated
|
||||
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="#3B7EB0" d="M0 0h64v64H0z"/><path fill="#FFF" d="M14 14h32v36H14z"/><path fill="#3B7EB0" d="M22 42h8v4h-8z"/><path opacity=".5" fill="#3B7EB0" d="M32 42h8v4h-8z"/><path fill="#3B7EB0" d="M22 18h14v2H22zM22 32h2v2h-2zM22 36h2v2h-2z"/><path opacity=".5" fill="#3B7EB0" d="M26 32h16v2H26zM26 36h16v2H26zM22 22h20v8H22z"/><path fill="#3B7EB0" d="M14 14h4v4h-4z"/><path opacity=".5" fill="#3B7EB0" d="M16 14h2v36h-2z"/></svg>
|
||||
|
After Width: | Height: | Size: 492 B |
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="#3B7EB0" d="M0 0h64v64H0z"/><path fill="#FFF" d="M14 14h32v36H14z"/><path fill="#3B7EB0" d="M22 42h8v4h-8z"/><path opacity=".5" fill="#3B7EB0" d="M32 42h8v4h-8z"/><path fill="#3B7EB0" d="M22 18h14v2H22zM22 32h2v2h-2zM22 36h2v2h-2z"/><path opacity=".5" fill="#3B7EB0" d="M26 32h16v2H26zM26 36h16v2H26zM22 22h20v8H22z"/><path fill="#3B7EB0" d="M14 14h4v4h-4z"/><path opacity=".5" fill="#3B7EB0" d="M16 14h2v36h-2z"/></svg>
|
||||
|
After Width: | Height: | Size: 492 B |
+911
@@ -0,0 +1,911 @@
|
||||
/*
|
||||
* jQuery UI Nested Sortable
|
||||
* v 2.1a / 2016-02-04
|
||||
* https://github.com/ilikenwf/nestedSortable
|
||||
*
|
||||
* Depends on:
|
||||
* jquery.ui.sortable.js 1.10+
|
||||
*
|
||||
* Copyright (c) 2010-2016 Manuele J Sarfatti and contributors
|
||||
* Licensed under the MIT License
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
*/
|
||||
(function(factory) {
|
||||
"use strict";
|
||||
|
||||
if (typeof define === "function" && define.amd) {
|
||||
|
||||
// AMD. Register as an anonymous module.
|
||||
define([
|
||||
"jquery",
|
||||
"jquery-ui/sortable"
|
||||
], factory);
|
||||
} else {
|
||||
|
||||
// Browser globals
|
||||
factory(window.jQuery);
|
||||
}
|
||||
}(function($) {
|
||||
"use strict";
|
||||
|
||||
function isOverAxis(x, reference, size) {
|
||||
return (x > reference) && (x < (reference + size));
|
||||
}
|
||||
|
||||
$.widget("mjs.nestedSortable", $.extend({}, $.ui.sortable.prototype, {
|
||||
|
||||
options: {
|
||||
disableParentChange: false,
|
||||
doNotClear: false,
|
||||
expandOnHover: 700,
|
||||
isAllowed: function() {
|
||||
return true;
|
||||
},
|
||||
isTree: false,
|
||||
listType: "ol",
|
||||
maxLevels: 0,
|
||||
protectRoot: false,
|
||||
rootID: null,
|
||||
rtl: false,
|
||||
startCollapsed: false,
|
||||
tabSize: 20,
|
||||
|
||||
branchClass: "mjs-nestedSortable-branch",
|
||||
collapsedClass: "mjs-nestedSortable-collapsed",
|
||||
disableNestingClass: "mjs-nestedSortable-no-nesting",
|
||||
errorClass: "mjs-nestedSortable-error",
|
||||
expandedClass: "mjs-nestedSortable-expanded",
|
||||
hoveringClass: "mjs-nestedSortable-hovering",
|
||||
leafClass: "mjs-nestedSortable-leaf",
|
||||
disabledClass: "mjs-nestedSortable-disabled"
|
||||
},
|
||||
|
||||
_create: function() {
|
||||
var self = this,
|
||||
err;
|
||||
|
||||
this.element.data("ui-sortable", this.element.data("mjs-nestedSortable"));
|
||||
|
||||
// mjs - prevent browser from freezing if the HTML is not correct
|
||||
if (!this.element.is(this.options.listType)) {
|
||||
err = "nestedSortable: " +
|
||||
"Please check that the listType option is set to your actual list type";
|
||||
|
||||
throw new Error(err);
|
||||
}
|
||||
|
||||
// if we have a tree with expanding/collapsing functionality,
|
||||
// force 'intersect' tolerance method
|
||||
if (this.options.isTree && this.options.expandOnHover) {
|
||||
this.options.tolerance = "intersect";
|
||||
}
|
||||
|
||||
$.ui.sortable.prototype._create.apply(this, arguments);
|
||||
|
||||
// prepare the tree by applying the right classes
|
||||
// (the CSS is responsible for actual hide/show functionality)
|
||||
if (this.options.isTree) {
|
||||
$(this.items).each(function() {
|
||||
var $li = this.item,
|
||||
hasCollapsedClass = $li.hasClass(self.options.collapsedClass),
|
||||
hasExpandedClass = $li.hasClass(self.options.expandedClass);
|
||||
|
||||
if ($li.children(self.options.listType).length) {
|
||||
$li.addClass(self.options.branchClass);
|
||||
// expand/collapse class only if they have children
|
||||
|
||||
if (!hasCollapsedClass && !hasExpandedClass) {
|
||||
if (self.options.startCollapsed) {
|
||||
$li.addClass(self.options.collapsedClass);
|
||||
} else {
|
||||
$li.addClass(self.options.expandedClass);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
$li.addClass(self.options.leafClass);
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
_destroy: function() {
|
||||
this.element
|
||||
.removeData("mjs-nestedSortable")
|
||||
.removeData("ui-sortable");
|
||||
return $.ui.sortable.prototype._destroy.apply(this, arguments);
|
||||
},
|
||||
|
||||
_mouseDrag: function(event) {
|
||||
var i,
|
||||
item,
|
||||
itemElement,
|
||||
intersection,
|
||||
self = this,
|
||||
o = this.options,
|
||||
scrolled = false,
|
||||
$document = $(document),
|
||||
previousTopOffset,
|
||||
parentItem,
|
||||
level,
|
||||
childLevels,
|
||||
itemAfter,
|
||||
itemBefore,
|
||||
newList,
|
||||
method,
|
||||
a,
|
||||
previousItem,
|
||||
nextItem,
|
||||
helperIsNotSibling;
|
||||
|
||||
//Compute the helpers position
|
||||
this.position = this._generatePosition(event);
|
||||
this.positionAbs = this._convertPositionTo("absolute");
|
||||
|
||||
if (!this.lastPositionAbs) {
|
||||
this.lastPositionAbs = this.positionAbs;
|
||||
}
|
||||
|
||||
//Do scrolling
|
||||
if (this.options.scroll) {
|
||||
if (this.scrollParent[0] !== document && this.scrollParent[0].tagName !== "HTML") {
|
||||
|
||||
if (
|
||||
(
|
||||
this.overflowOffset.top +
|
||||
this.scrollParent[0].offsetHeight
|
||||
) -
|
||||
event.pageY <
|
||||
o.scrollSensitivity
|
||||
) {
|
||||
scrolled = this.scrollParent.scrollTop() + o.scrollSpeed;
|
||||
this.scrollParent.scrollTop(scrolled);
|
||||
} else if (
|
||||
event.pageY -
|
||||
this.overflowOffset.top <
|
||||
o.scrollSensitivity
|
||||
) {
|
||||
scrolled = this.scrollParent.scrollTop() - o.scrollSpeed;
|
||||
this.scrollParent.scrollTop(scrolled);
|
||||
}
|
||||
|
||||
if (
|
||||
(
|
||||
this.overflowOffset.left +
|
||||
this.scrollParent[0].offsetWidth
|
||||
) -
|
||||
event.pageX <
|
||||
o.scrollSensitivity
|
||||
) {
|
||||
scrolled = this.scrollParent.scrollLeft() + o.scrollSpeed;
|
||||
this.scrollParent.scrollLeft(scrolled);
|
||||
} else if (
|
||||
event.pageX -
|
||||
this.overflowOffset.left <
|
||||
o.scrollSensitivity
|
||||
) {
|
||||
scrolled = this.scrollParent.scrollLeft() - o.scrollSpeed;
|
||||
this.scrollParent.scrollLeft(scrolled);
|
||||
}
|
||||
|
||||
} else {
|
||||
|
||||
if (
|
||||
event.pageY -
|
||||
$document.scrollTop() <
|
||||
o.scrollSensitivity
|
||||
) {
|
||||
scrolled = $document.scrollTop() - o.scrollSpeed;
|
||||
$document.scrollTop(scrolled);
|
||||
} else if (
|
||||
$(window).height() -
|
||||
(
|
||||
event.pageY -
|
||||
$document.scrollTop()
|
||||
) <
|
||||
o.scrollSensitivity
|
||||
) {
|
||||
scrolled = $document.scrollTop() + o.scrollSpeed;
|
||||
$document.scrollTop(scrolled);
|
||||
}
|
||||
|
||||
if (
|
||||
event.pageX -
|
||||
$document.scrollLeft() <
|
||||
o.scrollSensitivity
|
||||
) {
|
||||
scrolled = $document.scrollLeft() - o.scrollSpeed;
|
||||
$document.scrollLeft(scrolled);
|
||||
} else if (
|
||||
$(window).width() -
|
||||
(
|
||||
event.pageX -
|
||||
$document.scrollLeft()
|
||||
) <
|
||||
o.scrollSensitivity
|
||||
) {
|
||||
scrolled = $document.scrollLeft() + o.scrollSpeed;
|
||||
$document.scrollLeft(scrolled);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if (scrolled !== false && $.ui.ddmanager && !o.dropBehaviour) {
|
||||
$.ui.ddmanager.prepareOffsets(this, event);
|
||||
}
|
||||
}
|
||||
|
||||
//Regenerate the absolute position used for position checks
|
||||
this.positionAbs = this._convertPositionTo("absolute");
|
||||
|
||||
// mjs - find the top offset before rearrangement,
|
||||
previousTopOffset = this.placeholder.offset().top;
|
||||
|
||||
//Set the helper position
|
||||
if (!this.options.axis || this.options.axis !== "y") {
|
||||
this.helper[0].style.left = this.position.left + "px";
|
||||
}
|
||||
if (!this.options.axis || this.options.axis !== "x") {
|
||||
this.helper[0].style.top = (this.position.top) + "px";
|
||||
}
|
||||
|
||||
// mjs - check and reset hovering state at each cycle
|
||||
this.hovering = this.hovering ? this.hovering : null;
|
||||
this.mouseentered = this.mouseentered ? this.mouseentered : false;
|
||||
|
||||
// mjs - let's start caching some variables
|
||||
(function() {
|
||||
var _parentItem = this.placeholder.parent().parent();
|
||||
if (_parentItem && _parentItem.closest(".ui-sortable").length) {
|
||||
parentItem = _parentItem;
|
||||
}
|
||||
}.call(this));
|
||||
|
||||
level = this._getLevel(this.placeholder);
|
||||
childLevels = this._getChildLevels(this.helper);
|
||||
newList = document.createElement(o.listType);
|
||||
|
||||
//Rearrange
|
||||
for (i = this.items.length - 1; i >= 0; i--) {
|
||||
|
||||
//Cache variables and intersection, continue if no intersection
|
||||
item = this.items[i];
|
||||
itemElement = item.item[0];
|
||||
intersection = this._intersectsWithPointer(item);
|
||||
if (!intersection) {
|
||||
continue;
|
||||
}
|
||||
|
||||
// Only put the placeholder inside the current Container, skip all
|
||||
// items form other containers. This works because when moving
|
||||
// an item from one container to another the
|
||||
// currentContainer is switched before the placeholder is moved.
|
||||
//
|
||||
// Without this moving items in "sub-sortables" can cause the placeholder to jitter
|
||||
// beetween the outer and inner container.
|
||||
if (item.instance !== this.currentContainer) {
|
||||
continue;
|
||||
}
|
||||
|
||||
// No action if intersected item is disabled
|
||||
// and the element above or below in the direction we're going is also disabled
|
||||
if (itemElement.className.indexOf(o.disabledClass) !== -1) {
|
||||
// Note: intersection hardcoded direction values from
|
||||
// jquery.ui.sortable.js:_intersectsWithPointer
|
||||
if (intersection === 2) {
|
||||
// Going down
|
||||
itemAfter = this.items[i + 1];
|
||||
if (itemAfter && itemAfter.item.hasClass(o.disabledClass)) {
|
||||
continue;
|
||||
}
|
||||
|
||||
} else if (intersection === 1) {
|
||||
// Going up
|
||||
itemBefore = this.items[i - 1];
|
||||
if (itemBefore && itemBefore.item.hasClass(o.disabledClass)) {
|
||||
continue;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
method = intersection === 1 ? "next" : "prev";
|
||||
|
||||
// cannot intersect with itself
|
||||
// no useless actions that have been done before
|
||||
// no action if the item moved is the parent of the item checked
|
||||
if (itemElement !== this.currentItem[0] &&
|
||||
this.placeholder[method]()[0] !== itemElement &&
|
||||
!$.contains(this.placeholder[0], itemElement) &&
|
||||
(
|
||||
this.options.type === "semi-dynamic" ?
|
||||
!$.contains(this.element[0], itemElement) :
|
||||
true
|
||||
)
|
||||
) {
|
||||
|
||||
// mjs - we are intersecting an element:
|
||||
// trigger the mouseenter event and store this state
|
||||
if (!this.mouseentered) {
|
||||
$(itemElement).mouseenter();
|
||||
this.mouseentered = true;
|
||||
}
|
||||
|
||||
// mjs - if the element has children and they are hidden,
|
||||
// show them after a delay (CSS responsible)
|
||||
if (o.isTree && $(itemElement).hasClass(o.collapsedClass) && o.expandOnHover) {
|
||||
if (!this.hovering) {
|
||||
$(itemElement).addClass(o.hoveringClass);
|
||||
this.hovering = window.setTimeout(function() {
|
||||
$(itemElement)
|
||||
.removeClass(o.collapsedClass)
|
||||
.addClass(o.expandedClass);
|
||||
|
||||
self.refreshPositions();
|
||||
self._trigger("expand", event, self._uiHash());
|
||||
}, o.expandOnHover);
|
||||
}
|
||||
}
|
||||
|
||||
this.direction = intersection === 1 ? "down" : "up";
|
||||
|
||||
// mjs - rearrange the elements and reset timeouts and hovering state
|
||||
if (this.options.tolerance === "pointer" || this._intersectsWithSides(item)) {
|
||||
$(itemElement).mouseleave();
|
||||
this.mouseentered = false;
|
||||
$(itemElement).removeClass(o.hoveringClass);
|
||||
if (this.hovering) {
|
||||
window.clearTimeout(this.hovering);
|
||||
}
|
||||
this.hovering = null;
|
||||
|
||||
// mjs - do not switch container if
|
||||
// it's a root item and 'protectRoot' is true
|
||||
// or if it's not a root item but we are trying to make it root
|
||||
if (o.protectRoot &&
|
||||
!(
|
||||
this.currentItem[0].parentNode === this.element[0] &&
|
||||
// it's a root item
|
||||
itemElement.parentNode !== this.element[0]
|
||||
// it's intersecting a non-root item
|
||||
)
|
||||
) {
|
||||
if (this.currentItem[0].parentNode !== this.element[0] &&
|
||||
itemElement.parentNode === this.element[0]
|
||||
) {
|
||||
|
||||
if (!$(itemElement).children(o.listType).length) {
|
||||
itemElement.appendChild(newList);
|
||||
if (o.isTree) {
|
||||
$(itemElement)
|
||||
.removeClass(o.leafClass)
|
||||
.addClass(o.branchClass + " " + o.expandedClass);
|
||||
}
|
||||
}
|
||||
|
||||
if (this.direction === "down") {
|
||||
a = $(itemElement).prev().children(o.listType);
|
||||
} else {
|
||||
a = $(itemElement).children(o.listType);
|
||||
}
|
||||
|
||||
if (a[0] !== undefined) {
|
||||
this._rearrange(event, null, a);
|
||||
}
|
||||
|
||||
} else {
|
||||
this._rearrange(event, item);
|
||||
}
|
||||
} else if (!o.protectRoot) {
|
||||
this._rearrange(event, item);
|
||||
}
|
||||
} else {
|
||||
break;
|
||||
}
|
||||
|
||||
// Clear emtpy ul's/ol's
|
||||
this._clearEmpty(itemElement);
|
||||
|
||||
this._trigger("change", event, this._uiHash());
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// mjs - to find the previous sibling in the list,
|
||||
// keep backtracking until we hit a valid list item.
|
||||
(function() {
|
||||
var _previousItem = this.placeholder.prev();
|
||||
if (_previousItem.length) {
|
||||
previousItem = _previousItem;
|
||||
} else {
|
||||
previousItem = null;
|
||||
}
|
||||
}.call(this));
|
||||
|
||||
if (previousItem != null) {
|
||||
while (
|
||||
previousItem[0].nodeName.toLowerCase() !== "li" ||
|
||||
previousItem[0].className.indexOf(o.disabledClass) !== -1 ||
|
||||
previousItem[0] === this.currentItem[0] ||
|
||||
previousItem[0] === this.helper[0]
|
||||
) {
|
||||
if (previousItem[0].previousSibling) {
|
||||
previousItem = $(previousItem[0].previousSibling);
|
||||
} else {
|
||||
previousItem = null;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// mjs - to find the next sibling in the list,
|
||||
// keep stepping forward until we hit a valid list item.
|
||||
(function() {
|
||||
var _nextItem = this.placeholder.next();
|
||||
if (_nextItem.length) {
|
||||
nextItem = _nextItem;
|
||||
} else {
|
||||
nextItem = null;
|
||||
}
|
||||
}.call(this));
|
||||
|
||||
if (nextItem != null) {
|
||||
while (
|
||||
nextItem[0].nodeName.toLowerCase() !== "li" ||
|
||||
nextItem[0].className.indexOf(o.disabledClass) !== -1 ||
|
||||
nextItem[0] === this.currentItem[0] ||
|
||||
nextItem[0] === this.helper[0]
|
||||
) {
|
||||
if (nextItem[0].nextSibling) {
|
||||
nextItem = $(nextItem[0].nextSibling);
|
||||
} else {
|
||||
nextItem = null;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.beyondMaxLevels = 0;
|
||||
|
||||
// mjs - if the item is moved to the left, send it one level up
|
||||
// but only if it's at the bottom of the list
|
||||
if (parentItem != null &&
|
||||
nextItem == null &&
|
||||
!(o.protectRoot && parentItem[0].parentNode == this.element[0]) &&
|
||||
(
|
||||
o.rtl &&
|
||||
(
|
||||
this.positionAbs.left +
|
||||
this.helper.outerWidth() > parentItem.offset().left +
|
||||
parentItem.outerWidth()
|
||||
) ||
|
||||
!o.rtl && (this.positionAbs.left < parentItem.offset().left)
|
||||
)
|
||||
) {
|
||||
|
||||
parentItem.after(this.placeholder[0]);
|
||||
helperIsNotSibling = !parentItem
|
||||
.children(o.listItem)
|
||||
.children("li:visible:not(.ui-sortable-helper)")
|
||||
.length;
|
||||
if (o.isTree && helperIsNotSibling) {
|
||||
parentItem
|
||||
.removeClass(this.options.branchClass + " " + this.options.expandedClass)
|
||||
.addClass(this.options.leafClass);
|
||||
}
|
||||
if (typeof parentItem !== 'undefined')
|
||||
this._clearEmpty(parentItem[0]);
|
||||
this._trigger("change", event, this._uiHash());
|
||||
// mjs - if the item is below a sibling and is moved to the right,
|
||||
// make it a child of that sibling
|
||||
} else if (previousItem != null &&
|
||||
!previousItem.hasClass(o.disableNestingClass) &&
|
||||
(
|
||||
previousItem.children(o.listType).length &&
|
||||
previousItem.children(o.listType).is(":visible") ||
|
||||
!previousItem.children(o.listType).length
|
||||
) &&
|
||||
!(o.protectRoot && this.currentItem[0].parentNode === this.element[0]) &&
|
||||
(
|
||||
o.rtl &&
|
||||
(
|
||||
this.positionAbs.left +
|
||||
this.helper.outerWidth() <
|
||||
previousItem.offset().left +
|
||||
previousItem.outerWidth() -
|
||||
o.tabSize
|
||||
) ||
|
||||
!o.rtl &&
|
||||
(this.positionAbs.left > previousItem.offset().left + o.tabSize)
|
||||
)
|
||||
) {
|
||||
|
||||
this._isAllowed(previousItem, level, level + childLevels + 1);
|
||||
|
||||
if (!previousItem.children(o.listType).length) {
|
||||
previousItem[0].appendChild(newList);
|
||||
if (o.isTree) {
|
||||
previousItem
|
||||
.removeClass(o.leafClass)
|
||||
.addClass(o.branchClass + " " + o.expandedClass);
|
||||
}
|
||||
}
|
||||
|
||||
// mjs - if this item is being moved from the top, add it to the top of the list.
|
||||
if (previousTopOffset && (previousTopOffset <= previousItem.offset().top)) {
|
||||
previousItem.children(o.listType).prepend(this.placeholder);
|
||||
} else {
|
||||
// mjs - otherwise, add it to the bottom of the list.
|
||||
previousItem.children(o.listType)[0].appendChild(this.placeholder[0]);
|
||||
}
|
||||
if (typeof parentItem !== 'undefined')
|
||||
this._clearEmpty(parentItem[0]);
|
||||
this._trigger("change", event, this._uiHash());
|
||||
} else {
|
||||
this._isAllowed(parentItem, level, level + childLevels);
|
||||
}
|
||||
|
||||
//Post events to containers
|
||||
this._contactContainers(event);
|
||||
|
||||
//Interconnect with droppables
|
||||
if ($.ui.ddmanager) {
|
||||
$.ui.ddmanager.drag(this, event);
|
||||
}
|
||||
|
||||
//Call callbacks
|
||||
this._trigger("sort", event, this._uiHash());
|
||||
|
||||
this.lastPositionAbs = this.positionAbs;
|
||||
return false;
|
||||
|
||||
},
|
||||
|
||||
_mouseStop: function(event) {
|
||||
// mjs - if the item is in a position not allowed, send it back
|
||||
if (this.beyondMaxLevels) {
|
||||
|
||||
this.placeholder.removeClass(this.options.errorClass);
|
||||
|
||||
if (this.domPosition.prev) {
|
||||
$(this.domPosition.prev).after(this.placeholder);
|
||||
} else {
|
||||
$(this.domPosition.parent).prepend(this.placeholder);
|
||||
}
|
||||
|
||||
this._trigger("revert", event, this._uiHash());
|
||||
|
||||
}
|
||||
|
||||
// mjs - clear the hovering timeout, just to be sure
|
||||
$("." + this.options.hoveringClass)
|
||||
.mouseleave()
|
||||
.removeClass(this.options.hoveringClass);
|
||||
|
||||
this.mouseentered = false;
|
||||
if (this.hovering) {
|
||||
window.clearTimeout(this.hovering);
|
||||
}
|
||||
this.hovering = null;
|
||||
|
||||
this._relocate_event = event;
|
||||
this._pid_current = $(this.domPosition.parent).parent().attr("id");
|
||||
this._sort_current = this.domPosition.prev ? $(this.domPosition.prev).next().index() : 0;
|
||||
$.ui.sortable.prototype._mouseStop.apply(this, arguments); //asybnchronous execution, @see _clear for the relocate event.
|
||||
},
|
||||
|
||||
// mjs - this function is slightly modified
|
||||
// to make it easier to hover over a collapsed element and have it expand
|
||||
_intersectsWithSides: function(item) {
|
||||
|
||||
var half = this.options.isTree ? .8 : .5,
|
||||
isOverBottomHalf = isOverAxis(
|
||||
this.positionAbs.top + this.offset.click.top,
|
||||
item.top + (item.height * half),
|
||||
item.height
|
||||
),
|
||||
isOverTopHalf = isOverAxis(
|
||||
this.positionAbs.top + this.offset.click.top,
|
||||
item.top - (item.height * half),
|
||||
item.height
|
||||
),
|
||||
isOverRightHalf = isOverAxis(
|
||||
this.positionAbs.left + this.offset.click.left,
|
||||
item.left + (item.width / 2),
|
||||
item.width
|
||||
),
|
||||
verticalDirection = this._getDragVerticalDirection(),
|
||||
horizontalDirection = this._getDragHorizontalDirection();
|
||||
|
||||
if (this.floating && horizontalDirection) {
|
||||
return (
|
||||
(horizontalDirection === "right" && isOverRightHalf) ||
|
||||
(horizontalDirection === "left" && !isOverRightHalf)
|
||||
);
|
||||
} else {
|
||||
return verticalDirection && (
|
||||
(verticalDirection === "down" && isOverBottomHalf) ||
|
||||
(verticalDirection === "up" && isOverTopHalf)
|
||||
);
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
_contactContainers: function() {
|
||||
|
||||
if (this.options.protectRoot && this.currentItem[0].parentNode === this.element[0]) {
|
||||
return;
|
||||
}
|
||||
|
||||
$.ui.sortable.prototype._contactContainers.apply(this, arguments);
|
||||
|
||||
},
|
||||
|
||||
_clear: function() {
|
||||
var i,
|
||||
item;
|
||||
|
||||
$.ui.sortable.prototype._clear.apply(this, arguments);
|
||||
|
||||
//relocate event
|
||||
if (!(this._pid_current === this._uiHash().item.parent().parent().attr("id") &&
|
||||
this._sort_current === this._uiHash().item.index())) {
|
||||
this._trigger("relocate", this._relocate_event, this._uiHash());
|
||||
}
|
||||
|
||||
// mjs - clean last empty ul/ol
|
||||
for (i = this.items.length - 1; i >= 0; i--) {
|
||||
item = this.items[i].item[0];
|
||||
this._clearEmpty(item);
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
serialize: function(options) {
|
||||
|
||||
var o = $.extend({}, this.options, options),
|
||||
items = this._getItemsAsjQuery(o && o.connected),
|
||||
str = [];
|
||||
|
||||
$(items).each(function() {
|
||||
var res = ($(o.item || this).attr(o.attribute || "id") || "")
|
||||
.match(o.expression || (/(.+)[-=_](.+)/)),
|
||||
pid = ($(o.item || this).parent(o.listType)
|
||||
.parent(o.items)
|
||||
.attr(o.attribute || "id") || "")
|
||||
.match(o.expression || (/(.+)[-=_](.+)/));
|
||||
|
||||
if (res) {
|
||||
str.push(
|
||||
(
|
||||
(o.key || res[1]) +
|
||||
"[" +
|
||||
(o.key && o.expression ? res[1] : res[2]) + "]"
|
||||
) +
|
||||
"=" +
|
||||
(pid ? (o.key && o.expression ? pid[1] : pid[2]) : o.rootID));
|
||||
}
|
||||
});
|
||||
|
||||
if (!str.length && o.key) {
|
||||
str.push(o.key + "=");
|
||||
}
|
||||
|
||||
return str.join("&");
|
||||
|
||||
},
|
||||
|
||||
toHierarchy: function(options) {
|
||||
|
||||
var o = $.extend({}, this.options, options),
|
||||
ret = [];
|
||||
|
||||
$(this.element).children(o.items).each(function() {
|
||||
var level = _recursiveItems(this);
|
||||
ret.push(level);
|
||||
});
|
||||
|
||||
return ret;
|
||||
|
||||
function _recursiveItems(item) {
|
||||
var id = ($(item).attr(o.attribute || "id") || "").match(o.expression || (/(.+)[-=_](.+)/)),
|
||||
currentItem;
|
||||
|
||||
var data = $(item).data();
|
||||
if (data.nestedSortableItem) {
|
||||
delete data.nestedSortableItem; // Remove the nestedSortableItem object from the data
|
||||
}
|
||||
|
||||
if (id) {
|
||||
currentItem = {
|
||||
"id": id[2]
|
||||
};
|
||||
|
||||
currentItem = $.extend({}, currentItem, data); // Combine the two objects
|
||||
|
||||
if ($(item).children(o.listType).children(o.items).length > 0) {
|
||||
currentItem.children = [];
|
||||
$(item).children(o.listType).children(o.items).each(function() {
|
||||
var level = _recursiveItems(this);
|
||||
currentItem.children.push(level);
|
||||
});
|
||||
}
|
||||
return currentItem;
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
toArray: function(options) {
|
||||
|
||||
var o = $.extend({}, this.options, options),
|
||||
sDepth = o.startDepthCount || 0,
|
||||
ret = [],
|
||||
left = 1;
|
||||
|
||||
if (!o.excludeRoot) {
|
||||
ret.push({
|
||||
"item_id": o.rootID,
|
||||
"parent_id": null,
|
||||
"depth": sDepth,
|
||||
"left": left,
|
||||
"right": ($(o.items, this.element).length + 1) * 2
|
||||
});
|
||||
left++;
|
||||
}
|
||||
|
||||
$(this.element).children(o.items).each(function() {
|
||||
left = _recursiveArray(this, sDepth, left);
|
||||
});
|
||||
|
||||
ret = ret.sort(function(a, b) {
|
||||
return (a.left - b.left);
|
||||
});
|
||||
|
||||
return ret;
|
||||
|
||||
function _recursiveArray(item, depth, _left) {
|
||||
|
||||
var right = _left + 1,
|
||||
id,
|
||||
pid,
|
||||
parentItem;
|
||||
|
||||
if ($(item).children(o.listType).children(o.items).length > 0) {
|
||||
depth++;
|
||||
$(item).children(o.listType).children(o.items).each(function() {
|
||||
right = _recursiveArray($(this), depth, right);
|
||||
});
|
||||
depth--;
|
||||
}
|
||||
|
||||
id = ($(item).attr(o.attribute || "id") || "").match(o.expression || (/(.+)[-=_](.+)/));
|
||||
|
||||
if (depth === sDepth) {
|
||||
pid = o.rootID;
|
||||
} else {
|
||||
parentItem = ($(item).parent(o.listType)
|
||||
.parent(o.items)
|
||||
.attr(o.attribute || "id"))
|
||||
.match(o.expression || (/(.+)[-=_](.+)/));
|
||||
pid = parentItem[2];
|
||||
}
|
||||
|
||||
if (id) {
|
||||
var data = $(item).children('div').data();
|
||||
var itemObj = $.extend(data, {
|
||||
"id": id[2],
|
||||
"parent_id": pid,
|
||||
"depth": depth,
|
||||
"left": _left,
|
||||
"right": right
|
||||
});
|
||||
ret.push(itemObj);
|
||||
}
|
||||
|
||||
_left = right + 1;
|
||||
return _left;
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
_clearEmpty: function(item) {
|
||||
function replaceClass(elem, search, replace, swap) {
|
||||
if (swap) {
|
||||
search = [replace, replace = search][0];
|
||||
}
|
||||
|
||||
$(elem).removeClass(search).addClass(replace);
|
||||
}
|
||||
|
||||
var o = this.options,
|
||||
childrenList = $(item).children(o.listType),
|
||||
hasChildren = childrenList.has('li').length;
|
||||
|
||||
var doNotClear =
|
||||
o.doNotClear ||
|
||||
hasChildren ||
|
||||
o.protectRoot && $(item)[0] === this.element[0];
|
||||
|
||||
if (o.isTree) {
|
||||
replaceClass(item, o.branchClass, o.leafClass, doNotClear);
|
||||
}
|
||||
|
||||
if (!doNotClear) {
|
||||
childrenList.parent().removeClass(o.expandedClass);
|
||||
childrenList.remove();
|
||||
}
|
||||
},
|
||||
|
||||
_getLevel: function(item) {
|
||||
|
||||
var level = 1,
|
||||
list;
|
||||
|
||||
if (this.options.listType) {
|
||||
list = item.closest(this.options.listType);
|
||||
while (list && list.length > 0 && !list.is(".ui-sortable")) {
|
||||
level++;
|
||||
list = list.parent().closest(this.options.listType);
|
||||
}
|
||||
}
|
||||
|
||||
return level;
|
||||
},
|
||||
|
||||
_getChildLevels: function(parent, depth) {
|
||||
var self = this,
|
||||
o = this.options,
|
||||
result = 0;
|
||||
depth = depth || 0;
|
||||
|
||||
$(parent).children(o.listType).children(o.items).each(function(index, child) {
|
||||
result = Math.max(self._getChildLevels(child, depth + 1), result);
|
||||
});
|
||||
|
||||
return depth ? result + 1 : result;
|
||||
},
|
||||
|
||||
_isAllowed: function(parentItem, level, levels) {
|
||||
var o = this.options,
|
||||
// this takes into account the maxLevels set to the recipient list
|
||||
maxLevels = this
|
||||
.placeholder
|
||||
.closest(".ui-sortable")
|
||||
.nestedSortable("option", "maxLevels"),
|
||||
|
||||
// Check if the parent has changed to prevent it, when o.disableParentChange is true
|
||||
oldParent = this.currentItem.parent().parent(),
|
||||
disabledByParentchange = o.disableParentChange && (
|
||||
//From somewhere to somewhere else, except the root
|
||||
typeof parentItem !== 'undefined' && !oldParent.is(parentItem) ||
|
||||
typeof parentItem === 'undefined' && oldParent.is("li") //From somewhere to the root
|
||||
);
|
||||
// mjs - is the root protected?
|
||||
// mjs - are we nesting too deep?
|
||||
if (
|
||||
disabledByParentchange ||
|
||||
!o.isAllowed(this.placeholder, parentItem, this.currentItem)
|
||||
) {
|
||||
this.placeholder.addClass(o.errorClass);
|
||||
if (maxLevels < levels && maxLevels !== 0) {
|
||||
this.beyondMaxLevels = levels - maxLevels;
|
||||
} else {
|
||||
this.beyondMaxLevels = 1;
|
||||
}
|
||||
} else {
|
||||
if (maxLevels < levels && maxLevels !== 0) {
|
||||
this.placeholder.addClass(o.errorClass);
|
||||
this.beyondMaxLevels = levels - maxLevels;
|
||||
} else {
|
||||
this.placeholder.removeClass(o.errorClass);
|
||||
this.beyondMaxLevels = 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}));
|
||||
|
||||
$.mjs.nestedSortable.prototype.options = $.extend(
|
||||
{},
|
||||
$.ui.sortable.prototype.options,
|
||||
$.mjs.nestedSortable.prototype.options
|
||||
);
|
||||
}));
|
||||
File diff suppressed because it is too large.
Load diff
File diff suppressed because it is too large.
Load diff
@@ -0,0 +1,314 @@
|
||||
/*
|
||||
* This file is part of the TYPO3 CMS project.
|
||||
*
|
||||
* It is free software; you can redistribute it and/or modify it under
|
||||
* the terms of the GNU General Public License, either version 2
|
||||
* of the License, or any later version.
|
||||
*
|
||||
* For the full copyright and license information, please read the
|
||||
* LICENSE.txt file that was distributed with this source code.
|
||||
*
|
||||
* The TYPO3 project - inspiring people to share!
|
||||
*/
|
||||
|
||||
/**
|
||||
* Module: TYPO3/CMS/Form/Backend/FormEditor/Helper
|
||||
*/
|
||||
define(['jquery'], function($) {
|
||||
'use strict';
|
||||
|
||||
return (function($) {
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @var object
|
||||
*/
|
||||
var _formEditorApp = null;
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @var object
|
||||
*/
|
||||
var _configuration = {};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @var object
|
||||
*/
|
||||
var _defaultConfiguration = {
|
||||
domElementClassNames: {
|
||||
active: 'active',
|
||||
buttonCollectionElementRemove: 't3-form-collection-element-remove-button',
|
||||
buttonFormEditor: 't3-form-button',
|
||||
disabled: 'disabled',
|
||||
hidden: 'hidden',
|
||||
icon: 't3-form-icon',
|
||||
jQueryUiStateDisabled: 'ui-state-disabled',
|
||||
sortableHover: 'sortable-hover'
|
||||
},
|
||||
domElementDataAttributeNames: {
|
||||
elementIdentifier: 'data-element-identifier-path',
|
||||
identifier: 'data-identifier',
|
||||
template: 'data-template-name',
|
||||
templateProperty: 'data-template-property'
|
||||
},
|
||||
domElementSelectorPattern: {
|
||||
bracesWithKey: '[{0}]',
|
||||
bracesWithKeyValue: '[{0}="{1}"]',
|
||||
class: '.{0}',
|
||||
id: '#{0}',
|
||||
keyValue: '{0}="{1}"'
|
||||
}
|
||||
};
|
||||
|
||||
/* *************************************************************
|
||||
* Private Methodes
|
||||
* ************************************************************/
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return object
|
||||
*/
|
||||
function getFormEditorApp() {
|
||||
return _formEditorApp;
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return object
|
||||
*/
|
||||
function getUtility() {
|
||||
return getFormEditorApp().getUtility();
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @param mixed test
|
||||
* @param string message
|
||||
* @param int messageCode
|
||||
* @return void
|
||||
*/
|
||||
function assert(test, message, messageCode) {
|
||||
return getFormEditorApp().assert(test, message, messageCode);
|
||||
};
|
||||
|
||||
/* *************************************************************
|
||||
* Public Methodes
|
||||
* ************************************************************/
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object
|
||||
* @return this
|
||||
* @throws 1478950623
|
||||
*/
|
||||
function setConfiguration(configuration) {
|
||||
assert('object' === $.type(configuration), 'Invalid parameter "configuration"', 1478950623);
|
||||
_configuration = $.extend(true, _defaultConfiguration, configuration);
|
||||
return this;
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string
|
||||
* @param array
|
||||
* @return string
|
||||
* @throws 1478801251
|
||||
* @throws 1478801252
|
||||
*/
|
||||
function buildDomElementSelectorHelper(patternIdentifier, replacements) {
|
||||
var newString;
|
||||
assert(
|
||||
!getUtility().isUndefinedOrNull(_configuration['domElementSelectorPattern'][patternIdentifier]),
|
||||
'Invalid parameter "patternIdentifier" (' + patternIdentifier + ')',
|
||||
1478801251
|
||||
);
|
||||
assert('array' === $.type(replacements), 'Invalid parameter "replacements"', 1478801252);
|
||||
|
||||
newString = _configuration['domElementSelectorPattern'][patternIdentifier];
|
||||
for (var i = 0, len = replacements.length; i < len; ++i) {
|
||||
newString = newString.replace('{' + i + '}', replacements[i]);
|
||||
}
|
||||
return newString;
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string
|
||||
* @param array
|
||||
* @return string
|
||||
* @throws 1478372374
|
||||
*/
|
||||
function getDomElementSelector(selectorIdentifier, args) {
|
||||
assert(
|
||||
!getUtility().isUndefinedOrNull(_configuration['domElementSelectorPattern'][selectorIdentifier]),
|
||||
'Invalid parameter "selectorIdentifier" (' + selectorIdentifier + ')',
|
||||
1478372374
|
||||
);
|
||||
return buildDomElementSelectorHelper(selectorIdentifier, args);
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string
|
||||
* @param bool
|
||||
* @return string
|
||||
* @throws 1478803906
|
||||
*/
|
||||
function getDomElementClassName(classNameIdentifier, asSelector) {
|
||||
var className;
|
||||
assert(
|
||||
!getUtility().isUndefinedOrNull(_configuration['domElementClassNames'][classNameIdentifier]),
|
||||
'Invalid parameter "classNameIdentifier" (' + classNameIdentifier + ')',
|
||||
1478803906
|
||||
);
|
||||
|
||||
className = _configuration['domElementClassNames'][classNameIdentifier];
|
||||
if (!!asSelector) {
|
||||
className = getDomElementSelector('class', [className]);
|
||||
}
|
||||
return className;
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string
|
||||
* @param bool
|
||||
* @return string
|
||||
* @throws 1479251518
|
||||
*/
|
||||
function getDomElementIdName(idNameIdentifier, asSelector) {
|
||||
var idName;
|
||||
assert(
|
||||
!getUtility().isUndefinedOrNull(_configuration['domElementIdNames'][idNameIdentifier]),
|
||||
'Invalid parameter "domElementIdNames" (' + idNameIdentifier + ')',
|
||||
1479251518
|
||||
);
|
||||
|
||||
idName = _configuration['domElementIdNames'][idNameIdentifier];
|
||||
if (!!asSelector) {
|
||||
idName = getDomElementSelector('id', [idName]);
|
||||
}
|
||||
return idName;
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string
|
||||
* @param bool
|
||||
* @return string
|
||||
* @throws 1478806884
|
||||
*/
|
||||
function getDomElementDataAttributeValue(dataAttributeValueIdentifier) {
|
||||
assert(
|
||||
!getUtility().isUndefinedOrNull(_configuration['domElementDataAttributeValues'][dataAttributeValueIdentifier]),
|
||||
'Invalid parameter "dataAttributeValueIdentifier" (' + dataAttributeValueIdentifier + ')',
|
||||
1478806884
|
||||
);
|
||||
return _configuration['domElementDataAttributeValues'][dataAttributeValueIdentifier];
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string
|
||||
* @param string
|
||||
* @param array
|
||||
* @return string
|
||||
* @throws 1478808035
|
||||
*/
|
||||
function getDomElementDataAttribute(dataAttributeIdentifier, selectorIdentifier, additionalSelectorArgs) {
|
||||
assert(
|
||||
!getUtility().isUndefinedOrNull(_configuration['domElementDataAttributeNames'][dataAttributeIdentifier]),
|
||||
'Invalid parameter "dataAttributeIdentifier" (' + dataAttributeIdentifier + ')',
|
||||
1478808035
|
||||
);
|
||||
|
||||
if (getUtility().isUndefinedOrNull(selectorIdentifier)) {
|
||||
return _configuration['domElementDataAttributeNames'][dataAttributeIdentifier];
|
||||
}
|
||||
|
||||
additionalSelectorArgs = additionalSelectorArgs || [];
|
||||
return getDomElementSelector(
|
||||
selectorIdentifier,
|
||||
[_configuration['domElementDataAttributeNames'][dataAttributeIdentifier]].concat(additionalSelectorArgs)
|
||||
);
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* Return a string like [data-identifier="someValue"]
|
||||
*
|
||||
* @return string
|
||||
*/
|
||||
function getDomElementDataIdentifierSelector(dataAttributeValueIdentifier) {
|
||||
return getDomElementDataAttribute('identifier', 'bracesWithKeyValue', [getDomElementDataAttributeValue(dataAttributeValueIdentifier)]);
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string
|
||||
* @return object
|
||||
*/
|
||||
function getTemplate(templateName) {
|
||||
if (!getUtility().isUndefinedOrNull(_configuration['domElementDataAttributeValues'][templateName])) {
|
||||
templateName = getDomElementDataAttributeValue(templateName);
|
||||
}
|
||||
|
||||
return $(getDomElementDataAttribute('template', 'bracesWithKeyValue', [templateName]));
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string
|
||||
* @param object
|
||||
* @return object
|
||||
*/
|
||||
function getTemplatePropertyDomElement(templatePropertyName, templateDomElement) {
|
||||
return $(getDomElementDataAttribute('templateProperty', 'bracesWithKeyValue', [templatePropertyName]), $(templateDomElement));
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object formEditorApp
|
||||
* @return void
|
||||
*/
|
||||
function bootstrap(formEditorApp) {
|
||||
_formEditorApp = formEditorApp;
|
||||
};
|
||||
|
||||
/**
|
||||
* Publish the public methods.
|
||||
* Implements the "Revealing Module Pattern".
|
||||
*/
|
||||
return {
|
||||
bootstrap: bootstrap,
|
||||
buildDomElementSelectorHelper: buildDomElementSelectorHelper,
|
||||
getDomElementClassName: getDomElementClassName,
|
||||
getDomElementIdName: getDomElementIdName,
|
||||
getDomElementDataAttribute: getDomElementDataAttribute,
|
||||
getDomElementDataAttributeValue: getDomElementDataAttributeValue,
|
||||
getDomElementDataIdentifierSelector: getDomElementDataIdentifierSelector,
|
||||
getDomElementSelector: getDomElementSelector,
|
||||
getTemplate: getTemplate,
|
||||
getTemplatePropertyDomElement: getTemplatePropertyDomElement,
|
||||
setConfiguration: setConfiguration
|
||||
};
|
||||
})($);
|
||||
});
|
||||
+2523
File diff suppressed because it is too large.
Load diff
File diff suppressed because it is too large.
Load diff
@@ -0,0 +1,538 @@
|
||||
/*
|
||||
* This file is part of the TYPO3 CMS project.
|
||||
*
|
||||
* It is free software; you can redistribute it and/or modify it under
|
||||
* the terms of the GNU General Public License, either version 2
|
||||
* of the License, or any later version.
|
||||
*
|
||||
* For the full copyright and license information, please read the
|
||||
* LICENSE.txt file that was distributed with this source code.
|
||||
*
|
||||
* The TYPO3 project - inspiring people to share!
|
||||
*/
|
||||
|
||||
/**
|
||||
* Module: TYPO3/CMS/Form/Backend/FormEditor/ModalsComponent
|
||||
*/
|
||||
define(['jquery',
|
||||
'TYPO3/CMS/Form/Backend/FormEditor/Helper',
|
||||
'TYPO3/CMS/Backend/Modal',
|
||||
'TYPO3/CMS/Backend/Severity',
|
||||
'TYPO3/CMS/Backend/Icons'
|
||||
], function($, Helper, Modal, Severity, Icons) {
|
||||
'use strict';
|
||||
|
||||
return (function($, Helper, Modal, Severity, Icons) {
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @var object
|
||||
*/
|
||||
var _configuration = null;
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @var object
|
||||
*/
|
||||
var _defaultConfiguration = {
|
||||
domElementClassNames: {
|
||||
buttonDefault: 'btn-default',
|
||||
buttonInfo: 'btn-info',
|
||||
buttonWarning: 'btn-warning'
|
||||
},
|
||||
domElementDataAttributeNames: {
|
||||
elementType: 'element-type',
|
||||
fullElementType: 'data-element-type'
|
||||
},
|
||||
domElementDataAttributeValues: {
|
||||
rowItem: 'rowItem',
|
||||
rowLink: 'rowLink',
|
||||
rowsContainer: 'rowsContainer',
|
||||
templateInsertElements: 'Modal-InsertElements',
|
||||
templateInsertPages: 'Modal-InsertPages',
|
||||
templateValidationErrors: 'Modal-ValidationErrors'
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @var object
|
||||
*/
|
||||
var _formEditorApp = null;
|
||||
|
||||
/* *************************************************************
|
||||
* Private Methodes
|
||||
* ************************************************************/
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return void
|
||||
* @throws 1478268638
|
||||
*/
|
||||
function _helperSetup() {
|
||||
assert('function' === $.type(Helper.bootstrap),
|
||||
'The view model helper does not implement the method "bootstrap"',
|
||||
1478268638
|
||||
);
|
||||
Helper.bootstrap(getFormEditorApp());
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return object
|
||||
*/
|
||||
function getFormEditorApp() {
|
||||
return _formEditorApp;
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object
|
||||
* @return object
|
||||
*/
|
||||
function getHelper(configuration) {
|
||||
if (getUtility().isUndefinedOrNull(configuration)) {
|
||||
return Helper.setConfiguration(_configuration);
|
||||
}
|
||||
return Helper.setConfiguration(configuration);
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return object
|
||||
*/
|
||||
function getUtility() {
|
||||
return getFormEditorApp().getUtility();
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @param mixed test
|
||||
* @param string message
|
||||
* @param int messageCode
|
||||
* @return void
|
||||
*/
|
||||
function assert(test, message, messageCode) {
|
||||
return getFormEditorApp().assert(test, message, messageCode);
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return object
|
||||
*/
|
||||
function getRootFormElement() {
|
||||
return getFormEditorApp().getRootFormElement();
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return object
|
||||
*/
|
||||
function getPublisherSubscriber() {
|
||||
return getFormEditorApp().getPublisherSubscriber();
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @param object
|
||||
* @param string
|
||||
* @return mixed
|
||||
*/
|
||||
function getFormElementDefinition(formElement, formElementDefinitionKey) {
|
||||
return getFormEditorApp().getFormElementDefinition(formElement, formElementDefinitionKey);
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string publisherTopicName
|
||||
* @param object publisherTopicArguments
|
||||
* @return void
|
||||
* @throws 1478889044
|
||||
* @throws 1478889049
|
||||
*/
|
||||
function _showRemoveElementModal(publisherTopicName, publisherTopicArguments) {
|
||||
var modalButtons = [];
|
||||
|
||||
assert(
|
||||
getUtility().isNonEmptyString(publisherTopicName),
|
||||
'Invalid parameter "publisherTopicName"',
|
||||
1478889049
|
||||
);
|
||||
assert(
|
||||
'array' === $.type(publisherTopicArguments),
|
||||
'Invalid parameter "formElement"',
|
||||
1478889044
|
||||
);
|
||||
|
||||
modalButtons.push({
|
||||
text: getFormElementDefinition(getRootFormElement(), 'modalRemoveElementCancleButton'),
|
||||
active: true,
|
||||
btnClass: getHelper().getDomElementClassName('buttonDefault'),
|
||||
name: 'cancel',
|
||||
trigger: function() {
|
||||
Modal.currentModal.trigger('modal-dismiss');
|
||||
}
|
||||
});
|
||||
|
||||
modalButtons.push({
|
||||
text: getFormElementDefinition(getRootFormElement(), 'modalRemoveElementConfirmButton'),
|
||||
active: true,
|
||||
btnClass: getHelper().getDomElementClassName('buttonWarning'),
|
||||
name: 'confirm',
|
||||
trigger: function() {
|
||||
getPublisherSubscriber().publish(publisherTopicName, publisherTopicArguments);
|
||||
Modal.currentModal.trigger('modal-dismiss');
|
||||
}
|
||||
});
|
||||
|
||||
Modal.show(
|
||||
getFormElementDefinition(getRootFormElement(), 'modalRemoveElementDialogTitle'),
|
||||
getFormElementDefinition(getRootFormElement(), 'modalRemoveElementDialogMessage'),
|
||||
Severity.warning,
|
||||
modalButtons
|
||||
);
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @param object modalContent
|
||||
* @param string publisherTopicName
|
||||
* @param object configuration
|
||||
* @return void
|
||||
* @publish mixed
|
||||
* @throws 1478910954
|
||||
*/
|
||||
function _insertElementsModalSetup(modalContent, publisherTopicName, configuration) {
|
||||
var formElementItems;
|
||||
|
||||
assert(
|
||||
getUtility().isNonEmptyString(publisherTopicName),
|
||||
'Invalid parameter "publisherTopicName"',
|
||||
1478910954
|
||||
);
|
||||
|
||||
if ('object' === $.type(configuration)) {
|
||||
for (var key in configuration) {
|
||||
if (!configuration.hasOwnProperty(key)) {
|
||||
continue;
|
||||
}
|
||||
if (
|
||||
key === 'disableElementTypes'
|
||||
&& 'array' === $.type(configuration[key])
|
||||
) {
|
||||
for (var i = 0, len = configuration[key].length; i < len; ++i) {
|
||||
$(
|
||||
getHelper().getDomElementDataAttribute(
|
||||
'fullElementType',
|
||||
'bracesWithKeyValue', [configuration[key][i]]
|
||||
),
|
||||
modalContent
|
||||
).addClass(getHelper().getDomElementClassName('disabled'));
|
||||
}
|
||||
}
|
||||
|
||||
if (
|
||||
key === 'onlyEnableElementTypes'
|
||||
&& 'array' === $.type(configuration[key])
|
||||
) {
|
||||
$(
|
||||
getHelper().getDomElementDataAttribute(
|
||||
'fullElementType',
|
||||
'bracesWithKey'
|
||||
),
|
||||
modalContent
|
||||
).each(function(i, element) {
|
||||
for (var i = 0, len = configuration[key].length; i < len; ++i) {
|
||||
var that = $(this);
|
||||
if (that.data(getHelper().getDomElementDataAttribute('elementType')) !== configuration[key][i]) {
|
||||
that.addClass(getHelper().getDomElementClassName('disabled'));
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
$('a', modalContent).on("click", function(e) {
|
||||
getPublisherSubscriber().publish(publisherTopicName, [$(this).data(getHelper().getDomElementDataAttribute('elementType'))]);
|
||||
$('a', modalContent).off();
|
||||
Modal.currentModal.trigger('modal-dismiss');
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @param object modalContent
|
||||
* @param object validationResults
|
||||
* @return void
|
||||
* @publish view/modal/validationErrors/element/clicked
|
||||
* @throws 1479161268
|
||||
*/
|
||||
function _validationErrorsModalSetup(modalContent, validationResults) {
|
||||
var formElement, newRowItem, rowItemTemplate;
|
||||
|
||||
assert(
|
||||
'array' === $.type(validationResults),
|
||||
'Invalid parameter "validationResults"',
|
||||
1479161268
|
||||
);
|
||||
|
||||
rowItemTemplate = $(
|
||||
getHelper().getDomElementDataIdentifierSelector('rowItem'),
|
||||
modalContent
|
||||
).clone();
|
||||
|
||||
$(getHelper().getDomElementDataIdentifierSelector('rowItem'), modalContent).remove();
|
||||
|
||||
for (var i = 0, len = validationResults.length; i < len; ++i) {
|
||||
var hasError = false, validationElement;
|
||||
for (var j = 0, len2 = validationResults[i]['validationResults'].length; j < len2; ++j) {
|
||||
if (
|
||||
validationResults[i]['validationResults'][j]['validationResults']
|
||||
&& validationResults[i]['validationResults'][j]['validationResults'].length > 0
|
||||
) {
|
||||
hasError = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (hasError) {
|
||||
formElement = getFormEditorApp()
|
||||
.getFormElementByIdentifierPath(validationResults[i]['formElementIdentifierPath']);
|
||||
newRowItem = rowItemTemplate.clone();
|
||||
$(getHelper().getDomElementDataIdentifierSelector('rowLink'), newRowItem)
|
||||
.attr(
|
||||
getHelper().getDomElementDataAttribute('elementIdentifier'),
|
||||
validationResults[i]['formElementIdentifierPath']
|
||||
)
|
||||
.html(_buildTitleByFormElement(formElement));
|
||||
$(getHelper().getDomElementDataIdentifierSelector('rowsContainer'), modalContent)
|
||||
.append(newRowItem);
|
||||
}
|
||||
}
|
||||
|
||||
$('a', modalContent).on("click", function(e) {
|
||||
getPublisherSubscriber().publish('view/modal/validationErrors/element/clicked', [
|
||||
$(this).attr(getHelper().getDomElementDataAttribute('elementIdentifier'))
|
||||
]);
|
||||
$('a', modalContent).off();
|
||||
Modal.currentModal.trigger('modal-dismiss');
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @param object
|
||||
* @return object
|
||||
* @throws 1479162557
|
||||
*/
|
||||
function _buildTitleByFormElement(formElement) {
|
||||
var label;
|
||||
assert('object' === $.type(formElement), 'Invalid parameter "formElement"', 1479162557);
|
||||
|
||||
return $('<span></span>').text((formElement.get('label')
|
||||
? formElement.get('label')
|
||||
: formElement.get('identifier')));
|
||||
};
|
||||
|
||||
/* *************************************************************
|
||||
* Public Methodes
|
||||
* ************************************************************/
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object formElement
|
||||
* @return void
|
||||
* @publish view/modal/removeFormElement/perform
|
||||
*/
|
||||
function showRemoveFormElementModal(formElement) {
|
||||
_showRemoveElementModal('view/modal/removeFormElement/perform', [formElement]);
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string collectionElementIdentifier
|
||||
* @param string collectionName
|
||||
* @param object formElement
|
||||
* @return void
|
||||
* @publish view/modal/removeCollectionElement/perform
|
||||
* @throws 1478894420
|
||||
* @throws 1478894421
|
||||
*/
|
||||
function showRemoveCollectionElementModal(collectionElementIdentifier, collectionName, formElement) {
|
||||
assert(
|
||||
getUtility().isNonEmptyString(collectionElementIdentifier),
|
||||
'Invalid parameter "collectionElementIdentifier"',
|
||||
1478894420
|
||||
);
|
||||
assert(
|
||||
getUtility().isNonEmptyString(collectionName),
|
||||
'Invalid parameter "collectionName"',
|
||||
1478894421
|
||||
);
|
||||
|
||||
_showRemoveElementModal('view/modal/removeCollectionElement/perform', [collectionElementIdentifier, collectionName, formElement]);
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @return void
|
||||
* @publish view/modal/close/perform
|
||||
*/
|
||||
function showCloseConfirmationModal() {
|
||||
var modalButtons = [];
|
||||
|
||||
modalButtons.push({
|
||||
text: getFormElementDefinition(getRootFormElement(), 'modalCloseCancleButton'),
|
||||
active: true,
|
||||
btnClass: getHelper().getDomElementClassName('buttonDefault'),
|
||||
name: 'cancel',
|
||||
trigger: function() {
|
||||
Modal.currentModal.trigger('modal-dismiss');
|
||||
}
|
||||
});
|
||||
|
||||
modalButtons.push({
|
||||
text: getFormElementDefinition(getRootFormElement(), 'modalCloseConfirmButton'),
|
||||
active: true,
|
||||
btnClass: getHelper().getDomElementClassName('buttonWarning'),
|
||||
name: 'confirm',
|
||||
trigger: function() {
|
||||
getPublisherSubscriber().publish('view/modal/close/perform', []);
|
||||
Modal.currentModal.trigger('modal-dismiss');
|
||||
}
|
||||
});
|
||||
|
||||
Modal.show(
|
||||
getFormElementDefinition(getRootFormElement(), 'modalCloseDialogTitle'),
|
||||
getFormElementDefinition(getRootFormElement(), 'modalCloseDialogMessage'),
|
||||
Severity.warning,
|
||||
modalButtons
|
||||
);
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string
|
||||
* @param object
|
||||
* @return void
|
||||
*/
|
||||
function showInsertElementsModal(publisherTopicName, configuration) {
|
||||
var html, template;
|
||||
|
||||
template = getHelper().getTemplate('templateInsertElements');
|
||||
if (template.length > 0) {
|
||||
html = $(template.html());
|
||||
_insertElementsModalSetup(html, publisherTopicName, configuration);
|
||||
|
||||
Modal.show(
|
||||
getFormElementDefinition(getRootFormElement(), 'modalInsertElementsDialogTitle'),
|
||||
$(html),
|
||||
Severity.info
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string
|
||||
* @return void
|
||||
*/
|
||||
function showInsertPagesModal(publisherTopicName) {
|
||||
var html, template;
|
||||
|
||||
template = getHelper().getTemplate('templateInsertPages');
|
||||
if (template.length > 0) {
|
||||
html = $(template.html());
|
||||
_insertElementsModalSetup(html, publisherTopicName);
|
||||
|
||||
Modal.show(
|
||||
getFormElementDefinition(getRootFormElement(), 'modalInsertPagesDialogTitle'),
|
||||
$(html),
|
||||
Severity.info
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object
|
||||
* @return void
|
||||
*/
|
||||
function showValidationErrorsModal(validationResults) {
|
||||
var html, template, modalButtons = [];
|
||||
|
||||
modalButtons.push({
|
||||
text: getFormElementDefinition(getRootFormElement(), 'modalValidationErrorsConfirmButton'),
|
||||
active: true,
|
||||
btnClass: getHelper().getDomElementClassName('buttonDefault'),
|
||||
name: 'confirm',
|
||||
trigger: function() {
|
||||
Modal.currentModal.trigger('modal-dismiss');
|
||||
}
|
||||
});
|
||||
|
||||
template = getHelper().getTemplate('templateValidationErrors');
|
||||
if (template.length > 0) {
|
||||
html = $(template.html()).clone();
|
||||
_validationErrorsModalSetup(html, validationResults);
|
||||
|
||||
Modal.show(
|
||||
getFormElementDefinition(getRootFormElement(), 'modalValidationErrorsDialogTitle'),
|
||||
html,
|
||||
Severity.error,
|
||||
modalButtons
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object
|
||||
* @param object
|
||||
* @return this
|
||||
*/
|
||||
function bootstrap(formEditorApp, configuration) {
|
||||
_formEditorApp = formEditorApp;
|
||||
_configuration = $.extend(true, _defaultConfiguration, configuration || {});
|
||||
_helperSetup();
|
||||
return this;
|
||||
};
|
||||
|
||||
/**
|
||||
* Publish the public methods.
|
||||
* Implements the "Revealing Module Pattern".
|
||||
*/
|
||||
return {
|
||||
bootstrap: bootstrap,
|
||||
showCloseConfirmationModal: showCloseConfirmationModal,
|
||||
showInsertElementsModal: showInsertElementsModal,
|
||||
showInsertPagesModal: showInsertPagesModal,
|
||||
showRemoveCollectionElementModal: showRemoveCollectionElementModal,
|
||||
showRemoveFormElementModal: showRemoveFormElementModal,
|
||||
showValidationErrorsModal: showValidationErrorsModal
|
||||
};
|
||||
})($, Helper, Modal, Severity, Icons);
|
||||
});
|
||||
File diff suppressed because it is too large.
Load diff
@@ -0,0 +1,691 @@
|
||||
/*
|
||||
* This file is part of the TYPO3 CMS project.
|
||||
*
|
||||
* It is free software; you can redistribute it and/or modify it under
|
||||
* the terms of the GNU General Public License, either version 2
|
||||
* of the License, or any later version.
|
||||
*
|
||||
* For the full copyright and license information, please read the
|
||||
* LICENSE.txt file that was distributed with this source code.
|
||||
*
|
||||
* The TYPO3 project - inspiring people to share!
|
||||
*/
|
||||
|
||||
/**
|
||||
* Module: TYPO3/CMS/Form/Backend/FormEditor/TreeComponent
|
||||
*/
|
||||
define(['jquery',
|
||||
'TYPO3/CMS/Form/Backend/FormEditor/Helper',
|
||||
'TYPO3/CMS/Backend/Icons',
|
||||
'TYPO3/CMS/Form/Backend/Contrib/jquery.mjs.nestedSortable'
|
||||
], function($, Helper, Icons) {
|
||||
'use strict';
|
||||
|
||||
return (function($, Helper, Icons) {
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @var object
|
||||
*/
|
||||
var _configuration = null;
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @var object
|
||||
*/
|
||||
var _expanderStates = {};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @var object
|
||||
*/
|
||||
var _defaultConfiguration = {
|
||||
domElementClassNames: {
|
||||
collapsed: 'mjs-nestedSortable-collapsed',
|
||||
expanded: 'mjs-nestedSortable-expanded',
|
||||
hasChildren: 't3-form-element-has-children',
|
||||
sortable: 'sortable',
|
||||
svgLinkWrapper: 'svg-wrapper',
|
||||
noNesting: 'mjs-nestedSortable-no-nesting'
|
||||
},
|
||||
domElementDataAttributeNames: {
|
||||
abstractType: 'data-element-abstract-type'
|
||||
},
|
||||
domElementDataAttributeValues: {
|
||||
collapse: 'actions-pagetree-collapse',
|
||||
expander: 'treeExpander',
|
||||
title: 'treeTitle'
|
||||
},
|
||||
isSortable: true,
|
||||
svgLink: {
|
||||
height: 15,
|
||||
paths: {
|
||||
angle: 'M0 0 V20 H15',
|
||||
vertical: 'M0 0 V20 H0',
|
||||
hidden: 'M0 0 V0 H0'
|
||||
},
|
||||
width: 20
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @var object
|
||||
*/
|
||||
var _formEditorApp = null;
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @var object
|
||||
*/
|
||||
var _treeDomElement = null;
|
||||
|
||||
/* *************************************************************
|
||||
* Private Methodes
|
||||
* ************************************************************/
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return void
|
||||
* @throws 1478268638
|
||||
*/
|
||||
function _helperSetup() {
|
||||
assert('function' === $.type(Helper.bootstrap),
|
||||
'The view model helper does not implement the method "bootstrap"',
|
||||
1478268638
|
||||
);
|
||||
Helper.bootstrap(getFormEditorApp());
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return object
|
||||
*/
|
||||
function getFormEditorApp() {
|
||||
return _formEditorApp;
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object
|
||||
* @return object
|
||||
*/
|
||||
function getHelper(configuration) {
|
||||
if (getUtility().isUndefinedOrNull(configuration)) {
|
||||
return Helper.setConfiguration(_configuration);
|
||||
}
|
||||
return Helper.setConfiguration(configuration);
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return object
|
||||
*/
|
||||
function getUtility() {
|
||||
return getFormEditorApp().getUtility();
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @param mixed test
|
||||
* @param string message
|
||||
* @param int messageCode
|
||||
* @return void
|
||||
*/
|
||||
function assert(test, message, messageCode) {
|
||||
return getFormEditorApp().assert(test, message, messageCode);
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return object
|
||||
*/
|
||||
function getRootFormElement() {
|
||||
return getFormEditorApp().getRootFormElement();
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return object
|
||||
*/
|
||||
function getCurrentlySelectedFormElement() {
|
||||
return getFormEditorApp().getCurrentlySelectedFormElement();
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return object
|
||||
*/
|
||||
function getPublisherSubscriber() {
|
||||
return getFormEditorApp().getPublisherSubscriber();
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @param object
|
||||
* @param string
|
||||
* @return mixed
|
||||
*/
|
||||
function getFormElementDefinition(formElement, formElementDefinitionKey) {
|
||||
return getFormEditorApp().getFormElementDefinition(formElement, formElementDefinitionKey);
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return object
|
||||
*/
|
||||
function _getLinkSvg(type) {
|
||||
return $('<span class="' + getHelper().getDomElementClassName('svgLinkWrapper') + '">'
|
||||
+ '<svg version="1.1" width="' + _configuration['svgLink']['width'] + '" height="' + _configuration['svgLink']['height'] + '">'
|
||||
+ '<path class="link" d="' + _configuration['svgLink']['paths'][type] + '">'
|
||||
+ '</svg>'
|
||||
+ '</span>');
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @param object
|
||||
* @return object
|
||||
* @publish view/tree/render/listItemAdded
|
||||
* @throws 1478715704
|
||||
*/
|
||||
function _renderNestedSortableListItem(formElement) {
|
||||
var childFormElements, childList, expanderItem, isLastFormElementWithinParentFormElement,
|
||||
listItem, listItemContent, searchElement;
|
||||
assert('object' === $.type(formElement), 'Invalid parameter "formElement"', 1478715704);
|
||||
|
||||
isLastFormElementWithinParentFormElement = false;
|
||||
if (formElement.get('__identifierPath') === getFormEditorApp().getLastFormElementWithinParentFormElement(formElement).get('__identifierPath')) {
|
||||
isLastFormElementWithinParentFormElement = true;
|
||||
}
|
||||
|
||||
listItem = $('<li></li>');
|
||||
if (!getFormElementDefinition(formElement, '_isCompositeFormElement')) {
|
||||
listItem.addClass(getHelper().getDomElementClassName('noNesting'));
|
||||
}
|
||||
|
||||
listItemContent = $('<div></div>')
|
||||
.attr(getHelper().getDomElementDataAttribute('elementIdentifier'), formElement.get('__identifierPath'))
|
||||
.append(
|
||||
$('<span></span>')
|
||||
.attr(getHelper().getDomElementDataAttribute('identifier'), getHelper().getDomElementDataAttributeValue('title'))
|
||||
.html(buildTitleByFormElement(formElement))
|
||||
);
|
||||
|
||||
if (getFormElementDefinition(formElement, '_isCompositeFormElement')) {
|
||||
listItemContent.attr(getHelper().getDomElementDataAttribute('abstractType'), 'isCompositeFormElement');
|
||||
}
|
||||
if (getFormElementDefinition(formElement, '_isTopLevelFormElement')) {
|
||||
listItemContent.attr(getHelper().getDomElementDataAttribute('abstractType'), 'isTopLevelFormElement');
|
||||
}
|
||||
|
||||
expanderItem = $('<span></span>').attr('data-identifier', getHelper().getDomElementDataAttributeValue('expander'));
|
||||
listItemContent.prepend(expanderItem);
|
||||
|
||||
Icons.getIcon(getFormElementDefinition(formElement, 'iconIdentifier'), Icons.sizes.small, null, Icons.states.default).done(function(icon) {
|
||||
expanderItem.after(
|
||||
$(icon).addClass(getHelper().getDomElementClassName('icon'))
|
||||
.tooltip({
|
||||
title: 'id = ' + formElement.get('identifier'),
|
||||
placement: 'right'
|
||||
})
|
||||
);
|
||||
|
||||
if (getFormElementDefinition(formElement, '_isCompositeFormElement')) {
|
||||
if (formElement.get('renderables') && formElement.get('renderables').length > 0) {
|
||||
Icons.getIcon(getHelper().getDomElementDataAttributeValue('collapse'), Icons.sizes.small).done(function(icon) {
|
||||
expanderItem.before(_getLinkSvg('angle')).html($(icon));
|
||||
listItem.addClass(getHelper().getDomElementClassName('hasChildren'));
|
||||
});
|
||||
} else {
|
||||
expanderItem.before(_getLinkSvg('angle')).remove();
|
||||
}
|
||||
} else {
|
||||
listItemContent.prepend(_getLinkSvg('angle'));
|
||||
expanderItem.remove();
|
||||
}
|
||||
|
||||
searchElement = formElement.get('__parentRenderable');
|
||||
while (searchElement) {
|
||||
if (searchElement.get('__identifierPath') === getRootFormElement().get('__identifierPath')) {
|
||||
break;
|
||||
}
|
||||
|
||||
if (searchElement.get('__identifierPath') === getFormEditorApp().getLastFormElementWithinParentFormElement(searchElement).get('__identifierPath')) {
|
||||
listItemContent.prepend(_getLinkSvg('hidden'));
|
||||
} else {
|
||||
listItemContent.prepend(_getLinkSvg('vertical'));
|
||||
}
|
||||
searchElement = searchElement.get('__parentRenderable');
|
||||
}
|
||||
});
|
||||
listItem.append(listItemContent);
|
||||
|
||||
getPublisherSubscriber().publish('view/tree/render/listItemAdded', [listItem, formElement]);
|
||||
childFormElements = formElement.get('renderables');
|
||||
childList = null;
|
||||
if ('array' === $.type(childFormElements)) {
|
||||
childList = $('<ol></ol>');
|
||||
for (var i = 0, len = childFormElements.length; i < len; ++i) {
|
||||
childList.append(_renderNestedSortableListItem(childFormElements[i]));
|
||||
}
|
||||
}
|
||||
|
||||
if (childList) {
|
||||
listItem.append(childList);
|
||||
}
|
||||
return listItem;
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return void
|
||||
* @publish view/tree/dnd/stop
|
||||
* @publish view/tree/dnd/change
|
||||
* @publish view/tree/dnd/update
|
||||
*/
|
||||
function _addSortableEvents() {
|
||||
$('ol.' + getHelper().getDomElementClassName('sortable'), _treeDomElement).nestedSortable({
|
||||
forcePlaceholderSize: true,
|
||||
protectRoot: true,
|
||||
isTree: true,
|
||||
handle: 'div' + getHelper().getDomElementDataAttribute('elementIdentifier', 'bracesWithKey'),
|
||||
helper: 'clone',
|
||||
items: 'li',
|
||||
opacity: .6,
|
||||
revert: 250,
|
||||
delay: 200,
|
||||
tolerance: 'pointer',
|
||||
toleranceElement: '> div',
|
||||
|
||||
isAllowed: function(placeholder, placeholderParent, currentItem) {
|
||||
var formElementIdentifierPath, formElementTypeDefinition, targetFormElementIdentifierPath,
|
||||
targetFormElementTypeDefinition;
|
||||
|
||||
if (typeof placeholderParent === 'undefined') {
|
||||
return true;
|
||||
}
|
||||
|
||||
formElementIdentifierPath = getTreeNodeIdentifierPathWithinDomElement($(currentItem));
|
||||
targetFormElementIdentifierPath = getTreeNodeIdentifierPathWithinDomElement($(placeholderParent));
|
||||
|
||||
formElementTypeDefinition = getFormElementDefinition(formElementIdentifierPath);
|
||||
targetFormElementTypeDefinition = getFormElementDefinition(targetFormElementIdentifierPath);
|
||||
|
||||
if (
|
||||
targetFormElementTypeDefinition['_isTopLevelFormElement']
|
||||
&& !targetFormElementTypeDefinition['_isCompositeFormElement']
|
||||
) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (
|
||||
formElementTypeDefinition['_isGridContainerFormElement']
|
||||
&& (
|
||||
getFormEditorApp().findEnclosingGridContainerFormElement(targetFormElementIdentifierPath)
|
||||
|| getFormEditorApp().findEnclosingGridRowFormElement(targetFormElementIdentifierPath)
|
||||
)
|
||||
) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (
|
||||
!formElementTypeDefinition['_isGridContainerFormElement']
|
||||
&& !formElementTypeDefinition['_isGridRowFormElement']
|
||||
&& targetFormElementTypeDefinition['_isGridContainerFormElement']
|
||||
) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
},
|
||||
stop: function(e, o) {
|
||||
getPublisherSubscriber().publish('view/tree/dnd/stop', [getTreeNodeIdentifierPathWithinDomElement($(o.item))]);
|
||||
},
|
||||
change: function(e, o) {
|
||||
var enclosingCompositeFormElement, parentFormElementIdentifierPath;
|
||||
|
||||
parentFormElementIdentifierPath = getParentTreeNodeIdentifierPathWithinDomElement($(o.placeholder));
|
||||
if (parentFormElementIdentifierPath) {
|
||||
enclosingCompositeFormElement = getFormEditorApp().findEnclosingCompositeFormElementWhichIsNotOnTopLevel(parentFormElementIdentifierPath);
|
||||
}
|
||||
getPublisherSubscriber().publish('view/tree/dnd/change', [$(o.placeholder), parentFormElementIdentifierPath, enclosingCompositeFormElement]);
|
||||
},
|
||||
update: function(e, o) {
|
||||
var nextFormElementIdentifierPath, movedFormElementIdentifierPath,
|
||||
previousFormElementIdentifierPath;
|
||||
|
||||
movedFormElementIdentifierPath = getTreeNodeIdentifierPathWithinDomElement($(o.item));
|
||||
previousFormElementIdentifierPath = getSiblingTreeNodeIdentifierPathWithinDomElement($(o.item), 'prev');
|
||||
nextFormElementIdentifierPath = getSiblingTreeNodeIdentifierPathWithinDomElement($(o.item), 'next');
|
||||
|
||||
getPublisherSubscriber().publish('view/tree/dnd/update', [$(o.item), movedFormElementIdentifierPath, previousFormElementIdentifierPath, nextFormElementIdentifierPath]);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return void
|
||||
*/
|
||||
function _saveExpanderStates() {
|
||||
var addStates;
|
||||
|
||||
addStates = function(formElement) {
|
||||
var childFormElements, treeNode;
|
||||
|
||||
if (getFormElementDefinition(formElement, '_isCompositeFormElement')) {
|
||||
treeNode = getTreeNode(formElement);
|
||||
if (treeNode.length) {
|
||||
if (treeNode.closest('li').hasClass(getHelper().getDomElementClassName('expanded'))) {
|
||||
_expanderStates[formElement.get('__identifierPath')] = true;
|
||||
} else {
|
||||
_expanderStates[formElement.get('__identifierPath')] = false;
|
||||
}
|
||||
}
|
||||
|
||||
if (getUtility().isUndefinedOrNull(_expanderStates[formElement.get('__identifierPath')])) {
|
||||
_expanderStates[formElement.get('__identifierPath')] = true;
|
||||
}
|
||||
}
|
||||
|
||||
childFormElements = formElement.get('renderables');
|
||||
if ('array' === $.type(childFormElements)) {
|
||||
for (var i = 0, len = childFormElements.length; i < len; ++i) {
|
||||
addStates(childFormElements[i]);
|
||||
}
|
||||
}
|
||||
};
|
||||
addStates(getRootFormElement());
|
||||
|
||||
for (var identifierPath in _expanderStates) {
|
||||
if (!_expanderStates.hasOwnProperty(identifierPath)) {
|
||||
continue;
|
||||
}
|
||||
try {
|
||||
getFormEditorApp().getFormElementByIdentifierPath(identifierPath);
|
||||
} catch (error) {
|
||||
delete _expanderStates[identifierPath];
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return void
|
||||
*/
|
||||
function _loadExpanderStates() {
|
||||
for (var identifierPath in _expanderStates) {
|
||||
var treeNode;
|
||||
|
||||
if (!_expanderStates.hasOwnProperty(identifierPath)) {
|
||||
continue;
|
||||
}
|
||||
treeNode = getTreeNode(identifierPath);
|
||||
if (treeNode.length) {
|
||||
if (_expanderStates[identifierPath]) {
|
||||
treeNode.closest('li')
|
||||
.removeClass(getHelper().getDomElementClassName('collapsed'))
|
||||
.addClass(getHelper().getDomElementClassName('expanded'));
|
||||
} else {
|
||||
treeNode.closest('li')
|
||||
.addClass(getHelper().getDomElementClassName('collapsed'))
|
||||
.removeClass(getHelper().getDomElementClassName('expanded'));
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/* *************************************************************
|
||||
* Public Methodes
|
||||
* ************************************************************/
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object
|
||||
* @return object
|
||||
* @throws 1478721208
|
||||
*/
|
||||
function renderCompositeFormElementChildsAsSortableList(formElement) {
|
||||
var elementList;
|
||||
assert('object' === $.type(formElement), 'Invalid parameter "formElement"', 1478721208);
|
||||
|
||||
elementList = $('<ol></ol>').addClass(getHelper().getDomElementClassName('sortable'));
|
||||
if ('array' === $.type(formElement.get('renderables'))) {
|
||||
for (var i = 0, len = formElement.get('renderables').length; i < len; ++i) {
|
||||
elementList.append(_renderNestedSortableListItem(formElement.get('renderables')[i]));
|
||||
}
|
||||
}
|
||||
return elementList;
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @return void
|
||||
* @param object
|
||||
* @publish view/tree/node/clicked
|
||||
*/
|
||||
function renew(formElement) {
|
||||
if (getFormEditorApp().getUtility().isUndefinedOrNull(formElement)) {
|
||||
formElement = getRootFormElement();
|
||||
}
|
||||
_saveExpanderStates();
|
||||
_treeDomElement.off().empty().append(renderCompositeFormElementChildsAsSortableList(formElement));
|
||||
|
||||
_treeDomElement.on("click", function(e) {
|
||||
var formElementIdentifierPath;
|
||||
|
||||
formElementIdentifierPath = $(e.target)
|
||||
.closest(getHelper().getDomElementDataAttribute('elementIdentifier', 'bracesWithKey'))
|
||||
.attr(getHelper().getDomElementDataAttribute('elementIdentifier'));
|
||||
if (getUtility().isUndefinedOrNull(formElementIdentifierPath) || !getUtility().isNonEmptyString(formElementIdentifierPath)) {
|
||||
return;
|
||||
}
|
||||
getPublisherSubscriber().publish('view/tree/node/clicked', [formElementIdentifierPath]);
|
||||
});
|
||||
|
||||
$(getHelper().getDomElementDataIdentifierSelector('expander'), _treeDomElement).on('click', function() {
|
||||
$(this).closest('li').toggleClass(getHelper().getDomElementClassName('collapsed')).toggleClass(getHelper().getDomElementClassName('expanded'));
|
||||
});
|
||||
|
||||
if (_configuration['isSortable']) {
|
||||
_addSortableEvents();
|
||||
}
|
||||
_loadExpanderStates();
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object
|
||||
* @return string
|
||||
*/
|
||||
function getAllTreeNodes() {
|
||||
return $(getHelper().getDomElementDataAttribute('elementIdentifier', 'bracesWithKey'), _treeDomElement);
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object
|
||||
* @return string
|
||||
*/
|
||||
function getTreeNodeWithinDomElement(element) {
|
||||
return $(element).find(getHelper().getDomElementDataAttribute('elementIdentifier', 'bracesWithKey')).first();
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object
|
||||
* @return string
|
||||
*/
|
||||
function getTreeNodeIdentifierPathWithinDomElement(element) {
|
||||
return getTreeNodeWithinDomElement($(element)).attr(getHelper().getDomElementDataAttribute('elementIdentifier'));
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object
|
||||
* @return string
|
||||
*/
|
||||
function getParentTreeNodeWithinDomElement(element) {
|
||||
return $(element).parent().closest('li').find(getHelper().getDomElementDataAttribute('elementIdentifier', 'bracesWithKey')).first();
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object
|
||||
* @return string
|
||||
*/
|
||||
function getParentTreeNodeIdentifierPathWithinDomElement(element) {
|
||||
return getParentTreeNodeWithinDomElement(element).attr(getHelper().getDomElementDataAttribute('elementIdentifier'));
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @param object
|
||||
* @param string
|
||||
* @return string
|
||||
*/
|
||||
function getSiblingTreeNodeIdentifierPathWithinDomElement(element, position) {
|
||||
var formElementIdentifierPath;
|
||||
|
||||
if (getUtility().isUndefinedOrNull(position)) {
|
||||
position = 'prev';
|
||||
}
|
||||
formElementIdentifierPath = getTreeNodeIdentifierPathWithinDomElement(element);
|
||||
element = (position === 'prev') ? $(element).prev('li') : $(element).next('li');
|
||||
return element.find(getHelper().getDomElementDataAttribute('elementIdentifier', 'bracesWithKey'))
|
||||
.not(getHelper().getDomElementDataAttribute('elementIdentifier', 'bracesWithKeyValue', [formElementIdentifierPath]))
|
||||
.first()
|
||||
.attr(getHelper().getDomElementDataAttribute('elementIdentifier'));
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string
|
||||
* @param object
|
||||
* @return void
|
||||
*/
|
||||
function setTreeNodeTitle(title, formElement) {
|
||||
if (getUtility().isUndefinedOrNull(title)) {
|
||||
title = buildTitleByFormElement(formElement);
|
||||
}
|
||||
|
||||
$(getHelper().getDomElementDataIdentifierSelector('title'), getTreeNode(formElement)).html(title);
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string|object
|
||||
* @return object
|
||||
*/
|
||||
function getTreeNode(formElement) {
|
||||
var formElementIdentifierPath;
|
||||
|
||||
if ('string' === $.type(formElement)) {
|
||||
formElementIdentifierPath = formElement;
|
||||
} else {
|
||||
if (getUtility().isUndefinedOrNull(formElement)) {
|
||||
formElementIdentifierPath = getCurrentlySelectedFormElement().get('__identifierPath');
|
||||
} else {
|
||||
formElementIdentifierPath = formElement.get('__identifierPath');
|
||||
}
|
||||
}
|
||||
return $(getHelper().getDomElementDataAttribute('elementIdentifier', 'bracesWithKeyValue', [formElementIdentifierPath]), _treeDomElement);
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object
|
||||
* @return object
|
||||
* @throws 1478719287
|
||||
*/
|
||||
function buildTitleByFormElement(formElement) {
|
||||
if (getUtility().isUndefinedOrNull(formElement)) {
|
||||
formElement = getCurrentlySelectedFormElement();
|
||||
}
|
||||
assert('object' === $.type(formElement), 'Invalid parameter "formElement"', 1478719287);
|
||||
|
||||
return $('<span></span>')
|
||||
.text((formElement.get('label') ? formElement.get('label') : formElement.get('identifier')))
|
||||
.append($('<small></small>').text("(" + getFormElementDefinition(formElement, 'label') + ")"));
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @return object
|
||||
*/
|
||||
function getTreeDomElement() {
|
||||
return _treeDomElement;
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object
|
||||
* @param object
|
||||
* @param object
|
||||
* @return this
|
||||
* @throws 1478714814
|
||||
*/
|
||||
function bootstrap(formEditorApp, appendToDomElement, configuration) {
|
||||
_formEditorApp = formEditorApp;
|
||||
assert('object' === $.type(appendToDomElement), 'Invalid parameter "appendToDomElement"', 1478714814);
|
||||
|
||||
_treeDomElement = $(appendToDomElement);
|
||||
_configuration = $.extend(true, _defaultConfiguration, configuration || {});
|
||||
_helperSetup();
|
||||
return this;
|
||||
};
|
||||
|
||||
/**
|
||||
* Publish the public methods.
|
||||
* Implements the "Revealing Module Pattern".
|
||||
*/
|
||||
return {
|
||||
bootstrap: bootstrap,
|
||||
buildTitleByFormElement: buildTitleByFormElement,
|
||||
getAllTreeNodes: getAllTreeNodes,
|
||||
getParentTreeNodeWithinDomElement: getParentTreeNodeWithinDomElement,
|
||||
getParentTreeNodeIdentifierPathWithinDomElement: getParentTreeNodeIdentifierPathWithinDomElement,
|
||||
getSiblingTreeNodeIdentifierPathWithinDomElement: getSiblingTreeNodeIdentifierPathWithinDomElement,
|
||||
getTreeDomElement: getTreeDomElement,
|
||||
getTreeNode: getTreeNode,
|
||||
getTreeNodeWithinDomElement: getTreeNodeWithinDomElement,
|
||||
getTreeNodeIdentifierPathWithinDomElement: getTreeNodeIdentifierPathWithinDomElement,
|
||||
renderCompositeFormElementChildsAsSortableList: renderCompositeFormElementChildsAsSortableList,
|
||||
renew: renew,
|
||||
setTreeNodeTitle: setTreeNodeTitle
|
||||
};
|
||||
})($, Helper, Icons);
|
||||
});
|
||||
File diff suppressed because it is too large.
Load diff
@@ -0,0 +1,240 @@
|
||||
/*
|
||||
* This file is part of the TYPO3 CMS project.
|
||||
*
|
||||
* It is free software; you can redistribute it and/or modify it under
|
||||
* the terms of the GNU General Public License, either version 2
|
||||
* of the License, or any later version.
|
||||
*
|
||||
* For the full copyright and license information, please read the
|
||||
* LICENSE.txt file that was distributed with this source code.
|
||||
*
|
||||
* The TYPO3 project - inspiring people to share!
|
||||
*/
|
||||
|
||||
/**
|
||||
* Module: TYPO3/CMS/Form/Backend/FormManager
|
||||
*/
|
||||
define(['jquery'], function($) {
|
||||
'use strict';
|
||||
|
||||
/**
|
||||
* Return a static method named "getInstance".
|
||||
* Use this method to create the formmanager app.
|
||||
*/
|
||||
return (function() {
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* Hold the instance (Singleton Pattern)
|
||||
*/
|
||||
var _formManagerInstance = null;
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object _configuration
|
||||
* @param object _viewModel
|
||||
* @return object
|
||||
*/
|
||||
function FormManager(_configuration, _viewModel) {
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @var bool
|
||||
*/
|
||||
var _isRunning = false;
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param mixed test
|
||||
* @param string message
|
||||
* @param int messageCode
|
||||
* @return void
|
||||
*/
|
||||
function assert(test, message, messageCode) {
|
||||
if ('function' === $.type(test)) {
|
||||
test = (test() !== false);
|
||||
}
|
||||
if (!test) {
|
||||
message = message || "Assertion failed";
|
||||
if (messageCode) {
|
||||
message = message + ' (' + messageCode + ')';
|
||||
}
|
||||
if ('undefined' !== typeof Error) {
|
||||
throw new Error(message);
|
||||
}
|
||||
throw message;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @var bool
|
||||
*/
|
||||
var _isRunning = false;
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @return object
|
||||
*/
|
||||
function getPrototypes() {
|
||||
var prototypes = [];
|
||||
|
||||
if ('array' === $.type(_configuration['selectablePrototypesConfiguration'])) {
|
||||
for (var i = 0, len = _configuration['selectablePrototypesConfiguration'].length; i < len; ++i) {
|
||||
prototypes.push({
|
||||
label: _configuration['selectablePrototypesConfiguration'][i]['label'],
|
||||
value: _configuration['selectablePrototypesConfiguration'][i]['identifier']
|
||||
});
|
||||
}
|
||||
}
|
||||
return prototypes;
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string prototypeName
|
||||
* @return object
|
||||
*/
|
||||
function getTemplatesForPrototype(prototypeName) {
|
||||
var templates = [];
|
||||
assert('string' === $.type(prototypeName), 'Invalid parameter "prototypeName"', 1475945286);
|
||||
if ('array' === $.type(_configuration['selectablePrototypesConfiguration'])) {
|
||||
for (var i = 0, len1 = _configuration['selectablePrototypesConfiguration'].length; i < len1; ++i) {
|
||||
if (_configuration['selectablePrototypesConfiguration'][i]['identifier'] !== prototypeName) {
|
||||
continue;
|
||||
}
|
||||
if ('array' === $.type(_configuration['selectablePrototypesConfiguration'][i]['newFormTemplates'])) {
|
||||
for (var j = 0, len2 = _configuration['selectablePrototypesConfiguration'][i]['newFormTemplates'].length; j < len2; ++j) {
|
||||
templates.push({
|
||||
label: _configuration['selectablePrototypesConfiguration'][i]['newFormTemplates'][j]['label'],
|
||||
value: _configuration['selectablePrototypesConfiguration'][i]['newFormTemplates'][j]['templatePath']
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return templates;
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string prototypeName
|
||||
* @return object
|
||||
*/
|
||||
function getAccessibleFormStorageFolders() {
|
||||
var folders = [];
|
||||
|
||||
if ('array' === $.type(_configuration['accessibleFormStorageFolders'])) {
|
||||
for (var i = 0, len1 = _configuration['accessibleFormStorageFolders'].length; i < len1; ++i) {
|
||||
folders.push({
|
||||
label: _configuration['accessibleFormStorageFolders'][i]['label'] + ' (' + _configuration['accessibleFormStorageFolders'][i]['value'] + ')',
|
||||
value: _configuration['accessibleFormStorageFolders'][i]['value']
|
||||
});
|
||||
}
|
||||
}
|
||||
return folders;
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string prototypeName
|
||||
* @return object
|
||||
* @throws 1477506508
|
||||
*/
|
||||
function getAjaxEndpoint(endpointName) {
|
||||
var templates = [];
|
||||
assert(typeof _configuration['endpoints'][endpointName] !== 'undefined', 'Endpoint ' + endpointName + ' does not exist', 1477506508);
|
||||
|
||||
return _configuration['endpoints'][endpointName];
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return void
|
||||
* @throws 1475942906
|
||||
*/
|
||||
function _viewSetup() {
|
||||
assert('function' === $.type(_viewModel.bootstrap), 'The view model does not implement the method "bootstrap"', 1475942906);
|
||||
_viewModel.bootstrap(_formManagerInstance);
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return void
|
||||
* @throws 1477506504
|
||||
*/
|
||||
function _bootstrap() {
|
||||
_configuration = _configuration || {};
|
||||
assert('object' === $.type(_configuration['endpoints']), 'Invalid parameter "endpoints"', 1477506504);
|
||||
_viewSetup();
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @return TYPO3/CMS/Form/Backend/FormManager
|
||||
* @throws 1475942618
|
||||
*/
|
||||
function run() {
|
||||
if (_isRunning) {
|
||||
throw 'You can not run the app twice (1475942618)';
|
||||
}
|
||||
|
||||
_bootstrap();
|
||||
_isRunning = true;
|
||||
return this;
|
||||
};
|
||||
|
||||
/**
|
||||
* Publish the public methods.
|
||||
* Implements the "Revealing Module Pattern".
|
||||
*/
|
||||
return {
|
||||
getPrototypes: getPrototypes,
|
||||
getTemplatesForPrototype: getTemplatesForPrototype,
|
||||
getAccessibleFormStorageFolders: getAccessibleFormStorageFolders,
|
||||
getAjaxEndpoint: getAjaxEndpoint,
|
||||
|
||||
assert: assert,
|
||||
run: run
|
||||
};
|
||||
};
|
||||
|
||||
/**
|
||||
* Emulation of static methods
|
||||
*/
|
||||
return {
|
||||
/**
|
||||
* @public
|
||||
* @static
|
||||
*
|
||||
* Implement the "Singleton Pattern".
|
||||
*
|
||||
* Return a singleton instance of a
|
||||
* "FormManager" object.
|
||||
*
|
||||
* @param object configuration
|
||||
* @param object viewModel
|
||||
* @return object
|
||||
*/
|
||||
getInstance: function(configuration, viewModel) {
|
||||
if (_formManagerInstance === null) {
|
||||
_formManagerInstance = new FormManager(configuration, viewModel);
|
||||
}
|
||||
return _formManagerInstance;
|
||||
}
|
||||
};
|
||||
})();
|
||||
});
|
||||
@@ -0,0 +1,575 @@
|
||||
/*
|
||||
* This file is part of the TYPO3 CMS project.
|
||||
*
|
||||
* It is free software; you can redistribute it and/or modify it under
|
||||
* the terms of the GNU General Public License, either version 2
|
||||
* of the License, or any later version.
|
||||
*
|
||||
* For the full copyright and license information, please read the
|
||||
* LICENSE.txt file that was distributed with this source code.
|
||||
*
|
||||
* The TYPO3 project - inspiring people to share!
|
||||
*/
|
||||
|
||||
/**
|
||||
* Module: TYPO3/CMS/Form/Backend/FormManager/ViewModel
|
||||
*/
|
||||
define(['jquery',
|
||||
'TYPO3/CMS/Backend/Modal',
|
||||
'TYPO3/CMS/Backend/Severity',
|
||||
'TYPO3/CMS/Backend/Wizard',
|
||||
'TYPO3/CMS/Backend/Icons',
|
||||
'TYPO3/CMS/Backend/Notification'
|
||||
], function($, Modal, Severity, Wizard, Icons, Notification) {
|
||||
'use strict';
|
||||
|
||||
return (function($, Modal, Severity, Wizard, Icons, Notification) {
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @var object
|
||||
*/
|
||||
var _formManagerApp = null;
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @var object
|
||||
*/
|
||||
var _domElementIdentifierCache = {};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return void
|
||||
*/
|
||||
function _domElementIdentifierCacheSetup() {
|
||||
_domElementIdentifierCache = {
|
||||
newFormModalTrigger: {identifier: '[data-identifier="newForm"]'},
|
||||
duplicateFormModalTrigger: {identifier: '[data-identifier="duplicateForm"]'},
|
||||
removeFormModalTrigger: {identifier: '[data-identifier="removeForm"]'},
|
||||
|
||||
newFormName: {identifier: '[data-identifier="newFormName"]'},
|
||||
newFormSavePath: {identifier: '[data-identifier="newFormSavePath"]'},
|
||||
advancedWizard: {identifier: '[data-identifier="advancedWizard"]'},
|
||||
newFormPrototypeName: {identifier: '[data-identifier="newFormPrototypeName"]'},
|
||||
newFormTemplate: {identifier: '[data-identifier="newFormTemplate"]'},
|
||||
|
||||
duplicateFormName: {identifier: '[data-identifier="duplicateFormName"]'},
|
||||
duplicateFormSavePath: {identifier: '[data-identifier="duplicateFormSavePath"]'},
|
||||
|
||||
showReferences: {identifier: '[data-identifier="showReferences"]'},
|
||||
referenceLink: {identifier: '[data-identifier="referenceLink"]'},
|
||||
|
||||
tooltip: {identifier: '[data-toggle="tooltip"]'},
|
||||
|
||||
moduleBody: {class: '.module-body.t3js-module-body'},
|
||||
t3Logo: {class: '.t3-message-page-logo'},
|
||||
t3Footer: {id: '#t3-footer'}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return void
|
||||
* @throws 1477506500
|
||||
* @throws 1477506501
|
||||
* @throws 1477506502
|
||||
*/
|
||||
function _newFormSetup() {
|
||||
$(getDomElementIdentifier('newFormModalTrigger')).on('click', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
/**
|
||||
* Wizard step 1
|
||||
*/
|
||||
Wizard.addSlide('new-form-step-1', TYPO3.lang['formManager.newFormWizard.step1.title'], '', Severity.info, function(slide) {
|
||||
var advandecWizardHasOptions, folders, html, modal, nextButton, prototypes,
|
||||
savePathSelect, templates;
|
||||
|
||||
modal = Wizard.setup.$carousel.closest('.modal');
|
||||
nextButton = modal.find('.modal-footer').find('button[name="next"]');
|
||||
|
||||
folders = _formManagerApp.getAccessibleFormStorageFolders();
|
||||
if (folders.length === 0) {
|
||||
html = '<div class="new-form-modal">'
|
||||
+ '<div class="form-horizontal">'
|
||||
+ '<div>'
|
||||
+ '<label class="control-label">' + TYPO3.lang['formManager.newFormWizard.step1.noStorages'] + '</label>'
|
||||
+ '</div>'
|
||||
+ '</div>'
|
||||
+ '</div>';
|
||||
|
||||
slide.html(html);
|
||||
_formManagerApp.assert(false, 'No accessible form storage folders', 1477506500);
|
||||
}
|
||||
|
||||
Wizard.set('savePath', folders[0]['value']);
|
||||
if (folders.length > 1) {
|
||||
savePathSelect = $('<select class="new-form-save-path form-control" id="new-form-save-path" data-identifier="newFormSavePath" />');
|
||||
for (var i = 0, len = folders.length; i < len; ++i) {
|
||||
var option = new Option(folders[i]['label'], folders[i]['value']);
|
||||
$(savePathSelect).append(option);
|
||||
}
|
||||
}
|
||||
|
||||
prototypes = _formManagerApp.getPrototypes();
|
||||
|
||||
_formManagerApp.assert(prototypes.length > 0, 'No prototypes available', 1477506501);
|
||||
Wizard.set('prototypeName', prototypes[0]['value']);
|
||||
|
||||
templates = _formManagerApp.getTemplatesForPrototype(prototypes[0]['value']);
|
||||
_formManagerApp.assert(templates.length > 0, 'No templates available', 1477506502);
|
||||
Wizard.set('templatePath', templates[0]['value']);
|
||||
|
||||
html = '<div class="new-form-modal">'
|
||||
+ '<div class="form-horizontal">'
|
||||
+ '<div>'
|
||||
+ '<label class="control-label" for="new-form-name">' + TYPO3.lang['formManager.form_name'] + '</label>'
|
||||
+ '<input class="new-form-name form-control has-error" id="new-form-name" data-identifier="newFormName" />';
|
||||
|
||||
if (savePathSelect) {
|
||||
html += '<label class="control-label" for="new-form-save-path">' + TYPO3.lang['formManager.form_save_path'] + '</label>' + $(savePathSelect)[0].outerHTML;
|
||||
}
|
||||
|
||||
if (prototypes.length > 1 || templates.length > 1) {
|
||||
html += '<label class="control-label" for="new-form-advance-wizard">' + TYPO3.lang['formManager.newFormWizard.step1.advanced'] + '</label>'
|
||||
+ '<div class="t3-form-controls"><input type="checkbox" class="new-form-advance-wizard" id="new-form-advance-wizard" data-identifier="advancedWizard" /></div>';
|
||||
}
|
||||
|
||||
html += '</div>'
|
||||
+ '</div>'
|
||||
+ '</div>';
|
||||
|
||||
slide.html(html);
|
||||
$(getDomElementIdentifier('newFormName'), modal).focus();
|
||||
|
||||
$(getDomElementIdentifier('newFormName'), modal).on('keyup paste', function(e) {
|
||||
if ($(this).val().length > 0) {
|
||||
$(this).removeClass('has-error');
|
||||
Wizard.unlockNextStep();
|
||||
Wizard.set('formName', $(this).val());
|
||||
} else {
|
||||
$(this).addClass('has-error');
|
||||
Wizard.lockNextStep();
|
||||
}
|
||||
});
|
||||
|
||||
$(getDomElementIdentifier('newFormSavePath'), modal).on('change', function(e) {
|
||||
Wizard.set('savePath', $(getDomElementIdentifier('newFormSavePath') + ' option:selected', modal).val());
|
||||
});
|
||||
|
||||
$(getDomElementIdentifier('advancedWizard'), modal).on('change', function(e) {
|
||||
if ($(this).is(':checked')) {
|
||||
Wizard.set('advancedWizard', true);
|
||||
} else {
|
||||
Wizard.set('advancedWizard', false);
|
||||
}
|
||||
});
|
||||
|
||||
nextButton.on('click', function() {
|
||||
Wizard.setup.forceSelection = false;
|
||||
Icons.getIcon('spinner-circle-dark', Icons.sizes.large, null, null).done(function(markup) {
|
||||
slide.html($('<div />', {class: 'text-center'}).append(markup));
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
/**
|
||||
* Wizard step 2
|
||||
*/
|
||||
Wizard.addSlide('new-form-step-2', TYPO3.lang['formManager.newFormWizard.step2.title'], '', Severity.info, function(slide, settings) {
|
||||
var addOnTemplateChangeEvents, html, modal, nextButton, prototypes, prototypeNameSelect,
|
||||
templates, templateSelect;
|
||||
|
||||
if (settings['advancedWizard'] !== true) {
|
||||
Wizard.unlockNextStep().trigger('click');
|
||||
return;
|
||||
}
|
||||
|
||||
modal = Wizard.setup.$carousel.closest('.modal');
|
||||
nextButton = modal.find('.modal-footer').find('button[name="next"]');
|
||||
|
||||
prototypeNameSelect = $('<select class="new-form-prototype-name form-control" id="new-form-prototype-name" data-identifier="newFormPrototypeName" />');
|
||||
templateSelect = $('<select class="new-form-template form-control" id="new-form-template" data-identifier="newFormTemplate" />');
|
||||
|
||||
prototypes = _formManagerApp.getPrototypes();
|
||||
templates = {};
|
||||
if (prototypes.length > 0) {
|
||||
for (var i = 0, len = prototypes.length; i < len; ++i) {
|
||||
var option = new Option(prototypes[i]['label'], prototypes[i]['value']);
|
||||
$(prototypeNameSelect).append(option);
|
||||
}
|
||||
|
||||
templates = _formManagerApp.getTemplatesForPrototype(prototypes[0]['value']);
|
||||
for (var i = 0, len = templates.length; i < len; ++i) {
|
||||
var option = new Option(templates[i]['label'], templates[i]['value']);
|
||||
$(templateSelect).append(option);
|
||||
}
|
||||
}
|
||||
|
||||
html = '<div class="new-form-modal">'
|
||||
+ '<div class="form-horizontal">'
|
||||
+ '<div>';
|
||||
|
||||
if (prototypes.length > 1) {
|
||||
html += '<label class="control-label" for="new-form-prototype-name">' + TYPO3.lang['formManager.form_prototype'] + '</label>' + $(prototypeNameSelect)[0].outerHTML;
|
||||
}
|
||||
if (templates.length > 1) {
|
||||
html += '<label class="control-label" for="new-form-template">' + TYPO3.lang['formManager.form_template'] + '</label>' + $(templateSelect)[0].outerHTML;
|
||||
}
|
||||
|
||||
html += '</div>'
|
||||
+ '</div>'
|
||||
+ '</div>';
|
||||
|
||||
slide.html(html);
|
||||
if (prototypes.length > 1) {
|
||||
$(getDomElementIdentifier('newFormPrototypeName'), modal).focus();
|
||||
} else if (templates.length > 1) {
|
||||
$(getDomElementIdentifier('newFormTemplate'), modal).focus();
|
||||
}
|
||||
|
||||
addOnTemplateChangeEvents = function() {
|
||||
$(getDomElementIdentifier('newFormTemplate'), modal).on('change', function(e) {
|
||||
Wizard.set('templatePath', $(getDomElementIdentifier('newFormTemplate') + ' option:selected', modal).val());
|
||||
});
|
||||
};
|
||||
|
||||
$(getDomElementIdentifier('newFormPrototypeName'), modal).on('change', function(e) {
|
||||
Wizard.set('prototypeName', $(this).val());
|
||||
templates = _formManagerApp.getTemplatesForPrototype($(this).val());
|
||||
$(getDomElementIdentifier('newFormTemplate'), modal).off().empty();
|
||||
for (var i = 0, len = templates.length; i < len; ++i) {
|
||||
var option = new Option(templates[i]['label'], templates[i]['value']);
|
||||
$(getDomElementIdentifier('newFormTemplate'), modal).append(option);
|
||||
Wizard.set('templatePath', templates[0]['value']);
|
||||
}
|
||||
addOnTemplateChangeEvents();
|
||||
});
|
||||
|
||||
addOnTemplateChangeEvents();
|
||||
|
||||
nextButton.on('click', function() {
|
||||
Icons.getIcon('spinner-circle-dark', Icons.sizes.large, null, null).done(function(markup) {
|
||||
slide.html($('<div />', {class: 'text-center'}).append(markup));
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
/**
|
||||
* Wizard step 3
|
||||
*/
|
||||
Wizard.addSlide('new-form-step-3', TYPO3.lang['formManager.newFormWizard.step3.title'], TYPO3.lang['formManager.newFormWizard.step3.message'], Severity.info);
|
||||
|
||||
/**
|
||||
* Wizard step 4
|
||||
*/
|
||||
Wizard.addFinalProcessingSlide(function() {
|
||||
$.post(_formManagerApp.getAjaxEndpoint('create'), {
|
||||
tx_form_web_formformbuilder: {
|
||||
formName: Wizard.setup.settings['formName'],
|
||||
templatePath: Wizard.setup.settings['templatePath'],
|
||||
prototypeName: Wizard.setup.settings['prototypeName'],
|
||||
savePath: Wizard.setup.settings['savePath']
|
||||
}
|
||||
}, function(data, textStatus, jqXHR) {
|
||||
if (data['status'] === 'success') {
|
||||
document.location = data.url;
|
||||
} else {
|
||||
Notification.error(TYPO3.lang['formManager.newFormWizard.step4.errorTitle'], TYPO3.lang['formManager.newFormWizard.step4.errorMessage'] + " " + data['message']);
|
||||
}
|
||||
Wizard.dismiss();
|
||||
}).fail(function(jqXHR, textStatus, errorThrown) {
|
||||
var parser = new DOMParser(),
|
||||
responseDocument = parser.parseFromString(jqXHR.responseText, "text/html"),
|
||||
responseBody = $(responseDocument.body);
|
||||
|
||||
Notification.error(textStatus, errorThrown, 2);
|
||||
Wizard.dismiss();
|
||||
|
||||
$(getDomElementIdentifier('t3Logo', 'class'), responseBody).remove();
|
||||
$(getDomElementIdentifier('t3Footer', 'id'), responseBody).remove();
|
||||
$(getDomElementIdentifier('moduleBody', 'class')).html(responseBody.html());
|
||||
});
|
||||
}).done(function() {
|
||||
Wizard.show();
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return void
|
||||
*/
|
||||
function _removeFormSetup() {
|
||||
$(getDomElementIdentifier('removeFormModalTrigger')).on('click', function(e) {
|
||||
var modalButtons = [], that;
|
||||
|
||||
e.preventDefault();
|
||||
that = $(this)
|
||||
|
||||
modalButtons.push({
|
||||
text: TYPO3.lang['formManager.cancel'],
|
||||
active: true,
|
||||
btnClass: 'btn-default',
|
||||
name: 'cancel',
|
||||
trigger: function() {
|
||||
Modal.currentModal.trigger('modal-dismiss');
|
||||
}
|
||||
});
|
||||
|
||||
modalButtons.push({
|
||||
text: TYPO3.lang['formManager.remove_form'],
|
||||
active: true,
|
||||
btnClass: 'btn-warning',
|
||||
name: 'createform',
|
||||
trigger: function() {
|
||||
document.location = _formManagerApp.getAjaxEndpoint('delete') + '&tx_form_web_formformbuilder[formPersistenceIdentifier]=' + that.data('formPersistenceIdentifier');
|
||||
Modal.currentModal.trigger('modal-dismiss');
|
||||
}
|
||||
});
|
||||
|
||||
Modal.show(
|
||||
TYPO3.lang['formManager.remove_form_title'],
|
||||
TYPO3.lang['formManager.remove_form_message'],
|
||||
Severity.warning,
|
||||
modalButtons
|
||||
);
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return void
|
||||
* @throws 1477649539
|
||||
*/
|
||||
function _duplicateFormSetup() {
|
||||
$(getDomElementIdentifier('duplicateFormModalTrigger')).on('click', function(e) {
|
||||
var that;
|
||||
|
||||
e.preventDefault();
|
||||
that = $(this);
|
||||
|
||||
/**
|
||||
* Wizard step 1
|
||||
*/
|
||||
Wizard.addSlide('duplicate-form-step-1', TYPO3.lang['formManager.duplicateFormWizard.step1.title'].replace('{0}', that.data('formName')), '', Severity.info, function(slide) {
|
||||
var folders, html, modal, nextButton, savePathSelect;
|
||||
|
||||
modal = Wizard.setup.$carousel.closest('.modal');
|
||||
nextButton = modal.find('.modal-footer').find('button[name="next"]');
|
||||
|
||||
folders = _formManagerApp.getAccessibleFormStorageFolders();
|
||||
_formManagerApp.assert(folders.length > 0, 'No accessible form storage folders', 1477649539);
|
||||
|
||||
Wizard.set('formPersistenceIdentifier', that.data('formPersistenceIdentifier'));
|
||||
Wizard.set('savePath', folders[0]['value']);
|
||||
if (folders.length > 1) {
|
||||
savePathSelect = $('<select class="duplicate-form-save-path form-control" data-identifier="duplicateFormSavePath" />');
|
||||
for (var i = 0, len = folders.length; i < len; ++i) {
|
||||
var option = new Option(folders[i]['label'], folders[i]['value']);
|
||||
$(savePathSelect).append(option);
|
||||
}
|
||||
}
|
||||
|
||||
html = '<div class="duplicate-form-modal">'
|
||||
+ '<div class="form-horizontal">'
|
||||
+ '<div>'
|
||||
+ '<label class="control-label">' + TYPO3.lang['formManager.new_form_name'] + '</label>'
|
||||
+ '<input class="duplicate-form-name form-control has-error" data-identifier="duplicateFormName" />';
|
||||
|
||||
if (savePathSelect) {
|
||||
html += '<label class="control-label">' + TYPO3.lang['formManager.form_save_path'] + '</label>' + $(savePathSelect)[0].outerHTML;
|
||||
}
|
||||
|
||||
html += '</div>'
|
||||
+ '</div>'
|
||||
+ '</div>';
|
||||
|
||||
slide.html(html);
|
||||
$(getDomElementIdentifier('duplicateFormName'), modal).focus();
|
||||
|
||||
$(getDomElementIdentifier('duplicateFormName'), modal).on('keyup paste', function(e) {
|
||||
if ($(this).val().length > 0) {
|
||||
$(this).removeClass('has-error');
|
||||
Wizard.unlockNextStep();
|
||||
Wizard.set('formName', $(this).val());
|
||||
} else {
|
||||
$(this).addClass('has-error');
|
||||
Wizard.lockNextStep();
|
||||
}
|
||||
});
|
||||
|
||||
$(getDomElementIdentifier('duplicateFormSavePath'), modal).on('change', function(e) {
|
||||
Wizard.set('savePath', $(getDomElementIdentifier('duplicateFormSavePath') + ' option:selected', modal).val());
|
||||
});
|
||||
});
|
||||
|
||||
/**
|
||||
* Wizard step 2
|
||||
*/
|
||||
Wizard.addFinalProcessingSlide(function() {
|
||||
$.post(_formManagerApp.getAjaxEndpoint('duplicate'), {
|
||||
tx_form_web_formformbuilder: {
|
||||
formName: Wizard.setup.settings['formName'],
|
||||
formPersistenceIdentifier: Wizard.setup.settings['formPersistenceIdentifier'],
|
||||
savePath: Wizard.setup.settings['savePath']
|
||||
}
|
||||
}, function(data, textStatus, jqXHR) {
|
||||
if (data['status'] === 'success') {
|
||||
document.location = data.url;
|
||||
} else {
|
||||
Notification.error(TYPO3.lang['formManager.duplicateFormWizard.step2.errorTitle'], TYPO3.lang['formManager.duplicateFormWizard.step2.errorMessage'] + " " + data['message']);
|
||||
}
|
||||
Wizard.dismiss();
|
||||
}).fail(function(jqXHR, textStatus, errorThrown) {
|
||||
var parser = new DOMParser(),
|
||||
responseDocument = parser.parseFromString(jqXHR.responseText, "text/html"),
|
||||
responseBody = $(responseDocument.body);
|
||||
|
||||
Notification.error(textStatus, errorThrown, 2);
|
||||
Wizard.dismiss();
|
||||
|
||||
$(getDomElementIdentifier('t3Logo', 'class'), responseBody).remove();
|
||||
$(getDomElementIdentifier('t3Footer', 'id'), responseBody).remove();
|
||||
$(getDomElementIdentifier('moduleBody', 'class')).html(responseBody.html());
|
||||
});
|
||||
}).done(function() {
|
||||
Wizard.show();
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
*
|
||||
* @return void
|
||||
*/
|
||||
function _showReferencesSetup() {
|
||||
$(getDomElementIdentifier('showReferences')).on('click', function(e) {
|
||||
var that, url;
|
||||
|
||||
e.preventDefault();
|
||||
that = this;
|
||||
url = _formManagerApp.getAjaxEndpoint('references') + '&tx_form_web_formformbuilder[formPersistenceIdentifier]=' + $(this).data('formPersistenceIdentifier');
|
||||
|
||||
$.get(url, function(data, textStatus, jqXHR) {
|
||||
var html, modalButtons = [], referencesLength;
|
||||
|
||||
modalButtons.push({
|
||||
text: TYPO3.lang['formManager.cancel'],
|
||||
active: true,
|
||||
btnClass: 'btn-default',
|
||||
name: 'cancel',
|
||||
trigger: function() {
|
||||
Modal.currentModal.trigger('modal-dismiss');
|
||||
}
|
||||
});
|
||||
|
||||
referencesLength = data['references'].length;
|
||||
if (referencesLength > 0) {
|
||||
html = '<div>'
|
||||
+ '<h3>' + TYPO3.lang['formManager.references.headline'].replace('{0}', $(that).data('formName')) + '</h3>'
|
||||
+ '</div>'
|
||||
+ '<div class="table-fit">'
|
||||
+ '<table id="forms" class="table table-striped table-condensed">'
|
||||
+ '<thead>'
|
||||
+ '<tr>'
|
||||
+ '<th>' + TYPO3.lang['formManager.page'] + '</th>'
|
||||
+ '<th>' + TYPO3.lang['formManager.record'] + '</th>'
|
||||
+ '</tr>'
|
||||
+ '</thead>'
|
||||
+ '<tbody>';
|
||||
|
||||
for (var i = 0, len = data['references'].length; i < len; ++i) {
|
||||
html += '<tr>'
|
||||
+ '<td>' + data['references'][i]['recordPageTitle'] + '</td>'
|
||||
+ '<td>'
|
||||
+ data['references'][i]['recordIcon']
|
||||
+ '<a href="' + data['references'][i]['recordEditUrl'] + '" data-identifier="referenceLink">'
|
||||
+ data['references'][i]['recordTitle'] + ' (uid: ' + data['references'][i]['recordUid'] + ')'
|
||||
+ '</a>'
|
||||
+ '</td>'
|
||||
+ '</tr>';
|
||||
}
|
||||
|
||||
html += '</tbody>'
|
||||
+ '</table>'
|
||||
+ '</div>';
|
||||
} else {
|
||||
html = '<div>'
|
||||
+ '<h1>' + TYPO3.lang['formManager.references.title'].replace('{0}', data['formPersistenceIdentifier']) + '</h1>'
|
||||
+ '</div>'
|
||||
+ '<div>' + TYPO3.lang['formManager.no_references'] + '</div>';
|
||||
}
|
||||
|
||||
html = $(html);
|
||||
$(getDomElementIdentifier('referenceLink'), html).on('click', function(e) {
|
||||
e.preventDefault();
|
||||
Modal.currentModal.trigger('modal-dismiss');
|
||||
document.location = $(this).prop('href');
|
||||
});
|
||||
|
||||
Modal.show(
|
||||
TYPO3.lang['formManager.references.title'],
|
||||
html,
|
||||
Severity.info,
|
||||
modalButtons
|
||||
);
|
||||
}).fail(function(jqXHR, textStatus, errorThrown) {
|
||||
if (jqXHR.status !== 0) {
|
||||
Notification.error(textStatus, errorThrown, 2);
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param string elementIdentifier
|
||||
* @param string type
|
||||
* @return mixed|undefined
|
||||
* @throws 1477506413
|
||||
* @throws 1477506414
|
||||
*/
|
||||
function getDomElementIdentifier(elementIdentifier, type) {
|
||||
_formManagerApp.assert(elementIdentifier.length > 0, 'Invalid parameter "elementIdentifier"', 1477506413);
|
||||
_formManagerApp.assert(typeof _domElementIdentifierCache[elementIdentifier] !== "undefined", 'elementIdentifier "' + elementIdentifier + '" does not exist', 1477506414);
|
||||
if (typeof type === "undefined") {
|
||||
type = 'identifier';
|
||||
}
|
||||
|
||||
return _domElementIdentifierCache[elementIdentifier][type] || undefined;
|
||||
};
|
||||
|
||||
/**
|
||||
* @public
|
||||
*
|
||||
* @param object formManagerApp
|
||||
* @return void
|
||||
*/
|
||||
function bootstrap(formManagerApp) {
|
||||
_formManagerApp = formManagerApp;
|
||||
_domElementIdentifierCacheSetup();
|
||||
_removeFormSetup();
|
||||
_newFormSetup();
|
||||
_duplicateFormSetup();
|
||||
_showReferencesSetup();
|
||||
$(getDomElementIdentifier('tooltip')).tooltip();
|
||||
};
|
||||
|
||||
/**
|
||||
* Publish the public methods.
|
||||
* Implements the "Revealing Module Pattern".
|
||||
*/
|
||||
return {
|
||||
bootstrap: bootstrap
|
||||
};
|
||||
})($, Modal, Severity, Wizard, Icons, Notification);
|
||||
});
|
||||
Reference in new issue
Block a user