From 5759d2db1e7ffbb6f9355ea5bde8cf2a1d99de1a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=B3zsef=20Farkas?= Date: Mon, 16 May 2016 12:38:37 +0200 Subject: [PATCH] SwitchKeymap rendering --- .../config-items/UhkConfiguration.ts | 10 +++++ config-serializer/uhk-config.json | 25 ++++++++++- .../keys/svg-keyboard-key.component.ts | 23 +++++++++-- .../keys/svg-switch-keymap-key.component.ts | 41 +++++++++++++++++++ .../keys/svg-text-icon-key.component.ts | 4 +- src/main-app.component.ts | 15 ++++--- src/services/mapper.service.ts | 2 +- src/services/uhk-configuration.service.ts | 19 +++++++++ 8 files changed, 124 insertions(+), 15 deletions(-) create mode 100644 src/components/keys/svg-switch-keymap-key.component.ts create mode 100644 src/services/uhk-configuration.service.ts diff --git a/config-serializer/config-items/UhkConfiguration.ts b/config-serializer/config-items/UhkConfiguration.ts index 9573e0e3..e1f5fbc6 100644 --- a/config-serializer/config-items/UhkConfiguration.ts +++ b/config-serializer/config-items/UhkConfiguration.ts @@ -1,6 +1,7 @@ import {Serializable} from '../Serializable'; import {ModuleConfigurations} from './ModuleConfigurations'; import {KeyMaps} from './KeyMaps'; +import {KeyMap} from './KeyMap'; import {Macros} from './Macros'; import {UhkBuffer} from '../UhkBuffer'; import {assertUInt8, assertUInt32} from '../assert'; @@ -85,4 +86,13 @@ export class UhkConfiguration extends Serializable { toString(): string { return ``; } + + getKeymap(keymapId: number): KeyMap { + let keyMaps: KeyMap[] = this.keyMaps.elements; + for (let i = 0; i < keyMaps.length; ++i) { + if (keymapId === keyMaps[i].id) { + return keyMaps[i]; + } + } + } } diff --git a/config-serializer/uhk-config.json b/config-serializer/uhk-config.json index a898af2a..a1940f9b 100644 --- a/config-serializer/uhk-config.json +++ b/config-serializer/uhk-config.json @@ -392,7 +392,8 @@ "keyActionType": "none" }, { - "keyActionType": "none" + "keyActionType": "switchKeymap", + "keymapId": 2 }, { "keyActionType": "none" @@ -824,6 +825,28 @@ ] } ] + }, + { + "id": 2, + "isDefault": false, + "abbreviation": "DVR", + "name": "DVR", + "layers": [ + { + "modules": [ + { + "id": 0, + "pointerRole": "move", + "keyActions": [] + }, + { + "id": 1, + "pointerRole": "move", + "keyActions": [] + } + ] + } + ] } ], "macros": [ diff --git a/src/components/keys/svg-keyboard-key.component.ts b/src/components/keys/svg-keyboard-key.component.ts index 1edcf01b..85ac10af 100644 --- a/src/components/keys/svg-keyboard-key.component.ts +++ b/src/components/keys/svg-keyboard-key.component.ts @@ -6,17 +6,22 @@ import {KeystrokeAction} from '../../../config-serializer/config-items/Keystroke import {KeystrokeModifiersAction, KeyModifiers} from '../../../config-serializer/config-items/KeystrokeModifiersAction'; import {SwitchLayerAction, LayerName} from '../../../config-serializer/config-items/SwitchLayerAction'; import {MapperService} from '../../services/mapper.service'; +import {SwitchKeymapAction} from '../../../config-serializer/config-items/SwitchKeymapAction'; +import {UhkConfiguration} from '../../../config-serializer/config-items/UhkConfiguration'; +import {UhkConfigurationService} from '../../services/uhk-configuration.service'; import {SvgOneLineTextKeyComponent} from './svg-one-line-text-key.component'; import {SvgTwoLineTextKeyComponent} from './svg-two-line-text-key.component'; import {SvgSingleIconKeyComponent} from './svg-single-icon-key.component'; import {SvgTextIconKeyComponent} from './svg-text-icon-key.component'; +import {SvgSwitchKeymapKeyComponent} from './svg-switch-keymap-key.component'; enum LabelTypes { OneLineText, TwoLineText, TextIcon, - SingleIcon + SingleIcon, + SwitchKeymap } @Component({ @@ -49,6 +54,11 @@ enum LabelTypes { [width]="width" [icon]="labelSource"> + + `, directives: @@ -58,7 +68,8 @@ enum LabelTypes { SvgOneLineTextKeyComponent, SvgTwoLineTextKeyComponent, SvgSingleIconKeyComponent, - SvgTextIconKeyComponent + SvgTextIconKeyComponent, + SvgSwitchKeymapKeyComponent ] }) export class SvgKeyboardKeyComponent implements OnInit, OnChanges { @@ -77,7 +88,7 @@ export class SvgKeyboardKeyComponent implements OnInit, OnChanges { private labelSource: any; private labelType: LabelTypes; - constructor(private mapperService: MapperService) { } + constructor(private mapperService: MapperService, private uhkConfigurationService: UhkConfigurationService) { } ngOnInit() { this.setLabels(); @@ -163,11 +174,15 @@ export class SvgKeyboardKeyComponent implements OnInit, OnChanges { text: newLabelSource, icon: this.mapperService.getIcon('toggle') }; - console.log(keyAction, this.labelSource); } else { this.labelType = LabelTypes.OneLineText; this.labelSource = newLabelSource; } + } else if (this.keyAction instanceof SwitchKeymapAction) { + let keyAction: SwitchKeymapAction = this.keyAction as SwitchKeymapAction; + this.labelType = LabelTypes.SwitchKeymap; + let uhkConfiguration: UhkConfiguration = this.uhkConfigurationService.getUhkConfiguration(); + this.labelSource = uhkConfiguration.getKeymap(keyAction.keymapId).abbreviation; } } diff --git a/src/components/keys/svg-switch-keymap-key.component.ts b/src/components/keys/svg-switch-keymap-key.component.ts new file mode 100644 index 00000000..88479284 --- /dev/null +++ b/src/components/keys/svg-switch-keymap-key.component.ts @@ -0,0 +1,41 @@ +import { Component, OnInit, Input } from '@angular/core'; + +import {MapperService} from '../../services/mapper.service'; + +@Component({ + moduleId: module.id, + selector: 'g[svg-switch-keymap-key]', + template: + ` + + + + {{ abbreviation }} + + ` +}) +export class SvgSwitchKeymapKeyComponent implements OnInit { + @Input() width: number; + @Input() height: number; + @Input() abbreviation: string; + private icon: string; + + constructor(private mapperService: MapperService) { } + + ngOnInit() { + this.icon = this.mapperService.getIcon('switch-keymap'); + } + +} diff --git a/src/components/keys/svg-text-icon-key.component.ts b/src/components/keys/svg-text-icon-key.component.ts index b4229a5f..2ea03b66 100644 --- a/src/components/keys/svg-text-icon-key.component.ts +++ b/src/components/keys/svg-text-icon-key.component.ts @@ -32,8 +32,6 @@ export class SvgTextIconKeyComponent implements OnInit { constructor() { } - ngOnInit() { - console.log(this); - } + ngOnInit() { } } diff --git a/src/main-app.component.ts b/src/main-app.component.ts index 8b811715..5f7924d0 100644 --- a/src/main-app.component.ts +++ b/src/main-app.component.ts @@ -1,12 +1,12 @@ import { Component, OnInit, AfterViewInit, Renderer, ViewChildren, QueryList, ElementRef} from '@angular/core'; -import {UhkConfiguration} from '../config-serializer/config-items/UhkConfiguration'; import {Layers} from '../config-serializer/config-items/Layers'; import {SvgKeyboardComponent} from './components/svg-keyboard.component'; import {SvgModule} from './components/svg-module.model'; import {DataProviderService} from './services/data-provider.service'; +import {UhkConfigurationService} from './services/uhk-configuration.service'; @Component({ selector: 'main-app', @@ -96,7 +96,8 @@ import {DataProviderService} from './services/data-provider.service'; } `], - directives: [SvgKeyboardComponent] + directives: [SvgKeyboardComponent], + providers: [UhkConfigurationService] }) export class MainAppComponent implements OnInit, AfterViewInit { @ViewChildren('baseButton,modButton,fnButton,mouseButton') @@ -115,7 +116,11 @@ export class MainAppComponent implements OnInit, AfterViewInit { private numAnimationInProgress: number; - constructor(private renderer: Renderer, private dps: DataProviderService) { + constructor( + private renderer: Renderer, + private dps: DataProviderService, + private uhkConfigurationService: UhkConfigurationService + ) { this.buttons = []; this.keyboards = []; this.selectedLayerIndex = -1; @@ -132,9 +137,7 @@ export class MainAppComponent implements OnInit, AfterViewInit { this.modules = svg.g[0].g.map(obj => new SvgModule(obj)); this.modules = [this.modules[1], this.modules[0]]; // TODO: remove if the svg will be correct - let uhkConfig: UhkConfiguration = new UhkConfiguration(); - uhkConfig.fromJsObject(this.dps.getUHKConfig()); - this.layers = uhkConfig.keyMaps.elements[0].layers; + this.layers = this.uhkConfigurationService.getUhkConfiguration().keyMaps.elements[0].layers; } diff --git a/src/services/mapper.service.ts b/src/services/mapper.service.ts index 0aa7350c..1b72ddad 100644 --- a/src/services/mapper.service.ts +++ b/src/services/mapper.service.ts @@ -125,7 +125,7 @@ export class MapperService { private initNameToFileNames(): void { this.nameToFileName = new Map(); this.nameToFileName.set('toggle', 'icon-kbd__fn--toggle'); + this.nameToFileName.set('switch-keymap', 'icon-kbd__mod--switch-layout'); } - } diff --git a/src/services/uhk-configuration.service.ts b/src/services/uhk-configuration.service.ts new file mode 100644 index 00000000..2b15e6cc --- /dev/null +++ b/src/services/uhk-configuration.service.ts @@ -0,0 +1,19 @@ +import { Injectable } from '@angular/core'; +import {DataProviderService} from './data-provider.service'; + +import {UhkConfiguration} from '../../config-serializer/config-items/UhkConfiguration'; + +@Injectable() +export class UhkConfigurationService { + + private configuration: UhkConfiguration; + + constructor(private dataProviderService: DataProviderService) { + this.configuration = new UhkConfiguration().fromJsObject(this.dataProviderService.getUHKConfig()); + } + + getUhkConfiguration(): UhkConfiguration { + return this.configuration; + } + +}