Yac-carousel NPM

YAC Carousel (Yet Another Carousel)

Development

Setup

Clone repository
Run npm install to install all dependencies
Run npm run develop to start local webpack server. This will open test page automatically in the browser and reload on any code changes.

Architecture

The carousel is constructed by combining 2 classes: Container and Item. Various mixins are applied by default to all of these classes in order to extend their functionality and allow for a pluggable architecture.

Take a look at src/carousel.ts to get a better idea how the mixins are applied to the classes and test/page/index.ts to see how they are used to initialize the carousel.

Mixins

Mixin	Class	Description	Container Deps	Item Deps
AlignableCore	Container	Set/get align option
AlignableElement	Container	Automatically set align option by examining CSS styles applied to the element	AlignableCore ElementableCore
Autoplayable	Container	Allows automatic cycling through items	IndexableSelect
Controllable	Container	Set/get controller instance	ItemizableCoreInstance Typeable BoxModelable AlignableCore DirectionableCoreMixin IndexableSelect Nudgeable
CssTransformableTranslate	Item	Set/get CSS `transform: translate(...)` style on element		ElementableCore