New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@pluginjs/thumbnails

Package Overview
Dependencies
Maintainers
2
Versions
43
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@pluginjs/thumbnails - npm Package Compare versions

Comparing version 0.7.18 to 0.7.19

166

dist/thumbnails.common.js
/*!
* @pluginjs/thumbnails v0.7.18 (https://pluginjs.com)
* @pluginjs/thumbnails v0.7.19 (https://pluginjs.com)
* Copyright 2019 Creation Studio Limited

@@ -39,61 +39,38 @@ * Released under the GPL-3.0 License.

function _objectSpread(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i] != null ? arguments[i] : {};
var ownKeys = Object.keys(source);
function ownKeys(object, enumerableOnly) {
var keys = Object.keys(object);
if (typeof Object.getOwnPropertySymbols === 'function') {
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
}));
}
ownKeys.forEach(function (key) {
_defineProperty(target, key, source[key]);
if (Object.getOwnPropertySymbols) {
var symbols = Object.getOwnPropertySymbols(object);
if (enumerableOnly) symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
keys.push.apply(keys, symbols);
}
return target;
return keys;
}
function _slicedToArray(arr, i) {
return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest();
}
function _objectSpread2(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i] != null ? arguments[i] : {};
function _arrayWithHoles(arr) {
if (Array.isArray(arr)) return arr;
}
function _iterableToArrayLimit(arr, i) {
var _arr = [];
var _n = true;
var _d = false;
var _e = undefined;
try {
for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
_arr.push(_s.value);
if (i && _arr.length === i) break;
if (i % 2) {
ownKeys(source, true).forEach(function (key) {
_defineProperty(target, key, source[key]);
});
} else if (Object.getOwnPropertyDescriptors) {
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
} else {
ownKeys(source).forEach(function (key) {
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
});
}
} catch (err) {
_d = true;
_e = err;
} finally {
try {
if (!_n && _i["return"] != null) _i["return"]();
} finally {
if (_d) throw _e;
}
}
return _arr;
return target;
}
function _nonIterableRest() {
throw new TypeError("Invalid attempt to destructure non-iterable instance");
}
const namespace = 'thumbnails';
const events = {
var namespace = 'thumbnails';
var events = {
READY: 'ready',

@@ -107,3 +84,3 @@ ENABLE: 'enable',

};
const classes = {
var classes = {
NAMESPACE: 'pj-thumb',

@@ -123,4 +100,4 @@ THEME: '{namespace}s--{theme}',

};
const methods = ['enable', 'disable', 'destroy', 'next', 'prev', 'go'];
const defaults = {
var methods = ['enable', 'disable', 'destroy', 'next', 'prev', 'go'];
var defaults = {
templates: {

@@ -152,6 +129,6 @@ inner() {

};
const dependencies = ['anime'];
var dependencies = ['anime'];
var _dec, _dec2, _dec3, _dec4, _dec5, _dec6, _class;
let Thumbnails = (_dec = decorator.themeable(), _dec2 = decorator.styleable(classes), _dec3 = decorator.eventable(events), _dec4 = decorator.stateable(), _dec5 = decorator.optionable(defaults, true), _dec6 = decorator.register(namespace, {
var Thumbnails = (_dec = decorator.themeable(), _dec2 = decorator.styleable(classes), _dec3 = decorator.eventable(events), _dec4 = decorator.stateable(), _dec5 = decorator.optionable(defaults, true), _dec6 = decorator.register(namespace, {
methods: methods,

@@ -161,3 +138,3 @@ dependencies: dependencies

constructor(element) {
let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
super(element);

@@ -200,4 +177,4 @@ this.setupOptions(options);

if (Breakpoints.all().includes(this.options.breakpoint)) {
const breakpoint = this.options.breakpoint;
const that = this;
var breakpoint = this.options.breakpoint;
var that = this;

@@ -222,10 +199,10 @@ if (Breakpoints.is("".concat(breakpoint, "-"))) {

parseHtml() {
const data = [];
const items = this.element.querySelectorAll(this.options.delegate);
const regex = new RegExp(/\((.+?)\)/);
var data = [];
var items = this.element.querySelectorAll(this.options.delegate);
var regex = new RegExp(/\((.+?)\)/);
if (items.length > 0) {
items.forEach(item => {
const thumb = dom.closest(".".concat(this.classes.THUMB), item);
let info = {
var thumb = dom.closest(".".concat(this.classes.THUMB), item);
var info = {
src: item.getAttribute('src') || window.getComputedStyle(item)['background-image'].match(regex)[1].replace(/'/g, '').replace(/"/g, '')

@@ -238,14 +215,12 @@ };

const _data = Object.entries(item.dataset).reduce((result, _ref) => {
let _ref2 = _slicedToArray(_ref, 2),
k = _ref2[0],
v = _ref2[1];
var _data = Object.entries(item.dataset).reduce((result, _ref) => {
var [k, v] = _ref;
try {
const content = JSON.parse("{\"data\": ".concat(v.replace(/'/g, '"'), "}")).data;
return _objectSpread({}, result, {
var content = JSON.parse("{\"data\": ".concat(v.replace(/'/g, '"'), "}")).data;
return _objectSpread2({}, result, {
[k]: content
});
} catch (err) {
return _objectSpread({}, result, {
return _objectSpread2({}, result, {
[k]: v

@@ -277,3 +252,3 @@ });

this.data.forEach((item, index) => {
const thumb = this.getElement('thumb');
var thumb = this.getElement('thumb');

@@ -294,3 +269,3 @@ if (item.type === 'video') {

this.items.forEach(item => {
let loader = '';
var loader = '';

@@ -313,5 +288,5 @@ if (this.options.loader) {

initSwipeable() {
const that = this;
var that = this;
const serPos = () => {
var serPos = () => {
this.pos = this.swipeable.position[this.options.vertical ? 'y' : 'x'];

@@ -347,4 +322,4 @@ };

getElement(type) {
const template = this.options.templates[type];
let html = '';
var template = this.options.templates[type];
var html = '';
html = templateEngine.render(template.call(this), {

@@ -382,3 +357,3 @@ classes: this.classes

const target = dom.closest(".".concat(this.classes.THUMB), event.target);
var target = dom.closest(".".concat(this.classes.THUMB), event.target);

@@ -389,3 +364,3 @@ if (!target) {

const index = Number(dom.getData('index', target));
var index = Number(dom.getData('index', target));
return this.go(index);

@@ -400,3 +375,3 @@ }, this.element);

getItemPos(index) {
let center = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var center = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
return (center ? this.distance / 2 : this.distance) - this.distance * (index + 1) - this.gutter * index;

@@ -406,13 +381,13 @@ }

setPos(index) {
let vertical = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
let animation = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
const mode = this.options.mode;
let pos = 0;
var vertical = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var animation = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
var mode = this.options.mode;
var pos = 0;
if (mode === 'full') {
if (this.innerDistance > this.wrapDistance) {
const dif = this.wrapDistance - this.innerDistance;
var dif = this.wrapDistance - this.innerDistance;
if (this.current === null) {
const itemPos = this.getItemPos(index);
var itemPos = this.getItemPos(index);
pos = dif < itemPos ? itemPos : dif;

@@ -424,10 +399,11 @@ } else if (this.current === this.length - 1 && index === 0) {

} else {
const oldPos = this.pos;
var oldPos = this.pos;
if (index > this.current) {
const newPos = oldPos - this.distance - this.gutter;
var newPos = oldPos - this.distance - this.gutter;
pos = dif < newPos ? newPos : dif;
} else if (index < this.current) {
const newPos = oldPos + this.distance + this.gutter;
pos = newPos > 0 ? 0 : newPos;
var _newPos = oldPos + this.distance + this.gutter;
pos = _newPos > 0 ? 0 : _newPos;
}

@@ -441,3 +417,3 @@ }

if (animation) {
const opts = {
var opts = {
targets: this.inner,

@@ -459,4 +435,4 @@ easing: 'linear',

resetPos() {
let vertical = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
const wrapDistance = this.wrapDistance;
var vertical = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
var wrapDistance = this.wrapDistance;
this.setDistance(this.options.vertical);

@@ -469,5 +445,5 @@

this.setItemDistance(this.options.vertical);
const oldPos = this.pos;
const dif = this.wrapDistance - this.innerDistance;
let pos = 0;
var oldPos = this.pos;
var dif = this.wrapDistance - this.innerDistance;
var pos = 0;

@@ -504,4 +480,4 @@ if (dif > 0) {

go(index) {
let change = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
let animation = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
var change = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
var animation = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;

@@ -508,0 +484,0 @@ if (this.is('disable')) {

4

dist/thumbnails.common.min.js
/*!
* @pluginjs/thumbnails v0.7.18 (https://pluginjs.com)
* @pluginjs/thumbnails v0.7.19 (https://pluginjs.com)
* Copyright 2019 Creation Studio Limited
* Released under the GPL-3.0 License.
*/
"use strict";function _interopDefault(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var anime=_interopDefault(require("animejs")),Component=_interopDefault(require("@pluginjs/component")),templateEngine=_interopDefault(require("@pluginjs/template")),styled=require("@pluginjs/styled"),classes$1=require("@pluginjs/classes"),events$1=require("@pluginjs/events"),dom=require("@pluginjs/dom"),utils=require("@pluginjs/utils"),decorator=require("@pluginjs/decorator"),Swipeable=_interopDefault(require("@pluginjs/swipeable")),ImageLoader=_interopDefault(require("@pluginjs/image-loader")),Loader=_interopDefault(require("@pluginjs/loader")),Breakpoints=_interopDefault(require("@pluginjs/breakpoints"));function _defineProperty(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}function _objectSpread(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{},i=Object.keys(s);"function"==typeof Object.getOwnPropertySymbols&&(i=i.concat(Object.getOwnPropertySymbols(s).filter(function(e){return Object.getOwnPropertyDescriptor(s,e).enumerable}))),i.forEach(function(t){_defineProperty(e,t,s[t])})}return e}function _slicedToArray(e,t){return _arrayWithHoles(e)||_iterableToArrayLimit(e,t)||_nonIterableRest()}function _arrayWithHoles(e){if(Array.isArray(e))return e}function _iterableToArrayLimit(e,t){var s=[],i=!0,n=!1,a=void 0;try{for(var r,l=e[Symbol.iterator]();!(i=(r=l.next()).done)&&(s.push(r.value),!t||s.length!==t);i=!0);}catch(e){n=!0,a=e}finally{try{i||null==l.return||l.return()}finally{if(n)throw a}}return s}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}const namespace="thumbnails",events={READY:"ready",ENABLE:"enable",DISABLE:"disable",DESTROY:"destroy",CHANGE:"change",PREV:"prev",NEXT:"next"},classes={NAMESPACE:"pj-thumb",THEME:"{namespace}s--{theme}",THUMBS:"{namespace}s",INNER:"{namespace}s-inner",THUMB:"{namespace}",LOADER:"{namespace}-loader",LOADED:"{namespace}-loaded",VIDEO:"{namespace}-video",IMAGE:"{namespace}-img",VERTICAL:"{namespace}s-vertical",ACTIVE:"{namespace}-active",DISABLED:"{namespace}-disabled",RESPONSIVE:"{namespace}-responsive"},methods=["enable","disable","destroy","next","prev","go"],defaults={templates:{inner:()=>'<div class="{classes.INNER}"></div>',thumb:()=>'<div class="{classes.THUMB}"><div class="{classes.LOADER}"></div><img class="{classes.IMAGE}"></div>'},data:"html",delegate:"img",vertical:!1,current:0,mode:"full",loader:{theme:"ring",color:"#000",size:"lg"},breakpoint:null},dependencies=["anime"];var _dec,_dec2,_dec3,_dec4,_dec5,_dec6,_class;let Thumbnails=(_dec=decorator.themeable())(_class=(_dec2=decorator.styleable(classes))(_class=(_dec3=decorator.eventable(events))(_class=(_dec4=decorator.stateable())(_class=(_dec5=decorator.optionable(defaults,!0))(_class=(_dec6=decorator.register(namespace,{methods:methods,dependencies:dependencies}))(_class=class extends Component{constructor(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};super(e),this.setupOptions(t),this.distance=0,this.pos=0,this.current=null,this.dif=null,this.setupClasses(),this.setupStates(),this.initialize()}initialize(){!this.options.data||this.options.data.length<0||(this.options.breakpoint&&this.initBreakpoints(),this.data="html"===this.options.data?this.parseHtml():this.options.data,this.generate(),this.items=this.inner.querySelectorAll(".".concat(this.classes.THUMB)),this.setDistance(this.options.vertical),this.setItemDistance(this.options.vertical),this.go(this.options.current||0,!1,!1),this.initImageLoader(),this.initSwipeable(),this.bind(),this.enter("initialized"),this.trigger(events.READY))}initBreakpoints(){if(Breakpoints.init(),Breakpoints.all().includes(this.options.breakpoint)){const e=this.options.breakpoint,t=this;Breakpoints.is("".concat(e,"-"))&&classes$1.addClass(this.classes.RESPONSIVE,this.element),Breakpoints.to(e,{enter(){classes$1.addClass(t.classes.RESPONSIVE,t.element)},leave(){classes$1.removeClass(t.classes.RESPONSIVE,t.element)}})}}parseHtml(){const e=[],t=this.element.querySelectorAll(this.options.delegate),s=new RegExp(/\((.+?)\)/);return t.length>0&&t.forEach(t=>{const i=dom.closest(".".concat(this.classes.THUMB),t);let n={src:t.getAttribute("src")||window.getComputedStyle(t)["background-image"].match(s)[1].replace(/'/g,"").replace(/"/g,"")};i&&(n.type=classes$1.hasClass(this.classes.VIDEO,i)?"video":"image");const a=Object.entries(t.dataset).reduce((e,t)=>{let s=_slicedToArray(t,2),i=s[0],n=s[1];try{return _objectSpread({},e,{[i]:JSON.parse('{"data": '.concat(n.replace(/'/g,'"'),"}")).data})}catch(t){return _objectSpread({},e,{[i]:n})}},{});n=utils.deepMerge(n,a),e.push(n)}),e}generate(){classes$1.addClass(this.classes.THUMBS,this.element),this.options.theme&&classes$1.addClass(this.getThemeClass(),this.element),this.options.vertical&&classes$1.addClass(this.classes.VERTICAL,this.element),this.inner=this.getElement("inner"),this.data.forEach((e,t)=>{const s=this.getElement("thumb");"video"===e.type&&classes$1.addClass(this.classes.VIDEO,s),dom.setData("index",t,s),s.querySelector(".".concat(this.classes.IMAGE)).setAttribute("src",e.src),dom.append(s,this.inner)}),this.element.innerHTML="",dom.append(this.inner,this.element)}initImageLoader(){this.items.forEach(e=>{let t="";this.options.loader&&(t=Loader.of(dom.query(".".concat(this.classes.LOADER),e),this.options.loader)).show(),ImageLoader.of(e.querySelector(".".concat(this.classes.IMAGE))).on("loaded",e=>{this.options.loader&&t.hide(),classes$1.addClass(this.classes.LOADED,dom.closest(".".concat(this.classes.THUMB),e))})})}initSwipeable(){const e=this,t=()=>{this.pos=this.swipeable.position[this.options.vertical?"y":"x"]};this.swipeable=Swipeable.of(this.inner,{rebound:!0,decay:!0,axis:this.options.vertical?"y":"x",reboundPos:"center"===this.options.mode?50:100,offset:"center"===this.options.mode?this.distance/2:0,onStart(){e.enter("dragged")},onDecayend(){t()},onReboundend(){t()},onEnd(){t()}})}getElement(e){const t=this.options.templates[e];let s="";return s=templateEngine.render(t.call(this),{classes:this.classes}),dom.parseHTML(s)}setDistance(e){this.wrapDistance=e?styled.outerHeight(this.element):styled.outerWidth(this.element),this.innerDistance=e?this.inner.scrollHeight:this.inner.scrollWidth}setItemDistance(e){this.length=this.items.length,this.distance=0,this.gutter=this.length>0?parseInt(window.getComputedStyle(this.items[1])[e?"margin-top":"margin-left"],10):0,this.length>0&&(this.distance=e?styled.outerHeight(this.items[0]):styled.outerWidth(this.items[0]))}bind(){events$1.bindEvent(this.eventName("click"),e=>{if(this.is("dragged"))return this.leave("dragged"),!1;if(this.is("disable")||this.swipeable.is("paning"))return!1;const t=dom.closest(".".concat(this.classes.THUMB),e.target);if(!t)return!1;const s=Number(dom.getData("index",t));return this.go(s)},this.element)}unbind(){events$1.removeEvent(this.eventName(),this.element)}getItemPos(e){return(arguments.length>1&&void 0!==arguments[1]&&arguments[1]?this.distance/2:this.distance)-this.distance*(e+1)-this.gutter*e}setPos(e){let t=arguments.length>1&&void 0!==arguments[1]&&arguments[1],s=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];const i=this.options.mode;let n=0;if("full"===i){if(this.innerDistance>this.wrapDistance){const t=this.wrapDistance-this.innerDistance;if(null===this.current){const s=this.getItemPos(e);n=t<s?s:t}else if(this.current===this.length-1&&0===e)n=0;else if(0===this.current&&e===this.length-1)n=t;else{const s=this.pos;if(e>this.current){const e=s-this.distance-this.gutter;n=t<e?e:t}else if(e<this.current){const e=s+this.distance+this.gutter;n=e>0?0:e}}}}else"center"===i&&(n=Math.min(this.wrapDistance,this.innerDistance)/2+this.getItemPos(e,!0));if(s){const e={targets:this.inner,easing:"linear",duration:300};e[t?"translateY":"translateX"]=n,anime(e)}else styled.setStyle({transform:"".concat(t?"translateY":"translateX","(").concat(n,"px)")},this.inner);this.pos=n}resetPos(){let e=arguments.length>0&&void 0!==arguments[0]&&arguments[0];const t=this.wrapDistance;if(this.setDistance(this.options.vertical),this.wrapDistance===t)return;this.setItemDistance(this.options.vertical);const s=this.pos,i=this.wrapDistance-this.innerDistance;let n=0;i>0||(null===this.dif&&(this.dif=i),"center"===this.options.mode?n=Math.min(this.wrapDistance,this.innerDistance)/2+this.getItemPos(this.current,!0):((n=this.current===this.length-1?s+(i-this.dif):s)>0&&(n=0),n<i&&(n=i)),this.dif=i,styled.setStyle({transform:"".concat(e?"translateY":"translateX","(").concat(n,"px)")},this.inner),this.pos=n)}go(e){let t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],s=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this.is("disable")||e<0||e>this.length||e===this.current||(this.setPos(e,this.options.vertical,s),classes$1.removeClass(this.classes.ACTIVE,this.items[this.current]),classes$1.addClass(this.classes.ACTIVE,this.items[e]),this.current=e,t&&this.trigger(events.CHANGE))}next(){this.is("disable")||(this.go(this.current+1),this.trigger(events.NEXT))}prev(){this.is("disable")||(this.go(this.current-1),this.trigger(events.PREV))}resize(){this.resetPos(this.options.vertical)}enable(){this.is("disable")&&(classes$1.removeClass(this.classes.DISABLED,this.element),this.element.disable=!1,this.leave("disable")),this.trigger(events.ENABLE)}disable(){this.is("disable")||(classes$1.addClass(this.classes.DISABLED,this.element),this.element.disable=!0,this.enter("disable")),this.trigger(events.DISABLE)}destroy(){this.is("initialized")&&(this.unbind(),!0===this.options.vertical&&classes$1.removeClass(this.classes.VERTICAL,this.element),this.options.theme&&classes$1.removeClass(this.getThemeClass(),this.element),this.is("disabled")&&(classes$1.removeClass(this.classes.DISABLED,this.element),this.element.disable=!1),this.leave("initialized")),this.trigger(events.DESTROY),super.destroy()}})||_class)||_class)||_class)||_class)||_class)||_class;module.exports=Thumbnails;
"use strict";function _interopDefault(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var anime=_interopDefault(require("animejs")),Component=_interopDefault(require("@pluginjs/component")),templateEngine=_interopDefault(require("@pluginjs/template")),styled=require("@pluginjs/styled"),classes$1=require("@pluginjs/classes"),events$1=require("@pluginjs/events"),dom=require("@pluginjs/dom"),utils=require("@pluginjs/utils"),decorator=require("@pluginjs/decorator"),Swipeable=_interopDefault(require("@pluginjs/swipeable")),ImageLoader=_interopDefault(require("@pluginjs/image-loader")),Loader=_interopDefault(require("@pluginjs/loader")),Breakpoints=_interopDefault(require("@pluginjs/breakpoints"));function _defineProperty(e,s,t){return s in e?Object.defineProperty(e,s,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[s]=t,e}function ownKeys(e,s){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);s&&(i=i.filter(function(s){return Object.getOwnPropertyDescriptor(e,s).enumerable})),t.push.apply(t,i)}return t}function _objectSpread2(e){for(var s=1;s<arguments.length;s++){var t=null!=arguments[s]?arguments[s]:{};s%2?ownKeys(t,!0).forEach(function(s){_defineProperty(e,s,t[s])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):ownKeys(t).forEach(function(s){Object.defineProperty(e,s,Object.getOwnPropertyDescriptor(t,s))})}return e}var _dec,_dec2,_dec3,_dec4,_dec5,_dec6,_class,namespace="thumbnails",events={READY:"ready",ENABLE:"enable",DISABLE:"disable",DESTROY:"destroy",CHANGE:"change",PREV:"prev",NEXT:"next"},classes={NAMESPACE:"pj-thumb",THEME:"{namespace}s--{theme}",THUMBS:"{namespace}s",INNER:"{namespace}s-inner",THUMB:"{namespace}",LOADER:"{namespace}-loader",LOADED:"{namespace}-loaded",VIDEO:"{namespace}-video",IMAGE:"{namespace}-img",VERTICAL:"{namespace}s-vertical",ACTIVE:"{namespace}-active",DISABLED:"{namespace}-disabled",RESPONSIVE:"{namespace}-responsive"},methods=["enable","disable","destroy","next","prev","go"],defaults={templates:{inner:()=>'<div class="{classes.INNER}"></div>',thumb:()=>'<div class="{classes.THUMB}"><div class="{classes.LOADER}"></div><img class="{classes.IMAGE}"></div>'},data:"html",delegate:"img",vertical:!1,current:0,mode:"full",loader:{theme:"ring",color:"#000",size:"lg"},breakpoint:null},dependencies=["anime"],Thumbnails=(_dec=decorator.themeable())(_class=(_dec2=decorator.styleable(classes))(_class=(_dec3=decorator.eventable(events))(_class=(_dec4=decorator.stateable())(_class=(_dec5=decorator.optionable(defaults,!0))(_class=(_dec6=decorator.register(namespace,{methods:methods,dependencies:dependencies}))(_class=class extends Component{constructor(e){var s=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};super(e),this.setupOptions(s),this.distance=0,this.pos=0,this.current=null,this.dif=null,this.setupClasses(),this.setupStates(),this.initialize()}initialize(){!this.options.data||this.options.data.length<0||(this.options.breakpoint&&this.initBreakpoints(),this.data="html"===this.options.data?this.parseHtml():this.options.data,this.generate(),this.items=this.inner.querySelectorAll(".".concat(this.classes.THUMB)),this.setDistance(this.options.vertical),this.setItemDistance(this.options.vertical),this.go(this.options.current||0,!1,!1),this.initImageLoader(),this.initSwipeable(),this.bind(),this.enter("initialized"),this.trigger(events.READY))}initBreakpoints(){if(Breakpoints.init(),Breakpoints.all().includes(this.options.breakpoint)){var e=this.options.breakpoint,s=this;Breakpoints.is("".concat(e,"-"))&&classes$1.addClass(this.classes.RESPONSIVE,this.element),Breakpoints.to(e,{enter(){classes$1.addClass(s.classes.RESPONSIVE,s.element)},leave(){classes$1.removeClass(s.classes.RESPONSIVE,s.element)}})}}parseHtml(){var e=[],s=this.element.querySelectorAll(this.options.delegate),t=new RegExp(/\((.+?)\)/);return s.length>0&&s.forEach(s=>{var i=dom.closest(".".concat(this.classes.THUMB),s),a={src:s.getAttribute("src")||window.getComputedStyle(s)["background-image"].match(t)[1].replace(/'/g,"").replace(/"/g,"")};i&&(a.type=classes$1.hasClass(this.classes.VIDEO,i)?"video":"image");var n=Object.entries(s.dataset).reduce((e,s)=>{var[t,i]=s;try{return _objectSpread2({},e,{[t]:JSON.parse('{"data": '.concat(i.replace(/'/g,'"'),"}")).data})}catch(s){return _objectSpread2({},e,{[t]:i})}},{});a=utils.deepMerge(a,n),e.push(a)}),e}generate(){classes$1.addClass(this.classes.THUMBS,this.element),this.options.theme&&classes$1.addClass(this.getThemeClass(),this.element),this.options.vertical&&classes$1.addClass(this.classes.VERTICAL,this.element),this.inner=this.getElement("inner"),this.data.forEach((e,s)=>{var t=this.getElement("thumb");"video"===e.type&&classes$1.addClass(this.classes.VIDEO,t),dom.setData("index",s,t),t.querySelector(".".concat(this.classes.IMAGE)).setAttribute("src",e.src),dom.append(t,this.inner)}),this.element.innerHTML="",dom.append(this.inner,this.element)}initImageLoader(){this.items.forEach(e=>{var s="";this.options.loader&&(s=Loader.of(dom.query(".".concat(this.classes.LOADER),e),this.options.loader)).show(),ImageLoader.of(e.querySelector(".".concat(this.classes.IMAGE))).on("loaded",e=>{this.options.loader&&s.hide(),classes$1.addClass(this.classes.LOADED,dom.closest(".".concat(this.classes.THUMB),e))})})}initSwipeable(){var e=this,s=()=>{this.pos=this.swipeable.position[this.options.vertical?"y":"x"]};this.swipeable=Swipeable.of(this.inner,{rebound:!0,decay:!0,axis:this.options.vertical?"y":"x",reboundPos:"center"===this.options.mode?50:100,offset:"center"===this.options.mode?this.distance/2:0,onStart(){e.enter("dragged")},onDecayend(){s()},onReboundend(){s()},onEnd(){s()}})}getElement(e){var s,t=this.options.templates[e];return s=templateEngine.render(t.call(this),{classes:this.classes}),dom.parseHTML(s)}setDistance(e){this.wrapDistance=e?styled.outerHeight(this.element):styled.outerWidth(this.element),this.innerDistance=e?this.inner.scrollHeight:this.inner.scrollWidth}setItemDistance(e){this.length=this.items.length,this.distance=0,this.gutter=this.length>0?parseInt(window.getComputedStyle(this.items[1])[e?"margin-top":"margin-left"],10):0,this.length>0&&(this.distance=e?styled.outerHeight(this.items[0]):styled.outerWidth(this.items[0]))}bind(){events$1.bindEvent(this.eventName("click"),e=>{if(this.is("dragged"))return this.leave("dragged"),!1;if(this.is("disable")||this.swipeable.is("paning"))return!1;var s=dom.closest(".".concat(this.classes.THUMB),e.target);if(!s)return!1;var t=Number(dom.getData("index",s));return this.go(t)},this.element)}unbind(){events$1.removeEvent(this.eventName(),this.element)}getItemPos(e){return(arguments.length>1&&void 0!==arguments[1]&&arguments[1]?this.distance/2:this.distance)-this.distance*(e+1)-this.gutter*e}setPos(e){var s=arguments.length>1&&void 0!==arguments[1]&&arguments[1],t=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],i=this.options.mode,a=0;if("full"===i){if(this.innerDistance>this.wrapDistance){var n=this.wrapDistance-this.innerDistance;if(null===this.current){var r=this.getItemPos(e);a=n<r?r:n}else if(this.current===this.length-1&&0===e)a=0;else if(0===this.current&&e===this.length-1)a=n;else{var l=this.pos;if(e>this.current){var o=l-this.distance-this.gutter;a=n<o?o:n}else if(e<this.current){var h=l+this.distance+this.gutter;a=h>0?0:h}}}}else"center"===i&&(a=Math.min(this.wrapDistance,this.innerDistance)/2+this.getItemPos(e,!0));if(t){var c={targets:this.inner,easing:"linear",duration:300};c[s?"translateY":"translateX"]=a,anime(c)}else styled.setStyle({transform:"".concat(s?"translateY":"translateX","(").concat(a,"px)")},this.inner);this.pos=a}resetPos(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],s=this.wrapDistance;if(this.setDistance(this.options.vertical),this.wrapDistance!==s){this.setItemDistance(this.options.vertical);var t=this.pos,i=this.wrapDistance-this.innerDistance,a=0;i>0||(null===this.dif&&(this.dif=i),"center"===this.options.mode?a=Math.min(this.wrapDistance,this.innerDistance)/2+this.getItemPos(this.current,!0):((a=this.current===this.length-1?t+(i-this.dif):t)>0&&(a=0),a<i&&(a=i)),this.dif=i,styled.setStyle({transform:"".concat(e?"translateY":"translateX","(").concat(a,"px)")},this.inner),this.pos=a)}}go(e){var s=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],t=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this.is("disable")||e<0||e>this.length||e===this.current||(this.setPos(e,this.options.vertical,t),classes$1.removeClass(this.classes.ACTIVE,this.items[this.current]),classes$1.addClass(this.classes.ACTIVE,this.items[e]),this.current=e,s&&this.trigger(events.CHANGE))}next(){this.is("disable")||(this.go(this.current+1),this.trigger(events.NEXT))}prev(){this.is("disable")||(this.go(this.current-1),this.trigger(events.PREV))}resize(){this.resetPos(this.options.vertical)}enable(){this.is("disable")&&(classes$1.removeClass(this.classes.DISABLED,this.element),this.element.disable=!1,this.leave("disable")),this.trigger(events.ENABLE)}disable(){this.is("disable")||(classes$1.addClass(this.classes.DISABLED,this.element),this.element.disable=!0,this.enter("disable")),this.trigger(events.DISABLE)}destroy(){this.is("initialized")&&(this.unbind(),!0===this.options.vertical&&classes$1.removeClass(this.classes.VERTICAL,this.element),this.options.theme&&classes$1.removeClass(this.getThemeClass(),this.element),this.is("disabled")&&(classes$1.removeClass(this.classes.DISABLED,this.element),this.element.disable=!1),this.leave("initialized")),this.trigger(events.DESTROY),super.destroy()}})||_class)||_class)||_class)||_class)||_class)||_class;module.exports=Thumbnails;

166

dist/thumbnails.esm.js
/*!
* @pluginjs/thumbnails v0.7.18 (https://pluginjs.com)
* @pluginjs/thumbnails v0.7.19 (https://pluginjs.com)
* Copyright 2019 Creation Studio Limited

@@ -35,61 +35,38 @@ * Released under the GPL-3.0 License.

function _objectSpread(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i] != null ? arguments[i] : {};
var ownKeys = Object.keys(source);
function ownKeys(object, enumerableOnly) {
var keys = Object.keys(object);
if (typeof Object.getOwnPropertySymbols === 'function') {
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
}));
}
ownKeys.forEach(function (key) {
_defineProperty(target, key, source[key]);
if (Object.getOwnPropertySymbols) {
var symbols = Object.getOwnPropertySymbols(object);
if (enumerableOnly) symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
keys.push.apply(keys, symbols);
}
return target;
return keys;
}
function _slicedToArray(arr, i) {
return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest();
}
function _objectSpread2(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i] != null ? arguments[i] : {};
function _arrayWithHoles(arr) {
if (Array.isArray(arr)) return arr;
}
function _iterableToArrayLimit(arr, i) {
var _arr = [];
var _n = true;
var _d = false;
var _e = undefined;
try {
for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
_arr.push(_s.value);
if (i && _arr.length === i) break;
if (i % 2) {
ownKeys(source, true).forEach(function (key) {
_defineProperty(target, key, source[key]);
});
} else if (Object.getOwnPropertyDescriptors) {
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
} else {
ownKeys(source).forEach(function (key) {
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
});
}
} catch (err) {
_d = true;
_e = err;
} finally {
try {
if (!_n && _i["return"] != null) _i["return"]();
} finally {
if (_d) throw _e;
}
}
return _arr;
return target;
}
function _nonIterableRest() {
throw new TypeError("Invalid attempt to destructure non-iterable instance");
}
const namespace = 'thumbnails';
const events = {
var namespace = 'thumbnails';
var events = {
READY: 'ready',

@@ -103,3 +80,3 @@ ENABLE: 'enable',

};
const classes = {
var classes = {
NAMESPACE: 'pj-thumb',

@@ -119,4 +96,4 @@ THEME: '{namespace}s--{theme}',

};
const methods = ['enable', 'disable', 'destroy', 'next', 'prev', 'go'];
const defaults = {
var methods = ['enable', 'disable', 'destroy', 'next', 'prev', 'go'];
var defaults = {
templates: {

@@ -148,6 +125,6 @@ inner() {

};
const dependencies = ['anime'];
var dependencies = ['anime'];
var _dec, _dec2, _dec3, _dec4, _dec5, _dec6, _class;
let Thumbnails = (_dec = themeable(), _dec2 = styleable(classes), _dec3 = eventable(events), _dec4 = stateable(), _dec5 = optionable(defaults, true), _dec6 = register(namespace, {
var Thumbnails = (_dec = themeable(), _dec2 = styleable(classes), _dec3 = eventable(events), _dec4 = stateable(), _dec5 = optionable(defaults, true), _dec6 = register(namespace, {
methods: methods,

@@ -157,3 +134,3 @@ dependencies: dependencies

constructor(element) {
let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
super(element);

@@ -196,4 +173,4 @@ this.setupOptions(options);

if (Breakpoints.all().includes(this.options.breakpoint)) {
const breakpoint = this.options.breakpoint;
const that = this;
var breakpoint = this.options.breakpoint;
var that = this;

@@ -218,10 +195,10 @@ if (Breakpoints.is("".concat(breakpoint, "-"))) {

parseHtml() {
const data = [];
const items = this.element.querySelectorAll(this.options.delegate);
const regex = new RegExp(/\((.+?)\)/);
var data = [];
var items = this.element.querySelectorAll(this.options.delegate);
var regex = new RegExp(/\((.+?)\)/);
if (items.length > 0) {
items.forEach(item => {
const thumb = closest(".".concat(this.classes.THUMB), item);
let info = {
var thumb = closest(".".concat(this.classes.THUMB), item);
var info = {
src: item.getAttribute('src') || window.getComputedStyle(item)['background-image'].match(regex)[1].replace(/'/g, '').replace(/"/g, '')

@@ -234,14 +211,12 @@ };

const _data = Object.entries(item.dataset).reduce((result, _ref) => {
let _ref2 = _slicedToArray(_ref, 2),
k = _ref2[0],
v = _ref2[1];
var _data = Object.entries(item.dataset).reduce((result, _ref) => {
var [k, v] = _ref;
try {
const content = JSON.parse("{\"data\": ".concat(v.replace(/'/g, '"'), "}")).data;
return _objectSpread({}, result, {
var content = JSON.parse("{\"data\": ".concat(v.replace(/'/g, '"'), "}")).data;
return _objectSpread2({}, result, {
[k]: content
});
} catch (err) {
return _objectSpread({}, result, {
return _objectSpread2({}, result, {
[k]: v

@@ -273,3 +248,3 @@ });

this.data.forEach((item, index) => {
const thumb = this.getElement('thumb');
var thumb = this.getElement('thumb');

@@ -290,3 +265,3 @@ if (item.type === 'video') {

this.items.forEach(item => {
let loader = '';
var loader = '';

@@ -309,5 +284,5 @@ if (this.options.loader) {

initSwipeable() {
const that = this;
var that = this;
const serPos = () => {
var serPos = () => {
this.pos = this.swipeable.position[this.options.vertical ? 'y' : 'x'];

@@ -343,4 +318,4 @@ };

getElement(type) {
const template = this.options.templates[type];
let html = '';
var template = this.options.templates[type];
var html = '';
html = templateEngine.render(template.call(this), {

@@ -378,3 +353,3 @@ classes: this.classes

const target = closest(".".concat(this.classes.THUMB), event.target);
var target = closest(".".concat(this.classes.THUMB), event.target);

@@ -385,3 +360,3 @@ if (!target) {

const index = Number(getData('index', target));
var index = Number(getData('index', target));
return this.go(index);

@@ -396,3 +371,3 @@ }, this.element);

getItemPos(index) {
let center = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var center = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
return (center ? this.distance / 2 : this.distance) - this.distance * (index + 1) - this.gutter * index;

@@ -402,13 +377,13 @@ }

setPos(index) {
let vertical = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
let animation = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
const mode = this.options.mode;
let pos = 0;
var vertical = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var animation = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
var mode = this.options.mode;
var pos = 0;
if (mode === 'full') {
if (this.innerDistance > this.wrapDistance) {
const dif = this.wrapDistance - this.innerDistance;
var dif = this.wrapDistance - this.innerDistance;
if (this.current === null) {
const itemPos = this.getItemPos(index);
var itemPos = this.getItemPos(index);
pos = dif < itemPos ? itemPos : dif;

@@ -420,10 +395,11 @@ } else if (this.current === this.length - 1 && index === 0) {

} else {
const oldPos = this.pos;
var oldPos = this.pos;
if (index > this.current) {
const newPos = oldPos - this.distance - this.gutter;
var newPos = oldPos - this.distance - this.gutter;
pos = dif < newPos ? newPos : dif;
} else if (index < this.current) {
const newPos = oldPos + this.distance + this.gutter;
pos = newPos > 0 ? 0 : newPos;
var _newPos = oldPos + this.distance + this.gutter;
pos = _newPos > 0 ? 0 : _newPos;
}

@@ -437,3 +413,3 @@ }

if (animation) {
const opts = {
var opts = {
targets: this.inner,

@@ -455,4 +431,4 @@ easing: 'linear',

resetPos() {
let vertical = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
const wrapDistance = this.wrapDistance;
var vertical = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
var wrapDistance = this.wrapDistance;
this.setDistance(this.options.vertical);

@@ -465,5 +441,5 @@

this.setItemDistance(this.options.vertical);
const oldPos = this.pos;
const dif = this.wrapDistance - this.innerDistance;
let pos = 0;
var oldPos = this.pos;
var dif = this.wrapDistance - this.innerDistance;
var pos = 0;

@@ -500,4 +476,4 @@ if (dif > 0) {

go(index) {
let change = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
let animation = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
var change = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
var animation = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;

@@ -504,0 +480,0 @@ if (this.is('disable')) {

4

dist/thumbnails.esm.min.js
/*!
* @pluginjs/thumbnails v0.7.18 (https://pluginjs.com)
* @pluginjs/thumbnails v0.7.19 (https://pluginjs.com)
* Copyright 2019 Creation Studio Limited
* Released under the GPL-3.0 License.
*/
import t from"animejs";import e from"@pluginjs/component";import s from"@pluginjs/template";import{outerHeight as i,outerWidth as n,setStyle as r}from"@pluginjs/styled";import{addClass as a,removeClass as h,hasClass as o}from"@pluginjs/classes";import{bindEvent as l,removeEvent as c}from"@pluginjs/events";import{closest as p,setData as m,append as d,query as u,parseHTML as g,getData as f}from"@pluginjs/dom";import{deepMerge as E}from"@pluginjs/utils";import{themeable as b,styleable as v,eventable as D,stateable as I,optionable as y,register as A}from"@pluginjs/decorator";import S from"@pluginjs/swipeable";import w from"@pluginjs/image-loader";import O from"@pluginjs/loader";import T from"@pluginjs/breakpoints";function j(t,e,s){return e in t?Object.defineProperty(t,e,{value:s,enumerable:!0,configurable:!0,writable:!0}):t[e]=s,t}function P(t){for(var e=1;e<arguments.length;e++){var s=null!=arguments[e]?arguments[e]:{},i=Object.keys(s);"function"==typeof Object.getOwnPropertySymbols&&(i=i.concat(Object.getOwnPropertySymbols(s).filter(function(t){return Object.getOwnPropertyDescriptor(s,t).enumerable}))),i.forEach(function(e){j(t,e,s[e])})}return t}function R(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var s=[],i=!0,n=!1,r=void 0;try{for(var a,h=t[Symbol.iterator]();!(i=(a=h.next()).done)&&(s.push(a.value),!e||s.length!==e);i=!0);}catch(t){n=!0,r=t}finally{try{i||null==h.return||h.return()}finally{if(n)throw r}}return s}(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}const L={READY:"ready",ENABLE:"enable",DISABLE:"disable",DESTROY:"destroy",CHANGE:"change",PREV:"prev",NEXT:"next"},N={templates:{inner:()=>'<div class="{classes.INNER}"></div>',thumb:()=>'<div class="{classes.THUMB}"><div class="{classes.LOADER}"></div><img class="{classes.IMAGE}"></div>'},data:"html",delegate:"img",vertical:!1,current:0,mode:"full",loader:{theme:"ring",color:"#000",size:"lg"},breakpoint:null};var B;export default b()(B=v({NAMESPACE:"pj-thumb",THEME:"{namespace}s--{theme}",THUMBS:"{namespace}s",INNER:"{namespace}s-inner",THUMB:"{namespace}",LOADER:"{namespace}-loader",LOADED:"{namespace}-loaded",VIDEO:"{namespace}-video",IMAGE:"{namespace}-img",VERTICAL:"{namespace}s-vertical",ACTIVE:"{namespace}-active",DISABLED:"{namespace}-disabled",RESPONSIVE:"{namespace}-responsive"})(B=D(L)(B=I()(B=y(N,!0)(B=A("thumbnails",{methods:["enable","disable","destroy","next","prev","go"],dependencies:["anime"]})(B=class extends e{constructor(t){let e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};super(t),this.setupOptions(e),this.distance=0,this.pos=0,this.current=null,this.dif=null,this.setupClasses(),this.setupStates(),this.initialize()}initialize(){!this.options.data||this.options.data.length<0||(this.options.breakpoint&&this.initBreakpoints(),this.data="html"===this.options.data?this.parseHtml():this.options.data,this.generate(),this.items=this.inner.querySelectorAll(".".concat(this.classes.THUMB)),this.setDistance(this.options.vertical),this.setItemDistance(this.options.vertical),this.go(this.options.current||0,!1,!1),this.initImageLoader(),this.initSwipeable(),this.bind(),this.enter("initialized"),this.trigger(L.READY))}initBreakpoints(){if(T.init(),T.all().includes(this.options.breakpoint)){const t=this.options.breakpoint,e=this;T.is("".concat(t,"-"))&&a(this.classes.RESPONSIVE,this.element),T.to(t,{enter(){a(e.classes.RESPONSIVE,e.element)},leave(){h(e.classes.RESPONSIVE,e.element)}})}}parseHtml(){const t=[],e=this.element.querySelectorAll(this.options.delegate),s=new RegExp(/\((.+?)\)/);return e.length>0&&e.forEach(e=>{const i=p(".".concat(this.classes.THUMB),e);let n={src:e.getAttribute("src")||window.getComputedStyle(e)["background-image"].match(s)[1].replace(/'/g,"").replace(/"/g,"")};i&&(n.type=o(this.classes.VIDEO,i)?"video":"image");const r=Object.entries(e.dataset).reduce((t,e)=>{let s=R(e,2),i=s[0],n=s[1];try{return P({},t,{[i]:JSON.parse('{"data": '.concat(n.replace(/'/g,'"'),"}")).data})}catch(e){return P({},t,{[i]:n})}},{});n=E(n,r),t.push(n)}),t}generate(){a(this.classes.THUMBS,this.element),this.options.theme&&a(this.getThemeClass(),this.element),this.options.vertical&&a(this.classes.VERTICAL,this.element),this.inner=this.getElement("inner"),this.data.forEach((t,e)=>{const s=this.getElement("thumb");"video"===t.type&&a(this.classes.VIDEO,s),m("index",e,s),s.querySelector(".".concat(this.classes.IMAGE)).setAttribute("src",t.src),d(s,this.inner)}),this.element.innerHTML="",d(this.inner,this.element)}initImageLoader(){this.items.forEach(t=>{let e="";this.options.loader&&(e=O.of(u(".".concat(this.classes.LOADER),t),this.options.loader)).show(),w.of(t.querySelector(".".concat(this.classes.IMAGE))).on("loaded",t=>{this.options.loader&&e.hide(),a(this.classes.LOADED,p(".".concat(this.classes.THUMB),t))})})}initSwipeable(){const t=this,e=()=>{this.pos=this.swipeable.position[this.options.vertical?"y":"x"]};this.swipeable=S.of(this.inner,{rebound:!0,decay:!0,axis:this.options.vertical?"y":"x",reboundPos:"center"===this.options.mode?50:100,offset:"center"===this.options.mode?this.distance/2:0,onStart(){t.enter("dragged")},onDecayend(){e()},onReboundend(){e()},onEnd(){e()}})}getElement(t){const e=this.options.templates[t];let i="";return i=s.render(e.call(this),{classes:this.classes}),g(i)}setDistance(t){this.wrapDistance=t?i(this.element):n(this.element),this.innerDistance=t?this.inner.scrollHeight:this.inner.scrollWidth}setItemDistance(t){this.length=this.items.length,this.distance=0,this.gutter=this.length>0?parseInt(window.getComputedStyle(this.items[1])[t?"margin-top":"margin-left"],10):0,this.length>0&&(this.distance=t?i(this.items[0]):n(this.items[0]))}bind(){l(this.eventName("click"),t=>{if(this.is("dragged"))return this.leave("dragged"),!1;if(this.is("disable")||this.swipeable.is("paning"))return!1;const e=p(".".concat(this.classes.THUMB),t.target);if(!e)return!1;const s=Number(f("index",e));return this.go(s)},this.element)}unbind(){c(this.eventName(),this.element)}getItemPos(t){return(arguments.length>1&&void 0!==arguments[1]&&arguments[1]?this.distance/2:this.distance)-this.distance*(t+1)-this.gutter*t}setPos(e){let s=arguments.length>1&&void 0!==arguments[1]&&arguments[1],i=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];const n=this.options.mode;let a=0;if("full"===n){if(this.innerDistance>this.wrapDistance){const t=this.wrapDistance-this.innerDistance;if(null===this.current){const s=this.getItemPos(e);a=t<s?s:t}else if(this.current===this.length-1&&0===e)a=0;else if(0===this.current&&e===this.length-1)a=t;else{const s=this.pos;if(e>this.current){const e=s-this.distance-this.gutter;a=t<e?e:t}else if(e<this.current){const t=s+this.distance+this.gutter;a=t>0?0:t}}}}else"center"===n&&(a=Math.min(this.wrapDistance,this.innerDistance)/2+this.getItemPos(e,!0));if(i){const e={targets:this.inner,easing:"linear",duration:300};e[s?"translateY":"translateX"]=a,t(e)}else r({transform:"".concat(s?"translateY":"translateX","(").concat(a,"px)")},this.inner);this.pos=a}resetPos(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];const e=this.wrapDistance;if(this.setDistance(this.options.vertical),this.wrapDistance===e)return;this.setItemDistance(this.options.vertical);const s=this.pos,i=this.wrapDistance-this.innerDistance;let n=0;i>0||(null===this.dif&&(this.dif=i),"center"===this.options.mode?n=Math.min(this.wrapDistance,this.innerDistance)/2+this.getItemPos(this.current,!0):((n=this.current===this.length-1?s+(i-this.dif):s)>0&&(n=0),n<i&&(n=i)),this.dif=i,r({transform:"".concat(t?"translateY":"translateX","(").concat(n,"px)")},this.inner),this.pos=n)}go(t){let e=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],s=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this.is("disable")||t<0||t>this.length||t===this.current||(this.setPos(t,this.options.vertical,s),h(this.classes.ACTIVE,this.items[this.current]),a(this.classes.ACTIVE,this.items[t]),this.current=t,e&&this.trigger(L.CHANGE))}next(){this.is("disable")||(this.go(this.current+1),this.trigger(L.NEXT))}prev(){this.is("disable")||(this.go(this.current-1),this.trigger(L.PREV))}resize(){this.resetPos(this.options.vertical)}enable(){this.is("disable")&&(h(this.classes.DISABLED,this.element),this.element.disable=!1,this.leave("disable")),this.trigger(L.ENABLE)}disable(){this.is("disable")||(a(this.classes.DISABLED,this.element),this.element.disable=!0,this.enter("disable")),this.trigger(L.DISABLE)}destroy(){this.is("initialized")&&(this.unbind(),!0===this.options.vertical&&h(this.classes.VERTICAL,this.element),this.options.theme&&h(this.getThemeClass(),this.element),this.is("disabled")&&(h(this.classes.DISABLED,this.element),this.element.disable=!1),this.leave("initialized")),this.trigger(L.DESTROY),super.destroy()}})||B)||B)||B)||B)||B)||B;
import t from"animejs";import e from"@pluginjs/component";import s from"@pluginjs/template";import{outerHeight as i,outerWidth as n,setStyle as r}from"@pluginjs/styled";import{addClass as a,removeClass as h,hasClass as o}from"@pluginjs/classes";import{bindEvent as l,removeEvent as c}from"@pluginjs/events";import{closest as p,setData as m,append as d,query as g,parseHTML as u,getData as v}from"@pluginjs/dom";import{deepMerge as b}from"@pluginjs/utils";import{themeable as E,styleable as f,eventable as D,stateable as I,optionable as A,register as O}from"@pluginjs/decorator";import S from"@pluginjs/swipeable";import y from"@pluginjs/image-loader";import w from"@pluginjs/loader";import j from"@pluginjs/breakpoints";function P(t,e,s){return e in t?Object.defineProperty(t,e,{value:s,enumerable:!0,configurable:!0,writable:!0}):t[e]=s,t}function T(t,e){var s=Object.keys(t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(t);e&&(i=i.filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})),s.push.apply(s,i)}return s}function R(t){for(var e=1;e<arguments.length;e++){var s=null!=arguments[e]?arguments[e]:{};e%2?T(s,!0).forEach(function(e){P(t,e,s[e])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(s)):T(s).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(s,e))})}return t}var L,N={READY:"ready",ENABLE:"enable",DISABLE:"disable",DESTROY:"destroy",CHANGE:"change",PREV:"prev",NEXT:"next"},B={templates:{inner:()=>'<div class="{classes.INNER}"></div>',thumb:()=>'<div class="{classes.THUMB}"><div class="{classes.LOADER}"></div><img class="{classes.IMAGE}"></div>'},data:"html",delegate:"img",vertical:!1,current:0,mode:"full",loader:{theme:"ring",color:"#000",size:"lg"},breakpoint:null};export default E()(L=f({NAMESPACE:"pj-thumb",THEME:"{namespace}s--{theme}",THUMBS:"{namespace}s",INNER:"{namespace}s-inner",THUMB:"{namespace}",LOADER:"{namespace}-loader",LOADED:"{namespace}-loaded",VIDEO:"{namespace}-video",IMAGE:"{namespace}-img",VERTICAL:"{namespace}s-vertical",ACTIVE:"{namespace}-active",DISABLED:"{namespace}-disabled",RESPONSIVE:"{namespace}-responsive"})(L=D(N)(L=I()(L=A(B,!0)(L=O("thumbnails",{methods:["enable","disable","destroy","next","prev","go"],dependencies:["anime"]})(L=class extends e{constructor(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};super(t),this.setupOptions(e),this.distance=0,this.pos=0,this.current=null,this.dif=null,this.setupClasses(),this.setupStates(),this.initialize()}initialize(){!this.options.data||this.options.data.length<0||(this.options.breakpoint&&this.initBreakpoints(),this.data="html"===this.options.data?this.parseHtml():this.options.data,this.generate(),this.items=this.inner.querySelectorAll(".".concat(this.classes.THUMB)),this.setDistance(this.options.vertical),this.setItemDistance(this.options.vertical),this.go(this.options.current||0,!1,!1),this.initImageLoader(),this.initSwipeable(),this.bind(),this.enter("initialized"),this.trigger(N.READY))}initBreakpoints(){if(j.init(),j.all().includes(this.options.breakpoint)){var t=this.options.breakpoint,e=this;j.is("".concat(t,"-"))&&a(this.classes.RESPONSIVE,this.element),j.to(t,{enter(){a(e.classes.RESPONSIVE,e.element)},leave(){h(e.classes.RESPONSIVE,e.element)}})}}parseHtml(){var t=[],e=this.element.querySelectorAll(this.options.delegate),s=new RegExp(/\((.+?)\)/);return e.length>0&&e.forEach(e=>{var i=p(".".concat(this.classes.THUMB),e),n={src:e.getAttribute("src")||window.getComputedStyle(e)["background-image"].match(s)[1].replace(/'/g,"").replace(/"/g,"")};i&&(n.type=o(this.classes.VIDEO,i)?"video":"image");var r=Object.entries(e.dataset).reduce((t,e)=>{var[s,i]=e;try{return R({},t,{[s]:JSON.parse('{"data": '.concat(i.replace(/'/g,'"'),"}")).data})}catch(e){return R({},t,{[s]:i})}},{});n=b(n,r),t.push(n)}),t}generate(){a(this.classes.THUMBS,this.element),this.options.theme&&a(this.getThemeClass(),this.element),this.options.vertical&&a(this.classes.VERTICAL,this.element),this.inner=this.getElement("inner"),this.data.forEach((t,e)=>{var s=this.getElement("thumb");"video"===t.type&&a(this.classes.VIDEO,s),m("index",e,s),s.querySelector(".".concat(this.classes.IMAGE)).setAttribute("src",t.src),d(s,this.inner)}),this.element.innerHTML="",d(this.inner,this.element)}initImageLoader(){this.items.forEach(t=>{var e="";this.options.loader&&(e=w.of(g(".".concat(this.classes.LOADER),t),this.options.loader)).show(),y.of(t.querySelector(".".concat(this.classes.IMAGE))).on("loaded",t=>{this.options.loader&&e.hide(),a(this.classes.LOADED,p(".".concat(this.classes.THUMB),t))})})}initSwipeable(){var t=this,e=()=>{this.pos=this.swipeable.position[this.options.vertical?"y":"x"]};this.swipeable=S.of(this.inner,{rebound:!0,decay:!0,axis:this.options.vertical?"y":"x",reboundPos:"center"===this.options.mode?50:100,offset:"center"===this.options.mode?this.distance/2:0,onStart(){t.enter("dragged")},onDecayend(){e()},onReboundend(){e()},onEnd(){e()}})}getElement(t){var e,i=this.options.templates[t];return e=s.render(i.call(this),{classes:this.classes}),u(e)}setDistance(t){this.wrapDistance=t?i(this.element):n(this.element),this.innerDistance=t?this.inner.scrollHeight:this.inner.scrollWidth}setItemDistance(t){this.length=this.items.length,this.distance=0,this.gutter=this.length>0?parseInt(window.getComputedStyle(this.items[1])[t?"margin-top":"margin-left"],10):0,this.length>0&&(this.distance=t?i(this.items[0]):n(this.items[0]))}bind(){l(this.eventName("click"),t=>{if(this.is("dragged"))return this.leave("dragged"),!1;if(this.is("disable")||this.swipeable.is("paning"))return!1;var e=p(".".concat(this.classes.THUMB),t.target);if(!e)return!1;var s=Number(v("index",e));return this.go(s)},this.element)}unbind(){c(this.eventName(),this.element)}getItemPos(t){return(arguments.length>1&&void 0!==arguments[1]&&arguments[1]?this.distance/2:this.distance)-this.distance*(t+1)-this.gutter*t}setPos(e){var s=arguments.length>1&&void 0!==arguments[1]&&arguments[1],i=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],n=this.options.mode,a=0;if("full"===n){if(this.innerDistance>this.wrapDistance){var h=this.wrapDistance-this.innerDistance;if(null===this.current){var o=this.getItemPos(e);a=h<o?o:h}else if(this.current===this.length-1&&0===e)a=0;else if(0===this.current&&e===this.length-1)a=h;else{var l=this.pos;if(e>this.current){var c=l-this.distance-this.gutter;a=h<c?c:h}else if(e<this.current){var p=l+this.distance+this.gutter;a=p>0?0:p}}}}else"center"===n&&(a=Math.min(this.wrapDistance,this.innerDistance)/2+this.getItemPos(e,!0));if(i){var m={targets:this.inner,easing:"linear",duration:300};m[s?"translateY":"translateX"]=a,t(m)}else r({transform:"".concat(s?"translateY":"translateX","(").concat(a,"px)")},this.inner);this.pos=a}resetPos(){var t=arguments.length>0&&void 0!==arguments[0]&&arguments[0],e=this.wrapDistance;if(this.setDistance(this.options.vertical),this.wrapDistance!==e){this.setItemDistance(this.options.vertical);var s=this.pos,i=this.wrapDistance-this.innerDistance,n=0;i>0||(null===this.dif&&(this.dif=i),"center"===this.options.mode?n=Math.min(this.wrapDistance,this.innerDistance)/2+this.getItemPos(this.current,!0):((n=this.current===this.length-1?s+(i-this.dif):s)>0&&(n=0),n<i&&(n=i)),this.dif=i,r({transform:"".concat(t?"translateY":"translateX","(").concat(n,"px)")},this.inner),this.pos=n)}}go(t){var e=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],s=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this.is("disable")||t<0||t>this.length||t===this.current||(this.setPos(t,this.options.vertical,s),h(this.classes.ACTIVE,this.items[this.current]),a(this.classes.ACTIVE,this.items[t]),this.current=t,e&&this.trigger(N.CHANGE))}next(){this.is("disable")||(this.go(this.current+1),this.trigger(N.NEXT))}prev(){this.is("disable")||(this.go(this.current-1),this.trigger(N.PREV))}resize(){this.resetPos(this.options.vertical)}enable(){this.is("disable")&&(h(this.classes.DISABLED,this.element),this.element.disable=!1,this.leave("disable")),this.trigger(N.ENABLE)}disable(){this.is("disable")||(a(this.classes.DISABLED,this.element),this.element.disable=!0,this.enter("disable")),this.trigger(N.DISABLE)}destroy(){this.is("initialized")&&(this.unbind(),!0===this.options.vertical&&h(this.classes.VERTICAL,this.element),this.options.theme&&h(this.getThemeClass(),this.element),this.is("disabled")&&(h(this.classes.DISABLED,this.element),this.element.disable=!1),this.leave("initialized")),this.trigger(N.DESTROY),super.destroy()}})||L)||L)||L)||L)||L)||L;

41

dist/thumbnails.js
/*!
* @pluginjs/thumbnails v0.7.18 (https://pluginjs.com)
* @pluginjs/thumbnails v0.7.19 (https://pluginjs.com)
* Copyright 2019 Creation Studio Limited

@@ -57,16 +57,31 @@ * Released under the GPL-3.0 License.

function _objectSpread(target) {
function ownKeys(object, enumerableOnly) {
var keys = Object.keys(object);
if (Object.getOwnPropertySymbols) {
var symbols = Object.getOwnPropertySymbols(object);
if (enumerableOnly) symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
keys.push.apply(keys, symbols);
}
return keys;
}
function _objectSpread2(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i] != null ? arguments[i] : {};
var ownKeys = Object.keys(source);
if (typeof Object.getOwnPropertySymbols === 'function') {
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
}));
if (i % 2) {
ownKeys(source, true).forEach(function (key) {
_defineProperty(target, key, source[key]);
});
} else if (Object.getOwnPropertyDescriptors) {
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
} else {
ownKeys(source).forEach(function (key) {
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
});
}
ownKeys.forEach(function (key) {
_defineProperty(target, key, source[key]);
});
}

@@ -352,5 +367,5 @@

var content = JSON.parse("{\"data\": ".concat(v.replace(/'/g, '"'), "}")).data;
return _objectSpread({}, result, _defineProperty({}, k, content));
return _objectSpread2({}, result, _defineProperty({}, k, content));
} catch (err) {
return _objectSpread({}, result, _defineProperty({}, k, v));
return _objectSpread2({}, result, _defineProperty({}, k, v));
}

@@ -357,0 +372,0 @@ }, {});

4

dist/thumbnails.min.js
/*!
* @pluginjs/thumbnails v0.7.18 (https://pluginjs.com)
* @pluginjs/thumbnails v0.7.19 (https://pluginjs.com)
* Copyright 2019 Creation Studio Limited
* Released under the GPL-3.0 License.
*/
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("animejs"),require("@pluginjs/component"),require("@pluginjs/template"),require("@pluginjs/styled"),require("@pluginjs/classes"),require("@pluginjs/events"),require("@pluginjs/dom"),require("@pluginjs/utils"),require("@pluginjs/decorator"),require("@pluginjs/swipeable"),require("@pluginjs/image-loader"),require("@pluginjs/loader"),require("@pluginjs/breakpoints")):"function"==typeof define&&define.amd?define(["animejs","@pluginjs/component","@pluginjs/template","@pluginjs/styled","@pluginjs/classes","@pluginjs/events","@pluginjs/dom","@pluginjs/utils","@pluginjs/decorator","@pluginjs/swipeable","@pluginjs/image-loader","@pluginjs/loader","@pluginjs/breakpoints"],t):(e=e||self)["@pluginjs/thumbnails"]=t(e.anime,e["@pluginjs/component"],e["@pluginjs/template"],e["@pluginjs/styled"],e["@pluginjs/classes"],e["@pluginjs/events"],e["@pluginjs/dom"],e["@pluginjs/utils"],e["@pluginjs/decorator"],e["@pluginjs/swipeable"],e["@pluginjs/image-loader"],e["@pluginjs/loader"],e["@pluginjs/breakpoints"])}(this,function(e,t,s,i,n,a,r,l,o,c,u,h,p){"use strict";function d(e,t){for(var s=0;s<t.length;s++){var i=t[s];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function f(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}function g(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{},i=Object.keys(s);"function"==typeof Object.getOwnPropertySymbols&&(i=i.concat(Object.getOwnPropertySymbols(s).filter(function(e){return Object.getOwnPropertyDescriptor(s,e).enumerable}))),i.forEach(function(t){f(e,t,s[t])})}return e}function m(e){return(m=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function v(e,t){return(v=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function y(e,t){return!t||"object"!=typeof t&&"function"!=typeof t?function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e):t}function b(e,t,s){return(b="undefined"!=typeof Reflect&&Reflect.get?Reflect.get:function(e,t,s){var i=function(e,t){for(;!Object.prototype.hasOwnProperty.call(e,t)&&null!==(e=m(e)););return e}(e,t);if(i){var n=Object.getOwnPropertyDescriptor(i,t);return n.get?n.get.call(s):n.value}})(e,t,s||e)}function E(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var s=[],i=!0,n=!1,a=void 0;try{for(var r,l=e[Symbol.iterator]();!(i=(r=l.next()).done)&&(s.push(r.value),!t||s.length!==t);i=!0);}catch(e){n=!0,a=e}finally{try{i||null==l.return||l.return()}finally{if(n)throw a}}return s}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}e=e&&e.hasOwnProperty("default")?e.default:e,t=t&&t.hasOwnProperty("default")?t.default:t,s=s&&s.hasOwnProperty("default")?s.default:s,c=c&&c.hasOwnProperty("default")?c.default:c,u=u&&u.hasOwnProperty("default")?u.default:u,h=h&&h.hasOwnProperty("default")?h.default:h,p=p&&p.hasOwnProperty("default")?p.default:p;var j,D={READY:"ready",ENABLE:"enable",DISABLE:"disable",DESTROY:"destroy",CHANGE:"change",PREV:"prev",NEXT:"next"};return o.themeable()(j=o.styleable({NAMESPACE:"pj-thumb",THEME:"{namespace}s--{theme}",THUMBS:"{namespace}s",INNER:"{namespace}s-inner",THUMB:"{namespace}",LOADER:"{namespace}-loader",LOADED:"{namespace}-loaded",VIDEO:"{namespace}-video",IMAGE:"{namespace}-img",VERTICAL:"{namespace}s-vertical",ACTIVE:"{namespace}-active",DISABLED:"{namespace}-disabled",RESPONSIVE:"{namespace}-responsive"})(j=o.eventable(D)(j=o.stateable()(j=o.optionable({templates:{inner:function(){return'<div class="{classes.INNER}"></div>'},thumb:function(){return'<div class="{classes.THUMB}"><div class="{classes.LOADER}"></div><img class="{classes.IMAGE}"></div>'}},data:"html",delegate:"img",vertical:!1,current:0,mode:"full",loader:{theme:"ring",color:"#000",size:"lg"},breakpoint:null},!0)(j=o.register("thumbnails",{methods:["enable","disable","destroy","next","prev","go"],dependencies:["anime"]})(j=function(o){function j(e){var t,s=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,j),(t=y(this,m(j).call(this,e))).setupOptions(s),t.distance=0,t.pos=0,t.current=null,t.dif=null,t.setupClasses(),t.setupStates(),t.initialize(),t}var w,O,I;return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&v(e,t)}(j,t),w=j,(O=[{key:"initialize",value:function(){!this.options.data||this.options.data.length<0||(this.options.breakpoint&&this.initBreakpoints(),this.data="html"===this.options.data?this.parseHtml():this.options.data,this.generate(),this.items=this.inner.querySelectorAll(".".concat(this.classes.THUMB)),this.setDistance(this.options.vertical),this.setItemDistance(this.options.vertical),this.go(this.options.current||0,!1,!1),this.initImageLoader(),this.initSwipeable(),this.bind(),this.enter("initialized"),this.trigger(D.READY))}},{key:"initBreakpoints",value:function(){if(p.init(),p.all().includes(this.options.breakpoint)){var e=this.options.breakpoint,t=this;p.is("".concat(e,"-"))&&n.addClass(this.classes.RESPONSIVE,this.element),p.to(e,{enter:function(){n.addClass(t.classes.RESPONSIVE,t.element)},leave:function(){n.removeClass(t.classes.RESPONSIVE,t.element)}})}}},{key:"parseHtml",value:function(){var e=this,t=[],s=this.element.querySelectorAll(this.options.delegate),i=new RegExp(/\((.+?)\)/);return s.length>0&&s.forEach(function(s){var a=r.closest(".".concat(e.classes.THUMB),s),o={src:s.getAttribute("src")||window.getComputedStyle(s)["background-image"].match(i)[1].replace(/'/g,"").replace(/"/g,"")};a&&(o.type=n.hasClass(e.classes.VIDEO,a)?"video":"image");var c=Object.entries(s.dataset).reduce(function(e,t){var s=E(t,2),i=s[0],n=s[1];try{return g({},e,f({},i,JSON.parse('{"data": '.concat(n.replace(/'/g,'"'),"}")).data))}catch(t){return g({},e,f({},i,n))}},{});o=l.deepMerge(o,c),t.push(o)}),t}},{key:"generate",value:function(){var e=this;n.addClass(this.classes.THUMBS,this.element),this.options.theme&&n.addClass(this.getThemeClass(),this.element),this.options.vertical&&n.addClass(this.classes.VERTICAL,this.element),this.inner=this.getElement("inner"),this.data.forEach(function(t,s){var i=e.getElement("thumb");"video"===t.type&&n.addClass(e.classes.VIDEO,i),r.setData("index",s,i),i.querySelector(".".concat(e.classes.IMAGE)).setAttribute("src",t.src),r.append(i,e.inner)}),this.element.innerHTML="",r.append(this.inner,this.element)}},{key:"initImageLoader",value:function(){var e=this;this.items.forEach(function(t){var s="";e.options.loader&&(s=h.of(r.query(".".concat(e.classes.LOADER),t),e.options.loader)).show(),u.of(t.querySelector(".".concat(e.classes.IMAGE))).on("loaded",function(t){e.options.loader&&s.hide(),n.addClass(e.classes.LOADED,r.closest(".".concat(e.classes.THUMB),t))})})}},{key:"initSwipeable",value:function(){var e=this,t=this,s=function(){e.pos=e.swipeable.position[e.options.vertical?"y":"x"]};this.swipeable=c.of(this.inner,{rebound:!0,decay:!0,axis:this.options.vertical?"y":"x",reboundPos:"center"===this.options.mode?50:100,offset:"center"===this.options.mode?this.distance/2:0,onStart:function(){t.enter("dragged")},onDecayend:function(){s()},onReboundend:function(){s()},onEnd:function(){s()}})}},{key:"getElement",value:function(e){var t,i=this.options.templates[e];return t=s.render(i.call(this),{classes:this.classes}),r.parseHTML(t)}},{key:"setDistance",value:function(e){this.wrapDistance=e?i.outerHeight(this.element):i.outerWidth(this.element),this.innerDistance=e?this.inner.scrollHeight:this.inner.scrollWidth}},{key:"setItemDistance",value:function(e){this.length=this.items.length,this.distance=0,this.gutter=this.length>0?parseInt(window.getComputedStyle(this.items[1])[e?"margin-top":"margin-left"],10):0,this.length>0&&(this.distance=e?i.outerHeight(this.items[0]):i.outerWidth(this.items[0]))}},{key:"bind",value:function(){var e=this;a.bindEvent(this.eventName("click"),function(t){if(e.is("dragged"))return e.leave("dragged"),!1;if(e.is("disable")||e.swipeable.is("paning"))return!1;var s=r.closest(".".concat(e.classes.THUMB),t.target);if(!s)return!1;var i=Number(r.getData("index",s));return e.go(i)},this.element)}},{key:"unbind",value:function(){a.removeEvent(this.eventName(),this.element)}},{key:"getItemPos",value:function(e){return(arguments.length>1&&void 0!==arguments[1]&&arguments[1]?this.distance/2:this.distance)-this.distance*(e+1)-this.gutter*e}},{key:"setPos",value:function(t){var s=arguments.length>1&&void 0!==arguments[1]&&arguments[1],n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],a=this.options.mode,r=0;if("full"===a){if(this.innerDistance>this.wrapDistance){var l=this.wrapDistance-this.innerDistance;if(null===this.current){var o=this.getItemPos(t);r=l<o?o:l}else if(this.current===this.length-1&&0===t)r=0;else if(0===this.current&&t===this.length-1)r=l;else{var c=this.pos;if(t>this.current){var u=c-this.distance-this.gutter;r=l<u?u:l}else if(t<this.current){var h=c+this.distance+this.gutter;r=h>0?0:h}}}}else"center"===a&&(r=Math.min(this.wrapDistance,this.innerDistance)/2+this.getItemPos(t,!0));if(n){var p={targets:this.inner,easing:"linear",duration:300};p[s?"translateY":"translateX"]=r,e(p)}else i.setStyle({transform:"".concat(s?"translateY":"translateX","(").concat(r,"px)")},this.inner);this.pos=r}},{key:"resetPos",value:function(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],t=this.wrapDistance;if(this.setDistance(this.options.vertical),this.wrapDistance!==t){this.setItemDistance(this.options.vertical);var s=this.pos,n=this.wrapDistance-this.innerDistance,a=0;n>0||(null===this.dif&&(this.dif=n),"center"===this.options.mode?a=Math.min(this.wrapDistance,this.innerDistance)/2+this.getItemPos(this.current,!0):((a=this.current===this.length-1?s+(n-this.dif):s)>0&&(a=0),a<n&&(a=n)),this.dif=n,i.setStyle({transform:"".concat(e?"translateY":"translateX","(").concat(a,"px)")},this.inner),this.pos=a)}}},{key:"go",value:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],s=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this.is("disable")||e<0||e>this.length||e===this.current||(this.setPos(e,this.options.vertical,s),n.removeClass(this.classes.ACTIVE,this.items[this.current]),n.addClass(this.classes.ACTIVE,this.items[e]),this.current=e,t&&this.trigger(D.CHANGE))}},{key:"next",value:function(){this.is("disable")||(this.go(this.current+1),this.trigger(D.NEXT))}},{key:"prev",value:function(){this.is("disable")||(this.go(this.current-1),this.trigger(D.PREV))}},{key:"resize",value:function(){this.resetPos(this.options.vertical)}},{key:"enable",value:function(){this.is("disable")&&(n.removeClass(this.classes.DISABLED,this.element),this.element.disable=!1,this.leave("disable")),this.trigger(D.ENABLE)}},{key:"disable",value:function(){this.is("disable")||(n.addClass(this.classes.DISABLED,this.element),this.element.disable=!0,this.enter("disable")),this.trigger(D.DISABLE)}},{key:"destroy",value:function(){this.is("initialized")&&(this.unbind(),!0===this.options.vertical&&n.removeClass(this.classes.VERTICAL,this.element),this.options.theme&&n.removeClass(this.getThemeClass(),this.element),this.is("disabled")&&(n.removeClass(this.classes.DISABLED,this.element),this.element.disable=!1),this.leave("initialized")),this.trigger(D.DESTROY),b(m(j.prototype),"destroy",this).call(this)}}])&&d(w.prototype,O),I&&d(w,I),j}())||j)||j)||j)||j)||j)||j});
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("animejs"),require("@pluginjs/component"),require("@pluginjs/template"),require("@pluginjs/styled"),require("@pluginjs/classes"),require("@pluginjs/events"),require("@pluginjs/dom"),require("@pluginjs/utils"),require("@pluginjs/decorator"),require("@pluginjs/swipeable"),require("@pluginjs/image-loader"),require("@pluginjs/loader"),require("@pluginjs/breakpoints")):"function"==typeof define&&define.amd?define(["animejs","@pluginjs/component","@pluginjs/template","@pluginjs/styled","@pluginjs/classes","@pluginjs/events","@pluginjs/dom","@pluginjs/utils","@pluginjs/decorator","@pluginjs/swipeable","@pluginjs/image-loader","@pluginjs/loader","@pluginjs/breakpoints"],t):(e=e||self)["@pluginjs/thumbnails"]=t(e.anime,e["@pluginjs/component"],e["@pluginjs/template"],e["@pluginjs/styled"],e["@pluginjs/classes"],e["@pluginjs/events"],e["@pluginjs/dom"],e["@pluginjs/utils"],e["@pluginjs/decorator"],e["@pluginjs/swipeable"],e["@pluginjs/image-loader"],e["@pluginjs/loader"],e["@pluginjs/breakpoints"])}(this,function(e,t,s,i,n,r,a,l,o,c,u,h,p){"use strict";function d(e,t){for(var s=0;s<t.length;s++){var i=t[s];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function f(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}function g(e,t){var s=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),s.push.apply(s,i)}return s}function m(e){for(var t=1;t<arguments.length;t++){var s=null!=arguments[t]?arguments[t]:{};t%2?g(s,!0).forEach(function(t){f(e,t,s[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(s)):g(s).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(s,t))})}return e}function v(e){return(v=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function y(e,t){return(y=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function b(e,t){return!t||"object"!=typeof t&&"function"!=typeof t?function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e):t}function E(e,t,s){return(E="undefined"!=typeof Reflect&&Reflect.get?Reflect.get:function(e,t,s){var i=function(e,t){for(;!Object.prototype.hasOwnProperty.call(e,t)&&null!==(e=v(e)););return e}(e,t);if(i){var n=Object.getOwnPropertyDescriptor(i,t);return n.get?n.get.call(s):n.value}})(e,t,s||e)}function j(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var s=[],i=!0,n=!1,r=void 0;try{for(var a,l=e[Symbol.iterator]();!(i=(a=l.next()).done)&&(s.push(a.value),!t||s.length!==t);i=!0);}catch(e){n=!0,r=e}finally{try{i||null==l.return||l.return()}finally{if(n)throw r}}return s}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}e=e&&e.hasOwnProperty("default")?e.default:e,t=t&&t.hasOwnProperty("default")?t.default:t,s=s&&s.hasOwnProperty("default")?s.default:s,c=c&&c.hasOwnProperty("default")?c.default:c,u=u&&u.hasOwnProperty("default")?u.default:u,h=h&&h.hasOwnProperty("default")?h.default:h,p=p&&p.hasOwnProperty("default")?p.default:p;var O,D={READY:"ready",ENABLE:"enable",DISABLE:"disable",DESTROY:"destroy",CHANGE:"change",PREV:"prev",NEXT:"next"};return o.themeable()(O=o.styleable({NAMESPACE:"pj-thumb",THEME:"{namespace}s--{theme}",THUMBS:"{namespace}s",INNER:"{namespace}s-inner",THUMB:"{namespace}",LOADER:"{namespace}-loader",LOADED:"{namespace}-loaded",VIDEO:"{namespace}-video",IMAGE:"{namespace}-img",VERTICAL:"{namespace}s-vertical",ACTIVE:"{namespace}-active",DISABLED:"{namespace}-disabled",RESPONSIVE:"{namespace}-responsive"})(O=o.eventable(D)(O=o.stateable()(O=o.optionable({templates:{inner:function(){return'<div class="{classes.INNER}"></div>'},thumb:function(){return'<div class="{classes.THUMB}"><div class="{classes.LOADER}"></div><img class="{classes.IMAGE}"></div>'}},data:"html",delegate:"img",vertical:!1,current:0,mode:"full",loader:{theme:"ring",color:"#000",size:"lg"},breakpoint:null},!0)(O=o.register("thumbnails",{methods:["enable","disable","destroy","next","prev","go"],dependencies:["anime"]})(O=function(o){function g(e){var t,s=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,g),(t=b(this,v(g).call(this,e))).setupOptions(s),t.distance=0,t.pos=0,t.current=null,t.dif=null,t.setupClasses(),t.setupStates(),t.initialize(),t}var O,w,P;return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&y(e,t)}(g,t),O=g,(w=[{key:"initialize",value:function(){!this.options.data||this.options.data.length<0||(this.options.breakpoint&&this.initBreakpoints(),this.data="html"===this.options.data?this.parseHtml():this.options.data,this.generate(),this.items=this.inner.querySelectorAll(".".concat(this.classes.THUMB)),this.setDistance(this.options.vertical),this.setItemDistance(this.options.vertical),this.go(this.options.current||0,!1,!1),this.initImageLoader(),this.initSwipeable(),this.bind(),this.enter("initialized"),this.trigger(D.READY))}},{key:"initBreakpoints",value:function(){if(p.init(),p.all().includes(this.options.breakpoint)){var e=this.options.breakpoint,t=this;p.is("".concat(e,"-"))&&n.addClass(this.classes.RESPONSIVE,this.element),p.to(e,{enter:function(){n.addClass(t.classes.RESPONSIVE,t.element)},leave:function(){n.removeClass(t.classes.RESPONSIVE,t.element)}})}}},{key:"parseHtml",value:function(){var e=this,t=[],s=this.element.querySelectorAll(this.options.delegate),i=new RegExp(/\((.+?)\)/);return s.length>0&&s.forEach(function(s){var r=a.closest(".".concat(e.classes.THUMB),s),o={src:s.getAttribute("src")||window.getComputedStyle(s)["background-image"].match(i)[1].replace(/'/g,"").replace(/"/g,"")};r&&(o.type=n.hasClass(e.classes.VIDEO,r)?"video":"image");var c=Object.entries(s.dataset).reduce(function(e,t){var s=j(t,2),i=s[0],n=s[1];try{return m({},e,f({},i,JSON.parse('{"data": '.concat(n.replace(/'/g,'"'),"}")).data))}catch(t){return m({},e,f({},i,n))}},{});o=l.deepMerge(o,c),t.push(o)}),t}},{key:"generate",value:function(){var e=this;n.addClass(this.classes.THUMBS,this.element),this.options.theme&&n.addClass(this.getThemeClass(),this.element),this.options.vertical&&n.addClass(this.classes.VERTICAL,this.element),this.inner=this.getElement("inner"),this.data.forEach(function(t,s){var i=e.getElement("thumb");"video"===t.type&&n.addClass(e.classes.VIDEO,i),a.setData("index",s,i),i.querySelector(".".concat(e.classes.IMAGE)).setAttribute("src",t.src),a.append(i,e.inner)}),this.element.innerHTML="",a.append(this.inner,this.element)}},{key:"initImageLoader",value:function(){var e=this;this.items.forEach(function(t){var s="";e.options.loader&&(s=h.of(a.query(".".concat(e.classes.LOADER),t),e.options.loader)).show(),u.of(t.querySelector(".".concat(e.classes.IMAGE))).on("loaded",function(t){e.options.loader&&s.hide(),n.addClass(e.classes.LOADED,a.closest(".".concat(e.classes.THUMB),t))})})}},{key:"initSwipeable",value:function(){var e=this,t=this,s=function(){e.pos=e.swipeable.position[e.options.vertical?"y":"x"]};this.swipeable=c.of(this.inner,{rebound:!0,decay:!0,axis:this.options.vertical?"y":"x",reboundPos:"center"===this.options.mode?50:100,offset:"center"===this.options.mode?this.distance/2:0,onStart:function(){t.enter("dragged")},onDecayend:function(){s()},onReboundend:function(){s()},onEnd:function(){s()}})}},{key:"getElement",value:function(e){var t,i=this.options.templates[e];return t=s.render(i.call(this),{classes:this.classes}),a.parseHTML(t)}},{key:"setDistance",value:function(e){this.wrapDistance=e?i.outerHeight(this.element):i.outerWidth(this.element),this.innerDistance=e?this.inner.scrollHeight:this.inner.scrollWidth}},{key:"setItemDistance",value:function(e){this.length=this.items.length,this.distance=0,this.gutter=this.length>0?parseInt(window.getComputedStyle(this.items[1])[e?"margin-top":"margin-left"],10):0,this.length>0&&(this.distance=e?i.outerHeight(this.items[0]):i.outerWidth(this.items[0]))}},{key:"bind",value:function(){var e=this;r.bindEvent(this.eventName("click"),function(t){if(e.is("dragged"))return e.leave("dragged"),!1;if(e.is("disable")||e.swipeable.is("paning"))return!1;var s=a.closest(".".concat(e.classes.THUMB),t.target);if(!s)return!1;var i=Number(a.getData("index",s));return e.go(i)},this.element)}},{key:"unbind",value:function(){r.removeEvent(this.eventName(),this.element)}},{key:"getItemPos",value:function(e){return(arguments.length>1&&void 0!==arguments[1]&&arguments[1]?this.distance/2:this.distance)-this.distance*(e+1)-this.gutter*e}},{key:"setPos",value:function(t){var s=arguments.length>1&&void 0!==arguments[1]&&arguments[1],n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],r=this.options.mode,a=0;if("full"===r){if(this.innerDistance>this.wrapDistance){var l=this.wrapDistance-this.innerDistance;if(null===this.current){var o=this.getItemPos(t);a=l<o?o:l}else if(this.current===this.length-1&&0===t)a=0;else if(0===this.current&&t===this.length-1)a=l;else{var c=this.pos;if(t>this.current){var u=c-this.distance-this.gutter;a=l<u?u:l}else if(t<this.current){var h=c+this.distance+this.gutter;a=h>0?0:h}}}}else"center"===r&&(a=Math.min(this.wrapDistance,this.innerDistance)/2+this.getItemPos(t,!0));if(n){var p={targets:this.inner,easing:"linear",duration:300};p[s?"translateY":"translateX"]=a,e(p)}else i.setStyle({transform:"".concat(s?"translateY":"translateX","(").concat(a,"px)")},this.inner);this.pos=a}},{key:"resetPos",value:function(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],t=this.wrapDistance;if(this.setDistance(this.options.vertical),this.wrapDistance!==t){this.setItemDistance(this.options.vertical);var s=this.pos,n=this.wrapDistance-this.innerDistance,r=0;n>0||(null===this.dif&&(this.dif=n),"center"===this.options.mode?r=Math.min(this.wrapDistance,this.innerDistance)/2+this.getItemPos(this.current,!0):((r=this.current===this.length-1?s+(n-this.dif):s)>0&&(r=0),r<n&&(r=n)),this.dif=n,i.setStyle({transform:"".concat(e?"translateY":"translateX","(").concat(r,"px)")},this.inner),this.pos=r)}}},{key:"go",value:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],s=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this.is("disable")||e<0||e>this.length||e===this.current||(this.setPos(e,this.options.vertical,s),n.removeClass(this.classes.ACTIVE,this.items[this.current]),n.addClass(this.classes.ACTIVE,this.items[e]),this.current=e,t&&this.trigger(D.CHANGE))}},{key:"next",value:function(){this.is("disable")||(this.go(this.current+1),this.trigger(D.NEXT))}},{key:"prev",value:function(){this.is("disable")||(this.go(this.current-1),this.trigger(D.PREV))}},{key:"resize",value:function(){this.resetPos(this.options.vertical)}},{key:"enable",value:function(){this.is("disable")&&(n.removeClass(this.classes.DISABLED,this.element),this.element.disable=!1,this.leave("disable")),this.trigger(D.ENABLE)}},{key:"disable",value:function(){this.is("disable")||(n.addClass(this.classes.DISABLED,this.element),this.element.disable=!0,this.enter("disable")),this.trigger(D.DISABLE)}},{key:"destroy",value:function(){this.is("initialized")&&(this.unbind(),!0===this.options.vertical&&n.removeClass(this.classes.VERTICAL,this.element),this.options.theme&&n.removeClass(this.getThemeClass(),this.element),this.is("disabled")&&(n.removeClass(this.classes.DISABLED,this.element),this.element.disable=!1),this.leave("initialized")),this.trigger(D.DESTROY),E(v(g.prototype),"destroy",this).call(this)}}])&&d(O.prototype,w),P&&d(O,P),g}())||O)||O)||O)||O)||O)||O});

40

package.json

@@ -14,3 +14,3 @@ {

},
"version": "0.7.18",
"version": "0.7.19",
"category": "ui",

@@ -41,23 +41,23 @@ "main": "dist/thumbnails.common.js",

"dependencies": {
"@pluginjs/breakpoints": "^0.7.13",
"@pluginjs/classes": "^0.7.13",
"@pluginjs/component": "^0.7.11",
"@pluginjs/decorator": "^0.7.15",
"@pluginjs/dom": "^0.7.14",
"@pluginjs/events": "^0.7.13",
"@pluginjs/factory": "^0.7.13",
"@pluginjs/image-loader": "^0.7.13",
"@pluginjs/is": "^0.7.12",
"@pluginjs/loader": "^0.7.15",
"@pluginjs/styled": "^0.7.14",
"@pluginjs/styles": "^0.7.7",
"@pluginjs/swipeable": "^0.7.17",
"@pluginjs/template": "^0.7.13",
"@pluginjs/utils": "^0.7.13",
"@pluginjs/breakpoints": "^0.7.14",
"@pluginjs/classes": "^0.7.14",
"@pluginjs/component": "^0.7.12",
"@pluginjs/decorator": "^0.7.16",
"@pluginjs/dom": "^0.7.15",
"@pluginjs/events": "^0.7.14",
"@pluginjs/factory": "^0.7.14",
"@pluginjs/image-loader": "^0.7.14",
"@pluginjs/is": "^0.7.13",
"@pluginjs/loader": "^0.7.16",
"@pluginjs/styled": "^0.7.15",
"@pluginjs/styles": "^0.7.8",
"@pluginjs/swipeable": "^0.7.18",
"@pluginjs/template": "^0.7.14",
"@pluginjs/utils": "^0.7.14",
"animejs": "*"
},
"devDependencies": {
"@babel/core": "^7.4.4",
"@pluginjs/browserslist-config": "^1.2.8",
"@pluginjs/cli": "^0.7.11",
"@babel/core": "^7.5.5",
"@pluginjs/browserslist-config": "^1.2.9",
"@pluginjs/cli": "^0.7.12",
"babel-jest": "*",

@@ -84,3 +84,3 @@ "jest": "*",

},
"gitHead": "dd7e1408426c72aa61b9bcd2968c389a8be92fec"
"gitHead": "e0247ab4b5e2026b77a390619f2b96bac30609c6"
}
dist/thumbnails.css

Sorry, the diff of this file is not supported yet

dist/thumbnails.min.css

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc