hazza/dspace-angular
1
0
Fork 1
mirror of https://github.com/DSpace/dspace-angular.git synced 2025-10-15 14:03:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

sidebar animations

Browse Source
This commit is contained in:
lotte
2018-11-23 14:44:11 +01:00
parent ea3a2076c7
commit 567d4dc331
20 changed files with 326 additions and 231 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
src/app/+admin/admin-sidebar/admin-sidebar.component.ts
View File

@@ -1,59 +1,27 @@
import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs/internal/Observable';
import { MemoizedSelector, select, Store } from '@ngrx/store';
import { AdminSidebarSectionState, AdminSidebarState, } from './admin-sidebar.reducer';
import { hasValue } from '../../shared/empty.util';
import { map } from 'rxjs/operators';
import {
AdminSidebarSectionCollapseAllAction,
AdminSidebarSectionToggleAction,
AdminSidebarToggleAction
} from './admin-sidebar.actions';
import { AppState, keySelector } from '../../app.reducer';
import { slideSidebar } from '../../shared/animations/slide';
import { CSSVariableService } from '../../shared/sass-helper/sass-helper.service';
import { rotateInOut } from '../../shared/animations/rotate';
const sidebarSectionStateSelector = (state: AppState) => state.adminSidebar.sections;
const sidebarStateSelector = (state) => state.adminSidebar;
const sectionByNameSelector = (name: string): MemoizedSelector<AppState, AdminSidebarSectionState> => {
return keySelector<AdminSidebarSectionState>(name, sidebarSectionStateSelector);
};
import { AdminSidebarService } from './admin-sidebar.service';
@Component({
selector: 'ds-admin-sidebar',
templateUrl: './admin-sidebar.component.html',
styleUrls: ['./admin-sidebar.component.scss'],
animations: [slideSidebar, rotateInOut]
animations: [slideSidebar]
})
export class AdminSidebarComponent implements OnInit {
sidebarCollapsed: Observable<boolean>;
sidebarWidth: Observable<string>;
sidebarActive = true;
constructor(private store: Store<AdminSidebarState>,
constructor(private sidebarService: AdminSidebarService,
private variableService: CSSVariableService) {
}
ngOnInit(): void {
this.sidebarWidth = this.variableService.getVariable('adminSidebarWidth')
this.sidebarCollapsed = this.store.pipe(
select(sidebarStateSelector),
map((state: AdminSidebarState) => state.collapsed)
);
}
public active(name: string): Observable<boolean> {
return this.store.pipe(
select(sectionByNameSelector(name)),
map((state: AdminSidebarSectionState) => hasValue(state) ? !state.sectionCollapsed : false)
);
}
toggleSection(event: Event, name: string) {
event.preventDefault();
this.store.dispatch(new AdminSidebarSectionToggleAction(name));
this.sidebarWidth = this.variableService.getVariable('adminSidebarWidth');
this.sidebarCollapsed = this.sidebarService.isSidebarCollapsed();
}
toggle(event: Event) {
@@ -61,9 +29,9 @@ export class AdminSidebarComponent implements OnInit {
// Is sidebar closing?
if (this.sidebarActive) {
this.sidebarActive = false;
this.store.dispatch(new AdminSidebarSectionCollapseAllAction());
this.sidebarService.collapseAllSections();
}
this.store.dispatch(new AdminSidebarToggleAction());
this.sidebarService.toggleSidebar();
}
/**