diff --git a/ajax/brick/templates/extras.html b/ajax/brick/templates/extras.html
index 24555389b8e8ac587112833e03caaa4279d17add..368ffba918716b0a8716b0f9a51d50be63a4825a 100644
--- a/ajax/brick/templates/extras.html
+++ b/ajax/brick/templates/extras.html
@@ -1,25 +1,23 @@
-
<form class="quiqqer-bricks-brickedit">
- <table class="data-table brick-edit-extra-header">
+ <table class="data-table data-table-flexbox brick-edit-extra-header">
<thead>
<tr>
- <th colspan="2">
+ <th>
{locale group="quiqqer/bricks" var="brick.edit.extra.header"}
</th>
</tr>
</thead>
<tbody>
-
- <tr class="{cycle values="odd,even"}">
- <td>
- <label for="frontendTitle">
- {locale group="quiqqer/bricks" var="brick.edit.frontendTitle"}
- </label>
- </td>
- <td>
- <input type="text" name="frontendTitle" id="frontendTitle" />
- </td>
+ <tr>
+ <td>
+ <label for="frontendTitle" class="field-container">
+ <span class="field-container-item">
+ {locale group="quiqqer/bricks" var="brick.edit.frontendTitle"}
+ </span>
+ <input type="text" name="frontendTitle" id="frontendTitle" class="field-container-field"/>
+ </label>
+ </td>
</tr>
</tbody>
</table>
diff --git a/ajax/brick/templates/information.html b/ajax/brick/templates/information.html
index 66929b65544ea1cb3f4133739e601d6ef52a2130..4dacc7d4f52c19748b5ea9f79f9585770fcefa59 100644
--- a/ajax/brick/templates/information.html
+++ b/ajax/brick/templates/information.html
@@ -1,44 +1,47 @@
-
-<form class="quiqqer-bricks-brickedit" name="">
- <table class="data-table">
- <thead>
+<form class="quiqqer-bricks-brickedit">
+ <table class="data-table data-table-flexbox">
+ <thead>
<tr>
- <th colspan="2">
+ <th>
{locale group="quiqqer/bricks" var="brick.edit.header"}
</th>
</tr>
- </thead>
- <tbody>
- <tr class="{cycle values="odd,even"}">
+ </thead>
+ <tbody>
+ <tr>
<td>
- <label for="title">
- {locale group="quiqqer/bricks" var="brick.edit.backendTitle"}
+ <label for="title" class="field-container">
+ <span class="field-container-item">
+ {locale group="quiqqer/bricks" var="brick.edit.backendTitle"}
+ </span>
+ <input type="text" name="title" id="title" class="field-container-field"/>
</label>
</td>
- <td>
- <input type="text" name="title" id="title" />
- </td>
</tr>
- <tr class="{cycle values="odd,even"}">
+ <tr>
<td>
- <label for="description">
- {locale group="quiqqer/bricks" var="brick.edit.description"}
+ <label for="description" class="field-container">
+ <span class="field-container-item">
+ {locale group="quiqqer/bricks" var="brick.edit.description"}
+ </span>
+ <textarea name="description"
+ id="description"
+ class="field-container-field"
+ style="height: 100px"
+ ></textarea>
</label>
</td>
- <td>
- <textarea name="description" id="description"></textarea>
- </td>
</tr>
- <tr class="{cycle values="odd,even"}">
+ <tr>
<td>
- <label for="type">
- {locale group="quiqqer/bricks" var="brick.edit.type"}
+ <label for="type" class="field-container">
+ <span class="field-container-item">
+ {locale group="quiqqer/bricks" var="brick.edit.type"}
+ </span>
+ <input type="text" name="type" id="type" disabled="disabled" class="field-container-field"/>
</label>
</td>
- <td>
- <input type="text" name="type" id="type" disabled="disabled" />
- </td>
</tr>
- </tbody>
+ </tbody>
</table>
</form>
\ No newline at end of file
diff --git a/ajax/brick/templates/settings.html b/ajax/brick/templates/settings.html
index bba10df1c44f9c2e45ed73634f038438130d373a..35d154a65ce0b07da3e69591b8ae2442f08b3b20 100644
--- a/ajax/brick/templates/settings.html
+++ b/ajax/brick/templates/settings.html
@@ -1,105 +1,32 @@
-
<form class="quiqqer-bricks-brickedit">
- <table class="data-table">
- <thead>
+ <table class="data-table data-table-flexbox">
+ <thead>
<tr>
<th>
{locale group="quiqqer/bricks" var="brick.edit.allowed.areas"}
</th>
</tr>
- </thead>
- <tbody>
- <tr class="{cycle values="odd,even"}">
+ </thead>
+ <tbody>
+ <tr>
<td>
<div class="quiqqer-bricks-areas"></div>
</td>
</tr>
- </tbody>
+ </tbody>
</table>
-<!--
- <table class="data-table">
- <thead>
+ <table class="data-table data-table-flexbox brick-table-flexible">
+ <thead>
<tr>
- <th colspan="2">
- {locale group="quiqqer/bricks" var="brick.edit.settings.proportion.header"}
+ <th>
+ {locale group="quiqqer/bricks" var="brick.edit.settings.flexible.header"}
+ <div class="description">
+ {locale group="quiqqer/bricks" var="brick.edit.settings.flexible.header.description"}
+ </div>
</th>
</tr>
- </thead>
- <tbody>
- <tr class="{cycle values="odd,even" reset=true}">
- <td>
- <label for="height">
- {locale group="quiqqer/bricks" var="brick.edit.height"}
- </label>
- </td>
- <td>
- <input type="text" name="height" id="height" />
- </td>
- </tr>
- <tr class="{cycle values="odd,even"}">
- <td>
- <label for="width">
- {locale group="quiqqer/bricks" var="brick.edit.width"}
- </label>
- </td>
- <td>
- <input type="text" name="width" id="width" />
- </td>
- </tr>
- <tr class="{cycle values="odd,even"}">
- <td>
- <label for="classes">
- {locale group="quiqqer/bricks" var="brick.edit.classes"}
- </label>
- </td>
- <td>
- <input type="text" name="classes" id="classes" />
- </td>
- </tr>
- </tbody>
+ </thead>
+ <tbody></tbody>
</table>
--->
-
- <table class="data-table brick-table-flexible">
- <thead>
- <tr>
- <th>
- {locale group="quiqqer/bricks" var="brick.edit.settings.flexible.header"}
- <div class="description">
- {locale group="quiqqer/bricks" var="brick.edit.settings.flexible.header.description"}
- </div>
- </th>
- </tr>
- </thead>
- <tbody>
- <!--
- <tr class="{cycle values="odd,even" reset=true}">
- <td>
- <label>
- <input type="checkbox" name="flexible-height">
- <span>{locale group="quiqqer/bricks" var="brick.edit.height"}</span>
- </label>
- </td>
- </tr>
- <tr class="{cycle values="odd,even"}">
- <td>
- <label>
- <input type="checkbox" name="flexible-width">
- <span>{locale group="quiqqer/bricks" var="brick.edit.width"}</span>
- </label>
- </td>
- </tr>
- <tr class="{cycle values="odd,even"}">
- <td>
- <label>
- <input type="checkbox" name="flexible-classes">
- <span>{locale group="quiqqer/bricks" var="brick.edit.classes"}</span>
- </label>
- </td>
- </tr>
- -->
- </tbody>
- </table>
-
</form>
\ No newline at end of file
diff --git a/bin/BrickEdit.css b/bin/BrickEdit.css
index 76d576ec0baf4d2982a926314a8557f9b1f4ea09..571bde0efc7b2c29b8193f85cf2a138ed2294d0f 100644
--- a/bin/BrickEdit.css
+++ b/bin/BrickEdit.css
@@ -14,7 +14,7 @@
.brick-edit-content {
margin-bottom: 0;
}
-
+/*
.quiqqer-bricks-brickedit label {
clear: both;
float: left;
@@ -30,7 +30,7 @@
max-width: 300px;
width: 100%;
}
-
+*/
.quiqqer-bricks-brickedit .cke_source {
max-width: 100%;
}
diff --git a/bin/BrickEdit.js b/bin/BrickEdit.js
index 6b6148fd04541a7318c8a8eeeacb099568dd2d0a..bb157014d536b97fa3b2e2b28e060ebb7aec27c9 100644
--- a/bin/BrickEdit.js
+++ b/bin/BrickEdit.js
@@ -258,7 +258,7 @@ define('package/quiqqer/bricks/bin/BrickEdit', [
data.customfields = self.$customfields;
- return Bricks.saveBrick(self.getAttribute('id'), data).then(function (attributes) {
+ return Bricks.saveBrick(self.getAttribute('id'), data).then(function () {
QUI.getMessageHandler().then(function (MH) {
MH.addSuccess(
QUILocale.get(lg, 'message.brick.save.success')
@@ -455,22 +455,38 @@ define('package/quiqqer/bricks/bin/BrickEdit', [
}).inject(Content.getElement('.quiqqer-bricks-areas'));
- // flexble settings
- var i, len, data;
+ // flexible settings
+ var i, len, data, description, Row;
var TBody = Content.getElement('.brick-table-flexible tbody');
for (i = 0, len = self.$availableSettings.length; i < len; i++) {
data = self.$availableSettings[i];
- new Element('tr', {
- 'class': i % 2 ? 'odd' : 'even',
- html : '<td>' +
- '<label>' +
+ Row = new Element('tr', {
+ html: '<td>' +
+ '<label class="field-container">' +
+ '<span class="field-container-item">' +
+ QUILocale.get(data.text[0], data.text[1]) + '' +
+ '</span>' +
+ '<div class="field-container-field">' +
'<input type="checkbox" name="flexible-' + data.name + '" />' +
- '<span>' + QUILocale.get(data.text[0], data.text[1]) + '</span>' +
+ '</div>' +
'</label>' +
'</td>'
}).inject(TBody);
+
+ description = data.description;
+
+ if (typeOf(data.description) === 'array') {
+ description = QUILocale.get(data.description[0], data.description[1]);
+ }
+
+ if (typeof description !== 'undefined' && description !== '') {
+ new Element('div', {
+ 'class': 'field-container-item-desc',
+ html : description
+ }).inject(Row.getElement('td'));
+ }
}
if (customfields) {
@@ -684,7 +700,7 @@ define('package/quiqqer/bricks/bin/BrickEdit', [
TableExtra.setStyle('display', null);
- var i, c, len, cLen, attr, Row, text, Value, setting,
+ var i, c, len, cLen, attr, Row, text, description, Value, setting,
extraFieldId, dataAttributes;
var self = this,
@@ -697,30 +713,40 @@ define('package/quiqqer/bricks/bin/BrickEdit', [
extraFieldId = 'extraField_' + id + '_' + i;
dataAttributes = setting['data-attributes'];
- text = setting.text;
+ text = setting.text;
+ description = setting.description;
if (typeOf(setting.text) === 'array') {
text = QUILocale.get(setting.text[0], setting.text[1]);
}
+ if (typeOf(setting.description) === 'array') {
+ description = QUILocale.get(setting.description[0], setting.description[1]);
+ }
+
Row = new Element('tr', {
- 'class': i % 2 ? 'odd' : 'even',
- html : '<td>' +
- ' <label class="quiqqer-bricks-areas" for="' + extraFieldId + '">' +
- text +
- ' </label>' +
- '</td>' +
- '<td></td>'
+ html: '<td>' +
+ '<label class="field-container" for="' + extraFieldId + '">' +
+ '<span class="field-container-item">' + text + '</span>' +
+ '</label>' +
+ '</td>'
}).inject(TableBody);
+ if (typeof description !== 'undefined' && description !== '') {
+ new Element('div', {
+ 'class': 'field-container-item-desc',
+ html : description
+ }).inject(Row.getElement('td'));
+ }
+
if (setting.type !== 'select') {
Value = new Element('input', {
type : setting.type,
name : setting.name,
'class': setting.class,
id : extraFieldId
- }).inject(Row.getElement('td:last-child'));
+ });
if (setting['data-qui'] !== '') {
Value.set('data-qui', setting['data-qui']);
@@ -734,6 +760,19 @@ define('package/quiqqer/bricks/bin/BrickEdit', [
}
}
+ if (Value.type === 'checkbox' ||
+ Value.type === 'radio' ||
+ Value.type === 'hidden') {
+ var Container = new Element('div', {
+ 'class': 'field-container-field'
+ }).inject(Row.getElement('.field-container'));
+
+ Value.inject(Container);
+ continue;
+ }
+
+ Value.classList.add('field-container-field');
+ Value.inject(Row.getElement('.field-container'));
continue;
}
@@ -741,7 +780,9 @@ define('package/quiqqer/bricks/bin/BrickEdit', [
name : setting.name,
'class': setting.class,
id : extraFieldId
- }).inject(Row.getElement('td:last-child'));
+ }).inject(Row.getElement('.field-container'));
+
+ Value.addClass('field-container-field');
for (c = 0, cLen = setting.options.length; c < cLen; c++) {
@@ -796,9 +837,7 @@ define('package/quiqqer/bricks/bin/BrickEdit', [
});
resolve();
-
}).catch(reject);
-
}.bind(this));
},
diff --git a/bin/Controls/Slider/PromosliderSettings.js b/bin/Controls/Slider/PromosliderSettings.js
index 5ab22d40bf4d5da2845b739e9c68744b9a318b51..db6bfeb2eba8c676462a4fcde01b44b902dba26d 100644
--- a/bin/Controls/Slider/PromosliderSettings.js
+++ b/bin/Controls/Slider/PromosliderSettings.js
@@ -70,20 +70,6 @@ define('package/quiqqer/bricks/bin/Controls/Slider/PromosliderSettings', [
}
}).wraps(this.$Input);
- // exist label?
- var id = this.$Input.get('id'),
- Label = document.getElement('label[for="' + id + '"]');
-
- if (Label) {
- var Cell = Label.getParent('td'),
- OldCell = this.$Elm.getParent('td');
-
- Cell.set('colspan', 2);
-
- this.$Elm.inject(Cell);
- OldCell.destroy();
- }
-
// grid and sizes
var size = this.$Elm.getSize();
@@ -233,7 +219,7 @@ define('package/quiqqer/bricks/bin/Controls/Slider/PromosliderSettings', [
*
* @param {Object} [caller] - the object calling this event
*/
- $toggleSlideStatus: function(caller) {
+ $toggleSlideStatus: function (caller) {
if (!caller) {
return;
}
@@ -277,8 +263,8 @@ define('package/quiqqer/bricks/bin/Controls/Slider/PromosliderSettings', [
insert.isDisabled = new QUISwitch({
status: entry.isDisabled === "1",
- name : i,
- uid: i,
+ name : i,
+ uid : i,
events: {
onChange: this.$toggleSlideStatus
}
@@ -310,7 +296,7 @@ define('package/quiqqer/bricks/bin/Controls/Slider/PromosliderSettings', [
if ("newTab" in entry) {
insert.newTab = new Element('span', {
- 'class': entry.newTab === "1" ? 'fa fa-check' : 'fa fa-times',
+ 'class' : entry.newTab === "1" ? 'fa fa-check' : 'fa fa-times',
'data-enabled': entry.newTab
});
}
@@ -392,7 +378,7 @@ define('package/quiqqer/bricks/bin/Controls/Slider/PromosliderSettings', [
entry.url = params.url;
}
- if("newTab" in params) {
+ if ("newTab" in params) {
entry.newTab = params.newTab;
}
@@ -652,13 +638,13 @@ define('package/quiqqer/bricks/bin/Controls/Slider/PromosliderSettings', [
var Content = Dialog.getContent();
var Form = Content.getElement('form');
- var IsDisabled = Form.elements.isDisabled;
- var Image = Form.elements.image;
- var Title = Form.elements.title;
- var Description = Form.elements.description;
- var Type = Form.elements.type;
- var Url = Form.elements.url;
- var NewTab = Form.elements.newTab;
+ var IsDisabled = Form.elements.isDisabled;
+ var Image = Form.elements.image;
+ var Title = Form.elements.title;
+ var Description = Form.elements.description;
+ var Type = Form.elements.type;
+ var Url = Form.elements.url;
+ var NewTab = Form.elements.newTab;
self.add({
isDisabled: IsDisabled.value,
@@ -722,7 +708,7 @@ define('package/quiqqer/bricks/bin/Controls/Slider/PromosliderSettings', [
this.IsDisabledSwitch = new QUISwitch({
- name: 'isDisabled',
+ name : 'isDisabled',
status: false
});
this.IsDisabledSwitch.inject(Container.getElement('#isDisabledWrapper'));
@@ -732,7 +718,7 @@ define('package/quiqqer/bricks/bin/Controls/Slider/PromosliderSettings', [
});
this.NewTabSwitch.inject(Container.getElement('#newTabWrapper'));
-
+
QUI.parse(Container).then(function () {
return ControlsUtils.parse(Container);
}).then(function () {
diff --git a/bin/Controls/Slider/ToggleMobileSlidesSetting.js b/bin/Controls/Slider/ToggleMobileSlidesSetting.js
index 868dbea707a432c54948b334b06a242f2bed665f..8c069aeeb187bc07e97b894f965c345a6d1b03ce 100644
--- a/bin/Controls/Slider/ToggleMobileSlidesSetting.js
+++ b/bin/Controls/Slider/ToggleMobileSlidesSetting.js
@@ -13,8 +13,6 @@ define('package/quiqqer/bricks/bin/Controls/Slider/ToggleMobileSlidesSetting', [
], function (QUI, QUIControl, QUISwitch) {
"use strict";
- var lg = 'quiqqer/bricks';
-
return new Class({
Extends: QUIControl,
@@ -47,7 +45,7 @@ define('package/quiqqer/bricks/bin/Controls/Slider/ToggleMobileSlidesSetting', [
status: this.getElm().value === "true",
events: {
onChange: this.$switchToggled,
- onLoad: function() {
+ onLoad : function () {
if (!this.$Switch.getStatus()) {
this.hideMobileSlidesSetting();
}
@@ -74,7 +72,10 @@ define('package/quiqqer/bricks/bin/Controls/Slider/ToggleMobileSlidesSetting', [
* @return {HTMLElement | null}
.*/
getMobileSlidesSettingElement: function () {
- return document.getElementsByName('mobileslides')[0].parentElement.parentElement.parentElement;
+ return this.getElm()
+ .getParent('table')
+ .getElement('[name="mobileslides"]')
+ .getParent('label');
},
diff --git a/src/QUI/Bricks/Manager.php b/src/QUI/Bricks/Manager.php
index 43c8515fbd0d735107e8d2ea7fe3ce9a950c45b1..b76685445d5c9b84ed4c2b552dede955cc4e6efd 100644
--- a/src/QUI/Bricks/Manager.php
+++ b/src/QUI/Bricks/Manager.php
@@ -637,6 +637,7 @@ protected function parseSettingToBrickArray(\DOMElement $Setting)
}
$dataAttributes = [];
+ $description = '';
foreach ($Setting->attributes as $attribute) {
if ($attribute->nodeName === 'data-qui') {
@@ -648,9 +649,16 @@ protected function parseSettingToBrickArray(\DOMElement $Setting)
}
}
+ $Description = $Setting->getElementsByTagName('description');
+
+ if ($Description->length) {
+ $description = QUI\Utils\DOM::getTextFromNode($Description->item(0), false);
+ }
+
return [
'name' => $Setting->getAttribute('name'),
'text' => QUI\Utils\DOM::getTextFromNode($Setting, false),
+ 'description' => $description,
'type' => $Setting->getAttribute('type'),
'class' => $Setting->getAttribute('class'),
'data-qui' => $Setting->getAttribute('data-qui'),