diff --git a/mediarepo-ui/src/app/components/core/core.component.ts b/mediarepo-ui/src/app/components/core/core.component.ts index d1812e8..37f1409 100644 --- a/mediarepo-ui/src/app/components/core/core.component.ts +++ b/mediarepo-ui/src/app/components/core/core.component.ts @@ -1,4 +1,4 @@ -import {Component, OnInit, ViewChild} from "@angular/core"; +import {Component, ViewChild} from "@angular/core"; import {Repository} from "../../models/Repository"; import {RepositoryService} from "../../services/repository/repository.service"; import {MatTabChangeEvent, MatTabGroup} from "@angular/material/tabs"; @@ -7,55 +7,59 @@ import {TabService} from "../../services/tab/tab.service"; import {TabCategory} from "../../models/TabCategory"; import {TabState} from "../../models/TabState.rs"; import {AppState} from "../../models/AppState"; +import {StateService} from "../../services/state/state.service"; @Component({ selector: "app-core", templateUrl: "./core.component.html", styleUrls: ["./core.component.scss"] }) -export class CoreComponent implements OnInit { +export class CoreComponent { public selectedRepository: Repository | undefined; public tabs: TabState[] = []; - public appState: AppState = new AppState(); - private stateInterval?: number; + public appState: AppState; + public newTab = false; @ViewChild("tabGroup") tabGroup!: MatTabGroup; - public newTab = false; constructor( private tabService: TabService, private repoService: RepositoryService, + private stateService: StateService, private tagService: TagService) { - } - - public async ngOnInit(): Promise { this.selectedRepository = this.repoService.selectedRepository.getValue(); + this.repoService.selectedRepository.subscribe(async (selected) => { this.selectedRepository = selected; if (this.selectedRepository) { await this.loadRepoData(); - if (this.appState.tabs.length === 0) { - this.addTab(); - } } else { - clearInterval(this.stateInterval); this.newTab = false; - this.tabService.closeAllTabs(); - this.appState = new AppState(); } }); - this.tabService.tabs.subscribe(tabs => { - this.tabs = tabs; - }); + this.appState = this.stateService.state.getValue(); + + this.stateService.state.subscribe(state => { + this.appState = state; + console.log("new state", state); + if (this.appState.tabs.value.length === 0) { + this.addTab(); + } + state.tabs.subscribe(tabs => { + console.log("new tabs", tabs); + this.tabs = tabs; + console.log(tabs); + if (this.tabs.length === 0) { + this.addTab(); + } + }); + }) } async loadRepoData() { await this.tagService.loadTags(); - this.appState = await this.repoService.getFrontendState(); - this.tabService.restoreFromState(this.appState); - this.startStateSaveRoutine(); } public onTabSelectionChange(event: MatTabChangeEvent): void { @@ -63,25 +67,27 @@ export class CoreComponent implements OnInit { } public addFilesTab(): void { - this.tabService.addTab(TabCategory.Files); + this.appState.addTab(TabCategory.Files); this.tabGroup.selectedIndex = this.tabs.length; this.newTab = false; } public addImportTab(): void { - this.tabService.addTab(TabCategory.Import); + this.appState.addTab(TabCategory.Import); this.tabGroup.selectedIndex = this.tabs.length; this.newTab = false; } public addTab(): void { - this.newTab = true; - this.tabGroup.selectedIndex = this.tabs.length + 1; + if (this.tabGroup) { + this.newTab = true; + this.tabGroup.selectedIndex = this.tabs.length + 1; + } } - public closeTab(tab: TabState): void { + public async closeTab(tab: TabState) { const previousIndex = this.tabGroup.selectedIndex; - this.tabService.closeTab(tab.uuid); + await this.appState.closeTab(tab.uuid); if (previousIndex) { if (previousIndex === 1 && this.tabs.length >= 1) { @@ -94,19 +100,10 @@ export class CoreComponent implements OnInit { } } - public onMouseClickTabLabel(tab: TabState, event: MouseEvent): void { + public async onMouseClickTabLabel(tab: TabState, event: MouseEvent) { console.log(event); if (event.button === 1) { // middle mouse button - this.closeTab(tab); + await this.closeTab(tab); } } - - private startStateSaveRoutine() { - clearInterval(this.stateInterval); - this.stateInterval = setInterval(async () => this.saveState(), 10000); - } - - private async saveState() { - await this.repoService.setFrontendState(this.appState); - } } diff --git a/mediarepo-ui/src/app/components/core/core.module.ts b/mediarepo-ui/src/app/components/core/core.module.ts index 92c2fed..d77e036 100644 --- a/mediarepo-ui/src/app/components/core/core.module.ts +++ b/mediarepo-ui/src/app/components/core/core.module.ts @@ -1,11 +1,17 @@ import {NgModule} from "@angular/core"; import {CommonModule} from "@angular/common"; import {CoreComponent} from "./core.component"; -import {RepositoriesTabComponent} from "./repositories-tab/repositories-tab.component"; +import { + RepositoriesTabComponent +} from "./repositories-tab/repositories-tab.component"; import {FilesTabComponent} from "./files-tab/files-tab.component"; -import {FilesTabSidebarComponent} from "./files-tab/files-tab-sidebar/files-tab-sidebar.component"; +import { + FilesTabSidebarComponent +} from "./files-tab/files-tab-sidebar/files-tab-sidebar.component"; import {ImportTabComponent} from "./import-tab/import-tab.component"; -import {ImportTabSidebarComponent} from "./import-tab/import-tab-sidebar/import-tab-sidebar.component"; +import { + ImportTabSidebarComponent +} from "./import-tab/import-tab-sidebar/import-tab-sidebar.component"; import {MatButtonModule} from "@angular/material/button"; import {MatSidenavModule} from "@angular/material/sidenav"; import {MatProgressBarModule} from "@angular/material/progress-bar"; @@ -24,17 +30,27 @@ import {SidebarModule} from "../shared/sidebar/sidebar.module"; import {FileModule} from "../shared/file/file.module"; import {AppCommonModule} from "../shared/app-common/app-common.module"; import {ReactiveFormsModule} from "@angular/forms"; -import {RepositoryCardComponent} from "./repositories-tab/repository-card/repository-card.component"; -import {AddRepositoryDialogComponent} from "./repositories-tab/add-repository-dialog/add-repository-dialog.component"; +import { + RepositoryCardComponent +} from "./repositories-tab/repository-card/repository-card.component"; +import { + AddRepositoryDialogComponent +} from "./repositories-tab/add-repository-dialog/add-repository-dialog.component"; import {MatCardModule} from "@angular/material/card"; import {MatListModule} from "@angular/material/list"; import {MatDialogModule} from "@angular/material/dialog"; import {MatTooltipModule} from "@angular/material/tooltip"; import {MatInputModule} from "@angular/material/input"; import {TagModule} from "../shared/tag/tag.module"; -import { RepositoryFormComponent } from "./repositories-tab/repository-form/repository-form.component"; -import { EditRepositoryDialogComponent } from "./repositories-tab/edit-repository-dialog/edit-repository-dialog.component"; -import { DownloadDaemonDialogComponent } from "./repositories-tab/download-daemon-dialog/download-daemon-dialog.component"; +import { + RepositoryFormComponent +} from "./repositories-tab/repository-form/repository-form.component"; +import { + EditRepositoryDialogComponent +} from "./repositories-tab/edit-repository-dialog/edit-repository-dialog.component"; +import { + DownloadDaemonDialogComponent +} from "./repositories-tab/download-daemon-dialog/download-daemon-dialog.component"; @NgModule({ diff --git a/mediarepo-ui/src/app/components/core/repositories-tab/add-repository-dialog/add-repository-dialog.component.ts b/mediarepo-ui/src/app/components/core/repositories-tab/add-repository-dialog/add-repository-dialog.component.ts index eb54e2b..058cca5 100644 --- a/mediarepo-ui/src/app/components/core/repositories-tab/add-repository-dialog/add-repository-dialog.component.ts +++ b/mediarepo-ui/src/app/components/core/repositories-tab/add-repository-dialog/add-repository-dialog.component.ts @@ -1,7 +1,11 @@ import {Component, Inject, ViewChild} from "@angular/core"; import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog"; -import {RepositoryService} from "../../../../services/repository/repository.service"; -import {ErrorBrokerService} from "../../../../services/error-broker/error-broker.service"; +import { + RepositoryService +} from "../../../../services/repository/repository.service"; +import { + ErrorBrokerService +} from "../../../../services/error-broker/error-broker.service"; import { RepositoryFormComponent } from "../repository-form/repository-form.component"; diff --git a/mediarepo-ui/src/app/components/core/repositories-tab/download-daemon-dialog/download-daemon-dialog.component.spec.ts b/mediarepo-ui/src/app/components/core/repositories-tab/download-daemon-dialog/download-daemon-dialog.component.spec.ts index ae0b74f..cdf6db5 100644 --- a/mediarepo-ui/src/app/components/core/repositories-tab/download-daemon-dialog/download-daemon-dialog.component.spec.ts +++ b/mediarepo-ui/src/app/components/core/repositories-tab/download-daemon-dialog/download-daemon-dialog.component.spec.ts @@ -1,25 +1,27 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import {ComponentFixture, TestBed} from "@angular/core/testing"; -import { DownloadDaemonDialogComponent } from './download-daemon-dialog.component'; +import { + DownloadDaemonDialogComponent +} from "./download-daemon-dialog.component"; -describe('DownloadDaemonDialogComponent', () => { - let component: DownloadDaemonDialogComponent; - let fixture: ComponentFixture; +describe("DownloadDaemonDialogComponent", () => { + let component: DownloadDaemonDialogComponent; + let fixture: ComponentFixture; - beforeEach(async () => { - await TestBed.configureTestingModule({ - declarations: [ DownloadDaemonDialogComponent ] - }) - .compileComponents(); - }); + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ DownloadDaemonDialogComponent ] + }) + .compileComponents(); + }); - beforeEach(() => { - fixture = TestBed.createComponent(DownloadDaemonDialogComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); + beforeEach(() => { + fixture = TestBed.createComponent(DownloadDaemonDialogComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); - it('should create', () => { - expect(component).toBeTruthy(); - }); + it("should create", () => { + expect(component).toBeTruthy(); + }); }); diff --git a/mediarepo-ui/src/app/components/core/repositories-tab/edit-repository-dialog/edit-repository-dialog.component.spec.ts b/mediarepo-ui/src/app/components/core/repositories-tab/edit-repository-dialog/edit-repository-dialog.component.spec.ts index 52daa10..5b4541e 100644 --- a/mediarepo-ui/src/app/components/core/repositories-tab/edit-repository-dialog/edit-repository-dialog.component.spec.ts +++ b/mediarepo-ui/src/app/components/core/repositories-tab/edit-repository-dialog/edit-repository-dialog.component.spec.ts @@ -1,25 +1,27 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import {ComponentFixture, TestBed} from "@angular/core/testing"; -import { EditRepositoryDialogComponent } from './edit-repository-dialog.component'; +import { + EditRepositoryDialogComponent +} from "./edit-repository-dialog.component"; -describe('EditRepositoryDialogComponent', () => { - let component: EditRepositoryDialogComponent; - let fixture: ComponentFixture; +describe("EditRepositoryDialogComponent", () => { + let component: EditRepositoryDialogComponent; + let fixture: ComponentFixture; - beforeEach(async () => { - await TestBed.configureTestingModule({ - declarations: [ EditRepositoryDialogComponent ] - }) - .compileComponents(); - }); + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ EditRepositoryDialogComponent ] + }) + .compileComponents(); + }); - beforeEach(() => { - fixture = TestBed.createComponent(EditRepositoryDialogComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); + beforeEach(() => { + fixture = TestBed.createComponent(EditRepositoryDialogComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); - it('should create', () => { - expect(component).toBeTruthy(); - }); + it("should create", () => { + expect(component).toBeTruthy(); + }); }); diff --git a/mediarepo-ui/src/app/components/core/repositories-tab/edit-repository-dialog/edit-repository-dialog.component.ts b/mediarepo-ui/src/app/components/core/repositories-tab/edit-repository-dialog/edit-repository-dialog.component.ts index 877b2a8..12c4336 100644 --- a/mediarepo-ui/src/app/components/core/repositories-tab/edit-repository-dialog/edit-repository-dialog.component.ts +++ b/mediarepo-ui/src/app/components/core/repositories-tab/edit-repository-dialog/edit-repository-dialog.component.ts @@ -1,4 +1,4 @@ -import {Component, Inject, OnInit, ViewChild} from "@angular/core"; +import {Component, Inject, ViewChild} from "@angular/core"; import { RepositoryFormComponent } from "../repository-form/repository-form.component"; diff --git a/mediarepo-ui/src/app/components/core/repositories-tab/repositories-tab.component.ts b/mediarepo-ui/src/app/components/core/repositories-tab/repositories-tab.component.ts index c6df19e..9715e67 100644 --- a/mediarepo-ui/src/app/components/core/repositories-tab/repositories-tab.component.ts +++ b/mediarepo-ui/src/app/components/core/repositories-tab/repositories-tab.component.ts @@ -1,11 +1,12 @@ import {AfterViewInit, Component, OnInit} from "@angular/core"; import {Repository} from "../../../models/Repository"; -import {RepositoryService} from "../../../services/repository/repository.service"; +import { + RepositoryService +} from "../../../services/repository/repository.service"; import {MatDialog} from "@angular/material/dialog"; -import {AddRepositoryDialogComponent} from "./add-repository-dialog/add-repository-dialog.component"; import { - ConfirmDialogComponent -} from "../../shared/app-common/confirm-dialog/confirm-dialog.component"; + AddRepositoryDialogComponent +} from "./add-repository-dialog/add-repository-dialog.component"; import { DownloadDaemonDialogComponent } from "./download-daemon-dialog/download-daemon-dialog.component"; diff --git a/mediarepo-ui/src/app/components/core/repositories-tab/repository-card/repository-card.component.ts b/mediarepo-ui/src/app/components/core/repositories-tab/repository-card/repository-card.component.ts index 5e105c7..c47131d 100644 --- a/mediarepo-ui/src/app/components/core/repositories-tab/repository-card/repository-card.component.ts +++ b/mediarepo-ui/src/app/components/core/repositories-tab/repository-card/repository-card.component.ts @@ -1,10 +1,18 @@ import {Component, Input, OnDestroy, OnInit, ViewChild} from "@angular/core"; import {Repository} from "../../../../models/Repository"; -import {RepositoryService} from "../../../../services/repository/repository.service"; -import {ErrorBrokerService} from "../../../../services/error-broker/error-broker.service"; +import { + RepositoryService +} from "../../../../services/repository/repository.service"; +import { + ErrorBrokerService +} from "../../../../services/error-broker/error-broker.service"; import {MatDialog} from "@angular/material/dialog"; -import {ConfirmDialogComponent} from "../../../shared/app-common/confirm-dialog/confirm-dialog.component"; -import {BusyIndicatorComponent} from "../../../shared/app-common/busy-indicator/busy-indicator.component"; +import { + ConfirmDialogComponent +} from "../../../shared/app-common/confirm-dialog/confirm-dialog.component"; +import { + BusyIndicatorComponent +} from "../../../shared/app-common/busy-indicator/busy-indicator.component"; import { EditRepositoryDialogComponent } from "../edit-repository-dialog/edit-repository-dialog.component"; diff --git a/mediarepo-ui/src/app/components/core/repositories-tab/repository-form/repository-form.component.spec.ts b/mediarepo-ui/src/app/components/core/repositories-tab/repository-form/repository-form.component.spec.ts index a44c814..4bb29c5 100644 --- a/mediarepo-ui/src/app/components/core/repositories-tab/repository-form/repository-form.component.spec.ts +++ b/mediarepo-ui/src/app/components/core/repositories-tab/repository-form/repository-form.component.spec.ts @@ -1,25 +1,25 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import {ComponentFixture, TestBed} from "@angular/core/testing"; -import { RepositoryFormComponent } from './repository-form.component'; +import {RepositoryFormComponent} from "./repository-form.component"; -describe('RepositoryFormComponent', () => { - let component: RepositoryFormComponent; - let fixture: ComponentFixture; +describe("RepositoryFormComponent", () => { + let component: RepositoryFormComponent; + let fixture: ComponentFixture; - beforeEach(async () => { - await TestBed.configureTestingModule({ - declarations: [ RepositoryFormComponent ] - }) - .compileComponents(); - }); + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ RepositoryFormComponent ] + }) + .compileComponents(); + }); - beforeEach(() => { - fixture = TestBed.createComponent(RepositoryFormComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); + beforeEach(() => { + fixture = TestBed.createComponent(RepositoryFormComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); - it('should create', () => { - expect(component).toBeTruthy(); - }); + it("should create", () => { + expect(component).toBeTruthy(); + }); }); diff --git a/mediarepo-ui/src/app/components/core/repositories-tab/repository-form/repository-form.component.ts b/mediarepo-ui/src/app/components/core/repositories-tab/repository-form/repository-form.component.ts index ccb9890..518b88e 100644 --- a/mediarepo-ui/src/app/components/core/repositories-tab/repository-form/repository-form.component.ts +++ b/mediarepo-ui/src/app/components/core/repositories-tab/repository-form/repository-form.component.ts @@ -2,7 +2,8 @@ import {Component, Input, OnInit, Output} from "@angular/core"; import { AbstractControl, FormControl, - FormGroup, ValidationErrors, + FormGroup, + ValidationErrors, Validators } from "@angular/forms"; import {Repository} from "../../../../models/Repository"; @@ -10,9 +11,6 @@ import { RepositoryService } from "../../../../services/repository/repository.service"; import {dialog} from "@tauri-apps/api"; -import { - ErrorBrokerService -} from "../../../../services/error-broker/error-broker.service"; import {MatDialog} from "@angular/material/dialog"; @Component({ diff --git a/mediarepo-ui/src/app/components/shared/app-common/app-common.module.ts b/mediarepo-ui/src/app/components/shared/app-common/app-common.module.ts index ccf0213..55c6460 100644 --- a/mediarepo-ui/src/app/components/shared/app-common/app-common.module.ts +++ b/mediarepo-ui/src/app/components/shared/app-common/app-common.module.ts @@ -1,6 +1,10 @@ import {NgModule} from "@angular/core"; -import {ConfirmDialogComponent} from "./confirm-dialog/confirm-dialog.component"; -import {BusyIndicatorComponent} from "./busy-indicator/busy-indicator.component"; +import { + ConfirmDialogComponent +} from "./confirm-dialog/confirm-dialog.component"; +import { + BusyIndicatorComponent +} from "./busy-indicator/busy-indicator.component"; import {ContextMenuComponent} from "./context-menu/context-menu.component"; import {CommonModule} from "@angular/common"; import {NgIconsModule} from "@ng-icons/core"; @@ -8,7 +12,9 @@ import {MatProgressSpinnerModule} from "@angular/material/progress-spinner"; import {MatButtonModule} from "@angular/material/button"; import {MatDialogModule} from "@angular/material/dialog"; import {MatMenuModule} from "@angular/material/menu"; -import {ContentAwareImageComponent} from "./content-aware-image/content-aware-image.component"; +import { + ContentAwareImageComponent +} from "./content-aware-image/content-aware-image.component"; @NgModule({ diff --git a/mediarepo-ui/src/app/components/shared/file/content-viewer/content-viewer.component.ts b/mediarepo-ui/src/app/components/shared/file/content-viewer/content-viewer.component.ts index 670f285..d99acc3 100644 --- a/mediarepo-ui/src/app/components/shared/file/content-viewer/content-viewer.component.ts +++ b/mediarepo-ui/src/app/components/shared/file/content-viewer/content-viewer.component.ts @@ -11,8 +11,12 @@ import {SafeResourceUrl} from "@angular/platform-browser"; import {File} from "../../../../models/File"; import {FileService} from "../../../../services/file/file.service"; import {FileHelper} from "../../../../services/file/file.helper"; -import {ErrorBrokerService} from "../../../../services/error-broker/error-broker.service"; -import {BusyIndicatorComponent} from "../../app-common/busy-indicator/busy-indicator.component"; +import { + ErrorBrokerService +} from "../../../../services/error-broker/error-broker.service"; +import { + BusyIndicatorComponent +} from "../../app-common/busy-indicator/busy-indicator.component"; type ContentType = "image" | "video" | "audio" | "other"; diff --git a/mediarepo-ui/src/app/components/shared/file/file-card/file-card.component.ts b/mediarepo-ui/src/app/components/shared/file/file-card/file-card.component.ts index 57a434e..0c5c289 100644 --- a/mediarepo-ui/src/app/components/shared/file/file-card/file-card.component.ts +++ b/mediarepo-ui/src/app/components/shared/file/file-card/file-card.component.ts @@ -10,7 +10,6 @@ import { ViewChild } from "@angular/core"; import {File} from "../../../../models/File"; -import {SafeResourceUrl} from "@angular/platform-browser"; import {Selectable} from "../../../../models/Selectable"; @Component({ diff --git a/mediarepo-ui/src/app/components/shared/file/file-context-menu/file-context-menu.component.ts b/mediarepo-ui/src/app/components/shared/file/file-context-menu/file-context-menu.component.ts index b28f4e2..b790239 100644 --- a/mediarepo-ui/src/app/components/shared/file/file-context-menu/file-context-menu.component.ts +++ b/mediarepo-ui/src/app/components/shared/file/file-context-menu/file-context-menu.component.ts @@ -1,9 +1,13 @@ import {Component, ViewChild} from "@angular/core"; import {File} from "../../../../models/File"; -import {ContextMenuComponent} from "../../app-common/context-menu/context-menu.component"; +import { + ContextMenuComponent +} from "../../app-common/context-menu/context-menu.component"; import {clipboard} from "@tauri-apps/api"; import {FileService} from "../../../../services/file/file.service"; -import {ErrorBrokerService} from "../../../../services/error-broker/error-broker.service"; +import { + ErrorBrokerService +} from "../../../../services/error-broker/error-broker.service"; import {FileHelper} from "../../../../services/file/file.helper"; @Component({ diff --git a/mediarepo-ui/src/app/components/shared/file/file-thumbnail/file-thumbnail.component.ts b/mediarepo-ui/src/app/components/shared/file/file-thumbnail/file-thumbnail.component.ts index 20e96d3..9eb62bb 100644 --- a/mediarepo-ui/src/app/components/shared/file/file-thumbnail/file-thumbnail.component.ts +++ b/mediarepo-ui/src/app/components/shared/file/file-thumbnail/file-thumbnail.component.ts @@ -1,8 +1,8 @@ import { - Component, EventEmitter, + Component, Input, OnChanges, - OnInit, Output, + OnInit, SimpleChanges } from "@angular/core"; import {File} from "../../../../models/File"; diff --git a/mediarepo-ui/src/app/components/shared/file/file.module.ts b/mediarepo-ui/src/app/components/shared/file/file.module.ts index da4609f..491b90d 100644 --- a/mediarepo-ui/src/app/components/shared/file/file.module.ts +++ b/mediarepo-ui/src/app/components/shared/file/file.module.ts @@ -1,19 +1,45 @@ -import { NgModule } from "@angular/core"; -import { CommonModule } from "@angular/common"; -import {FileMultiviewComponent} from "./file-multiview/file-multiview.component"; -import {FileGridComponent} from "./file-multiview/file-grid/file-grid.component"; -import {FileGalleryComponent} from "./file-multiview/file-gallery/file-gallery.component"; +import {NgModule} from "@angular/core"; +import {CommonModule} from "@angular/common"; +import { + FileMultiviewComponent +} from "./file-multiview/file-multiview.component"; +import { + FileGridComponent +} from "./file-multiview/file-grid/file-grid.component"; +import { + FileGalleryComponent +} from "./file-multiview/file-gallery/file-gallery.component"; import {FileCardComponent} from "./file-card/file-card.component"; -import {FileContextMenuComponent} from "./file-context-menu/file-context-menu.component"; -import {FileThumbnailComponent} from "./file-thumbnail/file-thumbnail.component"; -import {ContentViewerComponent} from "./content-viewer/content-viewer.component"; -import {AudioViewerComponent} from "./content-viewer/audio-viewer/audio-viewer.component"; -import {ImageViewerComponent} from "./content-viewer/image-viewer/image-viewer.component"; -import {VideoViewerComponent} from "./content-viewer/video-viewer/video-viewer.component"; +import { + FileContextMenuComponent +} from "./file-context-menu/file-context-menu.component"; +import { + FileThumbnailComponent +} from "./file-thumbnail/file-thumbnail.component"; +import { + ContentViewerComponent +} from "./content-viewer/content-viewer.component"; +import { + AudioViewerComponent +} from "./content-viewer/audio-viewer/audio-viewer.component"; +import { + ImageViewerComponent +} from "./content-viewer/image-viewer/image-viewer.component"; +import { + VideoViewerComponent +} from "./content-viewer/video-viewer/video-viewer.component"; import {AppCommonModule} from "../app-common/app-common.module"; import {MatSliderModule} from "@angular/material/slider"; import {NgIconsModule} from "@ng-icons/core"; -import {MatRefresh, MatClose, MatImage, MatMovie, MatGif, MatAudiotrack, MatDescription} from "@ng-icons/material-icons"; +import { + MatAudiotrack, + MatClose, + MatDescription, + MatGif, + MatImage, + MatMovie, + MatRefresh +} from "@ng-icons/material-icons"; import {DragDropModule} from "@angular/cdk/drag-drop"; import {MatButtonModule} from "@angular/material/button"; import {MatMenuModule} from "@angular/material/menu"; diff --git a/mediarepo-ui/src/app/components/shared/input/input.module.ts b/mediarepo-ui/src/app/components/shared/input/input.module.ts index f7e19ed..db989e3 100644 --- a/mediarepo-ui/src/app/components/shared/input/input.module.ts +++ b/mediarepo-ui/src/app/components/shared/input/input.module.ts @@ -1,13 +1,15 @@ import {NgModule} from "@angular/core"; import {CommonModule} from "@angular/common"; -import {NativeFileSelectComponent} from "./native-file-select/native-file-select.component"; +import { + NativeFileSelectComponent +} from "./native-file-select/native-file-select.component"; import {TagInputComponent} from "./tag-input/tag-input.component"; import {MatAutocompleteModule} from "@angular/material/autocomplete"; import {MatFormFieldModule} from "@angular/material/form-field"; import {ReactiveFormsModule} from "@angular/forms"; import {MatInputModule} from "@angular/material/input"; import {NgIconsModule} from "@ng-icons/core"; -import {MatInsertDriveFile, MatFolder} from "@ng-icons/material-icons"; +import {MatFolder, MatInsertDriveFile} from "@ng-icons/material-icons"; import {MatButtonModule} from "@angular/material/button"; import {FlexModule} from "@angular/flex-layout"; diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-import/file-import.component.spec.ts b/mediarepo-ui/src/app/components/shared/sidebar/file-import/file-import.component.spec.ts index e28b214..bdee95d 100644 --- a/mediarepo-ui/src/app/components/shared/sidebar/file-import/file-import.component.spec.ts +++ b/mediarepo-ui/src/app/components/shared/sidebar/file-import/file-import.component.spec.ts @@ -1,25 +1,25 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import {ComponentFixture, TestBed} from "@angular/core/testing"; -import { FileImportComponent } from './file-import.component'; +import {FileImportComponent} from "./file-import.component"; -describe('FileImportComponent', () => { - let component: FileImportComponent; - let fixture: ComponentFixture; +describe("FileImportComponent", () => { + let component: FileImportComponent; + let fixture: ComponentFixture; - beforeEach(async () => { - await TestBed.configureTestingModule({ - declarations: [ FileImportComponent ] - }) - .compileComponents(); - }); + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ FileImportComponent ] + }) + .compileComponents(); + }); - beforeEach(() => { - fixture = TestBed.createComponent(FileImportComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); + beforeEach(() => { + fixture = TestBed.createComponent(FileImportComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); - it('should create', () => { - expect(component).toBeTruthy(); - }); + it("should create", () => { + expect(component).toBeTruthy(); + }); }); diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-import/file-import.component.ts b/mediarepo-ui/src/app/components/shared/sidebar/file-import/file-import.component.ts index a6927e4..bb9a5a0 100644 --- a/mediarepo-ui/src/app/components/shared/sidebar/file-import/file-import.component.ts +++ b/mediarepo-ui/src/app/components/shared/sidebar/file-import/file-import.component.ts @@ -1,4 +1,4 @@ -import {Component, EventEmitter, OnInit, Output} from "@angular/core"; +import {Component, EventEmitter, Output} from "@angular/core"; import {File} from "../../../../models/File"; @Component({ diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-import/filesystem-import/filesystem-import.component.ts b/mediarepo-ui/src/app/components/shared/sidebar/file-import/filesystem-import/filesystem-import.component.ts index 7d26b01..f2bc725 100644 --- a/mediarepo-ui/src/app/components/shared/sidebar/file-import/filesystem-import/filesystem-import.component.ts +++ b/mediarepo-ui/src/app/components/shared/sidebar/file-import/filesystem-import/filesystem-import.component.ts @@ -1,7 +1,9 @@ import {Component, EventEmitter, Output} from "@angular/core"; import {FileOsMetadata} from "../../../../../models/FileOsMetadata"; import {ImportService} from "../../../../../services/import/import.service"; -import {ErrorBrokerService} from "../../../../../services/error-broker/error-broker.service"; +import { + ErrorBrokerService +} from "../../../../../services/error-broker/error-broker.service"; import {AddFileOptions} from "../../../../../models/AddFileOptions"; import {File} from "../../../../../models/File"; import {DialogFilter} from "@tauri-apps/api/dialog"; diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/editable-metadata-entry/editable-metadata-entry.component.spec.ts b/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/editable-metadata-entry/editable-metadata-entry.component.spec.ts index cce83ea..f7b617c 100644 --- a/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/editable-metadata-entry/editable-metadata-entry.component.spec.ts +++ b/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/editable-metadata-entry/editable-metadata-entry.component.spec.ts @@ -1,25 +1,27 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import {ComponentFixture, TestBed} from "@angular/core/testing"; -import { EditableMetadataEntryComponent } from './editable-metadata-entry.component'; +import { + EditableMetadataEntryComponent +} from "./editable-metadata-entry.component"; -describe('EditableMetadataEntryComponent', () => { - let component: EditableMetadataEntryComponent; - let fixture: ComponentFixture; +describe("EditableMetadataEntryComponent", () => { + let component: EditableMetadataEntryComponent; + let fixture: ComponentFixture; - beforeEach(async () => { - await TestBed.configureTestingModule({ - declarations: [ EditableMetadataEntryComponent ] - }) - .compileComponents(); - }); + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ EditableMetadataEntryComponent ] + }) + .compileComponents(); + }); - beforeEach(() => { - fixture = TestBed.createComponent(EditableMetadataEntryComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); + beforeEach(() => { + fixture = TestBed.createComponent(EditableMetadataEntryComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); - it('should create', () => { - expect(component).toBeTruthy(); - }); + it("should create", () => { + expect(component).toBeTruthy(); + }); }); diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/editable-metadata-entry/editable-metadata-entry.component.ts b/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/editable-metadata-entry/editable-metadata-entry.component.ts index d107270..801ac31 100644 --- a/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/editable-metadata-entry/editable-metadata-entry.component.ts +++ b/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/editable-metadata-entry/editable-metadata-entry.component.ts @@ -1,11 +1,4 @@ -import { - Component, - EventEmitter, - Input, - OnChanges, - OnInit, - Output -} from "@angular/core"; +import {Component, EventEmitter, Input, OnInit, Output} from "@angular/core"; import {FormControl} from "@angular/forms"; @Component({ diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/file-metadata.component.spec.ts b/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/file-metadata.component.spec.ts index 2ea664a..9f93d56 100644 --- a/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/file-metadata.component.spec.ts +++ b/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/file-metadata.component.spec.ts @@ -1,25 +1,25 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import {ComponentFixture, TestBed} from "@angular/core/testing"; -import { FileMetadataComponent } from './file-metadata.component'; +import {FileMetadataComponent} from "./file-metadata.component"; -describe('FileMetadataComponent', () => { - let component: FileMetadataComponent; - let fixture: ComponentFixture; +describe("FileMetadataComponent", () => { + let component: FileMetadataComponent; + let fixture: ComponentFixture; - beforeEach(async () => { - await TestBed.configureTestingModule({ - declarations: [ FileMetadataComponent ] - }) - .compileComponents(); - }); + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ FileMetadataComponent ] + }) + .compileComponents(); + }); - beforeEach(() => { - fixture = TestBed.createComponent(FileMetadataComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); + beforeEach(() => { + fixture = TestBed.createComponent(FileMetadataComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); - it('should create', () => { - expect(component).toBeTruthy(); - }); + it("should create", () => { + expect(component).toBeTruthy(); + }); }); 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 5879c09..153dfd4 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 @@ -1,10 +1,4 @@ -import { - Component, - Input, - OnChanges, - OnInit, - SimpleChanges -} from "@angular/core"; +import {Component, Input} from "@angular/core"; import {File} from "../../../../models/File"; import {FileService} from "../../../../services/file/file.service"; diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/metadata-entry/metadata-entry.component.spec.ts b/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/metadata-entry/metadata-entry.component.spec.ts index c66b354..d494874 100644 --- a/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/metadata-entry/metadata-entry.component.spec.ts +++ b/mediarepo-ui/src/app/components/shared/sidebar/file-metadata/metadata-entry/metadata-entry.component.spec.ts @@ -1,25 +1,25 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import {ComponentFixture, TestBed} from "@angular/core/testing"; -import { MetadataEntryComponent } from './metadata-entry.component'; +import {MetadataEntryComponent} from "./metadata-entry.component"; -describe('MetadataEntryComponent', () => { - let component: MetadataEntryComponent; - let fixture: ComponentFixture; +describe("MetadataEntryComponent", () => { + let component: MetadataEntryComponent; + let fixture: ComponentFixture; - beforeEach(async () => { - await TestBed.configureTestingModule({ - declarations: [ MetadataEntryComponent ] - }) - .compileComponents(); - }); + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ MetadataEntryComponent ] + }) + .compileComponents(); + }); - beforeEach(() => { - fixture = TestBed.createComponent(MetadataEntryComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); + beforeEach(() => { + fixture = TestBed.createComponent(MetadataEntryComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); - it('should create', () => { - expect(component).toBeTruthy(); - }); + it("should create", () => { + expect(component).toBeTruthy(); + }); }); diff --git a/mediarepo-ui/src/app/components/shared/sidebar/file-search/filter-dialog/filter-dialog.component.ts b/mediarepo-ui/src/app/components/shared/sidebar/file-search/filter-dialog/filter-dialog.component.ts index 0db9725..96da108 100644 --- a/mediarepo-ui/src/app/components/shared/sidebar/file-search/filter-dialog/filter-dialog.component.ts +++ b/mediarepo-ui/src/app/components/shared/sidebar/file-search/filter-dialog/filter-dialog.component.ts @@ -8,7 +8,9 @@ import { } from "../../../../../models/FilterExpression"; import {TagQuery} from "../../../../../models/TagQuery"; import {Tag} from "../../../../../models/Tag"; -import {TagFilterListItemComponent} from "./tag-filter-list-item/tag-filter-list-item.component"; +import { + TagFilterListItemComponent +} from "./tag-filter-list-item/tag-filter-list-item.component"; import {Selectable} from "../../../../../models/Selectable"; @Component({ diff --git a/mediarepo-ui/src/app/components/shared/sidebar/sidebar.module.ts b/mediarepo-ui/src/app/components/shared/sidebar/sidebar.module.ts index 7b64e61..8f0eb52 100644 --- a/mediarepo-ui/src/app/components/shared/sidebar/sidebar.module.ts +++ b/mediarepo-ui/src/app/components/shared/sidebar/sidebar.module.ts @@ -3,7 +3,14 @@ import {CommonModule} from "@angular/common"; import {TagEditComponent} from "./tag-edit/tag-edit.component"; import {FileSearchComponent} from "./file-search/file-search.component"; import {NgIconsModule} from "@ng-icons/core"; -import {MatRemove, MatChangeCircle, MatAddCircle, MatRemoveCircle, MatDeleteSweep, MatFilterAlt, MatSave, MatEdit} from "@ng-icons/material-icons"; +import { + MatAddCircle, + MatChangeCircle, + MatDeleteSweep, + MatFilterAlt, + MatRemove, + MatRemoveCircle +} from "@ng-icons/material-icons"; import {MatRippleModule} from "@angular/material/core"; import {MatButtonModule} from "@angular/material/button"; import {InputModule} from "../input/input.module"; @@ -13,22 +20,34 @@ import {MatDividerModule} from "@angular/material/divider"; import {FlexModule} from "@angular/flex-layout"; import {MatSelectModule} from "@angular/material/select"; import {MatInputModule} from "@angular/material/input"; -import {TagFilterListItemComponent} from "./file-search/filter-dialog/tag-filter-list-item/tag-filter-list-item.component"; -import {SortDialogComponent} from "./file-search/sort-dialog/sort-dialog.component"; -import {FilterDialogComponent} from "./file-search/filter-dialog/filter-dialog.component"; +import { + TagFilterListItemComponent +} from "./file-search/filter-dialog/tag-filter-list-item/tag-filter-list-item.component"; +import { + SortDialogComponent +} from "./file-search/sort-dialog/sort-dialog.component"; +import { + FilterDialogComponent +} from "./file-search/filter-dialog/filter-dialog.component"; import {MatListModule} from "@angular/material/list"; import {MatDialogModule} from "@angular/material/dialog"; import {AppCommonModule} from "../app-common/app-common.module"; import {DragDropModule} from "@angular/cdk/drag-drop"; import {TagModule} from "../tag/tag.module"; -import { FileImportComponent } from "./file-import/file-import.component"; -import {FilesystemImportComponent} from "./file-import/filesystem-import/filesystem-import.component"; +import {FileImportComponent} from "./file-import/file-import.component"; +import { + FilesystemImportComponent +} from "./file-import/filesystem-import/filesystem-import.component"; import {MatCheckboxModule} from "@angular/material/checkbox"; import {MatProgressBarModule} from "@angular/material/progress-bar"; import {MatMenuModule} from "@angular/material/menu"; -import { FileMetadataComponent } from "./file-metadata/file-metadata.component"; -import { MetadataEntryComponent } from "./file-metadata/metadata-entry/metadata-entry.component"; -import { EditableMetadataEntryComponent } from "./file-metadata/editable-metadata-entry/editable-metadata-entry.component"; +import {FileMetadataComponent} from "./file-metadata/file-metadata.component"; +import { + MetadataEntryComponent +} from "./file-metadata/metadata-entry/metadata-entry.component"; +import { + EditableMetadataEntryComponent +} from "./file-metadata/editable-metadata-entry/editable-metadata-entry.component"; import {ReactiveFormsModule} from "@angular/forms"; diff --git a/mediarepo-ui/src/app/components/shared/sidebar/tag-edit/tag-edit.component.ts b/mediarepo-ui/src/app/components/shared/sidebar/tag-edit/tag-edit.component.ts index 8d9ca80..d40058e 100644 --- a/mediarepo-ui/src/app/components/shared/sidebar/tag-edit/tag-edit.component.ts +++ b/mediarepo-ui/src/app/components/shared/sidebar/tag-edit/tag-edit.component.ts @@ -1,6 +1,5 @@ import { Component, - ElementRef, Input, OnChanges, OnInit, diff --git a/mediarepo-ui/src/app/models/AppState.ts b/mediarepo-ui/src/app/models/AppState.ts index c6d69e3..d7d3b56 100644 --- a/mediarepo-ui/src/app/models/AppState.ts +++ b/mediarepo-ui/src/app/models/AppState.ts @@ -1,27 +1,48 @@ import {TabState} from "./TabState.rs"; import {FileService} from "../services/file/file.service"; +import {BehaviorSubject} from "rxjs"; +import {TabCategory} from "./TabCategory"; export class AppState { - public tabs: TabState[] = []; + private tabIdCounter = 0; + public tabs = new BehaviorSubject([]); - constructor() { + private readonly fileService: FileService + + constructor(fileService: FileService) { + this.fileService = fileService; + } + + public addTab(category: TabCategory): TabState { + const state = new TabState(this.tabIdCounter++, category, this.fileService); + this.tabs.next([...this.tabs.value, state]); + return state; + } + + public async closeTab(uuid: number) { + const index = this.tabs.value.findIndex(t => t.uuid === uuid); + const tabs = this.tabs.value; + tabs.splice(index, 1) + this.tabs.next(tabs); } public static deserializeJson(stateString: string, fileService: FileService): AppState { let state = JSON.parse(stateString); - let appState = new AppState(); - for (let tab of state.tabs) { - appState.tabs.push(TabState.fromDTO(tab, fileService)); - } + let appState = new AppState(fileService); + const tabs = state.tabs.map((tab: any) => TabState.fromDTO(tab, fileService)); + appState.tabs.next(tabs); + + appState.tabIdCounter = state.tabIdCounter; return appState } public serializeJson(): string { - const tabDTOs = this.tabs.map(tab => tab.getDTO()); + const tabDTOs = this.tabs.value.map(tab => tab.getDTO()); return JSON.stringify({ - tabs: tabDTOs + tabs: tabDTOs, + tabIdCounter: this.tabIdCounter, }); } } diff --git a/mediarepo-ui/src/app/services/file/file.service.ts b/mediarepo-ui/src/app/services/file/file.service.ts index 5858047..ea604b7 100644 --- a/mediarepo-ui/src/app/services/file/file.service.ts +++ b/mediarepo-ui/src/app/services/file/file.service.ts @@ -2,9 +2,7 @@ import {Inject, Injectable} from "@angular/core"; import {File} from "../../models/File"; import {invoke} from "@tauri-apps/api/tauri"; import {DomSanitizer, SafeResourceUrl} from "@angular/platform-browser"; -import {Thumbnail} from "../../models/Thumbnail"; import {SortKey} from "../../models/SortKey"; -import {RepositoryService} from "../repository/repository.service"; import {FilterExpression} from "../../models/FilterExpression"; diff --git a/mediarepo-ui/src/app/services/repository/repository.service.ts b/mediarepo-ui/src/app/services/repository/repository.service.ts index b348b5f..8681d69 100644 --- a/mediarepo-ui/src/app/services/repository/repository.service.ts +++ b/mediarepo-ui/src/app/services/repository/repository.service.ts @@ -5,7 +5,6 @@ import {invoke} from "@tauri-apps/api/tauri"; import {listen} from "@tauri-apps/api/event"; import {Info} from "../../models/Info"; import {ErrorBrokerService} from "../error-broker/error-broker.service"; -import {AppState} from "../../models/AppState"; import {FileService} from "../file/file.service"; @Injectable({ @@ -156,28 +155,6 @@ export class RepositoryService { await invoke("plugin:mediarepo|init_repository", {repoPath}); } - /** - * Returns the state of the frontend - * @returns {Promise} - */ - public async getFrontendState(): Promise { - let stateString = await invoke("plugin:mediarepo|get_frontend_state"); - if (stateString) { - return AppState.deserializeJson(stateString, this.fileService) - } else { - return new AppState(); - } - } - - /** - * Sets the state of the frontend - * @param {AppState} state - * @returns {Promise} - */ - public async setFrontendState(state: AppState): Promise { - await invoke("plugin:mediarepo|set_frontend_state", {state: state.serializeJson()}) - } - async loadSelectedRepository() { let active_repo = await invoke( "plugin:mediarepo|get_active_repository"); diff --git a/mediarepo-ui/src/app/services/state/state.service.spec.ts b/mediarepo-ui/src/app/services/state/state.service.spec.ts new file mode 100644 index 0000000..050dad3 --- /dev/null +++ b/mediarepo-ui/src/app/services/state/state.service.spec.ts @@ -0,0 +1,16 @@ +import {TestBed} from "@angular/core/testing"; + +import {StateService} from "./state.service"; + +describe("StateServiceService", () => { + let service: StateService; + + beforeEach(() => { + TestBed.configureTestingModule({}); + service = TestBed.inject(StateService); + }); + + it("should be created", () => { + expect(service).toBeTruthy(); + }); +}); diff --git a/mediarepo-ui/src/app/services/state/state.service.ts b/mediarepo-ui/src/app/services/state/state.service.ts new file mode 100644 index 0000000..d6816f1 --- /dev/null +++ b/mediarepo-ui/src/app/services/state/state.service.ts @@ -0,0 +1,76 @@ +import {Injectable} from "@angular/core"; +import {BehaviorSubject, Subscription} from "rxjs"; +import {AppState} from "../../models/AppState"; +import {invoke} from "@tauri-apps/api/tauri"; +import {FileService} from "../file/file.service"; +import {RepositoryService} from "../repository/repository.service"; +import {TabState} from "../../models/TabState.rs"; +import {debounceTime} from "rxjs/operators"; + +@Injectable({ + providedIn: "root" +}) +export class StateService { + + public state: BehaviorSubject; + + private tabSubscriptions: Subscription[] = []; + + private stateChange = new BehaviorSubject(undefined); + + constructor(private fileService: FileService, private repoService: RepositoryService) { + this.state = new BehaviorSubject(new AppState(fileService)); + this.repoService.selectedRepository.subscribe(async (repo) => { + if (repo) { + await this.loadState(); + } else { + const state = new AppState(this.fileService); + this.subscribeToState(state); + this.state.next(state); + } + }); + this.stateChange.pipe(debounceTime(1000)).subscribe(async () => this.saveState()); + } + + /** + * Returns the state of the frontend + * @returns {Promise} + */ + public async loadState() { + let stateString = await invoke( + "plugin:mediarepo|get_frontend_state"); + let state; + + if (stateString) { + state = AppState.deserializeJson(stateString, this.fileService) + } else { + state = new AppState(this.fileService); + } + this.subscribeToState(state); + this.state.next(state); + } + + private subscribeToState(state: AppState) { + state.tabs.subscribe(async tabs => { + this.tabSubscriptions.forEach(s => s.unsubscribe()); + tabs.forEach((tab) => this.subscribeToTab(tab)); + this.stateChange.next(); + }) + } + + private subscribeToTab(tab: TabState) { + this.tabSubscriptions.push(tab.filters + .subscribe(() => this.stateChange.next())); + this.tabSubscriptions.push(tab.sortKeys + .subscribe(() => this.stateChange.next())); + } + + /** + * Sets the state of the frontend + * @returns {Promise} + */ + public async saveState(): Promise { + await invoke("plugin:mediarepo|set_frontend_state", + {state: this.state.value.serializeJson()}) + } +} diff --git a/mediarepo-ui/src/app/services/tab/tab.service.ts b/mediarepo-ui/src/app/services/tab/tab.service.ts index 53f9f39..e41ecf9 100644 --- a/mediarepo-ui/src/app/services/tab/tab.service.ts +++ b/mediarepo-ui/src/app/services/tab/tab.service.ts @@ -1,55 +1,17 @@ import {Injectable} from "@angular/core"; import {BehaviorSubject} from "rxjs"; -import {TabState} from "../../models/TabState.rs"; -import {TabCategory} from "../../models/TabCategory"; -import {FileService} from "../file/file.service"; -import {AppState} from "../../models/AppState"; @Injectable({ providedIn: "root" }) export class TabService { - private tabIdCounter = 0; public selectedTab = new BehaviorSubject(0); - public tabs = new BehaviorSubject([]); - private appState?: AppState; - constructor(private fileService: FileService) { - } - - public restoreFromState(appState: AppState) { - this.tabs.next(appState.tabs); - this.appState = appState; + constructor() { } public setSelectedTab(index: number) { this.selectedTab.next(index); } - - public addTab(category: TabCategory): TabState { - const state = new TabState(this.tabIdCounter++, category, this.fileService); - this.tabs.next([...this.tabs.value, state]); - this.saveState(); - return state; - } - - public closeTab(uuid: number) { - const index = this.tabs.value.findIndex(t => t.uuid === uuid); - const tabs = this.tabs.value; - tabs.splice(index, 1) - this.saveState(); - this.tabs.next(tabs); - } - - public closeAllTabs() { - this.tabs.next([]); - this.saveState(); - } - - private saveState() { - if (this.appState) { - this.appState.tabs = this.tabs.value; - } - } } diff --git a/mediarepo-ui/src/assets/icon.svg b/mediarepo-ui/src/assets/icon.svg index 3dd0806..2496c1d 100644 --- a/mediarepo-ui/src/assets/icon.svg +++ b/mediarepo-ui/src/assets/icon.svg @@ -2,20 +2,20 @@ + width="120" + height="120" + viewBox="0 0 120 120" + version="1.1" + id="svg5" + sodipodi:docname="mediarepo-icon.svg" + inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20, custom)" + inkscape:export-filename="/home/trivernis/Pictures/mediarepo-icon_32x32.png" + inkscape:export-xdpi="25.6" + inkscape:export-ydpi="25.6" + xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" + xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" + xmlns="http://www.w3.org/2000/svg" +>