@iris.interactive/handcook 2.6.10 → 2.6.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iris.interactive/handcook",
-  "version": "2.6.10",
+  "version": "2.6.13",
   "description": "The web cooking by IRIS Interactive",
   "main": "./public/scripts/index.js",
   "scripts": {

package/public/scripts/components/lazyload/lazyload.component.js

@@ -16,13 +16,16 @@
 
 import LazyLoad from "vanilla-lazyload";
 
-const hc_lazyload = function() {
-	return new LazyLoad({
+const hc_lazyload = function (options = {}) {
+
+	options = Object.assign({
 		elements_selector: '[data-hc-src], [data-hc-bg], [data-hc-bg-hidpi]',
 		data_src: 'hc-src',
 		data_bg: 'hc-bg',
 		data_bg_hidpi: 'hc-bg-hidpi'
-	});
+	}, options)
+
+	return new LazyLoad(options);
 }
 
 export default hc_lazyload;

package/public/scripts/components/modal/modal.component.js

@@ -20,9 +20,12 @@ import './modal.component.scss';
 
 export class HcModal {
 
+	showEvent;
+	hideEvent;
 	options = {};
 
 	constructor(elements = ElementEnum.modal, overrideOptions = {}) {
+		this.createEvent();
 		document.querySelectorAll(elements).forEach(element => {
 			Fancybox.bind(element);
 			element.addEventListener('click', (e) => {
@@ -31,7 +34,16 @@ export class HcModal {
 				Object.assign(this.options, overrideOptions);
 				this.options.src = this.options.src != '' ? this.options.src : (e.currentTarget.hasAttribute('href') ? e.currentTarget.getAttribute('href') : (e.currentTarget.hasAttribute('data-hc-src') ? e.currentTarget.dataset.hcSrc : ''));
 				this.options.parentEl = this.options.parentEl !== null ? document.querySelector(this.options.parentEl) : (e.currentTarget.hasAttribute('data-hc-modal-parent') ? document.querySelector(e.currentTarget.getAttribute('data-hc-modal-parent')) : '');
-				Fancybox.show([this.options]);
+				Fancybox.show([this.options], {
+					on: {
+						reveal: () => {
+							document.dispatchEvent(this.showEvent);
+						},
+						closing: () => {
+							document.dispatchEvent(this.hideEvent);
+						}
+					}
+				});
 			});
 		});
 	}
@@ -48,9 +60,14 @@ export class HcModal {
 		this.options = {
 			src: '',
 			type: 'inline',
-			parentEl: null
+			parentEl: null,
 		};
 	}
+
+	createEvent() {
+		this.showEvent = new Event("show.hc.modal");
+		this.hideEvent = new Event("hide.hc.modal");
+	}
 }
 
 const hc_modal = function (trigger, options) {

package/public/scripts/components/slider/slider.component.js

@@ -157,6 +157,7 @@ export class HcSlider {
 
 					// layout
 					swiper.$el.find('.swiper-wrapper').addClass('hc-slider-wrapper');
+					swiper.$el.addClass('hc-slider-initialized');
 
 					// slide item
 					swiper.$el.find('.swiper-slide').addClass('hc-slider-slide');

package/public/scripts/components/tab/tab.component.js

@@ -61,10 +61,18 @@ export class HcTab {
 	}
 
 	createEvent() {
-		this.showEvent = new Event("show.hc.collapse");
-		this.shownEvent = new Event("shown.hc.collapse");
-		this.hideEvent = new Event("hide.hc.collapse");
-		this.hiddenEvent = new Event("hidden.hc.collapse");
+		this.showEvent = new Event("show.hc.tab");
+		this.shownEvent = new Event("shown.hc.tab");
+		this.hideEvent = new Event("hide.hc.tab");
+		this.hiddenEvent = new Event("hidden.hc.tab");
+	}
+
+	static show(trigger) {
+		var triggerTabList = [].slice.call(document.querySelectorAll(trigger));
+		triggerTabList.forEach(function (triggerEl) {
+			var tabTrigger = new Tab(triggerEl)
+			tabTrigger.show();
+		});
 	}
 }