inviton-powerduck 0.0.126 → 0.0.128

package/components/dropdown/mobile/legacy_fdd.ts

@@ -37,7 +37,6 @@ export interface FilterableSelectDataSource {
 }
 
 export default function FilterableSelect(this: any, args: FilterableSelectArgs): void {
-	const self = this;
 	const iframeTopMode = !(args.iframeTopMode == false);
 	let contextWindow, contextBody;
 
@@ -69,24 +68,22 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 	let openClickTime = null;
 	let warmupHandle = null;
 	const cssClass = args.cssClass || null;
-	self.onItemSelected = args.onItemSelected;
-	self.onCancel = null;
-	self.animate = animate;
-	self.warmupMode = args.warmupMode;
-	self.selectedIds = selectedIds;
-	self.multiselect = args.multiselect == true;
-	(FilterableSelect as any).currentInstance = self;
-
-	function htmlEscape(str) {
-		return String(str)
-			.replace(/&/g, '&')
-			.replace(/"/g, '"')
-			.replace(/'/g, ''')
-			.replace(/</g, '&lt;')
-			.replace(/>/g, '&gt;');
-	}
-
-	self._isGhostClick = function () {
+	this.onItemSelected = args.onItemSelected;
+	this.onCancel = null;
+	this.animate = animate;
+	this.warmupMode = args.warmupMode;
+	this.selectedIds = selectedIds;
+	this.multiselect = args.multiselect == true;
+	(FilterableSelect as any).currentInstance = this;
+
+	const htmlEscape = str => String(str)
+		.replace(/&/g, '&amp;')
+		.replace(/"/g, '&quot;')
+		.replace(/'/g, '&#39;')
+		.replace(/</g, '&lt;')
+		.replace(/>/g, '&gt;');
+
+	this._isGhostClick = () => {
 		if (!useIscroll && !useFastClick) {
 			return false;
 		}
@@ -96,7 +93,7 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 		return !(timeDiff > 700);
 	};
 
-	self._getDropDownInnerStyle = function () {
+	this._getDropDownInnerStyle = () => {
 		if (useIscroll) {
 			return '';
 		} else {
@@ -104,12 +101,12 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 		}
 	};
 
-	self._getDropDownTemplate = function () {
+	this._getDropDownTemplate = () => {
 		let bottomCss = '';
 		let rootCss = args.multiselect ? 'fdd-multiselect-root' : 'fdd-singleselect-root';
 		let buttonHtml = `<button id="btn_fdd_FddCancel" type="button" class="fdd-cancel-btn ${cancelButtonCss}">${cancelText}</button>`;
 
-		if (self.multiselect) {
+		if (this.multiselect) {
 			bottomCss = 'fdd-bottom-hasmultiple';
 			buttonHtml += `<div class="fdd-btn-separator"></div><button id="btn_fdd_FddConfirm" type="button" class="fdd-confirm-btn ${confirmButtonCss}">${confirmText}</button>`;
 		}
@@ -118,31 +115,29 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 			rootCss += ` ${args.containerCssClass}`;
 		}
 
-		return `<div id="filterableSelectDropDown" style="" class="${self._getAnimClass()}${self._getWarmupModeClass()}${self._getAllowExclusivityCss()} ${rootCss}"><div id="filterableSelectDropDownInner" class="fdd-list-block fdd-winner fdd-main${args.useListviewBuilder != true ? ' fdd-nolvbuilder' : ''}" style="${self._getDropDownInnerStyle()}"><div id="filterableSelectDropWrap" class="fdd-swrap"><div id="filterableSelectDropContainer" class="fdd-sscroll"></div></div></div><div class="fdd-bottom ${bottomCss}">${buttonHtml}</div></div>`;
+		return `<div id="filterableSelectDropDown" style="" class="${this._getAnimClass()}${this._getWarmupModeClass()}${this._getAllowExclusivityCss()} ${rootCss}"><div id="filterableSelectDropDownInner" class="fdd-list-block fdd-winner fdd-main${args.useListviewBuilder != true ? ' fdd-nolvbuilder' : ''}" style="${this._getDropDownInnerStyle()}"><div id="filterableSelectDropWrap" class="fdd-swrap"><div id="filterableSelectDropContainer" class="fdd-sscroll"></div></div></div><div class="fdd-bottom ${bottomCss}">${buttonHtml}</div></div>`;
 	};
 
-	self._getAnimClass = function () {
+	this._getAnimClass = () => {
 		const animateClass = '';
-		if (self.animate) {
+		if (this.animate) {
 			return 'fdd-anim-init';
 		} else {
 			return '';
 		}
 	};
 
-	self._getWarmupModeClass = function () {
-		if (self.warmupMode == true) {
+	this._getWarmupModeClass = () => {
+		if (this.warmupMode == true) {
 			return ' fdd-warmup-mode';
 		} else {
 			return '';
 		}
 	};
 
-	self._getAllowExclusivityCss = function () {
-		return (args.allowExclusiveSearch == true ? ' fdd-has-exclusive-switch ' : '');
-	};
+	this._getAllowExclusivityCss = () => args.allowExclusiveSearch == true ? ' fdd-has-exclusive-switch ' : '';
 
-	self._getTargetElement = function (iScroll) {
+	this._getTargetElement = (iScroll) => {
 		if (iScroll) {
 			return $(contextBody).find('#filterableSelectDropContainer');
 		} else {
@@ -150,7 +145,7 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 		}
 	};
 
-	self._getClickEventName = function (iScroll) {
+	this._getClickEventName = (iScroll) => {
 		if (iScroll) {
 			return 'iscrollTap';
 		} else {
@@ -158,7 +153,7 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 		}
 	};
 
-	self.removeElems = function (preventGhostClick) {
+	this.removeElems = (preventGhostClick) => {
 		if (preventGhostClick == null) {
 			preventGhostClick = false;
 		}
@@ -200,21 +195,21 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 		}
 	};
 
-	self.cancel = function () {
-		if (self.onCancel != null) {
-			self.onCancel();
+	this.cancel = () => {
+		if (this.onCancel != null) {
+			this.onCancel();
 		}
 
-		self.close();
+		this.close();
 	};
 
-	self.close = function () {
-		self.removeElems();
+	this.close = () => {
+		this.removeElems();
 	};
 
-	self._getRowLineWithSelected = function (item) {
+	this._getRowLineWithSelected = (item) => {
 		let itemLine;
-		if (self.selectedIds == null || !self.selectedIds.includes(item.id)) {
+		if (this.selectedIds == null || !this.selectedIds.includes(item.id)) {
 			itemLine = '<li class="accordion-item filterabledd-item fdd-noselected" data-id="{id}"><a href="javascript:" class="fdd-item-link fdd-item-content"><div class="fdd-item-inner fdd-inner"><div class="fdd-item-title fdd-item">{text}</div></div></a></li>';
 		} else {
 			itemLine = '<li class="accordion-item filterabledd-item fdd-selected" data-id="{id}"><a href="javascript:" class="fdd-item-link fdd-item-content"><div class="fdd-item-inner fdd-inner"><div class="fdd-item-title fdd-item">{text}</div></div></a></li>';
@@ -236,7 +231,7 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 	};
 
 	if (args.formatResult != null) {
-		self._getRowValuePerf = function (item) {
+		this._getRowValuePerf = (item) => {
 			const formatedResult = args.formatResult(item, 'fdd');
 			if ((formatedResult as any).jquery) {
 				return (formatedResult[0] as any).outerHTML;
@@ -245,26 +240,24 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 			}
 		};
 	} else {
-		self._getRowValuePerf = function (item) {
-			return htmlEscape(item.text);
-		};
+		this._getRowValuePerf = item => htmlEscape(item.text);
 	}
 
-	self._getRowLineWithSelectedPerf = function (item): string {
+	this._getRowLineWithSelectedPerf = (item): string => {
 		if (hasOptionGroups) {
 			if ((item as any).isOptionGroup == true) {
-				return `<li class="filterabledd-item filterabledd-optgroup fdd-noselected" data-id="${item.id}"><a href="javascript:" class="fdd-item-link fdd-item-content"><div class="fdd-item-inner fdd-inner"><div class="fdd-item-title fdd-item">${self._getRowValuePerf(item)}</div></div></a></li>`;
+				return `<li class="filterabledd-item filterabledd-optgroup fdd-noselected" data-id="${item.id}"><a href="javascript:" class="fdd-item-link fdd-item-content"><div class="fdd-item-inner fdd-inner"><div class="fdd-item-title fdd-item">${this._getRowValuePerf(item)}</div></div></a></li>`;
 			}
 		}
 
-		if (self.selectedIds == null || !self.selectedIds.includes(item.id)) {
-			return `<li class="filterabledd-item filterabledd-item-perf fdd-noselected" data-id="${item.id}">${self._getRowValuePerf(item)}</li>`;
+		if (this.selectedIds == null || !this.selectedIds.includes(item.id)) {
+			return `<li class="filterabledd-item filterabledd-item-perf fdd-noselected" data-id="${item.id}">${this._getRowValuePerf(item)}</li>`;
 		} else {
-			return `<li class="filterabledd-item filterabledd-item-perf fdd-selected" data-id="${item.id}">${self._getRowValuePerf(item)}</li>`;
+			return `<li class="filterabledd-item filterabledd-item-perf fdd-selected" data-id="${item.id}">${this._getRowValuePerf(item)}</li>`;
 		}
 	};
 
-	self._handleItemClick = function (targetElem) {
+	this._handleItemClick = (targetElem) => {
 		const sender = $(targetElem);
 		const liSender = (sender.is('li') ? sender : sender.closest('li'));
 		const exlusivity = ($('.fdd-incl-excl-chb input').prop('checked') == true ? 1 : 0);
@@ -274,24 +267,28 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 			return;
 		}
 
-		if (self.elem != null) {
+		if (this.elem != null) {
 			const selVal = sender.text();
-			self.elem.val(selVal);
-			self.elem.find('.dropdownSelectedItem').html(selVal);
+			this.elem.val(selVal);
+			this.elem.find('.dropdownSelectedItem').html(selVal);
 		}
 
-		let cbi = self.getDataFromElement(liSender);
+		let cbi = this.getDataFromElement(liSender);
 		if (cbi == null) {
 			cbi = {
-				id: self.getIdFromElement(liSender),
+				id: this.getIdFromElement(liSender),
 				text: sender.text(),
 			};
 		}
 
-		if (!self.multiselect) {
-			self.hide();
-			if (self.onItemSelected != null) {
-				self.onItemSelected([cbi], exlusivity);
+		if (!this.multiselect) {
+			this.hide();
+			if (this.onItemSelected != null) {
+				if (cbi?.id == selectedIds?.[0]) {
+					this.onItemSelected([], exlusivity);
+				} else {
+					this.onItemSelected([cbi], exlusivity);
+				}
 			}
 		} else {
 			if (liSender.hasClass('fdd-selected')) {
@@ -302,48 +299,48 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 		}
 	};
 
-	self.hide = function () {
+	this.hide = () => {
 		$(document).trigger('fdd-hide', $('#filterableSelectDropDown'));
 
-		if (self.animate) {
+		if (this.animate) {
 			$(contextBody).find('#filterableSelectOverlay').removeClass('fdd-anim-shown');
 			$(contextBody).find('#filterableSelectDropDown').removeClass('fdd-anim-shown');
 			setTimeout(() => {
-				self.removeElems(true);
+				this.removeElems(true);
 			}, 350);
 		} else {
-			self.removeElems(true);
+			this.removeElems(true);
 		}
 	};
 
-	self.open = function () {
-		self.removeElems();
+	this.open = () => {
+		this.removeElems();
 		contextWindow.isFilterableDropDownOpen = true;
-		$(contextBody).append(self.overlayTemplate);
-		$(contextBody).append(self.dropDownTemplate);
+		$(contextBody).append(this.overlayTemplate);
+		$(contextBody).append(this.dropDownTemplate);
 		if (contextWindow.PreventKeyboardHack == null) {
 			contextWindow.PreventKeyboardHack = true;
 		}
 
 		if (args.useListviewBuilder) {
 			const builder = new ListviewBuilder();
-			builder.data = self.data;
+			builder.data = this.data;
 			builder.parentTemplate = '<ul>{content}</ul>';
 			builder.itemTemplate = '<li class="accordion-item filterabledd-item" data-id="{id}"><a href="javascript:" class="fdd-item-link fdd-item-content"><div class="fdd-item-inner fdd-inner"><div class="fdd-item-title fdd-item">{text}</div></div></a></li>';
-			builder.targetElem = self._getTargetElement(useIscroll);
+			builder.targetElem = this._getTargetElement(useIscroll);
 			builder.pagingCount = pagingCount;
 			builder.filter = true;
 			builder.filterField = 'filterValue';
 			builder.useFastClick = false;
 			builder.showPagination = (builder.data.length >= builder.pagingCount);
 			builder.clickEventName = clickEventName;
-			builder.itemClicked = function () {
-				if (!self._isGhostClick()) {
-					self._handleItemClick(this);
+			builder.itemClicked = () => {
+				if (!this._isGhostClick()) {
+					this._handleItemClick(this);
 				}
 			};
 
-			builder.onRowsBuilt = function (elem, dataArr) {
+			builder.onRowsBuilt = (elem, dataArr) => {
 				if (args.formatResult != null) {
 					dataArr.forEach((dataItem) => {
 						if (dataItem != null) {
@@ -361,21 +358,21 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 				}
 			};
 
-			builder._getRowLine = self._getRowLineWithSelected;
+			builder._getRowLine = this._getRowLineWithSelected;
 			builder.build();
 		} else {
 			let builder = '';
 			for (const item of data) {
-				builder += self._getRowLineWithSelectedPerf(item);
+				builder += this._getRowLineWithSelectedPerf(item);
 			}
 
 			const listContainer = document.createElement('ul');
 			listContainer.onclick = (e) => {
-				self._handleItemClick(e.target);
+				this._handleItemClick(e.target);
 			};
 			listContainer.innerHTML = builder;
 
-			const targetElem = self._getTargetElement(useIscroll)[0];
+			const targetElem = this._getTargetElement(useIscroll)[0];
 			targetElem.innerHTML = `<div class="lvb-filter-container filterableSelectFilter ${cssClass || ''}"><div class="lvb-filter-erase"><span class="far fa-trash-alt"></span></div><input type="text" class="lvb-filter-input" placeholder="Search..."></div>`;
 			targetElem.append(listContainer);
 
@@ -393,20 +390,20 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 
 				currentTimeOut = setTimeout(() => {
 					currentTimeOut = null;
-					self._pageIndex = 0;
+					this._pageIndex = 0;
 					const currVal = latinize((searchInput.val() || '').toString().toLowerCase());
-					if (currVal != self._filterVal) {
-						self._filterVal = currVal;
+					if (currVal != this._filterVal) {
+						this._filterVal = currVal;
 
 						let builder = '';
 						if (currVal == '') {
 							for (const item of data) {
-								builder += self._getRowLineWithSelectedPerf(item);
+								builder += this._getRowLineWithSelectedPerf(item);
 							}
 						} else {
 							for (const item of data) {
 								if ((item as any).filterValue.includes(currVal)) {
-									builder += self._getRowLineWithSelectedPerf(item);
+									builder += this._getRowLineWithSelectedPerf(item);
 								}
 							}
 						}
@@ -421,7 +418,7 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 			// '<li class="accordion-item filterabledd-item" data-id="{id}"><a href="javascript:" class="fdd-item-link fdd-item-content"><div class="fdd-item-inner fdd-inner"><div class="fdd-item-title fdd-item">{text}</div></div></a></li>'
 		}
 
-		const currentContext = self._getTargetElement(useIscroll);
+		const currentContext = this._getTargetElement(useIscroll);
 		const currentFilter = currentContext.find('.lvb-filter-container').first();
 		currentFilter.css({ 'position': 'fixed', 'margin-left': '3%', 'width': '94%', 'z-index': '999997', 'top': '12px', 'height': '48px', 'left': '0', 'margin-top': '0' });
 		currentFilter.appendTo($(contextBody).find('#filterableSelectDropDown'));
@@ -436,7 +433,7 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 			}
 		}
 
-		if (self.animate) {
+		if (this.animate) {
 			setTimeout(() => {
 				$(contextBody).find('#filterableSelectOverlay').addClass('fdd-anim-shown');
 				$(contextBody).find('#filterableSelectDropDown').addClass('fdd-anim-shown');
@@ -460,12 +457,12 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 		}
 
 		$(contextBody).find('#btn_fdd_FddCancel').click(() => {
-			self.hide();
+			this.hide();
 		});
 
-		if (self.multiselect) {
+		if (this.multiselect) {
 			$(contextBody).find('#btn_fdd_FddConfirm').click(() => {
-				self.onOkButtonClicked();
+				this.onOkButtonClicked();
 			});
 		}
 
@@ -477,40 +474,38 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 
 		if (args.warmupMode) {
 			warmupHandle = setTimeout(() => {
-				self.close();
+				this.close();
 			}, 2000);
 		}
 
 		$(document).trigger('fdd-show', $('#filterableSelectDropDown'));
 	};
 
-	self.onOkButtonClicked = function () {
+	this.onOkButtonClicked = () => {
 		const retArr = [];
 		const selArr = $(contextBody).find('.fdd-selected');
 		const exlusivity = ($('.fdd-incl-excl-chb input').prop('checked') == true ? 1 : 0);
 
-		selArr.each(function () {
-			const item = self.getDataFromElement($(this));
+		selArr.each(() => {
+			const item = this.getDataFromElement($(this));
 			if (item != null) {
 				retArr.push(item);
 			}
 		});
 
-		self.hide();
-		if (self.onItemSelected != null) {
-			self.onItemSelected(retArr, exlusivity);
+		this.hide();
+		if (this.onItemSelected != null) {
+			this.onItemSelected(retArr, exlusivity);
 		}
 	};
 
-	self.getIdFromElement = function (liElem) {
-		return liElem.attr('data-id');
-	};
+	this.getIdFromElement = liElem => liElem.attr('data-id');
 
-	self.getDataFromElement = function (liElem) {
-		const selId = self.getIdFromElement(liElem);
-		for (let i = 0, len = self.data.length; i < len; i++) {
-			if (self.data[i].id == selId) {
-				return self.data[i];
+	this.getDataFromElement = (liElem) => {
+		const selId = this.getIdFromElement(liElem);
+		for (let i = 0, len = this.data.length; i < len; i++) {
+			if (this.data[i].id == selId) {
+				return this.data[i];
 			}
 		}
 
@@ -522,10 +517,10 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 			(dataItem as any).filterValue = latinize(dataItem.text.toLowerCase());
 		});
 
-		self.data = data; // fadeInFddOverlay fdd-ovl-animated
-		self.overlayTemplate = `<div class="${self._getAnimClass()}${self._getWarmupModeClass()}" id="filterableSelectOverlay" style="position:fixed;top:0;height:120%; width:120%;z-index:999990;background-color:black;opacity:0.7;margin-left:-5px;"></div>`;
-		self.dropDownTemplate = self._getDropDownTemplate(useIscroll);
-		self.buttonTemplate = '<div class="ui-select"><div data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-icon="arrow-d" data-iconpos="right" data-theme="c" class="ui-btn ui-shadow ui-btn-corner-all ui-btn-icon-right ui-btn-up-c"><span class="ui-btn-inner"><span class="ui-btn-text"><span class="dropdownSelectedItem"></span></span><span class="ui-icon ui-icon-arrow-d ui-icon-shadow">&nbsp;</span></span></div></div>';
+		this.data = data; // fadeInFddOverlay fdd-ovl-animated
+		this.overlayTemplate = `<div class="${this._getAnimClass()}${this._getWarmupModeClass()}" id="filterableSelectOverlay" style="position:fixed;top:0;height:120%; width:120%;z-index:999990;background-color:black;opacity:0.7;margin-left:-5px;"></div>`;
+		this.dropDownTemplate = this._getDropDownTemplate(useIscroll);
+		this.buttonTemplate = '<div class="ui-select"><div data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-icon="arrow-d" data-iconpos="right" data-theme="c" class="ui-btn ui-shadow ui-btn-corner-all ui-btn-icon-right ui-btn-up-c"><span class="ui-btn-inner"><span class="ui-btn-text"><span class="dropdownSelectedItem"></span></span><span class="ui-icon ui-icon-arrow-d ui-icon-shadow">&nbsp;</span></span></div></div>';
 	}
 
 	if (elem != null && data != null) {
@@ -533,22 +528,22 @@ export default function FilterableSelect(this: any, args: FilterableSelectArgs):
 			elem = $(contextBody).find(`#${elem}`);
 		}
 
-		self.elem = elem;
-		self.elem.val('');
-		elem.html(self.buttonTemplate);
+		this.elem = elem;
+		this.elem.val('');
+		elem.html(this.buttonTemplate);
 
-		self.elem.find('.ui-select').fastClick(() => {
-			if (!self._isGhostClick()) {
-				self.open();
+		this.elem.find('.ui-select').fastClick(() => {
+			if (!this._isGhostClick()) {
+				this.open();
 			}
 		});
 
-		self.val = function (newValue) {
+		this.val = (newValue) => {
 			if (newValue == null || newValue.toString().length == 0) {
-				return self.elem.val();
+				return this.elem.val();
 			}
 		};
 	}
 
-	return self;
+	return this;
 }

package/components/input/css/daterange-picker.css

@@ -33,4 +33,5 @@
 	font-size: 16px;
 	font-weight: bold;
 	color: rgb(94, 98, 120);
+	z-index: 500;
 }

package/components/input/plugins/daterangepicker/jquery.daterangepicker.ts

@@ -3,6 +3,7 @@
 // license : MIT
 // www.jszen.com
 
+/* eslint-disable */
 import { DateWrapper } from '../../../../common/date-wrapper';
 import DateUtils from '../../../../common/utils/date-utils';
 import DaterangePickerConfig from './daterangepicker-config';

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "inviton-powerduck",
 	"type": "module",
-	"version": "0.0.126",
+	"version": "0.0.128",
 	"files": [
 		"app/",
 		"common/",