diff options
Diffstat (limited to 'sdc-workflow-designer-ui/src/app/paletx/core/pxbutton/button.directive.ts')
-rw-r--r-- | sdc-workflow-designer-ui/src/app/paletx/core/pxbutton/button.directive.ts | 178 |
1 files changed, 0 insertions, 178 deletions
diff --git a/sdc-workflow-designer-ui/src/app/paletx/core/pxbutton/button.directive.ts b/sdc-workflow-designer-ui/src/app/paletx/core/pxbutton/button.directive.ts deleted file mode 100644 index 842b9fb4..00000000 --- a/sdc-workflow-designer-ui/src/app/paletx/core/pxbutton/button.directive.ts +++ /dev/null @@ -1,178 +0,0 @@ -import {AfterViewInit, Directive, ElementRef, Input, OnDestroy} from '@angular/core'; - -import {DomHandler} from '../domhandler'; - -import {PlxButtonState} from './button-state'; - -@Directive({selector: '[pxButton]', providers: [DomHandler]}) -export class PlxButtonDirective implements AfterViewInit, OnDestroy { - @Input() iconPos: string = 'left'; - - @Input() cornerStyleClass: string = 'ui-corner-all'; - - _label: string; - - _loadinglabel: string; - - _icon: string; - - _state: number; - - initialized: boolean; - - constructor( - public el: ElementRef, public domHandler: DomHandler) {} - - ngAfterViewInit() { - this.domHandler.addMultipleClasses( - this.el.nativeElement, this.getStyleClass()); - if (this.icon) { - let iconElement = document.createElement('span'); - let iconPosClass = (this.iconPos === 'right') ? 'ui-button-icon-right' : - 'ui-button-icon-left'; - iconElement.className = - iconPosClass + ' ui-c iconfont plx-icon-' + this.icon; - this.el.nativeElement.appendChild(iconElement); - } - - let iconAnimationElement = document.createElement('span'); - iconAnimationElement.className = - 'ui-button-icon-left ui-c iconfont plx-icon-circle-o-notch plx-spin'; - iconAnimationElement.style.display = 'none'; - this.el.nativeElement.appendChild(iconAnimationElement); - - let labelElement = document.createElement('span'); - labelElement.className = 'ui-button-text ui-c'; - labelElement.appendChild(document.createTextNode(this.label || '')); - this.el.nativeElement.appendChild(labelElement); - - if (this.state) { - let spanElement = - this.domHandler.findSingle(this.el.nativeElement, '.ui-button-text'); - if (this.state === PlxButtonState.DOING) { - if (spanElement) { - spanElement.innerText = this.loadinglabel || 'loading'; - } - this.el.nativeElement.disabled = true; - this.setIconELement(true); - } else { - spanElement.innerText = this.label || ''; - this.el.nativeElement.disabled = false; - this.setIconELement(false); - } - } - - this.initialized = true; - } - - getStyleClass(): string { - let styleClass = - 'ui-button ui-widget ui-state-default ' + this.cornerStyleClass; - if (this.icon) { - if (this.label !== null && this.label !== undefined) { - if (this.iconPos === 'left') { - styleClass = styleClass + ' ui-button-text-icon-left'; - } else { - styleClass = styleClass + ' ui-button-text-icon-right'; - } - } else { - styleClass = styleClass + ' ui-button-icon-only'; - } - } else { - styleClass = styleClass + ' ui-button-text-only'; - } - - return styleClass; - } - - setIconELement(isShowAnimation: boolean) { - let iconLeftElement = this.domHandler.findSingle( - this.el.nativeElement, '.ui-button-icon-left.iconfont'); - if (iconLeftElement) { - iconLeftElement.style.display = isShowAnimation ? 'none' : 'inline-block'; - } - let iconRightElement = this.domHandler.findSingle( - this.el.nativeElement, '.ui-button-icon-left.iconfont'); - if (iconRightElement) { - iconRightElement.style.display = - isShowAnimation ? 'none' : 'inline-block'; - } - let iconAnimationElement = this.domHandler.findSingle( - this.el.nativeElement, '.iconfont.plx-icon-circle-o-notch.plx-spin'); - if (iconAnimationElement) { - iconAnimationElement.style.display = - isShowAnimation ? 'inline-block' : 'none'; - } - } - - @Input() - get label(): string { - return this._label; - } - - set label(val: string) { - this._label = val; - - if (this.initialized) { - this.domHandler.findSingle(this.el.nativeElement, '.ui-button-text') - .textContent = this._label; - } - } - - @Input() - get loadinglabel(): string { - return this._loadinglabel; - } - - set loadinglabel(val: string) { - this._loadinglabel = val; - } - - @Input() - get icon(): string { - return this._icon; - } - - set icon(val: string) { - this._icon = val; - - if (this.initialized) { - let iconPosClass = (this.iconPos === 'right') ? 'ui-button-icon-right' : - 'ui-button-icon-left'; - this.domHandler.findSingle(this.el.nativeElement, '.iconfont').className = - iconPosClass + ' ui-c iconfont plx-icon-' + this.icon; - } - } - - @Input() - get state(): number { - return this._state; - } - - set state(val: number) { - this._state = val; - if (this.initialized) { - let spanElement = - this.domHandler.findSingle(this.el.nativeElement, '.ui-button-text'); - if (this.state === PlxButtonState.DOING) { - if (spanElement) { - spanElement.innerText = this.loadinglabel || 'loading'; - } - this.el.nativeElement.disabled = true; - this.setIconELement(true); - } else { - spanElement.innerText = this.label || ''; - this.el.nativeElement.disabled = false; - this.setIconELement(false); - } - } - } - - ngOnDestroy() { - while (this.el.nativeElement.hasChildNodes()) { - this.el.nativeElement.removeChild(this.el.nativeElement.lastChild); - } - - this.initialized = false; - } -} |