-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* update styles (#349) (#350) * config for running int tests on cloud * Feature/carousels (#340) * working demo of carousel * presentable example * remove unneeded tests * remove scss file * presentable with examples * get rid of 508 bad thingies * config for running int tests on cloud (#339) (#341) * fix navigation (#343) * Delete docker-build.yml * Update README.md * fix navigation (#345) * Dropdown logout (#347) --------- Signed-off-by: usiiasirrush <[email protected]> * fix angular routing (#351) * fix angular routing * remove remaining navcontents * uneeded test --------- Signed-off-by: usiiasirrush <[email protected]>
- Loading branch information
1 parent
2318fa7
commit d19deae
Showing
26 changed files
with
1,847 additions
and
1,637 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -80,4 +80,4 @@ button { | |
.logout-button { | ||
color: white; | ||
font-weight: bold; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,127 +1 @@ | ||
<span class="accessibility-tools"> | ||
<a | ||
#skipLink | ||
id="skipLink" | ||
href="#pageHeader" | ||
class="skip-to-main-content-link" | ||
>Skip to main content</a | ||
> | ||
</span> | ||
|
||
<span *ngIf="isContentShown"> | ||
<nav class="navbar navbar-light bg-light mb-3 navigation"> | ||
<div class="container-fluid"> | ||
<span *ngIf="isMobileLayout" class="col-sm-3"> | ||
<img | ||
style="width: 100px" | ||
class="logo" | ||
src="../assets/logo.png" | ||
alt="Neurodiversity in Buisness Logo" | ||
/> | ||
</span> | ||
|
||
<div *ngIf="!isMobileLayout" class="col-sm-3"> | ||
<img | ||
class="logo" | ||
src="../assets/logo.png" | ||
alt="Neurodiversity in Buisness Logo" | ||
/> | ||
</div> | ||
|
||
<div class="col" style="text-align: right"> | ||
<div> | ||
<button | ||
class="login-button btn btn-primary" | ||
*ngIf="!loginDisplay" | ||
(click)="loginRedirect()" | ||
> | ||
Login | ||
</button> | ||
|
||
<div *ngIf="loginDisplay" ngbDropdown class="d-inline-block"> | ||
<button | ||
type="button" | ||
ngbDropdownToggle | ||
class="btn btn-outline-primary" | ||
id="dropdownBasic1" | ||
> | ||
{{ username }} | ||
</button> | ||
<div ngbDropdownMenu aria-labelledby="dropdownBasic1"> | ||
<button ngbDropdownItem (click)="logout()">Logout</button> | ||
</div> | ||
</div> | ||
</div> | ||
<br /><br /> | ||
<div [(ngbCollapse)]="isMenuCollapsed" class="collapse navbar-collapse"> | ||
<ul | ||
[keyboard]="true" | ||
ngbNav | ||
[(ngbCollapse)]="isMenuCollapsed" | ||
#nav="ngbNav" | ||
[(activeId)]="navActiveId" | ||
class="nav" | ||
> | ||
<li [ngbNavItem]="1"> | ||
<button #homeButton id="homeButton" ngbNavLink>Home</button> | ||
<ng-template ngbNavContent> <app-home></app-home></ng-template> | ||
</li> | ||
<li [ngbNavItem]="2"> | ||
<button id="aboutButton" ngbNavLink>About Us</button> | ||
<ng-template ngbNavContent> <app-about></app-about></ng-template> | ||
</li> | ||
<li [ngbNavItem]="3"> | ||
<button id="memberButton" ngbNavLink>Become A Member</button> | ||
<ng-template ngbNavContent> | ||
<app-member-start></app-member-start | ||
></ng-template> | ||
</li> | ||
<li [ngbNavItem]="4"> | ||
<button id="researchButton" ngbNavLink>Research</button> | ||
<ng-template ngbNavContent> | ||
<app-research></app-research | ||
></ng-template> | ||
</li> | ||
<li [ngbNavItem]="5"> | ||
<button id="volunteerButton" ngbNavLink>Volunteer With Us</button> | ||
<ng-template ngbNavContent> | ||
<app-volunteer-start></app-volunteer-start | ||
></ng-template> | ||
</li> | ||
<li [ngbNavItem]="6"> | ||
<button | ||
onClick="location.href='https://neurodiversityinbusiness.org/ndresourcehub/'" | ||
id="hubButton" | ||
ngbNavLink | ||
> | ||
ND Resource Hub | ||
</button> | ||
<ng-template ngbNavContent> <app-hub></app-hub></ng-template> | ||
</li> | ||
<li [ngbNavItem]="7"> | ||
<button id="contactButton" ngbNavLink>Contact Us</button> | ||
<ng-template ngbNavContent> | ||
<app-contact-us></app-contact-us | ||
></ng-template> | ||
</li> | ||
</ul> | ||
</div> | ||
<div class="md-auto"> | ||
<button | ||
class="navbar-toggler" | ||
type="button" | ||
(click)="isMenuCollapsed = !isMenuCollapsed" | ||
> | ||
☰ | ||
</button> | ||
</div> | ||
</div> | ||
</div> | ||
</nav> | ||
<div [ngbNavOutlet]="nav" id="navOutlet" class="mt-2"></div | ||
></span> | ||
<div *ngIf="!isContentShown"> | ||
<router-outlet></router-outlet> | ||
</div> | ||
|
||
<app-footer> </app-footer> | ||
<app-landing></app-landing> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,186 +1,10 @@ | ||
import { | ||
AfterViewInit, | ||
Component, | ||
ElementRef, | ||
Inject, | ||
OnDestroy, | ||
OnInit, | ||
ViewChild, | ||
} from '@angular/core'; | ||
import { NavigationEnd, Router } from '@angular/router'; | ||
import { DisplayContentService } from './display-content.service'; | ||
import { | ||
MsalService, | ||
MsalBroadcastService, | ||
MSAL_GUARD_CONFIG, | ||
MsalGuardConfiguration, | ||
} from '@azure/msal-angular'; | ||
import { | ||
InteractionStatus, | ||
RedirectRequest, | ||
EventMessage, | ||
EventType, | ||
} from '@azure/msal-browser'; | ||
import { Location } from '@angular/common'; | ||
import { Subject } from 'rxjs/internal/Subject'; | ||
import { filter, takeUntil } from 'rxjs/operators'; | ||
import { Component } from '@angular/core'; | ||
|
||
@Component({ | ||
selector: 'app-root', | ||
templateUrl: './app.component.html', | ||
styleUrls: ['./app.component.css'], | ||
}) | ||
export class AppComponent implements OnInit, AfterViewInit, OnDestroy { | ||
@ViewChild('nav') nav: ElementRef; | ||
export class AppComponent { | ||
title = 'Neurodiversity in Business'; | ||
navActiveId = 1; | ||
isContentShown = true; | ||
isMenuCollapsed = window.innerWidth <= 991; | ||
loginDisplay = false; | ||
username = ''; | ||
private readonly _destroying$ = new Subject<void>(); | ||
|
||
public isMobileLayout = false; | ||
history: string[]; | ||
|
||
constructor( | ||
private displayContentService: DisplayContentService, | ||
private router: Router, | ||
@Inject(MSAL_GUARD_CONFIG) private msalGuardConfig: MsalGuardConfiguration, | ||
private authService: MsalService, | ||
private msalBroadcastService: MsalBroadcastService, | ||
private angularLocation: Location | ||
) { | ||
this.router.events.subscribe((event) => { | ||
if (event instanceof NavigationEnd) { | ||
if (this.history != undefined) { | ||
this.history.push(event.urlAfterRedirects); | ||
} | ||
} | ||
}); | ||
} | ||
|
||
ngOnInit() { | ||
if (window.innerWidth <= 991) { | ||
this.isMobileLayout = true; | ||
} | ||
window.onresize = () => { | ||
this.isMobileLayout = window.innerWidth <= 991; | ||
this.isMenuCollapsed = this.isMobileLayout; | ||
}; | ||
this.setLoginDisplay(); | ||
this.authService.handleRedirectObservable().subscribe((res) => { | ||
this.isContentShown = true; | ||
this.username = this.authService.instance.getActiveAccount()?.name!; | ||
console.log(res); | ||
}); | ||
|
||
this.authService.instance.enableAccountStorageEvents(); // Optional - This will enable ACCOUNT_ADDED and ACCOUNT_REMOVED events emitted when a user logs in or out of another tab or window | ||
this.msalBroadcastService.msalSubject$ | ||
.pipe( | ||
filter( | ||
(msg: EventMessage) => | ||
msg.eventType === EventType.ACCOUNT_ADDED || | ||
msg.eventType === EventType.ACCOUNT_REMOVED | ||
) | ||
) | ||
.subscribe((result: EventMessage) => { | ||
if (this.authService.instance.getAllAccounts().length === 0) { | ||
window.location.pathname = '/'; | ||
} else { | ||
this.setLoginDisplay(); | ||
} | ||
}); | ||
|
||
this.msalBroadcastService.inProgress$ | ||
.pipe( | ||
filter( | ||
(status: InteractionStatus) => status === InteractionStatus.None | ||
), | ||
takeUntil(this._destroying$) | ||
) | ||
.subscribe(() => { | ||
this.setLoginDisplay(); | ||
this.checkAndSetActiveAccount(); | ||
}); | ||
} | ||
|
||
ngAfterViewInit(): void { | ||
let this$ = this; | ||
|
||
if (window.location.hash == '#/' || window.location.hash.length == 0) { | ||
this.displayContentService.hideContent(); | ||
this.router.navigate([ | ||
'/', | ||
window.location.hash.replace('/', '').replace('#', ''), | ||
]); | ||
} | ||
|
||
this.displayContentService.displayContentObservable$.subscribe({ | ||
next(flag) { | ||
if (flag == 'hide') { | ||
this$.isContentShown = false; | ||
} else { | ||
this$.isContentShown = true; | ||
} | ||
}, | ||
}); | ||
} | ||
setLoginDisplay() { | ||
this.loginDisplay = this.authService.instance.getAllAccounts().length > 0; | ||
} | ||
checkAndSetActiveAccount() { | ||
/** | ||
* If no active account set but there are accounts signed in, sets first account to active account | ||
* To use active account set here, subscribe to inProgress$ first in your component | ||
* Note: Basic usage demonstrated. Your app may require more complicated account selection logic | ||
*/ | ||
let activeAccount = this.authService.instance.getActiveAccount(); | ||
|
||
if ( | ||
!activeAccount && | ||
this.authService.instance.getAllAccounts().length > 0 | ||
) { | ||
let accounts = this.authService.instance.getAllAccounts(); | ||
this.authService.instance.setActiveAccount(accounts[0]); | ||
} | ||
} | ||
loginRedirect() { | ||
if (this.msalGuardConfig.authRequest) { | ||
this.authService.loginRedirect({ | ||
...this.msalGuardConfig.authRequest, | ||
} as RedirectRequest); | ||
} else { | ||
this.authService.loginRedirect(); | ||
} | ||
} | ||
|
||
logout(popup?: boolean) { | ||
if (popup) { | ||
this.authService.logoutPopup({ | ||
mainWindowRedirectUri: '/', | ||
}); | ||
} else { | ||
this.authService.logoutRedirect(); | ||
} | ||
} | ||
|
||
ngOnDestroy(): void { | ||
this._destroying$.next(undefined); | ||
this._destroying$.complete(); | ||
} | ||
toggleContent(flag: string) { | ||
if (flag == 'hide') { | ||
this.isContentShown = false; | ||
} else { | ||
this.isContentShown = true; | ||
} | ||
} | ||
back(): void { | ||
this.history.pop(); | ||
if (this.history.length > 0) { | ||
this.angularLocation.back(); | ||
} else { | ||
this.router.navigate([this.angularLocation.path()]); | ||
} | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.