Remapping support for tabs

src/components/popover/tab/keymap-tab.component.ts

@@ -3,6 +3,8 @@ import { Component, OnInit } from '@angular/core';
 import {UhkConfigurationService} from '../../../services/uhk-configuration.service';
 import {Keymap} from '../../../../config-serializer/config-items/Keymap';
 import {SvgKeyboardComponent} from '../../svg-keyboard.component';
+import {KeyActionSaver} from '../key-action-saver';
+import {SwitchKeymapAction} from '../../../../config-serializer/config-items/SwitchKeymapAction';
 
 @Component({
     moduleId: module.id,
@@ -28,7 +30,7 @@ import {SvgKeyboardComponent} from '../../svg-keyboard.component';
     styles: [require('./keymap-tab.component.scss')],
     directives: [SvgKeyboardComponent]
 })
-export class KeymapTabComponent implements OnInit {
+export class KeymapTabComponent implements OnInit, KeyActionSaver {
 
     private keymaps: Keymap[];
     private selectedKeymapIndex: number;
@@ -40,4 +42,17 @@ export class KeymapTabComponent implements OnInit {
 
     ngOnInit() { }
 
+    keyActionValid(): boolean {
+        return this.selectedKeymapIndex !== -1;
+    }
+
+    toKeyAction(): SwitchKeymapAction {
+        if (!this.keyActionValid()) {
+            throw new Error('KeyAction is not valid. No selected keymap!');
+        }
+        let keymapAction = new SwitchKeymapAction();
+        keymapAction.keymapId = this.keymaps[this.selectedKeymapIndex].id;
+        return keymapAction;
+    }
+
 }

src/components/popover/tab/keypress-tab.component.ts

@@ -2,9 +2,11 @@ import { Component, OnInit } from '@angular/core';
 
 import { CaptureKeystrokeButtonComponent } from '../widgets/capture-keystroke-button.component';
 
+import { KeyAction } from '../../../../config-serializer/config-items/KeyAction';
 import { KeystrokeAction } from '../../../../config-serializer/config-items/KeystrokeAction';
 import { KeystrokeModifiersAction } from '../../../../config-serializer/config-items/KeystrokeModifiersAction';
 import { KeystrokeWithModifiersAction } from '../../../../config-serializer/config-items/KeystrokeWithModifiersAction';
+import { KeyActionSaver } from '../key-action-saver';
 
 @Component({
     moduleId: module.id,
@@ -45,7 +47,7 @@ import { KeystrokeWithModifiersAction } from '../../../../config-serializer/conf
     `,
     directives: [CaptureKeystrokeButtonComponent]
 })
-export class KeypressTabComponent implements OnInit {
+export class KeypressTabComponent implements OnInit, KeyActionSaver {
     private leftModifiers: string[];
     private rightModifiers: string[];
 
@@ -63,4 +65,11 @@ export class KeypressTabComponent implements OnInit {
         return;
     }
 
+    keyActionValid(): boolean {
+        return false;
+    }
+
+    toKeyAction(): KeyAction {
+        return undefined;
+    }
 }

src/components/popover/tab/layer-tab.component.ts

@@ -1,28 +1,48 @@
 import { Component, OnInit } from '@angular/core';
 
+import { LayerName, SwitchLayerAction } from '../../../../config-serializer/config-items/SwitchLayerAction';
+import { KeyActionSaver } from '../key-action-saver';
+
 @Component({
     moduleId: module.id,
     selector: 'layer-tab',
     template:
     `
-        <select>
-            <option> Activate </option>
-            <option> Toggle </option>
+        <select [(ngModel)]="toggle">
+            <option [ngValue]="false"> Activate </option>
+            <option [ngValue]="true"> Toggle </option>
         </select>
         <span>the</span>
-        <select>
-            <option> Mod </option>
-            <option> Fn </option>
-            <option> Mouse </option>
+        <select [(ngModel)]="layer">
+            <option [ngValue]="0"> Mod </option>
+            <option [ngValue]="1"> Fn </option>
+            <option [ngValue]="2"> Mouse </option>
         </select>
         <span>
         layer by holding this key.
         </span>
     `
 })
-export class LayerTabComponent implements OnInit {
-    constructor() { }
+export class LayerTabComponent implements OnInit, KeyActionSaver {
+    private toggle: boolean;
+    private layer: LayerName;
+
+    constructor() {
+        this.toggle = false;
+        this.layer = LayerName.mod;
+    }
 
     ngOnInit() { }
 
+    keyActionValid(): boolean {
+        return true;
+    }
+
+    toKeyAction(): SwitchLayerAction {
+        let keyAction = new SwitchLayerAction();
+        keyAction.isLayerToggleable = this.toggle;
+        keyAction.layer = this.layer;
+        return keyAction;
+    }
+
 }

src/components/popover/tab/macro-tab.component.ts

@@ -1,5 +1,8 @@
 import { Component, OnInit } from '@angular/core';
 
+import { KeyActionSaver } from '../key-action-saver';
+import { KeyAction } from '../../../../config-serializer/config-items/KeyAction';
+
 @Component({
     moduleId: module.id,
     selector: 'macro-tab',
@@ -8,9 +11,17 @@ import { Component, OnInit } from '@angular/core';
         Macro
     `
 })
-export class MacroTabComponent implements OnInit {
+export class MacroTabComponent implements OnInit, KeyActionSaver {
     constructor() { }
 
     ngOnInit() { }
 
+    keyActionValid(): boolean {
+        return false;
+    }
+
+    toKeyAction(): KeyAction {
+        return undefined;
+    }
+
 }

src/components/popover/tab/mouse-tab.component.ts

@@ -1,5 +1,8 @@
 import { Component, OnInit } from '@angular/core';
 
+import { KeyActionSaver } from '../key-action-saver';
+import { KeyAction } from '../../../../config-serializer/config-items/KeyAction';
+
 @Component({
     moduleId: module.id,
     selector: 'mouse-tab',
@@ -16,11 +19,19 @@ import { Component, OnInit } from '@angular/core';
         <div class="details">
         </div>
     `,
-    styles: [ require('./mouse-tab.component.scss') ]
+    styles: [require('./mouse-tab.component.scss')]
 })
-export class MouseTabComponent implements OnInit {
+export class MouseTabComponent implements OnInit, KeyActionSaver {
     constructor() { }
 
     ngOnInit() { }
 
+    keyActionValid(): boolean {
+        return false;
+    }
+
+    toKeyAction(): KeyAction {
+        return undefined;
+    }
+
 }

src/components/popover/tab/none-tab.component.ts

@@ -1,5 +1,8 @@
 import { Component, OnInit } from '@angular/core';
 
+import { KeyActionSaver } from '../key-action-saver';
+import { NoneAction } from '../../../../config-serializer/config-items/NoneAction';
+
 @Component({
     moduleId: module.id,
     selector: 'none-tab',
@@ -13,9 +16,17 @@ import { Component, OnInit } from '@angular/core';
         }
     `]
 })
-export class NoneTabComponent implements OnInit {
+export class NoneTabComponent implements OnInit, KeyActionSaver {
     constructor() { }
 
     ngOnInit() { }
 
+    keyActionValid(): boolean {
+        return true;
+    }
+
+    toKeyAction(): NoneAction {
+        return new NoneAction();
+    }
+
 }