,
+ private element: ElementRef,
+ private captureService: CaptureService,
+ private renderer: Renderer
+ ) {
this.subscription = store.let(getMacroEntities())
.subscribe((macros: Macro[]) => this.macros = macros);
+
+ this.reset();
+ this.captureService.populateMapping();
}
ngOnInit() {
@@ -84,22 +151,50 @@ export class SvgKeyboardKeyComponent implements OnInit, OnChanges, OnDestroy {
}
ngOnChanges(changes: { [propertyName: string]: SimpleChange }) {
- /* tslint:disable:no-string-literal */
if (changes['keyAction']) {
this.setLabels();
if (this.keybindAnimationEnabled) {
- this.animation = 'active';
+ this.changeAnimation = 'active';
}
}
- /* tslint:enable:no-string-literal */
}
ngOnDestroy() {
this.subscription.unsubscribe();
}
- animationDone() {
- this.animation = 'inactive';
+ onChangeAnimationDone() {
+ this.changeAnimation = 'inactive';
+ }
+
+ onRecordingAnimationDone() {
+ if (this.recording && this.recordAnimation === 'inactive') {
+ this.recordAnimation = 'active';
+ } else {
+ this.recordAnimation = 'inactive';
+ }
+ }
+
+ private reset() {
+ this.recording = false;
+ this.changeAnimation = 'inactive';
+ this.captureService.initModifiers();
+ }
+
+ private saveScanCode(code = 0) {
+ this.recording = false;
+ this.changeAnimation = 'inactive';
+
+ const left: boolean[] = this.captureService.getModifiers(true);
+ const right: boolean[] = this.captureService.getModifiers(false);
+
+ this.capture.emit({
+ code,
+ left,
+ right
+ });
+
+ this.captureService.initModifiers();
}
private setLabels(): void {
diff --git a/src/components/svg/module/svg-module.component.html b/src/components/svg/module/svg-module.component.html
index 41dd0506..5a507a5d 100644
--- a/src/components/svg/module/svg-module.component.html
+++ b/src/components/svg/module/svg-module.component.html
@@ -7,6 +7,7 @@
[keyAction]="keyActions[i]"
[keybindAnimationEnabled]="keybindAnimationEnabled"
(keyClick)="onKeyClick(i, $event)"
+ (capture)="onCapture(i, $event)"
(mouseenter)="onKeyHover(i, $event, true)"
(mouseleave)="onKeyHover(i, $event, false)"
/>
\ No newline at end of file
diff --git a/src/components/svg/module/svg-module.component.ts b/src/components/svg/module/svg-module.component.ts
index 035ea41f..82b491e2 100644
--- a/src/components/svg/module/svg-module.component.ts
+++ b/src/components/svg/module/svg-module.component.ts
@@ -16,6 +16,7 @@ export class SvgModuleComponent {
@Input() keybindAnimationEnabled: boolean;
@Output() keyClick = new EventEmitter();
@Output() keyHover = new EventEmitter();
+ @Output() capture = new EventEmitter();
constructor() {
this.keyboardKeys = [];
@@ -36,4 +37,10 @@ export class SvgModuleComponent {
});
}
+ onCapture(index: number, captured: {code: number, left: boolean[], right: boolean[]}) {
+ this.capture.emit({
+ index,
+ captured
+ });
+ }
}
diff --git a/src/components/svg/wrap/svg-keyboard-wrap.component.html b/src/components/svg/wrap/svg-keyboard-wrap.component.html
index 6d9e0b2e..0bb9d8ff 100644
--- a/src/components/svg/wrap/svg-keyboard-wrap.component.html
+++ b/src/components/svg/wrap/svg-keyboard-wrap.component.html
@@ -4,7 +4,9 @@
[currentLayer]="currentLayer"
[keybindAnimationEnabled]="keybindAnimationEnabled"
(keyClick)="onKeyClick($event.moduleId, $event.keyId, $event.keyTarget)"
- (keyHover)="onKeyHover($event.moduleId, $event.event, $event.over, $event.keyId)">
+ (keyHover)="onKeyHover($event.moduleId, $event.event, $event.over, $event.keyId)"
+ (capture)="onCapture($event.moduleId, $event.keyId, $event.captured)"
+ >
x ? 1 : 0);
+
+ keystrokeAction.scancode = captured.code;
+ keystrokeAction.modifierMask = 0;
+
+ for (let i = 0; i < modifiers.length; ++i) {
+ keystrokeAction.modifierMask |= modifiers[i] << this.mapper.modifierMapper(i);
+ }
+
+ this.store.dispatch(
+ KeymapActions.saveKey(
+ this.keymap,
+ this.currentLayer,
+ moduleId,
+ keyId,
+ keystrokeAction)
+ );
+ }
+
onRemap(keyAction: KeyAction): void {
this.store.dispatch(
KeymapActions.saveKey(
@@ -277,5 +298,4 @@ export class SvgKeyboardWrapComponent implements OnInit, OnChanges {
selectLayer(index: number): void {
this.currentLayer = index;
}
-
}
diff --git a/src/services/mapper.service.ts b/src/services/mapper.service.ts
index 90d5bf30..60ccff6a 100644
--- a/src/services/mapper.service.ts
+++ b/src/services/mapper.service.ts
@@ -38,6 +38,14 @@ export class MapperService {
return 'assets/compiled_sprite.svg#' + this.nameToFileName.get(iconName);
}
+ public modifierMapper(x: number) {
+ if (x < 8) {
+ return Math.floor(x / 2) * 4 + 1 - x; // 1, 0, 3, 2, 5, 4, 7, 6
+ } else {
+ return x;
+ }
+ }
+
// TODO: read the mapping from JSON
private initScanCodeTextMap(): void {
this.scanCodeTextMap = new Map();