refactore: create feature modules (#387)

* add @angular/cli to the project

* increase nodejs version -> 8.2.1

* add lerna

* merge web and shared module

* move electron module into packages as uhk-agent

Electron agent functionality is not working

* delete symlinker

* convert private properties to public of component if used in html

* revert uhk-message.component

* fix component path

* fix the correct name of the uhk-message.component.scss

* building web and electron module

* delete uhk-renderer package

* handle device connect disconnect state

* add privilege detection

* fix set privilege functionality

* turn back download keymap functionality

* add bootstrap, select2 js and fix null pointer exception

* turn back upload data to keyboard

* fix send keymap

* fix test-serializer

* add missing package.json

* merging

* fix appveyor build

* fix linting

* turn back electron storage service

* commit the missing electron-datastorage-repository

* update node to 8.3.0 in .nvmrc and log node version in appveyor build

* set exact version number in appveyor build

* vertical align privilege and missing device components

* set back node version to 8 in appveyor

* move node-usb dependency from usb dir to root

maybe it is fix the appveyor build

* revert usb to root

* fix electron builder script

* fix electron builder script

* turn off electron devtools

* remove CTRL+U functionality

* fix CTRL+o

* fix lint error

* turnoff store freeze

* start process when got `Error: EPERM: operation not permitted` error

* move files from root usb dir -> packages/usb

packages/uhk-web/src/app/components/popover/popover.component.html

@@ -0,0 +1,82 @@
+<div class="popover"
+     #popover
+     [@popover]="animationState"
+     [ngClass]="{'leftArrow': leftArrow, 'rightArrow': rightArrow}"
+     [style.top.px]="topPosition"
+     [style.left.px]="leftPosition"
+>
+    <div class="arrowCustom"></div>
+    <div class="popover-title menu-tabs">
+        <ul class="nav nav-tabs popover-menu">
+            <li #keypress [class.active]="activeTab === tabName.Keypress" (click)="selectTab(tabName.Keypress)">
+                <a class="menu-tabs--item">
+                    <i class="fa fa-keyboard-o"></i>
+                    <span>Keypress</span>
+                </a>
+            </li>
+            <li #layer [class.active]="activeTab === tabName.Layer" (click)="selectTab(tabName.Layer)">
+                <a class="menu-tabs--item">
+                    <i class="fa fa-clone"></i>
+                    <span>Layer</span>
+                </a>
+            </li>
+            <li #mouse [class.active]="activeTab === tabName.Mouse" (click)="selectTab(tabName.Mouse)">
+                <a class="menu-tabs--item">
+                    <i class="fa fa-mouse-pointer"></i>
+                    <span>Mouse</span>
+                </a>
+            </li>
+            <li #macro [class.active]="activeTab === tabName.Macro" (click)="selectTab(tabName.Macro)">
+                <a class="menu-tabs--item">
+                    <i class="fa fa-play"></i>
+                    <span>Macro</span>
+                </a>
+            </li>
+            <li #keymap [class.active]="activeTab === tabName.Keymap" (click)="selectTab(tabName.Keymap)">
+                <a class="menu-tabs--item">
+                    <i class="fa fa-keyboard-o"></i>
+                    <span>Keymap</span>
+                </a>
+            </li>
+            <li #none [class.active]="activeTab === tabName.None" (click)="selectTab(tabName.None)">
+                <a class="menu-tabs--item">
+                    <i class="fa fa-ban"></i>
+                    <span>None</span>
+                </a>
+            </li>
+        </ul>
+    </div>
+    <div [ngSwitch]="activeTab">
+        <keypress-tab #tab *ngSwitchCase="tabName.Keypress" class="popover-content"
+                      [defaultKeyAction]="defaultKeyAction"
+                      [longPressEnabled]="true"
+                      (validAction)="keyActionValid=$event"
+        ></keypress-tab>
+        <layer-tab #tab *ngSwitchCase="tabName.Layer" class="popover-content"
+                   [defaultKeyAction]="defaultKeyAction"
+                   [currentLayer]="currentLayer"
+                   (validAction)="keyActionValid=$event"
+        ></layer-tab>
+        <mouse-tab #tab *ngSwitchCase="tabName.Mouse" class="popover-content"
+                   [defaultKeyAction]="defaultKeyAction"
+                   (validAction)="keyActionValid=$event"
+        ></mouse-tab>
+        <macro-tab #tab *ngSwitchCase="tabName.Macro" class="popover-content"
+                   [defaultKeyAction]="defaultKeyAction"
+                   (validAction)="keyActionValid=$event"
+        ></macro-tab>
+        <keymap-tab #tab *ngSwitchCase="tabName.Keymap" class="popover-content"
+                    [defaultKeyAction]="defaultKeyAction"
+                    [keymaps]="keymaps$ | async"
+                    (validAction)="keyActionValid=$event"
+        ></keymap-tab>
+        <none-tab #tab *ngSwitchCase="tabName.None" class="popover-content"
+                  (validAction)="keyActionValid=$event"
+        ></none-tab>
+    </div>
+    <div class="popover-action">
+        <button class="btn btn-sm btn-default" type="button" (click)="onCancelClick()"> Cancel </button>
+        <button class="btn btn-sm btn-primary" [class.disabled]="!keyActionValid" type="button" (click)="onRemapKey()"> Remap Key </button>
+    </div>
+</div>
+<div class="popover-overlay" [class.display]="visible" (click)="onOverlay()"></div>