From e2eb46b0de2544434289156270457e4281571249 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=B3zsef=20Farkas?= Date: Fri, 29 Apr 2016 21:19:50 +0200 Subject: [PATCH] Add missing keyboard-key labels --- .../config-items/KeystrokeModifiersAction.ts | 4 ++ .../config-items/SwitchLayerAction.ts | 12 ++-- config-serializer/uhk-config.json | 30 +++++++++ src/components/svg-keyboard-key.component.ts | 17 ++--- src/components/svg-module.component.ts | 62 +++++++++++++++---- 5 files changed, 102 insertions(+), 23 deletions(-) diff --git a/config-serializer/config-items/KeystrokeModifiersAction.ts b/config-serializer/config-items/KeystrokeModifiersAction.ts index 103de60b..7704342b 100644 --- a/config-serializer/config-items/KeystrokeModifiersAction.ts +++ b/config-serializer/config-items/KeystrokeModifiersAction.ts @@ -48,4 +48,8 @@ export class KeystrokeModifiersAction extends KeyAction { isModifierActive(modifier: KeyModifiers): boolean { return (this.modifierMask & modifier) > 0; } + + isOnlyOneModifierActive(): boolean { + return this.modifierMask !== 0 && !(this.modifierMask & this.modifierMask - 1); + } } diff --git a/config-serializer/config-items/SwitchLayerAction.ts b/config-serializer/config-items/SwitchLayerAction.ts index 69536660..cc76d4ab 100644 --- a/config-serializer/config-items/SwitchLayerAction.ts +++ b/config-serializer/config-items/SwitchLayerAction.ts @@ -1,7 +1,7 @@ import {keyActionType, KeyActionId, KeyAction} from './KeyAction'; import {UhkBuffer} from '../UhkBuffer'; -enum LayerName { +export enum LayerName { mod, fn, mouse @@ -12,18 +12,18 @@ export class SwitchLayerAction extends KeyAction { isLayerToggleable: boolean; // @assertEnum(LayerName) - private layer: LayerName; + private _layer: LayerName; _fromJsObject(jsObject: any): SwitchLayerAction { this.assertKeyActionType(jsObject); - this.layer = LayerName[ jsObject.layer]; + this._layer = LayerName[ jsObject.layer]; this.isLayerToggleable = jsObject.toggle; return this; } _fromBinary(buffer: UhkBuffer): SwitchLayerAction { this.readAndAssertKeyActionId(buffer); - this.layer = buffer.readUInt8(); + this._layer = buffer.readUInt8(); this.isLayerToggleable = buffer.readBoolean(); return this; } @@ -45,4 +45,8 @@ export class SwitchLayerAction extends KeyAction { toString(): string { return ``; } + + get layer() { + return this._layer; + } } diff --git a/config-serializer/uhk-config.json b/config-serializer/uhk-config.json index 5447f175..1dce7960 100644 --- a/config-serializer/uhk-config.json +++ b/config-serializer/uhk-config.json @@ -132,6 +132,36 @@ { "keyActionType": "keystroke", "scancode": 56 + }, + { + "keyActionType": "keystrokeModifiers", + "modifierMask": 32 + }, + { + "keyActionType": "keystroke", + "scancode": 44 + }, + { + "keyActionType": "switchLayer", + "layer": "fn", + "toggle": false + }, + { + "keyActionType": "keystrokeModifiers", + "modifierMask": 64 + }, + { + "keyActionType": "keystrokeModifiers", + "modifierMask": 128 + }, + { + "keyActionType": "keystrokeModifiers", + "modifierMask": 16 + }, + { + "keyActionType": "switchLayer", + "layer": "mod", + "toggle": false } ] }, diff --git a/src/components/svg-keyboard-key.component.ts b/src/components/svg-keyboard-key.component.ts index 786393b5..c9c20c7d 100644 --- a/src/components/svg-keyboard-key.component.ts +++ b/src/components/svg-keyboard-key.component.ts @@ -11,15 +11,16 @@ import { Component, OnInit, Input } from 'angular2/core'; + [attr.font-family]="'Helvetica'" + [attr.fill]="'#ffffff'" + [attr.style]="'dominant-baseline: central'" + *ngIf="labels && labels.length > 0"> {{asciiCode[0]}} + id="SvgjsTspan1180">{{ labels[0] }} ` }) @@ -29,10 +30,10 @@ export class SvgKeyboardKeyComponent implements OnInit { @Input() ry: string; @Input() height: string; @Input() width: string; - @Input() asciiCode: string[]; + @Input() labels: string[]; constructor() { - this.asciiCode = []; + this.labels = []; } ngOnInit() { } diff --git a/src/components/svg-module.component.ts b/src/components/svg-module.component.ts index 04e4d168..b2aed5c3 100644 --- a/src/components/svg-module.component.ts +++ b/src/components/svg-module.component.ts @@ -4,6 +4,8 @@ import {SvgKeyboardKey} from './svg-keyboard-key.model'; import {SvgKeyboardKeyComponent} from './svg-keyboard-key.component'; import {KeyAction} from '../../config-serializer/config-items/KeyAction'; import {KeystrokeAction} from '../../config-serializer/config-items/KeystrokeAction'; +import {KeystrokeModifiersAction, KeyModifiers} from '../../config-serializer/config-items/KeystrokeModifiersAction'; +import {SwitchLayerAction, LayerName} from '../../config-serializer/config-items/SwitchLayerAction'; import {Mapper} from '../utils/mapper'; @Component({ @@ -16,7 +18,7 @@ import {Mapper} from '../utils/mapper'; [rx]="key.rx" [ry]="key.ry" [width]="key.width" [height]="key.height" [attr.transform]="'translate(' + key.x + ' ' + key.y + ')'" - [asciiCode]="asciiCodes[i]" + [labels]="labels[i]" /> `, directives: [SvgKeyboardKeyComponent] @@ -25,40 +27,78 @@ export class SvgModuleComponent implements OnInit, OnChanges { @Input() coverages: any[]; @Input() keyboardKeys: SvgKeyboardKey[]; @Input() keyActions: KeyAction[]; - private asciiCodes: string[][]; + private labels: string[][]; constructor() { this.keyboardKeys = []; - this.asciiCodes = []; + this.labels = []; } ngOnInit() { - this.setAsciiCodes(); + this.setLabels(); console.log(this); } ngOnChanges(changes: { [propertyName: string]: SimpleChange }) { /* tslint:disable:no-string-literal */ if (changes['keyActions']) { - this.setAsciiCodes(); + this.setLabels(); } /* tslint:enable:no-string-literal */ } - private setAsciiCodes(): void { + private setLabels(): void { if (!this.keyActions) { return; } - let newAsciiCodes: string[][] = []; + let newLabels: string[][] = []; this.keyActions.forEach((keyAction: KeyAction) => { - if (keyAction instanceof KeystrokeAction) { - newAsciiCodes.push(Mapper.scanCodeToText((keyAction as KeystrokeAction).scancode)); + if (keyAction instanceof KeystrokeModifiersAction) { + if (keyAction.isOnlyOneModifierActive()) { + switch (keyAction.modifierMask) { + case KeyModifiers.leftCtrl: + case KeyModifiers.rightCtrl: + newLabels.push(['Ctrl']); + break; + case KeyModifiers.leftShift: + case KeyModifiers.rightShift: + newLabels.push(['Shift']); + break; + case KeyModifiers.leftAlt: + case KeyModifiers.rightAlt: + newLabels.push(['Alt']); + break; + case KeyModifiers.leftGui: + case KeyModifiers.rightGui: + newLabels.push(['Super']); + break; + default: + newLabels.push(['Undefined']); + break; + } + } + } else if (keyAction instanceof KeystrokeAction) { + newLabels.push(Mapper.scanCodeToText((keyAction as KeystrokeAction).scancode)); + } else if (keyAction instanceof SwitchLayerAction) { + switch (keyAction.layer) { + case LayerName.mod: + newLabels.push(['Mod']); + break; + case LayerName.fn: + newLabels.push(['Fn']); + break; + case LayerName.mouse: + newLabels.push(['Mouse']); + break; + default: + break; + } } else { - newAsciiCodes.push([]); + newLabels.push([]); } }); - this.asciiCodes = newAsciiCodes; + this.labels = newLabels; } }