diff --git a/src/Squidex/app/features/assets/pages/assets-page.component.html b/src/Squidex/app/features/assets/pages/assets-page.component.html index 9118b9986..fce2cff75 100644 --- a/src/Squidex/app/features/assets/pages/assets-page.component.html +++ b/src/Squidex/app/features/assets/pages/assets-page.component.html @@ -34,16 +34,14 @@

Tags

- - -
- {{tag}} -
-
- {{tags[tag]}} -
-
-
+ +
+ {{tag.name}} +
+
+ {{tag.count}} +
+
diff --git a/src/Squidex/app/framework/angular/forms/tag-editor.component.html b/src/Squidex/app/framework/angular/forms/tag-editor.component.html index 4320d4627..b55d1e014 100644 --- a/src/Squidex/app/framework/angular/forms/tag-editor.component.html +++ b/src/Squidex/app/framework/angular/forms/tag-editor.component.html @@ -3,13 +3,16 @@ {{item}} - + autocapitalize="off"> \ No newline at end of file diff --git a/src/Squidex/app/framework/angular/forms/tag-editor.component.ts b/src/Squidex/app/framework/angular/forms/tag-editor.component.ts index 7ff036436..1df2c10f1 100644 --- a/src/Squidex/app/framework/angular/forms/tag-editor.component.ts +++ b/src/Squidex/app/framework/angular/forms/tag-editor.component.ts @@ -12,6 +12,7 @@ import { Types } from '@app/framework/internal'; const KEY_SPACE = 32; const KEY_DELETE = 8; +const KEY_ENTER = 13; export interface Converter { convert(input: string): any; @@ -82,9 +83,15 @@ export class TagEditorComponent implements ControlValueAccessor { @Input() public useDefaultValue = true; + @Input() + public acceptEnter = false; + @Input() public class: string; + @Input() + public placeholder = '+Tag'; + @Input() public inputName = 'tag-editor'; @@ -164,7 +171,7 @@ export class TagEditorComponent implements ControlValueAccessor { } public onKeyDown(event: KeyboardEvent) { - if (event.keyCode === KEY_SPACE) { + if (event.keyCode === KEY_SPACE || (event.keyCode === KEY_ENTER && this.acceptEnter)) { const value = this.addInput.value; if (value && this.converter.isValidInput(value)) { diff --git a/src/Squidex/app/shared/components/asset.component.html b/src/Squidex/app/shared/components/asset.component.html index ee2c23aa2..243cc67f2 100644 --- a/src/Squidex/app/shared/components/asset.component.html +++ b/src/Squidex/app/shared/components/asset.component.html @@ -68,7 +68,7 @@
- +
{{asset.pixelWidth}}x{{asset.pixelHeight}}px, {{asset.fileSize | sqxFileSize}} diff --git a/src/Squidex/app/shared/state/assets.state.ts b/src/Squidex/app/shared/state/assets.state.ts index 70be17cc9..3f0087823 100644 --- a/src/Squidex/app/shared/state/assets.state.ts +++ b/src/Squidex/app/shared/state/assets.state.ts @@ -35,7 +35,7 @@ interface Snapshot { export class AssetsState extends State { public tags = this.changes.pipe(map(x => x.tags), - distinctUntilChanged()); + distinctUntilChanged(), map(x => sort(x))); public assets = this.changes.pipe(map(x => x.assets), @@ -210,5 +210,19 @@ export class AssetsState extends State { } } +function sort(tags: { [name: string]: number }) { + return Object.keys(tags).sort((a, b) => { + if (a < b) { + return -1; + } + if (a > b) { + return 1; + } + return 0; + }).map(key => { + return { name: key, count: tags[key] }; + }); +} + @Injectable() export class AssetsDialogState extends AssetsState { } \ No newline at end of file