Add coverages of modules

src/components/keyboard.component.ts

@@ -10,7 +10,7 @@ import {Module, ModuleComponent} from './module';
         <svg xmlns="http://www.w3.org/2000/svg" [attr.viewBox]="viewBox" height="100%" width="100%">
             <svg:g [attr.transform]="transform">
                 <svg:g uhk-module *ngFor="#module of modules"
-                        [case]="module.case"
+                        [coverages]="module.coverages"
                         [keyboardKeys]="module.keyboardKeys"
                         [fill]="module.fill"
                         [attr.transform]="module.attributes.transform"

src/components/module.component.ts

@@ -7,6 +7,7 @@ import {KeyboardKeyComponent} from './keyboard-key.component';
     selector: 'g[uhk-module]',
     template:
     `
+        <svg:path *ngFor="#path of coverages" [attr.d]="path.$.d"/>
         <svg:g uhk-keyboard-key *ngFor="#key of keyboardKeys"
                 [id]="key.id" [fill]="key.fill"
                 [rx]="key.rx" [ry]="key.ry"
@@ -17,7 +18,7 @@ import {KeyboardKeyComponent} from './keyboard-key.component';
     directives: [KeyboardKeyComponent]
 })
 export class ModuleComponent implements OnInit {
-    @Input() case: any;
+    @Input() coverages: any[];
     @Input() keyboardKeys: KeyboardKey[];
     @Input() fill: string;
 

src/components/module.model.ts

@@ -1,14 +1,14 @@
 import {KeyboardKey} from './keyboard-key.model';
 
 export class Module {
-    private case: any;
+    private coverages: any[];
     private keyboardKeys: KeyboardKey[];
     private attributes: any;
 
     constructor(obj: { rect: any[], path: any[], $: Object }, fill?: string) {
         this.keyboardKeys = obj.rect.map(rect => rect.$);
         this.keyboardKeys.forEach(keyboardKey => keyboardKey.fill = fill ? fill : 'black');
-        this.case = obj.path[0].$;
+        this.coverages = obj.path;
         this.attributes = obj.$;
     }
 }