feat(device): Add 'Save to keyboard' button (#402)

* feat(device): Add 'Save to keyboard' button

Created a 'Progress Button' that have 2 state in progress or not.
Able to set different text for different state:
- baseText for normal state
- progressText for in progress state
close: #377

* fix 'Save to keyboard' button visibility in web version

* remove success notification when save to keyboard success

* feat(notifier): Turn off auto hide of the notifier

* feat(device): Show saved state of 'Save to keyboard button'

* style: Format import in app.component.ts

* feat(device): Auto hide 'Save to Keyboard' button

* fix(device): Fix saving animation

* fix(device): Fix saving animation

* fix(device): Fix tslint
This commit is contained in:
Róbert Kiss
2017-09-10 23:22:54 +00:00
committed by László Monda
parent c135aed7c9
commit 8d7269a998
16 changed files with 244 additions and 69 deletions
@@ -1,21 +1,34 @@
import { Injectable } from '@angular/core';
import { Router } from '@angular/router';
import { Action } from '@ngrx/store';
import { Action, Store } from '@ngrx/store';
import { Actions, Effect, toPayload } from '@ngrx/effects';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import 'rxjs/add/observable/empty';
import 'rxjs/add/observable/timer';
import 'rxjs/add/operator/do';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/mergeMap';
import 'rxjs/add/operator/withLatestFrom';
import { NotificationType, IpcResponse } from 'uhk-common';
import { ActionTypes, ConnectionStateChangedAction, PermissionStateChangedAction } from '../actions/device';
import {
ActionTypes,
ConnectionStateChangedAction, HideSaveToKeyboardButton,
PermissionStateChangedAction,
SaveToKeyboardSuccessAction,
SaveToKeyboardSuccessFailed
} from '../actions/device';
import { DeviceRendererService } from '../../services/device-renderer.service';
import { ShowNotificationAction } from '../actions/app';
import { AppState } from '../index';
import { UserConfiguration } from '../../config-serializer/config-items/user-configuration';
import { UhkBuffer } from '../../config-serializer/uhk-buffer';
@Injectable()
export class DeviceEffects {
@Effect({ dispatch: false })
@Effect({dispatch: false})
deviceConnectionStateChange$: Observable<Action> = this.actions$
.ofType(ActionTypes.CONNECTION_STATE_CHANGED)
.map(toPayload)
@@ -28,7 +41,7 @@ export class DeviceEffects {
}
});
@Effect({ dispatch: false })
@Effect({dispatch: false})
permissionStateChange$: Observable<Action> = this.actions$
.ofType(ActionTypes.PERMISSION_STATE_CHANGED)
.map(toPayload)
@@ -41,7 +54,7 @@ export class DeviceEffects {
}
});
@Effect({ dispatch: false })
@Effect({dispatch: false})
setPrivilegeOnLinux$: Observable<Action> = this.actions$
.ofType(ActionTypes.SET_PRIVILEGE_ON_LINUX)
.do(() => {
@@ -67,35 +80,52 @@ export class DeviceEffects {
];
});
@Effect({ dispatch: false })
@Effect({dispatch: false})
saveConfiguration$: Observable<Action> = this.actions$
.ofType(ActionTypes.SAVE_CONFIGURATION)
.map(toPayload)
.do((buffer: Buffer) => {
this.deviceRendererService.saveUserConfiguration(buffer);
});
.withLatestFrom(this.store)
.map(([action, state]) => state.userConfiguration)
.do((userConfiguration: UserConfiguration) => {
setTimeout(() => this.sendUserConfigToKeyboard(userConfiguration), 100);
})
.switchMap(() => Observable.empty());
@Effect()
saveConfigurationReply$: Observable<Action> = this.actions$
.ofType(ActionTypes.SAVE_CONFIGURATION_REPLY)
.map(toPayload)
.map((response: IpcResponse) => {
.mergeMap((response: IpcResponse) => {
if (response.success) {
return new ShowNotificationAction({
type: NotificationType.Success,
message: 'Save configuration successful.'
});
return [
new SaveToKeyboardSuccessAction()
];
}
return new ShowNotificationAction({
type: NotificationType.Error,
message: response.error.message
});
return [
new ShowNotificationAction({
type: NotificationType.Error,
message: response.error.message
}),
new SaveToKeyboardSuccessFailed()
];
});
@Effect()
autoHideSaveToKeyboardButton$: Observable<Action> = this.actions$
.ofType(ActionTypes.SAVE_TO_KEYBOARD_SUCCESS)
.switchMap(() => Observable.timer(1000)
.switchMap(() => Observable.of(new HideSaveToKeyboardButton()))
);
constructor(private actions$: Actions,
private router: Router,
private deviceRendererService: DeviceRendererService) {
private deviceRendererService: DeviceRendererService,
private store: Store<AppState>) {
}
private sendUserConfigToKeyboard(userConfiguration: UserConfiguration): void {
const uhkBuffer = new UhkBuffer();
userConfiguration.toBinary(uhkBuffer);
this.deviceRendererService.saveUserConfiguration(uhkBuffer.getBufferContent());
}
}
@@ -28,6 +28,7 @@ import { KeymapActions } from '../actions/keymap';
import { MacroActions } from '../actions/macro';
import { UndoUserConfigData } from '../../models/undo-user-config-data';
import { ShowNotificationAction, DismissUndoNotificationAction } from '../actions/app';
import { ShowSaveToKeyboardButtonAction } from '../actions/device';
@Injectable()
export class UserConfigEffects {
@@ -64,11 +65,16 @@ export class UserConfigEffects {
payload,
type: KeymapActions.UNDO_LAST_ACTION
}
})
}),
new ShowSaveToKeyboardButtonAction()
];
}
return [new SaveUserConfigSuccessAction(config), new DismissUndoNotificationAction()];
return [
new SaveUserConfigSuccessAction(config),
new DismissUndoNotificationAction(),
new ShowSaveToKeyboardButtonAction()
];
});
@Effect() undoUserConfig$: Observable<Action> = this.actions$