uhk/agent
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add list to macro-tab

Browse Source
This commit is contained in:
József Farkas
2016-06-04 17:20:02 +02:00
parent 4ea1d766b4
commit e8de047ed4
4 changed files with 235 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/popover/tab/macro-item.component.scss Normal file
View File

@@ -0,0 +1,14 @@
:host {
display: flex;
flex-shrink: 0;
icon {
margin: 0 5px;
}
div {
display: flex;
flex: 1;
}
}

136
src/components/popover/tab/macro-item.component.ts Normal file
View File

@@ -0,0 +1,136 @@
import { Component, OnInit, OnChanges, Input } from '@angular/core';
import { NgSwitch, NgSwitchWhen} from '@angular/common';
import {MacroAction} from '../../../../config-serializer/config-items/MacroAction';
import {DelayMacroAction} from '../../../../config-serializer/config-items/DelayMacroAction';
import {HoldKeyMacroAction} from '../../../../config-serializer/config-items/HoldKeyMacroAction';
import {HoldModifiersMacroAction} from '../../../../config-serializer/config-items/HoldModifiersMacroAction';
import {HoldMouseButtonsMacroAction} from '../../../../config-serializer/config-items/HoldMouseButtonsMacroAction';
import {MoveMouseMacroAction} from '../../../../config-serializer/config-items/MoveMouseMacroAction';
import {PressKeyMacroAction} from '../../../../config-serializer/config-items/PressKeyMacroAction';
import {PressModifiersMacroAction} from '../../../../config-serializer/config-items/PressModifiersMacroAction';
import {PressMouseButtonsMacroAction} from '../../../../config-serializer/config-items/PressMouseButtonsMacroAction';
import {ReleaseKeyMacroAction} from '../../../../config-serializer/config-items/ReleaseKeyMacroAction';
import {ReleaseModifiersMacroAction} from '../../../../config-serializer/config-items/ReleaseModifiersMacroAction';
import {ReleaseMouseButtonsMacroAction} from '../../../../config-serializer/config-items/ReleaseMouseButtonsMacroAction';
import {ScrollMouseMacroAction} from '../../../../config-serializer/config-items/ScrollMouseMacroAction';
import {TextMacroAction} from '../../../../config-serializer/config-items/TextMacroAction';
import {IconComponent} from '../widgets/icon.component';
import {KeyModifiers} from '../../../../config-serializer/config-items/KeystrokeModifiersAction';
@Component({
moduleId: module.id,
selector: 'macro-item',
template:
`
<icon *ngIf="moveable" name="option-vertical"></icon>
<icon [name]="iconName"></icon>
<div> {{ title }} </div>
<icon *ngIf="deletable" name="trash"></icon>
<icon *ngIf="editable" name="pencil"></icon>
`,
styles: [require('./macro-item.component.scss')],
directives: [NgSwitch, NgSwitchWhen, IconComponent]
})
export class MacroItemComponent implements OnInit, OnChanges {
@Input() macroAction: MacroAction;
@Input() editable: boolean;
@Input() deletable: boolean;
@Input() moveable: boolean;
private iconName: string;
private title: string;
constructor() { }
ngOnInit() {
this.updateView();
}
ngOnChanges() {
// TODO: check if macroAction changed
this.updateView();
}
private updateView(): void {
this.title = this.macroAction.constructor.name;
if (this.macroAction instanceof MoveMouseMacroAction) {
this.iconName = 'mouse-pointer';
this.title = 'Move pointer';
let action: MoveMouseMacroAction = this.macroAction as MoveMouseMacroAction;
let needAnd: boolean;
if (Math.abs(action.x) > 0) {
this.title += ` by ${Math.abs(action.x)}px ${action.x > 0 ? 'left' : 'right'}ward`;
needAnd = true;
}
if (Math.abs(action.y) > 0) {
this.title += ` ${needAnd ? 'and' : 'by'} ${Math.abs(action.y)}px ${action.y > 0 ? 'down' : 'up'}ward`;
}
} else if (this.macroAction instanceof DelayMacroAction) {
this.iconName = 'clock';
let action: DelayMacroAction = this.macroAction as DelayMacroAction;
this.title = `Delay of ${action.delay}ms`;
} else if (this.macroAction instanceof TextMacroAction) {
let action: TextMacroAction = this.macroAction as TextMacroAction;
this.title = `Write text: ${action.text}`;
} else if (this.macroAction instanceof ScrollMouseMacroAction) {
this.iconName = 'mouse-pointer';
this.title = 'Scroll';
let action: ScrollMouseMacroAction = this.macroAction as ScrollMouseMacroAction;
let needAnd: boolean;
if (Math.abs(action.x) > 0) {
this.title += ` by ${Math.abs(action.x)}px ${action.x > 0 ? 'left' : 'right'}ward`;
needAnd = true;
}
if (Math.abs(action.y) > 0) {
this.title += ` ${needAnd ? 'and' : 'by'} ${Math.abs(action.y)}px ${action.y > 0 ? 'down' : 'up'}ward`;
}
} else if (this.macroAction instanceof PressModifiersMacroAction) {
this.iconName = 'square';
let action: PressModifiersMacroAction = this.macroAction as PressModifiersMacroAction;
if (action.modifierMask === 0) {
this.title = 'Invalid PressModifiersMacroAction!';
return;
}
this.title = 'Press: ';
for (let i = KeyModifiers.leftCtrl; i !== KeyModifiers.rightCtrl; i <<= 1) {
if (action.isModifierActive(i)) {
this.title += ' ' + KeyModifiers[i];
}
}
} else if (this.macroAction instanceof HoldModifiersMacroAction) {
this.iconName = 'square';
let action: HoldModifiersMacroAction = this.macroAction as HoldModifiersMacroAction;
if (action.modifierMask === 0) {
this.title = 'Invalid HoldModifiersMacroAction!';
return;
}
this.title = 'Hold: ';
for (let i = KeyModifiers.leftCtrl; i !== KeyModifiers.rightCtrl; i <<= 1) {
if (action.isModifierActive(i)) {
this.title += ' ' + KeyModifiers[i];
}
}
} else if (this.macroAction instanceof ReleaseModifiersMacroAction) {
this.iconName = 'square';
let action: ReleaseModifiersMacroAction = this.macroAction as ReleaseModifiersMacroAction;
if (action.modifierMask === 0) {
this.title = 'Invalid ReleaseModifiersMacroAction!';
return;
}
this.title = 'Release: ';
for (let i = KeyModifiers.leftCtrl; i !== KeyModifiers.rightCtrl; i <<= 1) {
if (action.isModifierActive(i)) {
this.title += ' ' + KeyModifiers[i];
}
}
}
// TODO: finish for all MacroAction
}
}

43
src/components/popover/tab/macro-tab.component.scss Normal file
View File

@@ -0,0 +1,43 @@
:host {
display: flex;
flex-direction: column;
.macro-selector {
display: flex;
margin-top: 2px;
b {
margin-right: 7px;
}
select {
flex: 1;
}
}
.macro-action-container {
display: flex;
flex-direction: column;
min-height: 200px;
max-height: 300px;
margin: 20px 0px;
overflow-x: hidden;
overflow-y: auto;
macro-item {
border: 1px solid #ddd;
padding: 10px;
margin-bottom: -1px;
}
macro-item:first-child {
border-top-left-radius: 4px;
border-top-right-radius: 4px;
}
macro-item:last-child {
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
margin-bottom: 0;
}
}
}

51
src/components/popover/tab/macro-tab.component.ts
View File

@@ -1,27 +1,60 @@
import { Component, OnInit } from '@angular/core';
import { UhkConfigurationService } from '../../../services/uhk-configuration.service';
import { Macro } from '../../../../config-serializer/config-items/Macro';
import { PlayMacroAction } from '../../../../config-serializer/config-items/PlayMacroAction';
import { KeyActionSaver } from '../key-action-saver';
import { KeyAction } from '../../../../config-serializer/config-items/KeyAction';
import { MacroItemComponent } from './macro-item.component';
@Component({
moduleId: module.id,
selector: 'macro-tab',
template:
`
Macro
`
<div class="macro-selector">
<b> Play macro: </b>
<select [(ngModel)]="selectedMacroIndex">
<option [ngValue]="-1"> Select macro </option>
<option *ngFor="let macro of macros; let index=index" [ngValue]="index"> {{ macro.name }} </option>
</select>
</div>
<div class="macro-action-container">
<template [ngIf]="selectedMacroIndex >= 0">
<macro-item *ngFor="let macroAction of macros[selectedMacroIndex].macroActions.elements"
[macroAction]="macroAction">
</macro-item>
</template>
</div>
`,
styles: [require('./macro-tab.component.scss')],
directives: [MacroItemComponent]
})
export class MacroTabComponent implements OnInit, KeyActionSaver {
constructor() { }
ngOnInit() { }
private macros: Macro[];
private selectedMacroIndex: number;
keyActionValid(): boolean {
return false;
constructor(private uhkConfigurationService: UhkConfigurationService) {
this.macros = [];
this.selectedMacroIndex = -1;
}
toKeyAction(): KeyAction {
return undefined;
ngOnInit() {
this.macros = this.uhkConfigurationService.getUhkConfiguration().macros.elements;
}
keyActionValid(): boolean {
return this.selectedMacroIndex !== -1;
}
toKeyAction(): PlayMacroAction {
if (!this.keyActionValid()) {
throw new Error('KeyAction is not valid. No selected macro!');
}
let keymapAction = new PlayMacroAction();
keymapAction.macroId = this.macros[this.selectedMacroIndex].id;
return keymapAction;
}
}