From 055fbc5e0e3b4e59b659f847c348c9445ccfa649 Mon Sep 17 00:00:00 2001 From: Nick Van den Bleeken Date: Thu, 8 Mar 2018 16:33:17 +0100 Subject: [PATCH] Keep element structure if it is already in the correct structure. There are some frameworks that don't like you to move elements around. By allowing the user to create the viewport and slider nodes themselves, the carousel is usable when you use a framework that doesn't allows you to move elements. --- dist/flickity.pkgd.js | 29 +++++++++++++++++++---------- dist/flickity.pkgd.min.js | 4 ++-- js/flickity.js | 29 +++++++++++++++++++---------- 3 files changed, 40 insertions(+), 22 deletions(-) diff --git a/dist/flickity.pkgd.js b/dist/flickity.pkgd.js index faf7a521..40f4d828 100644 --- a/dist/flickity.pkgd.js +++ b/dist/flickity.pkgd.js @@ -1296,9 +1296,13 @@ proto._create = function() { this.x = 0; this.velocity = 0; this.originSide = this.options.rightToLeft ? 'right' : 'left'; - // create viewport & slider - this.viewport = document.createElement('div'); - this.viewport.className = 'flickity-viewport'; + + this.viewport = this.element.querySelector('.flickity-viewport'); + if (!this.viewport) { + // create viewport & slider + this.viewport = document.createElement('div'); + this.viewport.className = 'flickity-viewport'; + } this._createSlider(); if ( this.options.resize || this.options.watchCSS ) { @@ -1336,11 +1340,13 @@ proto.activate = function() { } this.getSize(); - // move initial cell elements so they can be loaded as cells - var cellElems = this._filterFindCellElements( this.element.children ); - moveElements( cellElems, this.slider ); - this.viewport.appendChild( this.slider ); - this.element.appendChild( this.viewport ); + if (!this.slider.childElementCount) { + // move initial cell elements so they can be loaded as cells + var cellElems = this._filterFindCellElements( this.element.children ); + moveElements( cellElems, this.slider ); + this.viewport.appendChild( this.slider ); + this.element.appendChild( this.viewport ); + } // get cells from children this.reloadCells(); @@ -1371,8 +1377,11 @@ proto.activate = function() { // slider positions the cells proto._createSlider = function() { // slider element does all the positioning - var slider = document.createElement('div'); - slider.className = 'flickity-slider'; + var slider = this.viewport.querySelector('.flickity-slider'); + if (!slider) { + slider = document.createElement('div'); + slider.className = 'flickity-slider'; + } slider.style[ this.originSide ] = 0; this.slider = slider; }; diff --git a/dist/flickity.pkgd.min.js b/dist/flickity.pkgd.min.js index 9b4d3538..ba34029f 100644 --- a/dist/flickity.pkgd.min.js +++ b/dist/flickity.pkgd.min.js @@ -9,5 +9,5 @@ * Copyright 2017 Metafizzy */ -!function(t,e){"function"==typeof define&&define.amd?define("jquery-bridget/jquery-bridget",["jquery"],function(i){return e(t,i)}):"object"==typeof module&&module.exports?module.exports=e(t,require("jquery")):t.jQueryBridget=e(t,t.jQuery)}(window,function(t,e){"use strict";function i(i,o,a){function l(t,e,n){var s,o="$()."+i+'("'+e+'")';return t.each(function(t,l){var h=a.data(l,i);if(!h)return void r(i+" not initialized. Cannot call methods, i.e. "+o);var c=h[e];if(!c||"_"==e.charAt(0))return void r(o+" is not a valid method");var d=c.apply(h,n);s=void 0===s?d:s}),void 0!==s?s:t}function h(t,e){t.each(function(t,n){var s=a.data(n,i);s?(s.option(e),s._init()):(s=new o(n,e),a.data(n,i,s))})}a=a||e||t.jQuery,a&&(o.prototype.option||(o.prototype.option=function(t){a.isPlainObject(t)&&(this.options=a.extend(!0,this.options,t))}),a.fn[i]=function(t){if("string"==typeof t){var e=s.call(arguments,1);return l(this,t,e)}return h(this,t),this},n(a))}function n(t){!t||t&&t.bridget||(t.bridget=i)}var s=Array.prototype.slice,o=t.console,r="undefined"==typeof o?function(){}:function(t){o.error(t)};return n(e||t.jQuery),i}),function(t,e){"function"==typeof define&&define.amd?define("ev-emitter/ev-emitter",e):"object"==typeof module&&module.exports?module.exports=e():t.EvEmitter=e()}("undefined"!=typeof window?window:this,function(){function t(){}var e=t.prototype;return e.on=function(t,e){if(t&&e){var i=this._events=this._events||{},n=i[t]=i[t]||[];return n.indexOf(e)==-1&&n.push(e),this}},e.once=function(t,e){if(t&&e){this.on(t,e);var i=this._onceEvents=this._onceEvents||{},n=i[t]=i[t]||{};return n[e]=!0,this}},e.off=function(t,e){var i=this._events&&this._events[t];if(i&&i.length){var n=i.indexOf(e);return n!=-1&&i.splice(n,1),this}},e.emitEvent=function(t,e){var i=this._events&&this._events[t];if(i&&i.length){i=i.slice(0),e=e||[];for(var n=this._onceEvents&&this._onceEvents[t],s=0;s