131 lines
3.0 KiB
JavaScript
131 lines
3.0 KiB
JavaScript
import $ from 'jquery';
|
|
|
|
// Extend VP class.
|
|
$(document).on('extendClass.vpf', (event, VP) => {
|
|
if (event.namespace !== 'vpf') {
|
|
return;
|
|
}
|
|
|
|
/**
|
|
* Init fjGallery plugin
|
|
*
|
|
* @param {mixed} options - gallery options.
|
|
* @param {mixed} additional - additional args.
|
|
*/
|
|
VP.prototype.initFjGallery = function (options = false, additional = null) {
|
|
const self = this;
|
|
|
|
if (self.$items_wrap.fjGallery && self.options.layout === 'justified') {
|
|
const initOptions =
|
|
options !== false
|
|
? options
|
|
: {
|
|
gutter: {
|
|
horizontal:
|
|
parseFloat(self.options.itemsGap) || 0,
|
|
vertical:
|
|
self.options.itemsGapVertical !== ''
|
|
? parseFloat(
|
|
self.options.itemsGapVertical
|
|
) || 0
|
|
: parseFloat(self.options.itemsGap) ||
|
|
0,
|
|
},
|
|
rowHeight:
|
|
parseFloat(self.options.justifiedRowHeight) ||
|
|
200,
|
|
maxRowsCount:
|
|
parseInt(
|
|
self.options.justifiedMaxRowsCount,
|
|
10
|
|
) || 0,
|
|
lastRow: self.options.justifiedLastRow || 'left',
|
|
rowHeightTolerance:
|
|
parseFloat(
|
|
self.options.justifiedRowHeightTolerance
|
|
) || 0,
|
|
calculateItemsHeight: true,
|
|
itemSelector: '.vp-portfolio__item-wrap',
|
|
imageSelector: '.vp-portfolio__item-img img',
|
|
transitionDuration: '0.3s',
|
|
};
|
|
|
|
if (initOptions.maxRowsCount === 0) {
|
|
initOptions.maxRowsCount = Number.POSITIVE_INFINITY;
|
|
}
|
|
|
|
self.emitEvent('beforeInitFjGallery', [initOptions, additional]);
|
|
|
|
self.$items_wrap.fjGallery(initOptions, additional);
|
|
|
|
self.emitEvent('initFjGallery', [initOptions, additional]);
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Destroy fjGallery plugin
|
|
*/
|
|
VP.prototype.destroyFjGallery = function () {
|
|
const self = this;
|
|
const fjGallery = self.$items_wrap.data('fjGallery');
|
|
|
|
if (fjGallery) {
|
|
self.$items_wrap.fjGallery('destroy');
|
|
|
|
self.emitEvent('destroyFjGallery');
|
|
}
|
|
};
|
|
});
|
|
|
|
// Add Items.
|
|
$(document).on('addItems.vpf', (event, self, $items, removeExisting) => {
|
|
if (event.namespace !== 'vpf') {
|
|
return;
|
|
}
|
|
|
|
const fjGallery = self.$items_wrap.data('fjGallery');
|
|
|
|
if (!fjGallery) {
|
|
return;
|
|
}
|
|
|
|
if (removeExisting) {
|
|
self.destroyFjGallery();
|
|
self.$items_wrap.find('.vp-portfolio__item-wrap').remove();
|
|
self.$items_wrap.prepend($items);
|
|
self.initFjGallery();
|
|
} else {
|
|
self.$items_wrap.append($items);
|
|
self.initFjGallery('appendImages', $items);
|
|
}
|
|
});
|
|
|
|
// Init.
|
|
$(document).on('init.vpf', (event, self) => {
|
|
if (event.namespace !== 'vpf') {
|
|
return;
|
|
}
|
|
|
|
self.initFjGallery();
|
|
});
|
|
|
|
// Images Loaded.
|
|
$(document).on('imagesLoaded.vpf', (event, self) => {
|
|
if (event.namespace !== 'vpf') {
|
|
return;
|
|
}
|
|
|
|
// sometimes on iOs images failed to calculate positions, so we need this imagesLoaded event.
|
|
// related issue: https://github.com/nk-crew/visual-portfolio/issues/55
|
|
self.initFjGallery();
|
|
});
|
|
|
|
// Destroy.
|
|
$(document).on('destroy.vpf', (event, self) => {
|
|
if (event.namespace !== 'vpf') {
|
|
return;
|
|
}
|
|
|
|
self.destroyFjGallery();
|
|
});
|