@lidorsystems/integralui-web/bin/integralui/components/integralui.combobox.js

IntegralUI Web - Advanced UI Components for Angular

/*
  filename: integralui.combobox.js
  version : 20.2.0
  Copyright © 2016-2020 Lidor Systems. All rights reserved.

  This file is part of the "IntegralUI Web" Library. 
                                                                   
  The contents of this file are subject to the IntegralUI Web License, and may not be used except in compliance with the License.
  A copy of the License should have been installed in the product's root installation directory or it can be found at
  http://www.lidorsystems.com/products/web/studio/license-agreement.aspx.
                                                            
  This SOFTWARE is provided "AS IS", WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License for the specific language 
  governing rights and limitations under the License. Any infringement will be prosecuted under applicable laws.                           
*/
"use strict";var __extends=this&&this.__extends||function(){var e=function(t,i){return(e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var i in t)if(t.hasOwnProperty(i))e[i]=t[i]})(t,i)};return function(t,i){e(t,i);function n(){this.constructor=t}t.prototype=null===i?Object.create(i):(n.prototype=i.prototype,new n)}}();Object.defineProperty(exports,"__esModule",{value:!0});var core_1=require("@angular/core"),integralui_core_1=require("./integralui.core"),integralui_common_service_1=require("../services/integralui.common.service"),i0=require("@angular/core"),i1=require("../services/integralui.common.service"),i2=require("@angular/common"),i3=require("./integralui.core"),_c0=["control"],_c1=["header"],_c2=["dropdown"],_c3=function(e,t,i,n,o,s){return{"border-width":e,display:t,height:i,opacity:n,"overflow-y":o,width:s}},_c4=["*"],IntegralUIComboBox=function(e){__extends(t,e);function t(t,i){var n=e.call(this,t)||this;n.commonService=t;n.cmpResolver=i;n.eventList=[];n.expandState="none";n.initStatus=!0;n.isExpanded=!1;n.isSelected=!1;n.supressCallback=!1;n.contentBorder="0px";n.contentHeight="0";n.contentDisplay="block";n.contentOpacity=1;n.contentOverflowY="hidden";n.listSize={width:0,height:0};n.maxBlockHeight=0;n.itemSizeList=[];n.contentClassName="";n.headerClassName="";n.headerExpandBoxClassName="";n.itemGeneralClassName="";n.itemContentClassName="";n.contentClass=[];n.tRef=null;n.click=new core_1.EventEmitter;n.dropDownClosed=new core_1.EventEmitter;n.dropDownClosing=new core_1.EventEmitter;n.dropDownOpened=new core_1.EventEmitter;n.dropDownOpening=new core_1.EventEmitter;n.selectedItemChanged=new core_1.EventEmitter;n.selectedIndexChanged=new core_1.EventEmitter;n.itemList=[];n.integralHeight=!1;n.maxDropDownItems=5;n.listSize={width:0,height:0};n.itemSizeList=[];return n}Object.defineProperty(t.prototype,"dropDownWidth",{get:function(){return this.listSize.width},set:function(e){if(this.listSize.width!=e)if(!this.comboWidth||e>=this.comboWidth)this.listSize.width=e;else if(this.comboWidth)this.listSize.width=this.comboWidth},enumerable:!0,configurable:!0});Object.defineProperty(t.prototype,"expanded",{get:function(){return this.isExpanded},set:function(e){if(this.isExpanded!=e){var t=this;if(t.callBeforeEvent(e)){if(e)t.expandState="expand";else t.expandState="collapse";var i=setTimeout(function(){if("collapse"==t.expandState)t.expandState="none";clearTimeout(i)},300);t.isExpanded=e;if(e)t.header.state|=integralui_core_1.IntegralUIObjectState.selected;else t.header.state&=~integralui_core_1.IntegralUIObjectState.selected;t.header.animationState=t.isExpanded?"expand":"collapse";t.updateContentClass();t.toggleContent()}}},enumerable:!0,configurable:!0});Object.defineProperty(t.prototype,"selectedIndex",{get:function(){return this.currentIndex},set:function(e){this.updateSelection(e)},enumerable:!0,configurable:!0});Object.defineProperty(t.prototype,"selectedItem",{get:function(){return this.currentSelection},set:function(e){if(this.currentSelection!=e){var t=this.items?this.items.indexOf(e):-1;this.updateSelection(t)}},enumerable:!0,configurable:!0});t.prototype.ngOnInit=function(){this.generalClassName="iui-combobox";this.headerClassName=this.generalClassName+"-header";this.headerExpandBoxClassName=this.headerClassName+"-expand-box";this.contentClassName=this.generalClassName+"-dropdown";this.itemGeneralClassName=this.generalClassName+"-item";this.itemContentClassName=this.itemGeneralClassName+"-content";this.defaultStyle={general:{disabled:this.generalClassName+"-disabled",focused:this.generalClassName+"-focused",normal:this.generalClassName,hovered:this.generalClassName+"-hovered",selected:this.generalClassName+"-selected"},header:{general:{disabled:this.headerClassName+"-disabled",focused:this.headerClassName+"-focused",normal:this.headerClassName,hovered:this.headerClassName+"-hovered",selected:this.headerClassName+"-selected"},expandBox:this.headerExpandBoxClassName},content:{general:this.contentClassName,expanded:this.contentClassName+"-expand",collapsed:this.contentClassName+"-collapse"},item:{general:{disabled:this.itemGeneralClassName+"-disabled",focused:this.itemGeneralClassName+"-focused",normal:this.itemGeneralClassName,hovered:this.itemGeneralClassName+"-hovered",selected:this.itemGeneralClassName+"-selected"},content:{disabled:this.itemContentClassName+"-disabled",focused:this.itemContentClassName+"-focused",normal:this.itemContentClassName,hovered:this.itemContentClassName+"-hovered",selected:this.itemContentClassName+"-selected"}}};this.updateStyle(this.controlStyle);this.updateControlClass();this.updateContentClass()};t.prototype.ngAfterViewInit=function(){var e=this,t=setTimeout(function(){var i=e.cmpResolver.resolveComponentFactory(integralui_core_1.IntegralUITComponent);if(i&&e.headerRef)e.tRef=e.headerRef.createComponent(i);clearTimeout(t)},100);if(e.headerElem){e.comboWidth=e.headerElem.nativeElement.firstElementChild.clientWidth;if(e.dropDownWidth<e.comboWidth)e.dropDownWidth=e.comboWidth}};t.prototype.ngAfterContentInit=function(){var e=this;e.attachItemEvents();e.contentList.changes.subscribe(function(){e.attachItemEvents()});e.updateSelectedIndex(e.selectedIndex);var t=setTimeout(function(){e.calcBlockHeight();e.contentDisplay="none";e.contentHeight="0";e.expandState="none";clearTimeout(t)},100)};t.prototype.ngOnDestroy=function(){if(this.tRef)this.tRef.destroy()};t.prototype.attachItemEvents=function(){var e=this;this.itemList=this.contentList.toArray();if(e.eventList){e.eventList.forEach(function(e){e.forEach(function(e){e.unsubscribe()})});e.eventList.length=0}if(this.itemList&&this.itemList.length>0)this.itemList.forEach(function(t){var i=[];i.push(t.mouseDown.subscribe(function(i){var n=e.itemList.indexOf(t);e.updateSelection(n);setTimeout(function(){e.closeDropDown()},1)}));e.eventList.push(i)})};t.prototype.comboClick=function(e){if(this.isEnabled&&1==e.buttons){this.initStatus=!1;if(this.expanded)this.closeDropDown();else this.openDropDown()}};t.prototype.dropDownBlurEvent=function(e){if(this.isEnabled){e.preventDefault();var t=this,i=setTimeout(function(){t.closeDropDown();clearTimeout(i)},1)}e.stopPropagation()};t.prototype.callBeforeEvent=function(e){var t={cancel:!1};if(e)this.dropDownOpening.emit(t);else this.dropDownClosing.emit(t);return!t.cancel};t.prototype.callAfterEvent=function(e){if(e)this.dropDownOpened.emit(null);else this.dropDownClosed.emit(null)};t.prototype.closeDropDown=function(){this.expanded=!1;if(this.dropDownElem)this.dropDownElem.nativeElement.blur()};t.prototype.openDropDown=function(){var e=this;e.expanded=!0;var t=setTimeout(function(){if(e.dropDownElem)e.dropDownElem.nativeElement.focus();clearTimeout(t)},5)};t.prototype.getComboIcon=function(){return this.selectedItem?this.selectedItem.icon:""};t.prototype.getComboIconUrl=function(){return this.selectedItem?this.selectedItem.iconUrl:""};t.prototype.getComboText=function(){return this.selectedItem?this.selectedItem.text:"_"};t.prototype.isIndexInRange=function(e){return this.items?e>=0&&e<this.items.length:!1};t.prototype.getDropDownWidth=function(){if(this.dropDownWidth>0)return this.dropDownWidth;else if(this.comboWidth)return this.comboWidth;return 0};t.prototype.calcBlockHeight=function(){var e=this;e.itemSizeList.length=0;e.itemList=e.contentList.toArray();if(e.itemList&&e.itemList.length>0){e.itemList.forEach(function(t){var i=t.getSize(),n=t.getMargin();e.itemSizeList.push({size:i,margin:n});0})}};t.prototype.getDropDownHeight=function(){var e=this;if(e.dropDownHeight>0)return e.dropDownHeight;var t=0,i=0;e.itemList=e.contentList.toArray();if(e.itemList&&e.itemList.length>0){var n=0,o=-1,s=!1;e.itemList.forEach(function(r,l){if(l<e.itemSizeList.length){if(n<e.maxDropDownItems){t+=e.itemSizeList[l].size.height;if(!s&&e.itemSizeList[l].size.height!=o&&o>0)s=!0;o=e.itemSizeList[l].size.height;i=e.itemSizeList[l].margin.bottom}n++}});if(n>0)t+=i;if(!e.integralHeight){var r=s?e.maxDropDownItems+1:e.maxDropDownItems,l=n<e.maxDropDownItems?n:e.maxDropDownItems,a=Math.floor(t/l);t=a*r}}return t};t.prototype.toggleContent=function(){var e=this,t=0,i=0;e.maxBlockHeight=e.getDropDownHeight();e.contentOverflowY="hidden";if(e.expanded){e.contentDisplay="block";e.contentBorder="1px";if(e.allowAnimation)var n=setInterval(function(){if(t+i<e.maxBlockHeight){t+=i=0==i?1:i+2;e.contentHeight=t+"px"}else{e.contentHeight=e.maxBlockHeight+"px";e.contentOverflowY="auto";e.expandState="none";e.callAfterEvent(!0);clearInterval(n)}},15);else{e.contentHeight=e.maxBlockHeight+"px";e.contentOverflowY="auto";e.expandState="none";e.callAfterEvent(!0)}}else{t=e.maxBlockHeight;if(e.allowAnimation)var o=setInterval(function(){if(t>0){t-=i=0==i?1:i+2;e.contentHeight=t+"px"}else{e.contentBorder="0px";e.contentDisplay="none";e.contentHeight="0";e.expandState="none";e.callAfterEvent();clearInterval(o)}},15);else{e.contentBorder="0px";e.contentDisplay="none";e.contentHeight="0";e.expandState="none";e.callAfterEvent()}}};t.prototype.processMouseWheel=function(e,t){if(this.isEnabled)e.stopPropagation()};t.prototype.clearSelection=function(e){this.itemList=this.contentList.toArray();this.itemList.forEach(function(t,i){if(t!=e)t.state&=~integralui_core_1.IntegralUIObjectState.selected})};t.prototype.updateSelectedIndex=function(e){if(this.isIndexInRange(e)){this.currentSelection=this.items[e];this.selectedItemChanged.emit({item:this.currentSelection});if(this.contentList){this.itemList=this.contentList.toArray();if(this.itemList&&e<this.itemList.length)this.itemList[e].state|=integralui_core_1.IntegralUIObjectState.selected}}};t.prototype.updateSelection=function(e){if(this.isIndexInRange(e)){this.currentIndex=e;var t=this,i=setTimeout(function(){t.clearSelection();t.updateSelectedIndex(e);t.selectedIndexChanged.emit({index:e});clearTimeout(i)},1)}};t.prototype.getControlStyle=function(){var e={};if(this.ctrlSize.width>0)e.width=this.ctrlSize.width+"px";if(this.ctrlSize.height>0)e.height=this.ctrlSize.height+"px";return e};t.prototype.updateContentClass=function(){this.contentClass.length=0;this.contentClass.push(this.options.currentStyle.content.general);if(0!=this.expanded){if("expand"==this.expandState)this.contentClass.push(this.options.currentStyle.content.expanded)}else if("collapse"==this.expandState)this.contentClass.push(this.options.currentStyle.content.collapsed)};t.prototype.getContentClass=function(){return this.contentClass};t.prototype.getContentStyle=function(e){if(this.commonService.isString(e))return e;else if(e)return{general:this.commonService.isFieldAvailable(e.general,this.contentClassName),expanded:this.commonService.isFieldAvailable(e.expanded,this.contentClassName+"-expand"),collapsed:this.commonService.isFieldAvailable(e.collapsed,this.contentClassName+"-collapse")};else return{general:this.defaultStyle.content.general,expanded:this.defaultStyle.content.expanded,collapsed:this.defaultStyle.content.collapsed}};t.prototype.getHeaderClass=function(){var e=this.headerClassName;if(this.state&integralui_core_1.IntegralUIObjectState.disabled)e+=" "+this.options.currentStyle.header.disabled;else if(this.state&integralui_core_1.IntegralUIObjectState.focused)e+=" "+this.options.currentStyle.header.focused;else if(this.state&integralui_core_1.IntegralUIObjectState.selected)e+=" "+this.options.currentStyle.header.selected;else if(this.state&integralui_core_1.IntegralUIObjectState.hovered)e+=" "+this.options.currentStyle.header.hovered;else e+=" "+this.options.currentStyle.header.normal;return e};t.prototype.getHeaderGeneralStyle=function(e){if(this.commonService.isString(e))return e;else if(e)return{disabled:this.commonService.isFieldAvailable(e.hovered,this.headerClassName+"-disabled"),focused:this.commonService.isFieldAvailable(e.hovered,this.headerClassName+"-focused"),hovered:this.commonService.isFieldAvailable(e.hovered,this.headerClassName+"-hovered"),normal:this.commonService.isFieldAvailable(e.normal,this.headerClassName),selected:this.commonService.isFieldAvailable(e.selected,this.headerClassName+"-selected")};else return{disabled:this.defaultStyle.header.general.disabled,focused:this.defaultStyle.header.general.focused,hovered:this.defaultStyle.header.general.hovered,normal:this.defaultStyle.header.general.normal,selected:this.defaultStyle.header.general.selected}};t.prototype.getHeaderStyle=function(e){if(e)return{general:this.getHeaderGeneralStyle(e.general),expandBox:this.commonService.isFieldAvailable(e.expandBox,this.headerExpandBoxClassName)};else return{general:this.getHeaderGeneralStyle(),expandBox:this.defaultStyle.header.expandBox}};t.prototype.getCurrentHeaderStyle=function(){return this.options.currentStyle.header};t.prototype.getItemStyle=function(e){if(e)return{general:this.getItemGeneralStyle(e.general),content:this.getItemContentStyle(e.content)};else return{general:this.getItemGeneralStyle(),content:this.getItemContentStyle()}};t.prototype.getItemGeneralStyle=function(e){if(this.commonService.isString(e))return e;else if(e)return{disabled:this.commonService.isFieldAvailable(e.disabled,this.itemGeneralClassName+"-disabled"),focused:this.commonService.isFieldAvailable(e.focused,this.itemGeneralClassName+"-focused"),hovered:this.commonService.isFieldAvailable(e.hovered,this.itemGeneralClassName+"-hovered"),normal:this.commonService.isFieldAvailable(e.normal,this.itemGeneralClassName),selected:this.commonService.isFieldAvailable(e.selected,this.itemGeneralClassName+"-selected")};else return{disabled:this.defaultStyle.item.general.disabled,focused:this.defaultStyle.item.general.focused,hovered:this.defaultStyle.item.general.hovered,normal:this.defaultStyle.item.general.normal,selected:this.defaultStyle.item.general.selected}};t.prototype.getItemContentStyle=function(e){if(this.commonService.isString(e))return e;else if(e)return{disabled:this.commonService.isFieldAvailable(e.disabled,this.itemContentClassName+"-disabled"),focused:this.commonService.isFieldAvailable(e.focused,this.itemContentClassName+"-focused"),hovered:this.commonService.isFieldAvailable(e.hovered,this.itemContentClassName+"-hovered"),normal:this.commonService.isFieldAvailable(e.normal,this.itemContentClassName),selected:this.commonService.isFieldAvailable(e.selected,this.itemContentClassName+"-selected")};else return{disabled:this.defaultStyle.item.content.disabled,focused:this.defaultStyle.item.content.focused,hovered:this.defaultStyle.item.content.hovered,normal:this.defaultStyle.item.content.normal,selected:this.defaultStyle.item.content.selected}};t.prototype.updateStyle=function(e){if(e)this.options.currentStyle={general:this.getGeneralStyle(e.general),header:this.getHeaderStyle(e.header),content:this.getContentStyle(e.content),item:this.getItemStyle(e.content)};else this.options.currentStyle={general:{disabled:this.defaultStyle.general.disabled,focused:this.defaultStyle.general.focused,hovered:this.defaultStyle.general.hovered,normal:this.defaultStyle.general.normal,selected:this.defaultStyle.general.selected},header:{general:{disabled:this.defaultStyle.header.general.disabled,focused:this.defaultStyle.header.general.focused,hovered:this.defaultStyle.header.general.hovered,normal:this.defaultStyle.header.general.normal,selected:this.defaultStyle.header.general.selected},expandBox:this.defaultStyle.header.expandBox},content:{general:this.defaultStyle.content.general,expanded:this.defaultStyle.content.expanded,collapsed:this.defaultStyle.content.collapsed},item:{general:{disabled:this.defaultStyle.item.general.disabled,focused:this.defaultStyle.item.general.focused,hovered:this.defaultStyle.item.general.hovered,normal:this.defaultStyle.item.general.normal,selected:this.defaultStyle.item.general.selected},content:{disabled:this.defaultStyle.item.content.disabled,focused:this.defaultStyle.item.content.focused,hovered:this.defaultStyle.item.content.hovered,normal:this.defaultStyle.item.content.normal,selected:this.defaultStyle.item.content.selected}}}};t.ɵfac=function(e){return new(e||t)(i0.ɵɵdirectiveInject(i1.IntegralUICommonService),i0.ɵɵdirectiveInject(i0.ComponentFactoryResolver))};t.ɵcmp=i0.ɵɵdefineComponent({type:t,selectors:[["iui-combobox"]],contentQueries:function(e,t,i){if(1&e)i0.ɵɵcontentQuery(i,integralui_core_1.IntegralUIItem,!0);if(2&e){var n;i0.ɵɵqueryRefresh(n=i0.ɵɵloadQuery())&&(t.contentList=n)}},viewQuery:function(e,t){if(1&e){i0.ɵɵviewQuery(_c0,!0,core_1.ElementRef);i0.ɵɵviewQuery(_c1,!0);i0.ɵɵviewQuery(_c1,!0,core_1.ElementRef);i0.ɵɵviewQuery(_c1,!0,core_1.ViewContainerRef);i0.ɵɵviewQuery(_c2,!0,core_1.ElementRef)}if(2&e){var i;i0.ɵɵqueryRefresh(i=i0.ɵɵloadQuery())&&(t.controlElem=i.first);i0.ɵɵqueryRefresh(i=i0.ɵɵloadQuery())&&(t.header=i.first);i0.ɵɵqueryRefresh(i=i0.ɵɵloadQuery())&&(t.headerElem=i.first);i0.ɵɵqueryRefresh(i=i0.ɵɵloadQuery())&&(t.headerRef=i.first);i0.ɵɵqueryRefresh(i=i0.ɵɵloadQuery())&&(t.dropDownElem=i.first)}},inputs:{controlStyle:"controlStyle",data:"data",enabled:"enabled",name:"name",size:"size",state:"state",dropDownHeight:"dropDownHeight",integralHeight:"integralHeight",items:"items",maxDropDownItems:"maxDropDownItems",dropDownWidth:"dropDownWidth",expanded:"expanded",selectedIndex:"selectedIndex",selectedItem:"selectedItem"},outputs:{click:"click",dropDownClosed:"dropDownClosed",dropDownClosing:"dropDownClosing",dropDownOpened:"dropDownOpened",dropDownOpening:"dropDownOpening",selectedItemChanged:"selectedItemChanged",selectedIndexChanged:"selectedIndexChanged"},features:[i0.ɵɵInheritDefinitionFeature],ngContentSelectors:_c4,decls:7,vars:19,consts:[[3,"ngClass","ngStyle","DOMMouseScroll","mousewheel"],["control",""],[3,"controlStyle","enabled","icon","iconUrl","text","allowAnimation","animationType","size","mouseDown"],["header",""],["tabindex","999",3,"ngClass","ngStyle","blur"],["dropdown",""]],template:function(e,t){if(1&e){i0.ɵɵprojectionDef();i0.ɵɵelementStart(0,"div",0,1);i0.ɵɵlistener("DOMMouseScroll",function(e){return t.processMouseWheel(e)})("mousewheel",function(e){return t.processMouseWheel(e)});i0.ɵɵelementStart(2,"iui-header",2,3);i0.ɵɵlistener("mouseDown",function(e){return t.comboClick(e)});i0.ɵɵelementEnd();i0.ɵɵelementStart(4,"div",4,5);i0.ɵɵlistener("blur",function(e){return t.dropDownBlurEvent(e)});i0.ɵɵprojection(6);i0.ɵɵelementEnd();i0.ɵɵelementEnd()}if(2&e){i0.ɵɵproperty("ngClass",t.getControlClass())("ngStyle",t.getControlStyle());i0.ɵɵadvance(2);i0.ɵɵproperty("controlStyle",t.getCurrentHeaderStyle())("enabled",t.enabled)("icon",t.getComboIcon())("iconUrl",t.getComboIconUrl())("text",t.getComboText())("allowAnimation",t.allowAnimation)("animationType","arrow")("size",t.size);i0.ɵɵadvance(2);i0.ɵɵproperty("ngClass",t.getContentClass())("ngStyle",i0.ɵɵpureFunction6(12,_c3,t.contentBorder,t.contentDisplay,t.contentHeight,t.contentOpacity,t.contentOverflowY,t.getDropDownWidth()+"px"))}},directives:[i2.NgClass,i2.NgStyle,i3.IntegralUIHeaderItem],encapsulation:2});return t}(integralui_core_1.IntegralUIBaseComponent);exports.IntegralUIComboBox=IntegralUIComboBox;