sgh-navbar 0.0.37 → 0.0.38

package/src/lib/sgh-navbar.service.spec.ts

@@ -1,16 +0,0 @@
-import { TestBed } from '@angular/core/testing';
-
-import { SghNavbarService } from './sgh-navbar.service';
-
-describe('SghNavbarService', () => {
-  let service: SghNavbarService;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({});
-    service = TestBed.inject(SghNavbarService);
-  });
-
-  it('should be created', () => {
-    expect(service).toBeTruthy();
-  });
-});

package/src/lib/sgh-navbar.service.ts

@@ -1,34 +0,0 @@
-import { Injectable } from '@angular/core';
-import {BehaviorSubject} from "rxjs";
-
-@Injectable({
-  providedIn: 'root'
-})
-export class SghNavbarService {
-  expanded:boolean;
-  client = new BehaviorSubject({});
-  subClient = new BehaviorSubject({});
-  setExpanded(value: boolean) {
-    this.expanded = value;
-  }
-
-  getExpanded() {
-    return this.expanded;
-  }
-
-  setClient(client) {
-    this.client.next(client);
-  }
-
-  getClient() {
-    return this.client;
-  }
-
-  setSubclient(subclient) {
-    this.subClient.next(subclient);
-  }
-
-  getSubclient() {
-    return this.subClient;
-  }
-}

package/src/lib/sidenav/helper.ts

@@ -1,25 +0,0 @@
-import { animate, style, transition, trigger } from "@angular/animations";
-
-export interface INavbarData {
-    routeLink: string;
-    icon?: string;
-    label: string;
-    expanded?: boolean;
-    visible: boolean;
-    items?: INavbarData[];
-}
-
-export const fadeInOut = trigger('fadeInOut', [
-    transition(':enter', [
-      style({opacity: 0}),
-      animate('350ms',
-        style({opacity: 1})
-      )
-    ]),
-    transition(':leave', [
-      style({opacity: 1}),
-      animate('350ms',
-        style({opacity: 0})
-      )
-    ])
-  ])

package/src/lib/sidenav/menu-list-item/item1/item1.component.html

@@ -1 +0,0 @@
-<p>item1 works!</p>

package/src/lib/sidenav/menu-list-item/item1/item1.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { Item1Component } from './item1.component';
-
-describe('Item1Component', () => {
-  let component: Item1Component;
-  let fixture: ComponentFixture<Item1Component>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ Item1Component ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(Item1Component);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/sidenav/menu-list-item/item1/item1.component.ts

@@ -1,15 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-item1',
-  templateUrl: './item1.component.html',
-  styleUrls: ['./item1.component.scss']
-})
-export class Item1Component implements OnInit {
-
-  constructor() { }
-
-  ngOnInit(): void {
-  }
-
-}

package/src/lib/sidenav/menu-list-item/item1/sub-item1/sub-item1.component.html

@@ -1 +0,0 @@
-<p>sub-item1 works!</p>

package/src/lib/sidenav/menu-list-item/item1/sub-item1/sub-item1.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { SubItem1Component } from './sub-item1.component';
-
-describe('SubItem1Component', () => {
-  let component: SubItem1Component;
-  let fixture: ComponentFixture<SubItem1Component>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ SubItem1Component ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(SubItem1Component);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/sidenav/menu-list-item/item1/sub-item1/sub-item1.component.ts

@@ -1,15 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-sub-item1',
-  templateUrl: './sub-item1.component.html',
-  styleUrls: ['./sub-item1.component.scss']
-})
-export class SubItem1Component implements OnInit {
-
-  constructor() { }
-
-  ngOnInit(): void {
-  }
-
-}

package/src/lib/sidenav/menu-list-item/item2/item2.component.html

@@ -1 +0,0 @@
-<p>item2 works!</p>

package/src/lib/sidenav/menu-list-item/item2/item2.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { Item2Component } from './item2.component';
-
-describe('Item2Component', () => {
-  let component: Item2Component;
-  let fixture: ComponentFixture<Item2Component>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ Item2Component ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(Item2Component);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/sidenav/menu-list-item/item2/item2.component.ts

@@ -1,15 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-item2',
-  templateUrl: './item2.component.html',
-  styleUrls: ['./item2.component.scss']
-})
-export class Item2Component implements OnInit {
-
-  constructor() { }
-
-  ngOnInit(): void {
-  }
-
-}

package/src/lib/sidenav/menu-list-item/item3/item3.component.html

@@ -1 +0,0 @@
-<p>item3 works!</p>

package/src/lib/sidenav/menu-list-item/item3/item3.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { Item3Component } from './item3.component';
-
-describe('Item3Component', () => {
-  let component: Item3Component;
-  let fixture: ComponentFixture<Item3Component>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ Item3Component ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(Item3Component);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/sidenav/menu-list-item/item3/item3.component.ts

@@ -1,15 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-item3',
-  templateUrl: './item3.component.html',
-  styleUrls: ['./item3.component.scss']
-})
-export class Item3Component implements OnInit {
-
-  constructor() { }
-
-  ngOnInit(): void {
-  }
-
-}

package/src/lib/sidenav/menu-list-item/menu-list-item.component.html

@@ -1,17 +0,0 @@
-<div class="sidebar_div" *ngFor="let data of items">
-  <a (click)="onItemSelected(data)" class="sub-link"
-     [routerLink]="[data.routeLink]" routerLinkActive="item-active" *ngIf="data.visible">
-    <div class="text-wrapper">
-      <i class="fa-size fa fa-{{data.icon}} {{data.icon ? '' : 'padding-10'}}"></i>
-      <div class="text-div">
-        {{data.label}}
-      </div>
-    </div>
-    <i class="fa-size fa fa-angle-down" *ngIf="!(data.items == undefined)"
-       [@indicatorRotate]="data.expanded ? 'expanded': 'collapsed'"></i>
-  </a>
-  <div class="sub-link-wrapper" *ngIf="data.expanded">
-    <app-menu-list-item [items]="data.items">
-    </app-menu-list-item>
-  </div>
-</div>

package/src/lib/sidenav/menu-list-item/menu-list-item.component.scss

@@ -1,128 +0,0 @@
-.padding-10{
-  padding-left: 10px;
-}
-.text-div{
-  text-align: initial;
-  padding-left: 10px;
-}
-.sub-link {
-  padding-left: 30px !important;
-}
-
-.sidebar_div {
-  margin: 0;
-  padding: 0;
-  //width: 200px;
-
-  //position: fixed;
-  //height: 100%;
-  overflow: auto;
-
-}
-
-/* sidebar_div links */
-.sidebar_div a {
-  color: #005860;
-  padding: 10px 13px;
-  text-decoration: none;
-  margin: 0px 2px;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-
-}
-
-/* Active/current link */
-.sidebar_div a.active {
-  background-color: #006068;
-  color: white;
-  border-radius: 13px;
-}
-
-/* Links on mouse-over */
-.sidebar_div a:hover:not(.active) {
-  background-color: #26787f !important;
-  color: white;
-  border-radius: 13px;
-}
-
-/* Page content. The value of the margin-left property should match the value of the sidebar_div's width property */
-div.content {
-  margin-left: 200px;
-  padding: 1px 16px;
-  height: 1000px;
-}
-
-/* On screens that are less than 700px wide, make the sidebar_div into a topbar */
-@media screen and (max-width: 700px) {
-  .sidebar_div {
-    width: 100%;
-    height: auto;
-    position: relative;
-  }
-  .sidebar_div a {
-    float: left;
-    width: -webkit-fill-available;
-  }
-  div.content {
-    margin-left: 0;
-  }
-}
-
-/* On screens that are less than 400px, display the bar vertically, instead of horizontally */
-@media screen and (max-width: 400px) {
-  .sidebar_div a {
-    text-align: center;
-    float: none;
-  }
-}
-
-
-.nav-list li a {
-  text-decoration: none;
-  display: block;
-  padding: 10px;
-  cursor: pointer;
-  border-bottom: 1px solid #515151 !important;
-  color: #9d9d9d;
-}
-
-.nav-list > li > a {
-  color: #C4C4C4;
-  font-size: 14px;
-  padding-left: 13px !important;
-  border-bottom: 1px solid #585858;
-}
-
-.nav-list > li > a:hover {
-  background-color: #444444;
-}
-
-.sidenav-overlay {
-  display: none;
-  position: fixed;
-  width: 100%;
-  height: 100%;
-  background-color: #0009 !important;
-  left: 0%;
-  top: 0;
-  z-index: -1;
-  cursor: default;
-}
-
-.text-wrapper {
-  display: flex !important;
-  align-items: center !important;
-  margin-left: 10px !important;
-}
-
-@media screen and (max-width: 600px) {
-  .sgh-sidebar {
-    position: absolute !important;
-    background: white !important;
-  }
-  .sidenav-overlay {
-    display: block;
-  }
-
-}

package/src/lib/sidenav/menu-list-item/menu-list-item.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { MenuListItemComponent } from './menu-list-item.component';
-
-describe('MenuListItemComponent', () => {
-  let component: MenuListItemComponent;
-  let fixture: ComponentFixture<MenuListItemComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ MenuListItemComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(MenuListItemComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/sidenav/menu-list-item/menu-list-item.component.ts

@@ -1,42 +0,0 @@
-import {Component, HostBinding, Input, OnInit, ViewEncapsulation} from '@angular/core';
-import {INavbarData} from '../helper';
-import {Router} from '@angular/router';
-import {animate, state, style, transition, trigger} from '@angular/animations';
-
-@Component({
-  selector: 'app-menu-list-item',
-  templateUrl: './menu-list-item.component.html',
-  styleUrls: ['./menu-list-item.component.scss'],
-  encapsulation:ViewEncapsulation.None,
-  animations: [
-    trigger('indicatorRotate', [
-      state('collapsed', style({transform: 'rotate(0deg)'})),
-      state('expanded', style({transform: 'rotate(180deg)'})),
-      transition('expanded <=> collapsed',
-        animate('225ms cubic-bezier(0.4,0.0,0.2,1)')
-      ),
-    ])
-  ]
-})
-export class MenuListItemComponent implements OnInit {
-  expanded: boolean;
-  expandMenu: boolean;
-  // @ts-ignore
-  @HostBinding('attr.aria-expanded') ariaExpanded = this.expanded;
-  @Input() items: any;
-
-  constructor(public router: Router) { }
-
-  ngOnInit(): void {
-  }
-
-  onItemSelected(item: INavbarData) {
-    if (!item.items || !item.items.length) {
-      this.router.navigate([item.routeLink]).then();
-    }
-    if (item.items && item.items.length) {
-      item.expanded = !item.expanded;
-    }
-  }
-
-}

package/src/lib/sidenav/nav-data.ts

@@ -1,98 +0,0 @@
-import { INavbarData } from "./helper";
-
-export const navbarData: INavbarData[] = [
-  {
-    "label": "Dashboard",
-    "icon": "home",
-    "routeLink": "dashboard",
-    "visible": true,
-    "items": [
-      {
-        "label": "Cards",
-        "icon": "home",
-        "routeLink": "dashboard/cards",
-        "visible": true,
-      },
-      {
-        "label": "Charts",
-        "icon": "home",
-        "routeLink": "dashboard/charts",
-        "visible": true,
-        "items": [
-          {
-            "label": "Vertical bar chart",
-            "icon": "",
-            "routeLink": "dashboard/charts/pages/vertical-bar-chart",
-            "visible": true
-          },
-          {
-            "label": "Horizontal bar chart",
-            "icon": "",
-            "routeLink": "dashboard/charts/pages/horizontal-bar-chart",
-            "visible": true
-          },
-          {
-            "label": "Grouped horizontal bar chart",
-            "icon": "",
-            "routeLink": "dashboard/charts/pages/grouped-horizontal-bar-chart",
-            "visible": true
-          },
-          {
-            "label": "Grouped vertical bar chart",
-            "icon": "",
-            "routeLink": "dashboard/charts/pages/grouped-vertical-bar-chart",
-            "visible": true
-          },
-          {
-            "label": "Pie chart",
-            "icon": "",
-            "routeLink": "dashboard/charts/pages/pie-chart",
-            "visible": true
-          },
-          {
-            "label": "Advanced pie chart",
-            "icon": "",
-            "routeLink": "dashboard/charts/pages/advanced-pie-chart",
-            "visible": true
-          },
-          {
-            "label": "Pie grid chart",
-            "icon": "",
-            "routeLink": "dashboard/charts/pages/pie-grid-chart",
-            "visible": true
-          },
-          {
-            "label": "Line chart",
-            "icon": "",
-            "routeLink": "dashboard/charts/pages/line-chart",
-            "visible": true
-          },
-          {
-            "label": "Number card chart",
-            "icon": "",
-            "routeLink": "dashboard/charts/pages/number-card-chart",
-            "visible": true
-          },
-          {
-            "label": "Linear gauge chart",
-            "icon": "",
-            "routeLink": "dashboard/charts/pages/linear-gauge-chart",
-            "visible": true
-          },
-          {
-            "label": "Combo chart",
-            "icon": "",
-            "routeLink": "dashboard/charts/pages/combo-chart",
-            "visible": true
-          }
-        ]
-      }
-    ]
-  },
-  {
-    "label": "Form elements",
-    "icon": "home",
-    "routeLink": "main",
-    "visible": true,
-  },
-];

package/src/lib/sidenav/sidenav-data.ts

@@ -1,12 +0,0 @@
-import {INavbarData} from "./helper";
-import {ClientListItem, SubClientListItem} from "../toolbar/toolbar-data";
-
-export class SidenavData {
-  navData:INavbarData[];
-  bgColor:string;
-  imgSm:string;
-  imgLg:string;
-  client?: ClientListItem;
-  subclient?: SubClientListItem;
-  activeRole?: string;
-}

package/src/lib/sidenav/sidenav.component.html

@@ -1,34 +0,0 @@
-<div class="close sidenav-overlay" *ngIf="expanded"></div>
-<aside class="sgh-sidebar" *ngIf="expanded" [@slideInOut]>
-  <div class="menu-wrapper">
-    <div class="sidebar_div " *ngFor="let data of sidenavData.navData">
-      <a (click)="onItemSelected(data)"
-         [routerLink]="[data.routeLink]" routerLinkActive="item-active" *ngIf="data.visible">
-        <div class="text-wrap">
-          <div class="icon-wrapper">
-            <i class="fa-size fa fa-{{data.icon}}"></i>
-          </div>
-          <div>
-            {{data.label}}
-          </div>
-        </div>
-        <i class="fa-size fa fa-angle-down" *ngIf="!(data.items == undefined)"
-           [@indicatorRotate]="data.expanded ? 'expanded': 'collapsed'"></i>
-      </a>
-      <div class="sub-link-wrapper" *ngIf="data.expanded">
-        <app-menu-list-item [items]="data.items">
-        </app-menu-list-item>
-      </div>
-    </div>
-    <div class="auth-info-wrp">
-      <div *ngIf="client && subclient" class="client-info-wrp">
-        <div>{{client?.text}}</div>
-        <i class="fa fa-angle-right"></i>
-        <div>{{subclient?.text}}</div>
-      </div>
-      <div *ngIf="sidenavData.activeRole" class="role-info-wrp">
-        <span class="role-info-text">Logged in as </span>
-        <span class="role-info-text role">{{sidenavData.activeRole}}</span></div>
-    </div>
-  </div>
-</aside>