src/config.js
/**
* Config data for Paraglider.
*
* @file config.js
* @module config
* @author Gregor Adams <greg@pixelass.com>
*/
/**
* Default classList for the plugin.
* This object can be replaced but not merged
* @private
* @type {object}
* @property {string} pluginLoaded Applied when the plugin has been loaded
* @property {string} init Applied when the plugin has been initialized. Removed on first interaction.
* @property {string} slides This element will be used to track touches. This is the wrapper around the slides.
* @property {string} slide Selector for each single slide.
* @property {string} current Applied to the currently visible slide
* @property {string} previous Applied to the previous slide in the queue
* @property {string} next Applied to the next slide in the queue
*/
const classNames = {
pluginLoaded: 'pluginLoaded',
slide: 'slide',
slides: 'slides',
init: 'init',
current: 'current',
previous: 'previous',
next: 'next'
}
/**
* Defaults for the presets.
* @type {object}
* @property {object} [classNames]
* Mapping of class names to be used by the plugin.
* @property {string} [classNames.pluginLoaded='pluginLoaded']
* Applied when the plugin has been loaded
* @property {string} [classNames.init='init']
* Applied when the plugin has been initialized. Removed on first interaction.
* @property {string} [classNames.slides='slides']
* This element will be used to track touches. This is the wrapper around the slides.
* @property {string} [classNames.slide='slide']
* Selector for each single slide.
* @property {string} [classNames.current='current']
* Applied to the currently visible slide
* @property {string} [classNames.previous='previous']
* Applied to the previous slide in the queue
* @property {string} [classNames.next='next']
* Applied to the next slide in the queue
* @property {object} [addClasses]
* Map of class names to be added to slides.
* @property {object} [addClasses.previous=true]
* Sets previous class name to slides.
* @property {object} [addClasses.current=true]
* Sets current class name to slides.
* @property {object} [addClasses.next=true]
* Sets next class name to slides.
* @property {object} [addMultiClasses]
* Map of class names to be added to slides using a counter.
* @property {object} [addMultiClasses.previous=undefined]
* Sets previous class name to slides using a counter.
* @property {object} [addMultiClasses.current]
* Sets current class name to slides using a counter.
* @property {object} [addMultiClasses.next=undefined]
* Sets next class name to slides using a counter.
* @property {boolean} [enableTouch=true]
* Enable touch interaction.
* @property {boolean} [enableSwipe=true]
* Enable mouse/drag/swipe interaction.
* @property {boolean} [loop=false]
* Enable looping slides.
* @property {?onInit} [onInit=null]
* Callback when the slider has been created.
* @property {?onDestroy} [onDestroy=null]
* Callback when the slider has been destroyed.
* @property {?onSlide} [onSlide=null]
* Callback while the slider is moving.
* @property {?onEnd} [onEnd=null]
* Callback while the slider stopped moving.
* @property {number} [speed=250]
* Animation duration when using paging.
* @property {number} [spring=100]
* Animation duration when snapping.
* @property {number} [snapBackAt=0.25]
* Amount of distance needed to snap. [0, 1]
* @property {number} [threshold=10]
* Threshold of pixels until the sliding mechanisms is triggered.
* @property {number} [initialSlide=0]
* Initially visible slide
* @property {number} [visibleSlides=1]
* Amount of visible slides
* @property {number} [slideBy=1]
* Amount of slides to slide on interaction
*/
const PLUGIN_DEFAULTS = {
classNames,
addClasses: {previous: true, current: true, next: true},
addMultiClasses: {current: true},
enableTouch: true,
enableSwipe: true,
loop: true,
onInit: null,
onDestroy: null,
onSlide: null,
onEnd: null,
speed: 250,
spring: 100,
snapBackAt: 0.25,
threshold: 10,
initialSlide: 0,
visibleSlides: 1,
slideBy: 1
}
/**
* Defaults for the presets.
* @type {object}
* @property {object} [classNames]
* Mapping of class names to be used by the plugin.
* @property {string} [classNames.pluginLoaded='pluginLoaded']
* Applied when the plugin has been loaded
* @property {string} [classNames.init='init']
* Applied when the plugin has been initialized. Removed on first interaction.
* @property {string} [classNames.slides='slides']
* This element will be used to track touches. This is the wrapper around the slides.
* @property {string} [classNames.slide='slide']
* Selector for each single slide.
* @property {string} [classNames.current='current']
* Applied to the currently visible slide
* @property {string} [classNames.previous='previous']
* Applied to the previous slide in the queue
* @property {string} [classNames.next='next']
* Applied to the next slide in the queue
* @property {string} [classNames.dot='dot']
* Selector for pager dots.
* @property {string} [classNames.active='active']
* Active class for pager dots.
* @property {string} [classNames.nextButton='nextButton']
* Selector for the navigation to the next slide.
* @property {string} [classNames.prevButton='prevButton']
* Selector for the navigation to the previous slide.
* @property {object} [addClasses]
* Map of class names to be added to slides.
* @property {object} [addClasses.previous=true]
* Sets previous class name to slides.
* @property {object} [addClasses.current=true]
* Sets current class name to slides.
* @property {object} [addClasses.next=true]
* Sets next class name to slides.
* @property {object} [addMultiClasses]
* Map of class names to be added to slides using a counter.
* @property {object} [addMultiClasses.previous=undefined]
* Sets previous class name to slides using a counter.
* @property {object} [addMultiClasses.current]
* Sets current class name to slides using a counter.
* @property {object} [addMultiClasses.next=undefined]
* Sets next class name to slides using a counter.
* @property {boolean} [enableTouch=true]
* Enable touch interaction.
* @property {boolean} [enableSwipe=true]
* Enable mouse/drag/swipe interaction.
* @property {boolean} [loop=false]
* Enable looping slides.
* @property {?onInit} [onInit=null]
* Callback when the slider has been created.
* @property {?onDestroy} [onDestroy=null]
* Callback when the slider has been destroyed.
* @property {?onSlide} [onSlide=null]
* Callback while the slider is moving.
* @property {?onEnd} [onEnd=null]
* Callback while the slider stopped moving.
* @property {number} [speed=250]
* Animation duration when using paging.
* @property {number} [spring=100]
* Animation duration when snapping.
* @property {number} [snapBackAt=0.25]
* Amount of distance needed to snap. [0, 1]
* @property {number} [threshold=10]
* Threshold of pixels until the sliding mechanisms is triggered.
* @property {number} [initialSlide=0]
* Initially visible slide
* @property {number} [visibleSlides=1]
* Amount of visible slides
* @property {number} [slideBy=1]
* Amount of slides to slide on interaction
*/
const PRESET_DEFAULTS = {
...PLUGIN_DEFAULTS,
classNames: {
...classNames,
dot: 'dot',
active: 'active',
nextButton: 'nextButton',
prevButton: 'prevButton'
}
}
export {
classNames,
PLUGIN_DEFAULTS,
PRESET_DEFAULTS
}