import { ChangeDetectionStrategy , Component , EventEmitter , Input , OnChanges , OnInit , Output , SimpleChanges } from '@angular/core' ; import { animate , style , transition , trigger } from '@angular/animations' ; import { faGripLinesVertical } from '@fortawesome/free-solid-svg-icons' ; import { CommandMacroAction , DelayMacroAction , KeyMacroAction , KeyModifiers , MacroAction , MouseButtonMacroAction , MouseButtons , MoveMouseMacroAction , ScrollMouseMacroAction , TextMacroAction } from 'uhk-common' ; import { MapperService } from '../../../services/mapper.service' ; @ Component ( { animations : [ trigger ( 'toggler' , [ transition ( ':enter' , [ style ( { height : '0px' , visibility : 'hidden' } ) , animate ( '500ms ease-out' , style ( { height : '*' , visibility : 'visible' } ) ) ] ) , transition ( ':leave' , [ style ( { height : '*' , visibility : 'visible' } ) , animate ( '500ms ease-out' , style ( { height : '0px' , visibility : 'hidden' } ) ) ] ) , ] ) ] , selector : 'macro-item' , changeDetection : ChangeDetectionStrategy . OnPush , templateUrl : './macro-item.component.html' , styleUrls : [ './macro-item.component.scss' ] , host : { 'class' : 'macro-item' } } ) export class MacroItemComponent implements OnInit , OnChanges { @ Input ( ) macroAction : MacroAction ; @ Input ( ) editable : boolean ; @ Input ( ) editing : boolean ; @ Input ( ) deletable : boolean ; @ Input ( ) movable : boolean ; @ Output ( ) save = new EventEmitter < MacroAction > ( ) ; @ Output ( ) cancel = new EventEmitter < void > ( ) ; @ Output ( ) edit = new EventEmitter < void > ( ) ; @ Output ( ) delete = new EventEmitter < void > ( ) ; title : string ; iconName : string ; newItem : boolean = false ; faGripLinesVertical = faGripLinesVertical ; isCommand = false ; constructor ( private mapper ) { } ngOnInit ( ) { this . updateView ( ) ; if ( ! this . macroAction ) { this . newItem = true ; } } ngOnChanges ( changes ) { if ( changes [ 'macroAction' ] ) { this . updateView ( ) ; } } saveEditedAction ( editedAction ) { this . macroAction = editedAction ; this . updateView ( ) ; this . save . emit ( editedAction ) ; } editAction ( ) { if ( ! this . editable || this . editing ) { this . cancelEdit ( ) ; return ; } this . edit . emit ( ) ; } cancelEdit ( ) { this . cancel . emit ( ) ; } deleteAction ( ) { this . delete . emit ( ) ; } saveMacroCommand ( command ) { const macroAction = new CommandMacroAction ( ) ; macroAction . command = command ; this . save . emit ( macroAction ) ; } private updateView ( ) { this . isCommand = false ; if ( ! this . macroAction ) { this . title = 'New macro action' ; } else if ( this . macroAction instanceof CommandMacroAction ) { this . isCommand = true ; this . iconName = 'code' ; } else if ( this . macroAction instanceof DelayMacroAction ) { this . iconName = 'clock' ; const action = this . macroAction as DelayMacroAction ; const delay = action . delay > 0 ? action . delay / 1000 : 0 ; this . title = `Delay of ${ delay }s` ; } else if ( this . macroAction instanceof TextMacroAction ) { const action = this . macroAction as TextMacroAction ; this . iconName = 'font' ; this . title = `Write text: ${ action . text }` ; } else if ( this . macroAction instanceof KeyMacroAction ) { const action = this . macroAction as KeyMacroAction ; this . setKeyActionContent ( action ) ; } else if ( this . macroAction instanceof MouseButtonMacroAction ) { const action = this . macroAction as MouseButtonMacroAction ; this . setMouseButtonActionContent ( action ) ; } else if ( this . macroAction instanceof MoveMouseMacroAction || this . macroAction instanceof ScrollMouseMacroAction ) { this . setMouseMoveScrollActionContent ( this . macroAction ) ; } else { this . title = this . macroAction . constructor . name ; } } private setKeyActionContent ( action ) { if ( ! action . hasScancode ( ) && ! action . hasModifiers ( ) ) { this . title = 'Invalid keypress' ; return ; } if ( action . isTapAction ( ) ) { this . iconName = 'hand-pointer' ; this . title = 'Tap key: ' ; } else if ( action . isPressAction ( ) ) { this . iconName = 'hand-rock' ; this . title = 'Press key: ' ; } else if ( action . isReleaseAction ( ) ) { this . iconName = 'hand-paper' ; this . title = 'Release key: ' ; } const texts = [ ] ; if ( action . hasModifiers ( ) ) { for ( let i = KeyModifiers . leftCtrl ; i <= KeyModifiers . rightGui ; i <<= 1 ) { if ( action . isModifierActive ( i ) ) { texts . push ( this . mapper . getOsSpecificText ( this . mapper . getOsSpecificModifierTextByValue ( i ) ) ) ; } } } if ( action . hasScancode ( ) ) { const scancode = ( this . mapper . scanCodeToText ( action . scancode , action . type ) || [ 'Unknown' ] ) . join ( ' ' ) ; if ( scancode ) { texts . push ( scancode ) ; } } this . title += texts . join ( ' + ' ) ; } private setMouseMoveScrollActionContent ( action ) { let typedAction ; if ( action instanceof MoveMouseMacroAction ) { this . iconName = 'mouse-pointer' ; this . title = 'Move pointer' ; typedAction = this . macroAction as MoveMouseMacroAction ; } else { this . iconName = 'mouse-pointer' ; this . title = 'Scroll' ; typedAction = this . macroAction as ScrollMouseMacroAction ; } let needAnd ; if ( Math . abs ( typedAction . x ) !== 0 ) { this . title += ` by ${ Math . abs ( typedAction . x ) }px ${ typedAction . x > 0 ? 'rightward' : 'leftward' }` ; needAnd = true ; } if ( Math . abs ( typedAction . y ) !== 0 ) { this . title += ` ${ needAnd ? 'and' : 'by' } ${ Math . abs ( typedAction . y ) }px ${ typedAction . y > 0 ? 'downward' : 'upward' }` ; } } private setMouseButtonActionContent ( action ) { if ( action . isOnlyClickAction ( ) ) { this . iconName = 'mouse-pointer' ; this . title = 'Click mouse button: ' ; } else if ( action . isOnlyHoldAction ( ) ) { this . iconName = 'hand-rock' ; this . title = 'Hold mouse button: ' ; } else if ( action . isOnlyReleaseAction ( ) ) { this . iconName = 'hand-paper' ; this . title = 'Release mouse button: ' ; } const selectedButtons = action . getMouseButtons ( ) ; const selectedButtonLabels = [ ] ; selectedButtons . forEach ( ( isSelected , idx ) => { if ( isSelected && MouseButtons [ idx ] ) { selectedButtonLabels . push ( MouseButtons [ idx ] ) ; } } ) ; this . title += selectedButtonLabels . join ( ', ' ) ; } }