diff --git a/bin/Controls/Slider/Promoslider.js b/bin/Controls/Slider/Promoslider.js index 23eec3e9325131a2afb9f65d5ba0f30e83f548c6..8804e9658345344af31398a348efb682b41683d4 100644 --- a/bin/Controls/Slider/Promoslider.js +++ b/bin/Controls/Slider/Promoslider.js @@ -29,14 +29,17 @@ define('package/quiqqer/bricks/bin/Controls/Slider/Promoslider', [ Binds: [ '$onImport', 'prev', - 'next' + 'next', + 'resize' ], options: { delay : 5000, effectduration: 400, autostart : true, - touch : true + touch : true, + pagefit : false, + pagefitcut : 0 }, initialize: function (options) { @@ -44,12 +47,14 @@ define('package/quiqqer/bricks/bin/Controls/Slider/Promoslider', [ this.$dots = []; this.$running = false; - - this.$Touch = null; + this.$Touch = null; + this.$FX = null; this.addEvents({ onImport: this.$onImport }); + + QUI.addEvent('resize', this.resize); }, /** @@ -60,6 +65,8 @@ define('package/quiqqer/bricks/bin/Controls/Slider/Promoslider', [ Elm = this.getElm(), slides = Elm.getElements('.quiqqer-bricks-promoslider-slide'); + this.$FX = moofx(Elm); + var Dots = new Element('div', { 'class': 'quiqqer-bricks-promoslider-dots' }).inject(Elm); @@ -75,7 +82,6 @@ define('package/quiqqer/bricks/bin/Controls/Slider/Promoslider', [ var i, len, Dot; for (i = 0, len = slides.length; i < len; i++) { - Dot = new Element('div', { 'class' : 'quiqqer-bricks-promoslider-dot', 'data-no': i, @@ -126,6 +132,31 @@ define('package/quiqqer/bricks/bin/Controls/Slider/Promoslider', [ if (this.getAttribute('autostart')) { this.$Timer = (this.next).periodical(this.getAttribute('delay')); } + + this.resize(); + }, + + /** + * resize the promoslider + */ + resize: function () { + if (!this.getAttribute('pagefit')) { + return; + } + + var winSize = QUI.getWindowSize(); + + + if (this.$FX) { + this.$FX.animate({ + height: winSize.y - this.getAttribute('pagefitcut') + }); + return; + } + + this.getElm().setStyles({ + height: winSize.y - this.getAttribute('pagefitcut') + }); }, /** diff --git a/bricks.xml b/bricks.xml index 939b54f5fab28f9b54565aa3444c3eee9f99f061..edf24437d2a43bdbf9abb5202e9fee640e598b40 100644 --- a/bricks.xml +++ b/bricks.xml @@ -134,6 +134,16 @@ <description> <locale group="quiqqer/bricks" var="brick.control.promoslider.description"/> </description> + + <settings> + <setting name="pagefit" type="checkbox"> + <locale group="quiqqer/bricks" var="brick.control.promoslider.pagefit"/> + </setting> + <setting name="pagefitcut" type="number"> + <locale group="quiqqer/bricks" var="brick.control.promoslider.pagefitcut"/> + </setting> + </settings> + </brick> <!-- Children Listing Infnite --> diff --git a/src/QUI/Bricks/Controls/Slider/Promoslider.css b/src/QUI/Bricks/Controls/Slider/Promoslider.css index d211b0dd81226666fc3f4c52d20f92186ec7f831..750397eaf79fdc975d5d1b305b67511137ea5c71 100644 --- a/src/QUI/Bricks/Controls/Slider/Promoslider.css +++ b/src/QUI/Bricks/Controls/Slider/Promoslider.css @@ -14,12 +14,12 @@ } .quiqqer-bricks-promoslider-slide-image { - height: 100%; + height: calc(100% - 50px); left: 0; padding: 10px 0 0 10px; position: absolute; top: 0; - width: auto; + width: 100%; } .quiqqer-bricks-promoslider-slide-image img { diff --git a/src/QUI/Bricks/Controls/Slider/Promoslider.php b/src/QUI/Bricks/Controls/Slider/Promoslider.php index f32675775a8c9d7a33a6e0b5be910035a15dca94..140b9ea848cc4b74d52ae77ddc6ac51bdcbb516d 100644 --- a/src/QUI/Bricks/Controls/Slider/Promoslider.php +++ b/src/QUI/Bricks/Controls/Slider/Promoslider.php @@ -109,6 +109,14 @@ public function getBody() { $Engine = QUI::getTemplateManager()->getEngine(); + if ($this->getAttribute('pagefit')) { + $this->setAttribute('data-qui-options-pagefit', $this->getAttribute('pagefit')); + } + + if ($this->getAttribute('pagefitcut')) { + $this->setAttribute('data-qui-options-pagefitcut', $this->getAttribute('pagefitcut')); + } + $Engine->assign(array( 'this' => $this, 'desktopSlides' => $this->desktopSlides,