Add keymap page (#80)

src/components/svg/keyboard/svg-keyboard.component.html

@@ -5,7 +5,8 @@
                 [keyboardKeys]="module.keyboardKeys"
                 [attr.transform]="module.attributes.transform"
                 [keyActions]="moduleConfig[i].keyActions.elements"
-                (editKeyActionRequest)="onEditKeyActionRequest(i, $event)"
+                (keyClick)="onKeyClick(i, $event)"
+                (keyHover)="onKeyHover($event.index, $event.event, $event.over, i)"
         />
     </svg:g>
 </svg>

src/components/svg/keyboard/svg-keyboard.component.ts

@@ -13,6 +13,7 @@ import {DataProviderService} from '../../../services/data-provider.service';
 export class SvgKeyboardComponent implements OnInit {
     @Input() moduleConfig: Module[];
     @Output() keyClick = new EventEmitter();
+    @Output() keyHover = new EventEmitter();
 
     private modules: SvgModule[];
     private svgAttributes: { viewBox: string, transform: string, fill: string };
@@ -26,11 +27,20 @@ export class SvgKeyboardComponent implements OnInit {
         this.modules = this.dps.getSvgModules();
     }
 
-    onEditKeyActionRequest(moduleId: number, keyId: number): void {
+    onKeyClick(moduleId: number, keyId: number): void {
         this.keyClick.emit({
             moduleId,
             keyId
         });
     }
 
+    onKeyHover(keyId: number, event: MouseEvent, over: boolean, moduleId: number): void {
+        this.keyHover.emit({
+            moduleId,
+            event,
+            over,
+            keyId
+        });
+    }
+
 }