From 064d2eb29a8a65568992ac8522f89668d4d7e803 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Farkas=20J=C3=B3zsef?= <fjozsef001@gmail.com>
Date: Sun, 20 Nov 2016 21:04:39 +0100
Subject: [PATCH] Remove placeholder in keymap-tab

---
 .../tab/keymap/keymap-tab.component.html      | 37 +++++++++++--------
 .../tab/keymap/keymap-tab.component.scss      |  4 ++
 .../tab/keymap/keymap-tab.component.ts        | 12 ++----
 3 files changed, 28 insertions(+), 25 deletions(-)

diff --git a/src/components/popover/tab/keymap/keymap-tab.component.html b/src/components/popover/tab/keymap/keymap-tab.component.html
index 8dd1adc7..1846dd08 100644
--- a/src/components/popover/tab/keymap/keymap-tab.component.html
+++ b/src/components/popover/tab/keymap/keymap-tab.component.html
@@ -1,17 +1,22 @@
-<div>
-    <b>Switch to keymap:</b>
-    <select2
-            [data]="keymapOptions"
-            [value]="selectedKeymap?.abbreviation || -1"
-            (valueChanged)="onChange($event)"
-            [width]="'100%'"
-    ></select2>
-</div>
-<div>
-    <div class="empty" *ngIf="!selectedKeymap?.abbreviation">
-        <img src="./images/base-layer--blank.svg">
+<template [ngIf]="keymapOptions.length === 0">
+    <span> No keymaps are available to choose from. Create a keymap first! </span>
+</template>
+<template [ngIf]="keymapOptions.length > 0">
+    <div>
+        <b>Switch to keymap:</b>
+        <select2
+                [data]="keymapOptions"
+                [value]="selectedKeymap?.abbreviation || -1"
+                (valueChanged)="onChange($event)"
+                [width]="'100%'"
+        ></select2>
     </div>
-    <svg-keyboard *ngIf="selectedKeymap?.abbreviation"
-                [moduleConfig]="selectedKeymap.layers[0].modules">
-    </svg-keyboard>
-</div>
\ No newline at end of file
+    <div>
+        <div class="empty" *ngIf="!selectedKeymap?.abbreviation">
+            <img src="./images/base-layer--blank.svg">
+        </div>
+        <svg-keyboard *ngIf="selectedKeymap?.abbreviation"
+                    [moduleConfig]="selectedKeymap.layers[0].modules">
+        </svg-keyboard>
+    </div>
+</template>
\ No newline at end of file
diff --git a/src/components/popover/tab/keymap/keymap-tab.component.scss b/src/components/popover/tab/keymap/keymap-tab.component.scss
index b1efee02..bb37e4e0 100644
--- a/src/components/popover/tab/keymap/keymap-tab.component.scss
+++ b/src/components/popover/tab/keymap/keymap-tab.component.scss
@@ -2,6 +2,10 @@
     display: flex;
     flex-direction: column;
 
+    > span {
+        text-align: center;
+    }
+
     > div {
         display: flex;
         margin-top: 2px;
diff --git a/src/components/popover/tab/keymap/keymap-tab.component.ts b/src/components/popover/tab/keymap/keymap-tab.component.ts
index a0ad45be..f3e5495f 100644
--- a/src/components/popover/tab/keymap/keymap-tab.component.ts
+++ b/src/components/popover/tab/keymap/keymap-tab.component.ts
@@ -31,15 +31,9 @@ export class KeymapTabComponent implements OnInit, Tab {
                     text: keymap.name
                 };
             });
-
-        this.keymapOptions = [
-            {
-                id: '-1',
-                text: 'Switch to keymap'
-            },
-            ...this.keymapOptions
-        ];
-
+        if (this.keymaps.length > 0) {
+            this.selectedKeymap = this.keymaps[0];
+        }
         this.fromKeyAction(this.defaultKeyAction);
     }