diff --git a/bin/Controls/Slider/PromosliderSettingsOnlyContent.js b/bin/Controls/Slider/PromosliderSettingsOnlyContent.js index 8d1fcf1ab2be92324340dbbce0fe6938540c18ca..430b47231390ce14f4642b6c7e079a745eac2c78 100644 --- a/bin/Controls/Slider/PromosliderSettingsOnlyContent.js +++ b/bin/Controls/Slider/PromosliderSettingsOnlyContent.js @@ -409,56 +409,8 @@ define('package/quiqqer/bricks/bin/Controls/Slider/PromosliderSettingsOnlyConten }, /** - * Open edit dialog - * - * @retrun {Promise} + * Dialogs */ - $openEditDialog: function () { - var data = this.$Grid.getSelectedData(); - var index = this.$Grid.getSelectedIndices(); - - if (!data.length) { - return; - } - - data = data[0]; - index = index[0]; - - return this.$createDialog().then(function (Container) { - var CloseButton = Container.getElement( - '.quiqqer-bricks-promoslider-settings-entry-buttons button' - ); - - var Button = QUI.Controls.getById(CloseButton.get('data-quiid')); - var Form = Container.getElement('form'); - - var Left = Form.elements.left; - var Right = Form.elements.right; - var Image = Form.elements.image; - var Url = Form.elements.url; - - Button.addEvent('click', function () { - this.edit(index, Left.value, Right.value, Image.value, Url.value); - - moofx(Container).animate({ - opacity: 0, - top : -30 - }, { - duration: 250, - callback: function () { - Container.destroy(); - } - }); - }.bind(this)); - - Left.value = data.left; - Right.value = data.right; - Image.value = data.image; - Url.value = data.url; - - Image.fireEvent('change'); - }.bind(this)); - }, /** * opens the delete dialog @@ -490,39 +442,88 @@ define('package/quiqqer/bricks/bin/Controls/Slider/PromosliderSettingsOnlyConten }).open(); }, + /** + * Open edit dialog + * + * @retrun {Promise} + */ + $openEditDialog: function () { + var self = this, + data = this.$Grid.getSelectedData(), + index = this.$Grid.getSelectedIndices(); + + if (!data.length) { + return Promise.resolve(); + } + + data = data[0]; + index = index[0]; + + return this.$createDialog().then(function (Dialog) { + Dialog.addEvent('onOpenAfterCreate', function () { + var Content = Dialog.getContent(); + var Form = Content.getElement('form'); + + var Left = Form.elements.left; + var Right = Form.elements.right; + var Image = Form.elements.image; + var Url = Form.elements.url; + + Left.value = data.left; + Right.value = data.right; + Image.value = data.image; + Url.value = data.url; + + Image.fireEvent('change'); + }); + + Dialog.addEvent('onSubmit', function () { + Dialog.Loader.show(); + + var Content = Dialog.getContent(); + var Form = Content.getElement('form'); + + var Left = Form.elements.left; + var Right = Form.elements.right; + var Image = Form.elements.image; + var Url = Form.elements.url; + + self.edit(index, Left.value, Right.value, Image.value, Url.value); + + Dialog.close(); + }); + + Dialog.setAttribute('title', QUILocale.get(lg, 'quiqqer.bricks.promoslider.editialog.title')); + Dialog.open(); + }); + }, + /** * * @returns {Promise} */ $openAddDialog: function () { - return this.$createDialog().then(function (Container) { - var CloseButton = Container.getElement( - '.quiqqer-bricks-promoslider-settings-entry-buttons button' - ); + var self = this; - var Button = QUI.Controls.getById(CloseButton.get('data-quiid')); + return this.$createDialog().then(function (Dialog) { + Dialog.addEvent('onSubmit', function () { + Dialog.Loader.show(); - Button.addEvent('click', function () { - var Form = Container.getElement('form'); + var Content = Dialog.getContent(); + var Form = Content.getElement('form'); var Left = Form.elements.left; var Right = Form.elements.right; var Image = Form.elements.image; var Url = Form.elements.url; - this.add(Left.value, Right.value, Image.value, Url.value); + self.add(Left.value, Right.value, Image.value, Url.value); - moofx(Container).animate({ - opacity: 0, - top : -30 - }, { - duration: 250, - callback: function () { - Container.destroy(); - } - }); - }.bind(this)); - }.bind(this)); + Dialog.close(); + }); + + Dialog.open(); + }); }, /** @@ -531,79 +532,74 @@ define('package/quiqqer/bricks/bin/Controls/Slider/PromosliderSettingsOnlyConten * @return {Promise} */ $createDialog: function () { - return new Promise(function (resolve) { - var Container = new Element('div', { - html : Mustache.render(templateEntry, { - fieldImage: QUILocale.get(lg, 'quiqqer.products.control.promoslider.image'), - fieldUrl : QUILocale.get(lg, 'quiqqer.products.control.promoslider.url'), - fieldLeft : QUILocale.get(lg, 'quiqqer.products.control.promoslider.left'), - fieldRight: QUILocale.get(lg, 'quiqqer.products.control.promoslider.right') - }), - 'class': 'quiqqer-bricks-promoslider-settings-entry' - }).inject(this.getElm()); - - var Close = Container.getElement( - '.quiqqer-bricks-promoslider-settings-entry-close' - ); - - var Buttons = Container.getElement( - '.quiqqer-bricks-promoslider-settings-entry-buttons' - ); - - var Text = Container.getElement('.field-description'); - - Text.getParent().setStyles({ - height: 100 - }); + var self = this; - Close.addEvent('click', function () { - moofx(Container).animate({ - opacity: 0, - top : -30 - }, { - duration: 250, - callback: function () { - Container.destroy(); + return new Promise(function (resolve) { + var Dialog = new QUIConfirm({ + title : QUILocale.get(lg, 'quiqqer.bricks.promoslider.adddialog.title'), + icon : 'fa fa-edit', + maxWidth : 800, + maxHeight: 600, + autoclose: false, + events : { + onOpen: function (Win) { + Win.Loader.show(); + Win.getContent().set('html', ''); + + var Container = new Element('div', { + html : Mustache.render(templateEntry, { + fieldImage : QUILocale.get(lg, 'quiqqer.bricks.promoslider.create.image'), + fieldUrl : QUILocale.get(lg, 'quiqqer.bricks.promoslider.create.url'), + fieldTitle : QUILocale.get(lg, 'quiqqer.bricks.promoslider.create.title'), + fieldDescription: QUILocale.get(lg, 'quiqqer.bricks.promoslider.create.text'), + fieldType : QUILocale.get(lg, 'quiqqer.bricks.promoslider.create.align'), + fieldLeft : QUILocale.get(lg, 'quiqqer.products.control.promoslider.left'), + fieldRight : QUILocale.get(lg, 'quiqqer.products.control.promoslider.right') + }), + 'class': 'quiqqer-bricks-promoslider-settings-entry' + }).inject(Win.getContent()); + + var Text = Container.getElement('.field-description'); + + Text.getParent().setStyles({ + height: 100 + }); + + QUI.parse(Container).then(function () { + return ControlsUtils.parse(Container); + }).then(function () { + var controls = QUI.Controls.getControlsInElement(Container), + project = self.getAttribute('project'); + + controls.each(function (Control) { + if (Control === self) { + return; + } + + if ("setProject" in Control) { + Control.setProject(project); + } + }); + + Win.fireEvent('openAfterCreate', [Win]); + + moofx(Container).animate({ + opacity: 1, + top : 0 + }, { + duration: 250, + callback: function () { + resolve(Container); + Win.Loader.hide(); + } + }); + }); } - }); - }); - - new QUIButton({ - text : QUILocale.get('quiqqer/system', 'accept'), - styles: { - 'float': 'none' } - }).inject(Buttons); - - - QUI.parse(Container).then(function () { - return ControlsUtils.parse(Container); - }).then(function () { - - var controls = QUI.Controls.getControlsInElement(Container), - project = this.getAttribute('project'); - - controls.each(function (Control) { - if (Control === this) { - return; - } + }); - if ("setProject" in Control) { - Control.setProject(project); - } - }.bind(this)); - - moofx(Container).animate({ - opacity: 1, - top : 0 - }, { - duration: 250, - callback: function () { - resolve(Container); - } - }); - }.bind(this)); - }.bind(this)); + resolve(Dialog); + }); } }); }); \ No newline at end of file diff --git a/bin/Controls/Slider/PromosliderSettingsOnlyContentEntry.html b/bin/Controls/Slider/PromosliderSettingsOnlyContentEntry.html index d83394116f82d12efefd137f61ec4cd645827483..912d226ca362b08b3fcba3b99246106b0787448d 100644 --- a/bin/Controls/Slider/PromosliderSettingsOnlyContentEntry.html +++ b/bin/Controls/Slider/PromosliderSettingsOnlyContentEntry.html @@ -1,47 +1,53 @@ -<div class="quiqqer-bricks-promoslider-settings-entry-header"> - <div class="quiqqer-bricks-promoslider-settings-entry-close"> - <span class="fa fa-remove"></span> - </div> -</div> - <form name="quiqqer-bricks-promoslider-settings-entry" class="quiqqer-bricks-promoslider-settings-entry-form" > - <label class="field-container"> - <span class="field-container-item"> - {{fieldImage}} - </span> - <span class="field-container-field"> - <input name="image" class="field-image media-image"/> - </span> - </label> - - <label class="field-container"> - <span class="field-container-item"> - {{fieldUrl}} - </span> - <span class="field-container-field"> - <input name="url" data-qui="controls/projects/project/site/Input"/> - </span> - </label> - - <label class="field-container"> - <span class="field-container-item"> - {{fieldLeft}} - </span> - <input name="left" class="field-container-field field-description" - data-qui="controls/editors/Input" - /> - </label> - - <label class="field-container"> - <span class="field-container-item"> - {{fieldRight}} - </span> - <input name="right" class="field-container-field field-description" - data-qui="controls/editors/Input" - /> - </label> + <table class="data-table data-table-flexbox"> + <tbody> + <tr> + <td> + <label class="field-container"> + <span class="field-container-item"> + {{fieldImage}} + </span> + <input name="image" class="field-container-field field-image media-image"/> + </label> + </td> + </tr> + <tr> + <td> + <label class="field-container"> + <span class="field-container-item"> + {{fieldUrl}} + </span> + <input name="url" class="field-container-field" + data-qui="controls/projects/project/site/Input"/> + </label> + </td> + </tr> + <tr> + <td> + <label class="field-container"> + <span class="field-container-item"> + {{fieldLeft}} + </span> + <input name="left" class="field-container-field field-description" + data-qui="controls/editors/Input" + /> + </label> + </td> + </tr> + <tr> + <td> + <label class="field-container"> + <span class="field-container-item"> + {{fieldRight}} + </span> + <input name="right" class="field-container-field field-description" + data-qui="controls/editors/Input" + /> + </label> + </td> + </tr> + </tbody> + </table> </form> - -<div class="quiqqer-bricks-promoslider-settings-entry-buttons"></div> \ No newline at end of file