diff --git a/mediarepo-ui/src/app/components/core/files-tab/files-tab-sidebar/files-tab-sidebar.component.html b/mediarepo-ui/src/app/components/core/files-tab/files-tab-sidebar/files-tab-sidebar.component.html
index 8c83179..6c677c9 100644
--- a/mediarepo-ui/src/app/components/core/files-tab/files-tab-sidebar/files-tab-sidebar.component.html
+++ b/mediarepo-ui/src/app/components/core/files-tab/files-tab-sidebar/files-tab-sidebar.component.html
@@ -3,7 +3,7 @@
+ (searchEndEvent)="this.onDisplayedFilesChange(); this.searchEndEvent.emit($event);" [tagsLoading]="this.tagsLoading">
0" label="Edit Tags">
diff --git a/mediarepo-ui/src/app/components/core/files-tab/files-tab-sidebar/files-tab-sidebar.component.ts b/mediarepo-ui/src/app/components/core/files-tab/files-tab-sidebar/files-tab-sidebar.component.ts
index ff3a8d9..d052a88 100644
--- a/mediarepo-ui/src/app/components/core/files-tab/files-tab-sidebar/files-tab-sidebar.component.ts
+++ b/mediarepo-ui/src/app/components/core/files-tab/files-tab-sidebar/files-tab-sidebar.component.ts
@@ -42,6 +42,7 @@ export class FilesTabSidebarComponent implements OnInit, OnChanges {
public allTags: Tag[] = [];
public files: File[] = [];
public tagsOfSelection: Tag[] = [];
+ public tagsLoading = false;
constructor(private repoService: RepositoryService, private tagService: TagService) {
this.repoService.selectedRepository.subscribe(
@@ -75,18 +76,22 @@ export class FilesTabSidebarComponent implements OnInit, OnChanges {
}
async loadTagsForDisplayedFiles() {
+ this.tagsLoading = true;
this.tagsOfFiles = await this.tagService.getTagsForFiles(
this.files.map(f => f.cd));
this.showAllTagsFallback();
+ this.tagsLoading = false;
}
async showFileDetails(files: File[]) {
+ this.tagsLoading = true;
this.tagsOfSelection = await this.tagService.getTagsForFiles(
files.map(f => f.cd));
this.tagsOfSelection = this.tagsOfSelection.sort(
(a, b) => a.getNormalizedOutput()
.localeCompare(b.getNormalizedOutput()));
this.tags = this.tagsOfSelection;
+ this.tagsLoading = false;
}
private async refreshFileSelection() {
diff --git a/mediarepo-ui/src/app/components/core/files-tab/files-tab.component.html b/mediarepo-ui/src/app/components/core/files-tab/files-tab.component.html
index b058cac..be372c1 100644
--- a/mediarepo-ui/src/app/components/core/files-tab/files-tab.component.html
+++ b/mediarepo-ui/src/app/components/core/files-tab/files-tab.component.html
@@ -5,7 +5,7 @@
[selectedFiles]="this.selectedFiles">
-
+
diff --git a/mediarepo-ui/src/app/components/shared/app-common/busy-indicator/busy-indicator.component.scss b/mediarepo-ui/src/app/components/shared/app-common/busy-indicator/busy-indicator.component.scss
index e5b12de..b5bef4e 100644
--- a/mediarepo-ui/src/app/components/shared/app-common/busy-indicator/busy-indicator.component.scss
+++ b/mediarepo-ui/src/app/components/shared/app-common/busy-indicator/busy-indicator.component.scss
@@ -15,12 +15,11 @@
}
.busy-indicator-overlay.blur {
- background-color: rgba(0, 0, 0, 0.5);
backdrop-filter: blur(5px);
}
.busy-indicator-overlay.darken {
- background-color: rgba(0, 0, 0, 0.2);
+ background-color: rgba(0, 0, 0, 0.5);
}
::ng-deep app-busy-indicator {
diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/file-metadata.component.html b/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/file-metadata.component.html
index 743d47d..0644be9 100644
--- a/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/file-metadata.component.html
+++ b/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/file-metadata.component.html
@@ -3,16 +3,16 @@
File Metadata
-
diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/file-metadata.component.ts b/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/file-metadata.component.ts
index c5175ce..733385d 100644
--- a/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/file-metadata.component.ts
+++ b/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/file-metadata.component.ts
@@ -18,24 +18,31 @@ export class FileMetadataComponent implements OnInit, OnChanges {
@Input() file!: File;
public fileMetadata: FileMetadata | undefined;
+ public loading = false;
constructor(private fileService: FileService) {
}
public async ngOnInit() {
+ this.loading = true;
this.fileMetadata = await this.fileService.getFileMetadata(this.file.id);
+ this.loading = false;
}
public async ngOnChanges(changes:SimpleChanges) {
if (changes["file"] && (!this.fileMetadata || this.fileMetadata.file_id != this.file.id)) {
+ this.loading = true;
this.fileMetadata = await this.fileService.getFileMetadata(this.file.id);
+ this.loading = false;
}
}
public async saveFileName(name: string) {
+ this.loading = true;
const newFile = await this.fileService.updateFileName(this.file.id, name);
if (this.fileMetadata) {
this.fileMetadata.name = newFile.name;
}
+ this.loading = false;
}
}
diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.html b/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.html
index 7847689..8183620 100644
--- a/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.html
+++ b/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.html
@@ -39,6 +39,7 @@
+
diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.scss b/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.scss
index fc69ec7..3d055e9 100644
--- a/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.scss
+++ b/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.scss
@@ -119,3 +119,16 @@ mat-divider {
margin: auto;
}
}
+
+.file-tag-list {
+ position: relative;
+}
+
+app-busy-indicator {
+ position: absolute;
+ top: 0;
+ left: 0;
+ height: 100%;
+ width: 100%;
+ z-index: 99;
+}
diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.ts b/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.ts
index 8da1fc1..4a496d5 100644
--- a/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.ts
+++ b/mediarepo-ui/src/app/components/shared/sidebar/file-search/file-search.component.ts
@@ -37,6 +37,7 @@ export class FileSearchComponent implements AfterViewChecked, OnInit {
@Input() availableTags: Tag[] = [];
@Input() contextTags: Tag[] = [];
@Input() state!: TabState;
+ @Input() tagsLoading = false;
@Output() searchStartEvent = new EventEmitter();
@Output() searchEndEvent = new EventEmitter();
diff --git a/mediarepo-ui/src/app/components/shared/sidebar/tag-edit/tag-edit.component.html b/mediarepo-ui/src/app/components/shared/sidebar/tag-edit/tag-edit.component.html
index 5c77125..c72c883 100644
--- a/mediarepo-ui/src/app/components/shared/sidebar/tag-edit/tag-edit.component.html
+++ b/mediarepo-ui/src/app/components/shared/sidebar/tag-edit/tag-edit.component.html
@@ -33,5 +33,5 @@
-
+
diff --git a/mediarepo-ui/src/polyfills.ts b/mediarepo-ui/src/polyfills.ts
index 9295036..48d7f58 100644
--- a/mediarepo-ui/src/polyfills.ts
+++ b/mediarepo-ui/src/polyfills.ts
@@ -3,7 +3,7 @@
* You can add your own extra polyfills to this file.
*
* This file is divided into 2 sections:
- * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
+ * 1. Browser polyfills. These are applied before tagsLoading ZoneJS and are sorted by browsers.
* 2. Application imports. Files imported after ZoneJS that should be loaded before your main
* file.
*