uhk/agent
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

refactor: Create uhk-header component (#354)

Browse Source 
Create a header wrapper component that will contains the undo
notification component.
This commit is contained in:
Róbert Kiss
2017-07-15 14:41:06 +02:00
committed by László Monda
parent 3b0540f0d4
commit 131fdea0c5
7 changed files with 89 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
electron/src/app.module.ts
View File

@@ -105,7 +105,8 @@ import { ElectronErrorHandlerService } from './services/electron-error-handler.s
import { AppUpdateRendererService } from './services/app-update-renderer.service'; import { AppUpdateRendererService } from './services/app-update-renderer.service';
import { reducer } from './store'; import { reducer } from './store';
import { AutoUpdateSettings } from './shared/components/auto-update-settings/auto-update-settings'; import { AutoUpdateSettings } from './shared/components/auto-update-settings/auto-update-settings';
import { angularNotifierConfig } from '../../shared/src/models/angular-notifier-config'; import { angularNotifierConfig } from './shared/models/angular-notifier-config';
import { UhkHeader } from './shared/components/uhk-header/uhk-header';
@NgModule({ @NgModule({
declarations: [ declarations: [
@@ -163,7 +164,8 @@ import { angularNotifierConfig } from '../../shared/src/models/angular-notifier-
TooltipDirective, TooltipDirective,
SafeStylePipe, SafeStylePipe,
UpdateAvailableComponent, UpdateAvailableComponent,
AutoUpdateSettings AutoUpdateSettings,
UhkHeader
], ],
imports: [ imports: [
BrowserModule, BrowserModule,

79
shared/src/components/keymap/header/keymap-header.component.html
View File

@@ -1,39 +1,42 @@
<div class="row"> <uhk-header>
<h1 class="col-xs-12 pane-title"> <div class="row">
<i class="fa fa-keyboard-o"></i> <h1 class="col-xs-12 pane-title">
<input #name cancelable <i class="fa fa-keyboard-o"></i>
class="keymap__name pane-title__name" <input #name cancelable
type="text" class="keymap__name pane-title__name"
value="{{ keymap.name }}" type="text"
(change)="editKeymapName($event.target.value)" value="{{ keymap.name }}"
(keyup.enter)="name.blur()" (change)="editKeymapName($event.target.value)"
/> keymap (keyup.enter)="name.blur()"
(<input #abbr cancelable /> keymap
class="keymap__abbrev pane-title__abbrev" (<input #abbr cancelable
type="text" class="keymap__abbrev pane-title__abbrev"
value="{{ keymap.abbreviation }}" type="text"
(change)="editKeymapAbbr($event.target.value)" value="{{ keymap.abbreviation }}"
(keyup.enter)="abbr.blur()" (change)="editKeymapAbbr($event.target.value)"
[attr.maxLength]="3" (keyup.enter)="abbr.blur()"
[attr.maxLength]="3"
/>) />)
<i class="fa keymap__is-default" <i class="fa keymap__is-default"
[ngClass]="{'fa-star-o': !keymap.isDefault, 'fa-star': keymap.isDefault}" [ngClass]="{'fa-star-o': !keymap.isDefault, 'fa-star': keymap.isDefault}"
[title]="starTitle" [title]="starTitle"
(click)="setDefault()" (click)="setDefault()"
></i> ></i>
<i class="glyphicon glyphicon-trash keymap__remove pull-right" [title]="trashTitle" <i class="glyphicon glyphicon-trash keymap__remove pull-right" [title]="trashTitle"
[class.disabled]="!deletable" [class.disabled]="!deletable"
data-toggle="tooltip" data-toggle="tooltip"
data-placement="left" data-placement="left"
data-original-title="Remove keymap" data-original-title="Remove keymap"
(click)="removeKeymap()" (click)="removeKeymap()"
></i> ></i>
<i class="fa fa-files-o keymap__duplicate pull-right" title="" <i class="fa fa-files-o keymap__duplicate pull-right" title=""
data-toggle="tooltip" data-toggle="tooltip"
data-placement="left" data-placement="left"
data-original-title="Duplicate keymap" data-original-title="Duplicate keymap"
(click)="duplicateKeymap()" (click)="duplicateKeymap()"
></i> ></i>
<i class="fa fa-download keymap__download pull-right" title="Download keymap" (click)="onDownloadIconClick()"></i> <i class="fa fa-download keymap__download pull-right" title="Download keymap"
</h1> (click)="onDownloadIconClick()"></i>
</div> </h1>
</div>
</uhk-header>

50
shared/src/components/macro/header/macro-header.component.html
View File

@@ -1,24 +1,26 @@
<div class="row"> <uhk-header>
<h1 class="col-xs-12 pane-title"> <div class="row">
<i class="fa fa-play"></i> <h1 class="col-xs-12 pane-title">
<input #macroName cancelable <i class="fa fa-play"></i>
class="pane-title__name" <input #macroName cancelable
type="text" class="pane-title__name"
value="{{ macro.name }}" type="text"
(change)="editMacroName($event.target.value)" value="{{ macro.name }}"
(keyup.enter)="macroName.blur()" (change)="editMacroName($event.target.value)"
/> (keyup.enter)="macroName.blur()"
<i class="glyphicon glyphicon-trash macro__remove pull-right" title="" />
data-toggle="tooltip" <i class="glyphicon glyphicon-trash macro__remove pull-right" title=""
data-placement="left" data-toggle="tooltip"
data-original-title="Remove macro" data-placement="left"
(click)="removeMacro()" data-original-title="Remove macro"
></i> (click)="removeMacro()"
<i class="fa fa-files-o macro__duplicate pull-right" title="" ></i>
data-toggle="tooltip" <i class="fa fa-files-o macro__duplicate pull-right" title=""
data-placement="left" data-toggle="tooltip"
data-original-title="Duplicate macro" data-placement="left"
(click)="duplicateMacro()" data-original-title="Duplicate macro"
></i> (click)="duplicateMacro()"
</h1> ></i>
</div> </h1>
</div>
</uhk-header>

1
shared/src/components/macro/not-found/macro-not-found.component.html
View File

@@ -1,3 +1,4 @@
<uhk-header></uhk-header>
<div class="not-found"> <div class="not-found">
You don't have any macros. Try to add one! You don't have any macros. Try to add one!
</div> </div>

3
shared/src/components/uhk-header/uhk-header.html Normal file
View File

@@ -0,0 +1,3 @@
<div>
<ng-content></ng-content>
</div>

9
shared/src/components/uhk-header/uhk-header.ts Normal file
View File

@@ -0,0 +1,9 @@
import { ChangeDetectionStrategy, Component } from '@angular/core';
@Component({
selector: 'uhk-header',
templateUrl: './uhk-header.html',
changeDetection: ChangeDetectionStrategy.OnPush
})
export class UhkHeader {
}

6
web/src/app.module.ts
View File

@@ -86,7 +86,8 @@ import { DefaultUserConfigurationService } from './shared/services/default-user-
import { reducer } from './shared/store/reducers/index'; import { reducer } from './shared/store/reducers/index';
import { LogService } from './shared/services/logger.service'; import { LogService } from './shared/services/logger.service';
import { AutoUpdateSettings } from './shared/components/auto-update-settings/auto-update-settings'; import { AutoUpdateSettings } from './shared/components/auto-update-settings/auto-update-settings';
import { angularNotifierConfig } from '../../shared/src/models/angular-notifier-config'; import { angularNotifierConfig } from './shared/models/angular-notifier-config';
import { UhkHeader } from './shared/components/uhk-header/uhk-header';
@NgModule({ @NgModule({
declarations: [ declarations: [
@@ -139,7 +140,8 @@ import { angularNotifierConfig } from '../../shared/src/models/angular-notifier-
CancelableDirective, CancelableDirective,
TooltipDirective, TooltipDirective,
SafeStylePipe, SafeStylePipe,
AutoUpdateSettings AutoUpdateSettings,
UhkHeader
], ],
imports: [ imports: [
BrowserModule, BrowserModule,