2 Copyright 2020 TATA ELXSI
4 Licensed under the Apache License, Version 2.0 (the 'License');
5 you may not use this file except in compliance with the License.
6 You may obtain a copy of the License at
8 http://www.apache.org/licenses/LICENSE-2.0
10 Unless required by applicable law or agreed to in writing, software
11 distributed under the License is distributed on an "AS IS" BASIS,
12 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 See the License for the specific language governing permissions and
14 limitations under the License.
16 Author: KUMARAN M (kumaran.m@tataelxsi.co.in), RAJESH S (rajesh.s@tataelxsi.co.in), BARATH KUMAR R (barath.r@tataelxsi.co.in)
20 * @file Sidebar Component
22 import { isNullOrUndefined } from 'util';
23 import { Component, Injector, OnInit } from '@angular/core';
24 import { DeviceCheckService } from 'DeviceCheckService';
25 import { MENU_ITEMS, MENUITEMS } from 'src/models/MenuModel';
29 * @Component takes SidebarComponent.html as template url
32 selector: 'app-sidebar',
33 templateUrl: './SidebarComponent.html',
34 styleUrls: ['./SidebarComponent.scss']
36 /** Exporting a class @exports SidebarComponent */
37 export class SidebarComponent implements OnInit {
38 /** To inject services @public */
39 public injector: Injector;
41 /** submenu router endpoints @public */
42 public routerEndpoint: string;
44 /** submenu router endpoints @public */
45 public getMenus: MENUITEMS[];
47 /** selected Menu @public */
48 public selectedItem: string;
50 /** get the classlist @public */
51 public elementCheck: HTMLCollection;
53 /** Apply active class for Desktop @public */
54 public classAppliedForDesktop: boolean = false;
56 /** Apply active class for mobile @public */
57 public classAppliedForMobile: boolean = false;
59 /** Device Check service @public */
60 public deviceCheckService: DeviceCheckService;
62 /** Check for the mobile @public */
63 public isMobile$: boolean;
65 constructor(injector: Injector) {
66 this.injector = injector;
67 this.deviceCheckService = this.injector.get(DeviceCheckService);
68 this.getMenus = MENU_ITEMS;
71 /** Lifecyle Hooks the trigger before component is instantiate @public */
72 public ngOnInit(): void {
73 this.deviceCheckService.checkDeviceType();
74 this.deviceCheckService.isMobile.subscribe((checkIsMobile: boolean) => {
75 this.isMobile$ = checkIsMobile;
79 /** method to open sideBarOpen in all the views */
80 public sideBarOpenClose(): void {
82 this.classAppliedForMobile = !this.classAppliedForMobile;
84 this.classAppliedForDesktop = !this.classAppliedForDesktop;
86 this.addClassMainWrapper();
88 /** Add class for mobile/Desktop in main-wrapper @public */
89 public addClassMainWrapper(): void {
90 const elementMain: HTMLElement = document.querySelector('#main-wrapper');
91 if (!isNullOrUndefined(elementMain)) {
93 elementMain.classList.toggle('sidebar-mobile');
95 elementMain.classList.toggle('sidebar-desktop');
99 /** Return the Device type @public */
100 public getDeviceType(): void {
101 if (this.isMobile$) {
102 this.classAppliedForMobile = true;
103 this.classAppliedForDesktop = false;
105 this.classAppliedForMobile = false;
106 this.classAppliedForDesktop = false;
108 this.addClassMainWrapper();
110 /** Set the SideBar Menus click function @public */
111 public handleMenuFunction(index: number, method: string, className: string, childExists: boolean): void {
112 this.selectedItem = method;
113 if (!isNullOrUndefined(method)) {
114 this.parentactiveClassAddRemove(index, method, className, childExists);
117 /** Removing the parentactive class which is already present and add it to current @public */
118 public parentactiveClassAddRemove(index: number, method: string, className: string, childExists: boolean): void {
119 const element: HTMLElement = document.querySelector('#' + method + '' + index);
120 const checkOpenedelement: boolean = element.classList.contains(className);
121 if (!checkOpenedelement) {
122 this.elementCheck = document.getElementsByClassName(className);
123 if (this.elementCheck.length > 0) {
124 this.removeClasses(className);
127 if (method !== 'nosubmenu') {
128 element.classList.toggle(className);
130 if (this.isMobile$ && !childExists) {
131 this.checkAndCloseSideBar(childExists);
134 /** Hide / Show Menus based on the clicking in the menus @public */
135 public checkAndCloseSideBar(childExists: boolean): void {
136 // eslint-disable-next-line deprecation/deprecation
137 event.stopPropagation();
138 if (this.isMobile$ && !childExists) {
139 this.sideBarOpenClose();
142 /** remove existing Class @public */
143 public removeClasses(className: string): void {
144 this.elementCheck[0].classList.remove(className);
145 if (this.elementCheck[0]) {
146 this.removeClasses(className);