Sha256: 04804081cff7e45676e91baa4140e826528fbcd398f45b621e0ead2eb8ba30cc
Contents?: true
Size: 1.25 KB
Versions: 3
Compression:
Stored size: 1.25 KB
Contents
import { CocoComponent } from "@assets/js/shared/coco";
export default CocoComponent("appPlanPicker", () => {
return {
slider: {
active: true,
position: 0,
items: [],
itemsPerPage: 4,
},
options: ["slider"],
init() {
this.slider.items = this.$refs.sliderItems.children;
this.$watch("slider.position", (position) => this.calculateOffset());
this.$watch("slider.active", (active) => {
if (!active) this.slider.position = 0;
});
},
previous() {
if (!this.isFirst) this.slider.position--;
},
next() {
if (!this.isLast) this.slider.position++;
},
get shouldPaginate() {
return (
this.sliderActive && this.slider.items.length > this.slider.itemsPerPage
);
},
calculateOffset() {
const offset = this.slider.items[this.slider.position].offsetLeft;
this.$refs.sliderItems.style.transform = `translateX(-${offset}px)`;
},
get sliderActive() {
return this.$options.slider && this.slider.active;
},
get isFirst() {
return this.slider.position == 0;
},
get isLast() {
return (
this.slider.position >=
this.slider.items.length - this.slider.itemsPerPage
);
},
};
});
Version data entries
3 entries across 3 versions & 1 rubygems