Bump version to 1.2.11 and update package.json

Summary:
- svg sprite generate with xmlns:xlink="http://www.w3.org/1999/xlink" namespace
- uhk-icon-agent-icon css class renamed to uhk-icon-pure-agent-icon because
  it collided with agent icon sprites
- added backspace and caps lock icons

CHANGELOG.md

@@ -6,6 +6,14 @@ The format is loosely based on [Keep a Changelog](http://keepachangelog.com/en/1
 
 Every Agent version includes the most recent firmware version. See the [firmware changelog](https://github.com/UltimateHackingKeyboard/firmware/blob/master/CHANGELOG.md).
 
+## [1.2.11] - 2018-10-03
+
+Firmware: 8.2.5 [[release](https://github.com/UltimateHackingKeyboard/firmware/releases/tag/v8.2.5)] | Device Protocol: 4.4.0 | User Config: 4.0.1 | Hardware Config: 1.0.0
+
+- Add backspace and caps lock icons which avoids the overlap of their old texts.
+- Fix right and middle mouse click macro actions which were exchanged.
+- Include Agent version to the firmware update log.
+
 ## [1.2.10] - 2018-09-24
 
 Firmware: 8.2.5 [[release](https://github.com/UltimateHackingKeyboard/firmware/releases/tag/v8.2.5)] | Device Protocol: 4.4.0 | User Config: 4.0.1 | Hardware Config: 1.0.0

ISSUE_TEMPLATE

@@ -0,0 +1 @@
+If you're using Karabiner Elements on your Mac, then stop here! Make sure to close Karabiner Elements, then try to reproduce the issue again, even if you think that Karabiner Elements shouldn't be the cause. Karabiner Elements is the source of numerous problems, and we don't want to receive any more reports it causes.

package.json

@@ -3,7 +3,7 @@
   "private": true,
   "author": "Ultimate Gadget Laboratories",
   "main": "electron/dist/electron-main.js",
-  "version": "1.2.10",
+  "version": "1.2.11",
   "firmwareVersion": "8.2.5",
   "deviceProtocolVersion": "4.4.0",
   "userConfigVersion": "4.0.1",
@@ -67,7 +67,7 @@
     "rimraf": "2.6.1",
     "standard-version": "4.2.0",
     "stylelint": "9.5.0",
-    "svg-sprite": "1.4.0",
+    "svg-sprite": "1.5.0",
     "ts-loader": "2.3.1",
     "ts-node": "7.0.1",
     "tslint": "5.9.1",

packages/uhk-agent/src/services/device.service.ts

@@ -9,7 +9,8 @@ import {
     IpcResponse,
     LogService,
     mapObjectToUserConfigBinaryBuffer,
-    SaveUserConfigurationData
+    SaveUserConfigurationData,
+    UpdateFirmwareData
 } from 'uhk-common';
 import { deviceConnectionStateComparer, snooze, UhkHidDevice, UhkOperations } from 'uhk-usb';
 import { Observable } from 'rxjs/Observable';
@@ -157,10 +158,12 @@ export class DeviceService {
 
     public async updateFirmware(event: Electron.Event, args?: Array<string>): Promise<void> {
         const response = new FirmwareUpgradeIpcResponse();
+        const data: UpdateFirmwareData = JSON.parse(args[0]);
 
         let firmwarePathData: TmpFirmware;
 
         try {
+            this.logService.debug('Agent version:', data.versionInformation.version);
             const hardwareModules = await this.getHardwareModules(false);
             this.logService.debug('Device right firmware version:', hardwareModules.rightModuleInfo.firmwareVersion);
             this.logService.debug('Device left firmware version:', hardwareModules.leftModuleInfo.firmwareVersion);
@@ -168,8 +171,8 @@ export class DeviceService {
             this.device.resetDeviceCache();
             this.stopPollTimer();
 
-            if (args && args.length > 0) {
+            if (data.firmware) {
-                firmwarePathData = await saveTmpFirmware(args[0]);
+                firmwarePathData = await saveTmpFirmware(data.firmware);
 
                 const packageJson = await getPackageJsonFromPathAsync(firmwarePathData.packageJsonPath);
                 this.logService.debug('New firmware version:', packageJson.firmwareVersion);

packages/uhk-agent/src/util/save-extract-firmware.ts

@@ -6,7 +6,7 @@ import * as decompressTarbz from 'decompress-tarbz2';
 
 import { TmpFirmware } from '../models/tmp-firmware';
 
-export async function saveTmpFirmware(data: string): Promise<TmpFirmware> {
+export async function saveTmpFirmware(data: Array<number>): Promise<TmpFirmware> {
     const tmpDirectory = dirSync();
     const zipFilePath = path.join(tmpDirectory.name, 'firmware.bz2');
 
@@ -21,10 +21,9 @@ export async function saveTmpFirmware(data: string): Promise<TmpFirmware> {
     };
 }
 
-function writeDataToFile(data: string, filePath: string): Promise<void> {
+function writeDataToFile(data: Array<number>, filePath: string): Promise<void> {
     return new Promise((resolve, reject) => {
-        const array: Array<number> = JSON.parse(data);
+        const buffer = new Buffer(data);
-        const buffer = new Buffer(array);
 
         fs.writeFile(filePath, buffer, err => {
             if (err) {

packages/uhk-common/src/config-serializer/config-items/macro-action/mouse-button-macro-action.ts

@@ -3,9 +3,9 @@ import { UhkBuffer } from '../../uhk-buffer';
 import { MacroAction, MacroActionId, MacroMouseSubAction, macroActionType } from './macro-action';
 
 export enum MouseButtons {
-    Left = 1 << 0,
+    Left = 0,
-    Middle = 1 << 1,
+    Right = 1,
-    Right = 1 << 2
+    Middle = 2
 }
 
 export interface JsObjectMouseButtonMacroAction {

packages/uhk-common/src/models/index.ts

@@ -8,3 +8,4 @@ export * from './device-connection-state';
 export * from './hardware-modules';
 export * from './hardware-module-info';
 export * from './save-user-configuration-data';
+export * from './update-firmware-data';

packages/uhk-common/src/models/update-firmware-data.ts

@@ -0,0 +1,6 @@
+import { VersionInformation } from './version-information';
+
+export interface UpdateFirmwareData {
+    versionInformation: VersionInformation;
+    firmware?: Array<number>;
+}

packages/uhk-web/src/app/components/agent/about/about.component.html

@@ -1,6 +1,6 @@
 <div class="row">
     <h1 class="col-xs-12 pane-title">
-        <i class="uhk-icon uhk-icon-agent-icon"></i>
+        <i class="uhk-icon uhk-icon-pure-agent-icon"></i>
         <span>About</span>
     </h1>
     <div class="col-xs-12">

packages/uhk-web/src/app/components/macro/action-editor/tab/mouse/macro-mouse.component.html

@@ -93,10 +93,17 @@
             <h4 *ngIf="activeTab === TabName.Hold">Hold mouse button</h4>
             <h4 *ngIf="activeTab === TabName.Release">Release mouse button</h4>
             <div class="btn-group">
-                <button *ngFor="let buttonLabel of buttonLabels; let buttonIndex = index"
+                <button class="btn btn-default"
-                        class="btn btn-default"
+                        [class.btn-primary]="hasButton(MouseButtons.Left)"
-                        [class.btn-primary]="hasButton(buttonIndex)"
+                        (click)="setMouseClick(MouseButtons.Left)">Left
-                        (click)="setMouseClick(buttonIndex)">{{buttonLabel}}
+                </button>
+                <button class="btn btn-default"
+                        [class.btn-primary]="hasButton(MouseButtons.Middle)"
+                        (click)="setMouseClick(MouseButtons.Middle)">Middle
+                </button>
+                <button class="btn btn-default"
+                        [class.btn-primary]="hasButton(MouseButtons.Right)"
+                        (click)="setMouseClick(MouseButtons.Right)">Right
                 </button>
             </div>
         </div>

packages/uhk-web/src/app/components/macro/action-editor/tab/mouse/macro-mouse.component.ts

@@ -1,10 +1,11 @@
 import { Component, Input, OnInit, ViewChild } from '@angular/core';
 
 import {
+    MacroMouseSubAction,
+    MouseButtons,
     MouseButtonMacroAction,
     MoveMouseMacroAction,
-    ScrollMouseMacroAction,
+    ScrollMouseMacroAction
-    MacroMouseSubAction
 } from 'uhk-common';
 import { Tab } from '../../../../popover/tab';
 import { MacroBaseComponent } from '../macro-base.component';
@@ -33,6 +34,7 @@ export class MacroMouseTabComponent extends MacroBaseComponent implements OnInit
     @ViewChild('tab') selectedTab: Tab;
 
     /* tslint:disable:variable-name: It is an enum type. So it can start with uppercase. */
+    MouseButtons = MouseButtons;
     TabName = TabName;
     /* tslint:enable:variable-name */
     activeTab: TabName;

packages/uhk-web/src/app/components/macro/item/macro-item.component.ts

@@ -5,6 +5,7 @@ import {
     KeyMacroAction,
     KeyModifiers,
     MacroAction,
+    MouseButtons,
     MouseButtonMacroAction,
     MoveMouseMacroAction,
     ScrollMouseMacroAction,
@@ -197,12 +198,11 @@ export class MacroItemComponent implements OnInit, OnChanges {
             this.title = 'Release mouse button: ';
         }
 
-        const buttonLabels: string[] = ['Left', 'Middle', 'Right'];
         const selectedButtons: boolean[] = action.getMouseButtons();
         const selectedButtonLabels: string[] = [];
         selectedButtons.forEach((isSelected, idx) => {
-            if (isSelected && buttonLabels[idx]) {
+            if (isSelected && MouseButtons[idx]) {
-                selectedButtonLabels.push(buttonLabels[idx]);
+                selectedButtonLabels.push(MouseButtons[idx]);
             }
         });
         this.title += selectedButtonLabels.join(', ');

packages/uhk-web/src/app/components/side-menu/side-menu.component.html

@@ -131,7 +131,7 @@
     </li>
     <li class="sidebar__level-0--item" [routerLinkActive]="['active']">
         <div class="sidebar__level-0">
-            <i class="uhk-icon uhk-icon-agent-icon"></i> Agent
+            <i class="uhk-icon uhk-icon-pure-agent-icon"></i> Agent
             <i class="fa fa-chevron-up pull-right"
                (click)="toggleHide($event, 'agent')"></i>
         </div>

packages/uhk-web/src/app/services/device-renderer.service.ts

@@ -1,7 +1,14 @@
 import { Injectable, NgZone } from '@angular/core';
 import { Action, Store } from '@ngrx/store';
 
-import { DeviceConnectionState, IpcEvents, IpcResponse, LogService, SaveUserConfigurationData } from 'uhk-common';
+import {
+    DeviceConnectionState,
+    IpcEvents,
+    IpcResponse,
+    LogService,
+    SaveUserConfigurationData,
+    UpdateFirmwareData
+} from 'uhk-common';
 import { AppState } from '../store';
 import { IpcCommonRenderer } from './ipc-common-renderer';
 import {
@@ -34,12 +41,8 @@ export class DeviceRendererService {
         this.ipcRenderer.send(IpcEvents.device.loadConfigurations);
     }
 
-    updateFirmware(data?: Array<number>): void {
+    updateFirmware(data: UpdateFirmwareData): void {
-        if (data) {
         this.ipcRenderer.send(IpcEvents.device.updateFirmware, JSON.stringify(data));
-        } else {
-            this.ipcRenderer.send(IpcEvents.device.updateFirmware);
-        }
     }
 
     startConnectionPoller(): void {

packages/uhk-web/src/app/services/mapper.service.ts

@@ -337,6 +337,8 @@ export class MapperService {
 
     private initScancodeIcons(): void {
         this.basicScancodeIcons = new Map<number, string>();
+        this.basicScancodeIcons.set(42, 'icon-kbd__backspace');
+        this.basicScancodeIcons.set(57, 'icon-kbd__caps-lock');
         this.basicScancodeIcons.set(79, 'icon-kbd__mod--arrow-right');
         this.basicScancodeIcons.set(80, 'icon-kbd__mod--arrow-left');
         this.basicScancodeIcons.set(81, 'icon-kbd__mod--arrow-down');

packages/uhk-web/src/app/store/effects/device.ts

@@ -50,6 +50,7 @@ import {
 } from '../actions/user-config';
 import { DefaultUserConfigurationService } from '../../services/default-user-configuration.service';
 import { DataStorageRepositoryService } from '../../services/datastorage-repository.service';
+import { getVersions } from '../../util';
 
 @Injectable()
 export class DeviceEffects {
@@ -201,12 +202,17 @@ export class DeviceEffects {
 
     @Effect({dispatch: false}) updateFirmware$ = this.actions$
         .ofType<UpdateFirmwareAction>(ActionTypes.UPDATE_FIRMWARE)
-        .do(() => this.deviceRendererService.updateFirmware());
+        .do(() => this.deviceRendererService.updateFirmware({
+            versionInformation: getVersions()
+        }));
 
     @Effect({dispatch: false}) updateFirmwareWith$ = this.actions$
         .ofType<UpdateFirmwareWithAction>(ActionTypes.UPDATE_FIRMWARE_WITH)
         .map(action => action.payload)
-        .do(data => this.deviceRendererService.updateFirmware(data));
+        .do(data => this.deviceRendererService.updateFirmware({
+            versionInformation: getVersions(),
+            firmware: data
+        }));
 
     @Effect() updateFirmwareReply$ = this.actions$
         .ofType<UpdateFirmwareReplyAction>(ActionTypes.UPDATE_FIRMWARE_REPLY)

packages/uhk-web/src/styles.scss

@@ -16,6 +16,10 @@ html, body {
     height: 100%;
 }
 
+.uhk-icon-pure-agent-icon {
+    background: url('assets/images/agent-icon.png') no-repeat;
+}
+
 .uhk-icon {
     display: inline-block;
     width: 1em;

packages/uhk-web/src/styles/uhk-icons/uhk-css.svg

@@ -1 +1 @@
-<?xml version="1.0" encoding="utf-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="31" height="16" viewBox="0 0 31 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><svg width="16" height="16" viewBox="0 0 16 16" id="icon-0401-usb-stick" xmlns="http://www.w3.org/2000/svg"><path d="M6.5 2a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 1 0v-1a.5.5 0 0 0-.5-.5zM8.5 2a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 1 0v-1a.5.5 0 0 0-.5-.5z"/><path d="M11.5 5H11V.5a.5.5 0 0 0-.5-.5h-6a.5.5 0 0 0-.5.5V5h-.5a.5.5 0 0 0-.5.5v9.375c1 1.5 8 1.5 9 0V5.5a.5.5 0 0 0-.5-.5zM5 13.5a.5.5 0 0 1-1 0v-6a.5.5 0 0 1 1 0v6zM10 5H5V1h5v4z"/></svg><svg width="15" height="15" viewBox="0 0 15 15" id="icon-agent-icon" x="16" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(12 0 0 -12 0 6)" id="abb"><stop offset="0" stop-color="#85878d"/><stop offset=".001" stop-color="#85878d"/><stop offset=".001" stop-color="#5d5f63"/><stop offset=".526" stop-color="#ccc"/><stop offset="1" stop-color="#5d5c62"/></linearGradient><linearGradient id="aba" gradientTransform="matrix(12 0 0 -12 0 6)" gradientUnits="userSpaceOnUse" x2="1"><stop offset="0" stop-color="#85878d"/><stop offset=".001" stop-color="#85878d"/><stop offset=".001" stop-color="#85878d"/><stop offset=".495" stop-color="#ccc"/><stop offset="1" stop-color="#5d5c62"/></linearGradient><clipPath id="abc"><path d="M2.398 12A2.393 2.393 0 0 1 0 9.602V2.398A2.393 2.393 0 0 1 2.398 0h7.203A2.394 2.394 0 0 1 12 2.398v7.204A2.394 2.394 0 0 1 9.601 12H2.398zM.602 7.199v1.199c0 .454.329.575.5.602.054.008.097 0 .097 0h3.602c.301 0 .597-.301.597-.301s.301-.301.602-.301.602.301.602.301.296.301.597.301h3.602c.597 0 .597-.602.597-.602V7.199c0-1.801-1.199-1.801-1.199-1.801h-3c-.301 0-.597.903-.597.903s-.301.898-.602.898-.602-.898-.602-.898-.296-.903-.597-.903h-3s-1.199 0-1.199 1.801"/></clipPath><linearGradient gradientUnits="userSpaceOnUse" x2="11.746" y1="11.542" x1=".915" id="abd" xlink:href="#aba"/><linearGradient y2="-.051" x2="12" y1="11.898" x1=".102" gradientUnits="userSpaceOnUse" id="abe" xlink:href="#abb"/></defs><g transform="matrix(1.25 0 0 -1.25 0 15)"><path d="M11.473 5.117H.416v4.266h11.057V5.117z" fill="#343434"/><g clip-path="url(#abc)" fill="url(#abd)"><path d="M2.398 12A2.393 2.393 0 0 1 0 9.602V2.398A2.393 2.393 0 0 1 2.398 0h7.203A2.394 2.394 0 0 1 12 2.398v7.204A2.394 2.394 0 0 1 9.601 12H2.398zM.602 7.199v1.199c0 .454.329.575.5.602.054.008.097 0 .097 0h3.602c.301 0 .597-.301.597-.301s.301-.301.602-.301.602.301.602.301.296.301.597.301h3.602c.597 0 .597-.602.597-.602V7.199c0-1.801-1.199-1.801-1.199-1.801h-3c-.301 0-.597.903-.597.903s-.301.898-.602.898-.602-.898-.602-.898-.296-.903-.597-.903h-3s-1.199 0-1.199 1.801" fill="url(#abe)"/></g></g></svg></svg>
+<?xml version="1.0" encoding="utf-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="31" height="16" viewBox="0 0 31 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><svg width="16" height="16" viewBox="0 0 16 16" id="icon-0401-usb-stick" xmlns="http://www.w3.org/2000/svg"><path d="M6.5 2a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 1 0v-1a.5.5 0 0 0-.5-.5zM8.5 2a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 1 0v-1a.5.5 0 0 0-.5-.5z"/><path d="M11.5 5H11V.5a.5.5 0 0 0-.5-.5h-6a.5.5 0 0 0-.5.5V5h-.5a.5.5 0 0 0-.5.5v9.375c1 1.5 8 1.5 9 0V5.5a.5.5 0 0 0-.5-.5zM5 13.5a.5.5 0 0 1-1 0v-6a.5.5 0 0 1 1 0v6zM10 5H5V1h5v4z"/></svg><svg width="15" height="15" viewBox="0 0 15 15" id="icon-agent-icon" x="16" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(12 0 0 -12 0 6)" spreadMethod="pad" id="bb"><stop offset="0" stop-color="#85878d"/><stop offset=".001" stop-color="#85878d"/><stop offset=".001" stop-color="#5d5f63"/><stop offset=".526" stop-color="#ccc"/><stop offset="1" stop-color="#5d5c62"/></linearGradient><linearGradient id="ba" spreadMethod="pad" gradientTransform="matrix(12 0 0 -12 0 6)" gradientUnits="userSpaceOnUse" y2="0" x2="1" y1="0" x1="0"><stop offset="0" stop-color="#85878d"/><stop offset=".001" stop-color="#85878d"/><stop offset=".001" stop-color="#85878d"/><stop offset=".495" stop-color="#ccc"/><stop offset="1" stop-color="#5d5c62"/></linearGradient><clipPath clipPathUnits="userSpaceOnUse" id="bc"><path d="M2.398 12A2.393 2.393 0 0 1 0 9.602V2.398A2.393 2.393 0 0 1 2.398 0h7.203A2.394 2.394 0 0 1 12 2.398v7.204A2.394 2.394 0 0 1 9.601 12H2.398zM.602 7.199v1.199c0 .454.329.575.5.602.054.008.097 0 .097 0h3.602c.301 0 .597-.301.597-.301s.301-.301.602-.301.602.301.602.301.296.301.597.301h3.602c.597 0 .597-.602.597-.602V7.199c0-1.801-1.199-1.801-1.199-1.801h-3c-.301 0-.597.903-.597.903s-.301.898-.602.898-.602-.898-.602-.898-.296-.903-.597-.903h-3s-1.199 0-1.199 1.801"/></clipPath><linearGradient gradientUnits="userSpaceOnUse" y2="0" x2="11.746" y1="11.542" x1=".915" id="bd" xlink:href="#ba"/><linearGradient y2="-.051" x2="12" y1="11.898" x1=".102" gradientUnits="userSpaceOnUse" id="be" xlink:href="#bb"/></defs><path d="M14.341 8.604H.52V3.27h13.821v5.333z" fill="#343434"/><g clip-path="url(#bc)" fill="url(#bd)" transform="matrix(1.25 0 0 -1.25 0 15)"><path d="M2.398 12A2.393 2.393 0 0 1 0 9.602V2.398A2.393 2.393 0 0 1 2.398 0h7.203A2.394 2.394 0 0 1 12 2.398v7.204A2.394 2.394 0 0 1 9.601 12H2.398zM.602 7.199v1.199c0 .454.329.575.5.602.054.008.097 0 .097 0h3.602c.301 0 .597-.301.597-.301s.301-.301.602-.301.602.301.602.301.296.301.597.301h3.602c.597 0 .597-.602.597-.602V7.199c0-1.801-1.199-1.801-1.199-1.801h-3c-.301 0-.597.903-.597.903s-.301.898-.602.898-.602-.898-.602-.898-.296-.903-.597-.903h-3s-1.199 0-1.199 1.801" fill="url(#be)"/></g></svg></svg>

packages/uhk-web/src/styles/uhk-icons/uhk-icon.scss

@@ -8,5 +8,6 @@
 }
 
 .uhk-icon-agent-icon {
-    background: url('assets/images/agent-icon.png') no-repeat;
+    @extend %svg-common;
+    background-position: 100% 0;
 }

scripts/generate-svg-sprites.js

@@ -19,6 +19,12 @@ let config = {
             'sprite': 'compiled_sprite.svg',
             bust: false
         }
+    },
+    svg: { // General options for created SVG files
+        namespaceIDs: true,
+        rootAttributes: {
+            "xmlns:xlink":"http://www.w3.org/1999/xlink"
+        }
     }
 };