Skip to content

Commit

Permalink
Fixed Firefox issues
Browse files Browse the repository at this point in the history
  • Loading branch information
@chuanlin2018
chuanlin2018 committed Nov 14, 2024
1 parent f87ccdc commit 29ea55a
Show file tree
Hide file tree
Showing 15 changed files with 199 additions and 173 deletions.
11 changes: 8 additions & 3 deletions angular/src/app/_helpers/fakeBackendInterceptor.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,17 @@ import { userInfo } from 'os';

@Injectable()
export class FakeBackendInterceptor implements HttpInterceptor {

_storage: Storage = null;
constructor(private http: HttpClient) { }

intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
//Read local storage, if exist, set the flag so the alert will not display again
//Otherwise, set storage and display alert
if(!localStorage.getItem("fakebackend")) {
localStorage.setItem("fakebackend", "true");
alert("You are using fake backend!");
}

// array in local storage for registered users

// const sampleData: any = require('../../assets/science-theme/BiometricsScienceTheme.json');
Expand Down Expand Up @@ -44,8 +51,6 @@ export class FakeBackendInterceptor implements HttpInterceptor {

// wrap in delayed observable to simulate server api call
return of(null).pipe(mergeMap(() => {
alert("You are using fake backend!");

console.log("request.url", request.url);

// RPA
Expand Down
2 changes: 1 addition & 1 deletion angular/src/app/landing/contact/contact.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
href="{{record.contactPoint.hasEmail}}" target="_top">
{{record.contactPoint.fn}}</a>
<span *ngIf="!isEmail">{{record.contactPoint.fn}}</span>
</strong>..
</strong>.
<i style="cursor: pointer; margin-left: 5px;" class="faa"
[ngClass]="expandIconClass"
aria-hidden="true" data-toggle="tooltip" [title]="expandButtonAlterText" [aria-label]="expandButtonAlterText" (click)="toggleExpand()"></i>
Expand Down
2 changes: 1 addition & 1 deletion angular/src/app/landing/facilitators/facilitators.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<div class="editable_field" style="max-width:calc(100% - 4em);"
[ngStyle]="getFieldStyle()">
<span *ngIf="record['facilitators']">
<span *ngFor="let facilitator of record.facilitators; let i = index" (click)="openModal()">
<span *ngFor="let facilitator of record.facilitators; let i = index" (click)="toggleExpand()" style="cursor: pointer;">
{{facilitator.fn.trim()}}<span *ngIf="i < record.facilitators.length-1; else theEnd">,</span><ng-template #theEnd>.</ng-template>
</span>
<i style="margin-left: 0.5rem; cursor: pointer;" class="faa"
Expand Down
18 changes: 10 additions & 8 deletions angular/src/app/landing/filters/filters.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,10 +28,12 @@
<div style="padding-left: -1em;padding-right: -2em;" *ngIf="isActive && !searching">
<!-- Loop through all themes -->
<div *ngFor="let key of collectionOrder">
<app-taxonomy [collectionThemesTree]="allCollections[key].theme?.collectionThemesTree" [collection]="key" [isCollection]="true"
[colorScheme]="colorScheme" [collectionNodeExpanded]="true" [clearAllCheckbox]="clearAllCheckbox"
(filterString)="updateFilterString($event, key)">
</app-taxonomy>
<div *ngIf="allCollections[key].theme">
<app-taxonomy [collectionThemesTree]="allCollections[key].theme.collectionThemesTree" [collection]="key" [isCollection]="true"
[colorScheme]="colorScheme" [collectionNodeExpanded]="true" [clearAllCheckbox]="clearAllCheckbox"
(filterObj)="updateFilterObj($event, key)">
</app-taxonomy>
</div>
</div>

<div *ngIf="theme=='ScienceTheme'" style="width: 100%;">
Expand All @@ -44,14 +46,14 @@
<!-- Type of Resource -->
<app-taxonomy [collectionThemesTree]="resourceTypeTree" collection="@type" [isCollection]="false"
[colorScheme]="colorScheme" [collectionNodeExpanded]="false" [clearAllCheckbox]="clearAllCheckbox"
(filterString)="updateFilterString($event, '@type')">
(filterObj)="updateFilterObj($event, '@type')">
</app-taxonomy>

<!-- Components (Record has) -->
<div class="filter-checkbox bottom-line" *ngIf="componentsTree.length > 0">
<app-taxonomy [collectionThemesTree]="componentsTree" collection="components.@type" [isCollection]="false"
[colorScheme]="colorScheme" [collectionNodeExpanded]="false" [clearAllCheckbox]="clearAllCheckbox"
(filterString)="updateFilterString($event, 'components.@type')">
(filterObj)="updateFilterObj($event, 'components.@type')">
</app-taxonomy>
</div>
</div>
Expand All @@ -66,7 +68,7 @@
<label for="suggestedauthor" class="hideLabel">Search Input</label>
<p-autoComplete [(ngModel)]="selectedAuthor" inputId="suggestedauthor"
[suggestions]="suggestedAuthors" (completeMethod)="filterAuthors($event)"
(onSelect)="filterResults()" (onUnselect)="filterResults()" [multiple]="true"
(onSelect)="createFilterObj()" (onUnselect)="createFilterObj()" [multiple]="true"
[minLength]="1" [maxlength]="30" [style]="filterStyle">
<ng-template let-author pTemplate="item">
<div data-toggle="tooltip" [title]="author">{{author}}</div>
Expand All @@ -84,7 +86,7 @@
<label for="keyword" class="hideLabel">Keyword</label>
<p-autoComplete inputId="keyword" [(ngModel)]="selectedKeywords"
[suggestions]="suggestedKeywords" (completeMethod)="updateSuggestedKeywords($event)"
[multiple]="true" (onSelect)="filterResults()" (onUnselect)="filterResults()"
[multiple]="true" (onSelect)="createFilterObj()" (onUnselect)="createFilterObj()"
[minLength]="1" [maxlength]="30" [style]="filterStyle" [inputStyle]="{'width':'100%'}">
<ng-template let-keyword pTemplate="item">
<div data-toggle="tooltip" [title]="suggestedKeywordsLkup[keyword]">{{keyword}}</div>
Expand Down
105 changes: 39 additions & 66 deletions angular/src/app/landing/filters/filters.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@ export class FiltersComponent implements OnInit {
clearAllCheckbox: boolean = false;

collectionThemesWithCount: FilterTreeNode[] = [];
filterStrings = {};
filterObjs = {};

// Object that hold all themes: Forensics, NIST, ...
allCollections: any = {};
Expand Down Expand Up @@ -144,7 +144,7 @@ export class FiltersComponent implements OnInit {
@Input() collection: string = Collections.FORENSICS;
@Input() taxonomyURI: any = {};
@Output() filterMode = new EventEmitter<string>(); // normal or collapsed
@Output() filterString = new EventEmitter<string>();
@Output() filterObjsOut = new EventEmitter<any[]>();

constructor(
public taxonomyListService: TaxonomyListService,
Expand All @@ -157,7 +157,7 @@ export class FiltersComponent implements OnInit {
}

ngOnInit(): void {
this.collectionService.loadAllCollections();
// this.collectionService.loadAllCollections();

this.collectionOrder = this.collectionService.getCollectionOrder();
this.msgs = [];
Expand All @@ -180,97 +180,76 @@ export class FiltersComponent implements OnInit {
* Update the filter string object based on the input filter string
* @param $event filter string returned from app-taxonomy
*/
updateFilterString(event, collection: string) {
let _filterString = event;
if(!event) _filterString = "";
updateFilterObj(event, collection: string) {
let _filterObj = event;
if(!event) _filterObj = null;

this.filterStrings[collection] = _filterString;
this.filterObjs[collection] = _filterObj;

this.filterResults();
}

/**
* Replace reserved chars with char name to avoid problems
* when parsing filter string in the result list component.
* For example, replace "&" with "aaamp". result list component
* restore "aaamp" back to "&".
* @param strng input string
*/
escapeReservedChars(inputStrng: string) {
let outputString: string;
if(!inputStrng || inputStrng.trim() == "")
return "";
else
return inputStrng.replace(new RegExp("&", "g"), "aaamp")
this.createFilterObj();
}

/**
* Form the filter string and refresh the result page
*/
filterResults() {
let lFilterString: string = "";
this.selectedThemes = [];
this.selectedComponents = [];
this.selectedResourceType = [];
let componentSelected: boolean = false;
let resourceTypesSelected: boolean = false;
let compType = '';
let resourceType = '';
createFilterObj() {
let lFilterObjs: any[] = [];

// Resource type
if(this.filterStrings["@type"]) {
if(lFilterString != '') lFilterString += "&";
lFilterString += this.escapeReservedChars(this.filterStrings["@type"]);
lFilterString = this.removeEndingComma(lFilterString);
if(this.filterObjs["@type"] && this.filterObjs["@type"].value.length>0) {
lFilterObjs.push(this.filterObjs["@type"]);
}

// Collections
for(let col of this.collectionOrder) {
if(this.filterStrings[col]) {
if(lFilterString != '') lFilterString += "&";
lFilterString += this.escapeReservedChars(this.filterStrings[col]);
lFilterString = this.removeEndingComma(lFilterString);
if(this.filterObjs[col] && this.filterObjs[col].value && this.filterObjs[col].value.length>0) {
lFilterObjs.push(this.filterObjs[col]);
}
}

// Record has
if(this.filterStrings["components.@type"]) {
if(lFilterString != '') lFilterString += "&";
lFilterString += this.escapeReservedChars(this.filterStrings["components.@type"]);
lFilterString = this.removeEndingComma(lFilterString);
if(this.filterObjs["components.@type"] && this.filterObjs["components.@type"].value.length>0) {
lFilterObjs.push(this.filterObjs["components.@type"]);
}

// Authors and contributors
if (this.selectedAuthor.length > 0) {
if(lFilterString != '') lFilterString += "&";

lFilterString += "contactPoint.fn=";

let authors: string[] = [];

for (let author of this.selectedAuthor) {
lFilterString += author + ",";
authors.push(author);
}
}

lFilterString = this.removeEndingComma(lFilterString);
lFilterObjs.push({
"type": "contactPoint.fn",
"value": authors
})
}

// Keywords
if (this.selectedKeywords.length > 0) {
if(lFilterString != '') lFilterString += "&";
let keywords: string[] = [];

lFilterString += "keyword=";
for (let keyword of this.selectedKeywords) {
lFilterString += this.escapeReservedChars(this.suggestedKeywordsLkup[keyword]) + ",";
keywords.push(this.suggestedKeywordsLkup[keyword]);
}

lFilterObjs.push({
"type": "keyword",
"value": keywords
})
}

lFilterString = this.removeEndingComma(lFilterString);
if(!lFilterString) lFilterString = "NoFilter";
if(!lFilterObjs || lFilterObjs.length == 0) {
lFilterObjs.push({
"type": "NoFilter",
"value": ""
})
}

// console.log('lFilterString', lFilterString);
this.filterString.emit(lFilterString);
this.filterObjsOut.emit(lFilterObjs);
}


/**
* If search value changed, clear the filters and refresh the search result.
* @param changes - changed detected
Expand Down Expand Up @@ -506,7 +485,6 @@ export class FiltersComponent implements OnInit {
}
}


this.resourceTypeTree = [{
label: 'Type of Resource',
"expanded": false,
Expand Down Expand Up @@ -702,11 +680,7 @@ export class FiltersComponent implements OnInit {
this.searchService.setClearAll(false);
}, 0)

this.filterStrings = {};
this.filterStrings[Collections.DEFAULT] = "";
this.filterStrings[Collections.FORENSICS] = "";
this.filterStrings[Collections.SEMICONDUCTORS] = "";

this.filterObjs = {};
this.suggestedThemes = [];
this.suggestedKeywords = [];
this.suggestedAuthors = [];
Expand Down Expand Up @@ -748,7 +722,6 @@ export class FiltersComponent implements OnInit {
setTimeout(() => {
this.clearAllCheckbox = false;
}, 0)
// this.filterResults()
}

/**
Expand Down
11 changes: 7 additions & 4 deletions angular/src/app/landing/landingpage.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,9 @@
</div>

<!-- landing page panel -->
<div *ngIf="!displaySpecialMessage && _showContent" class="p-grid p-grid-responsive p-grid-pad">
<div *ngIf="!displaySpecialMessage && _showContent" class="p-grid p-grid-responsive p-grid-pad" style="width:100%;" >
<!-- <div *ngIf="!displaySpecialMessage"> -->
<div [ngClass]="mobileMode ? 'landingcard-mobile' : 'landingcard'">
<div [ngClass]="mobileMode ? 'landingcard-mobile' : 'landingcard'" style="width:100%;">
<!-- <div> -->
<div *ngIf="md === null && edstatsvc.authorized && !edstatsvc.hasError">
<div class="col-12 col-md-10 col-lg-10 col-sm-12" style="padding-left: 1%">
Expand All @@ -19,12 +19,15 @@
</div>

<!-- Menu button and the popup menu (mobile mode only) -->
<div style="width: 100%; height: 0px; margin-top: 1em;" class="sticky-button">
<div
#stickyPopupMenu
class="stickyPopupMenu"
[ngStyle]="{'top': stickPopupMenuTop + 'px'}">
<!-- div to keep track of the menu button position -->
<div #stickyButton></div>

<button #menubtn *ngIf="md !== null && inBrowser && mobileMode"
[ngClass]="windowScrolled ? 'sticky-button' : 'rightmenu-button'" type="button" pButton
type="button" pButton
icon="faa faa-list" class="ui-button ui-button-icon-only"
(click)="toggleMenu($event)">
</button>
Expand Down
12 changes: 10 additions & 2 deletions angular/src/app/landing/landingpage.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,10 +52,18 @@
z-index: 10;
}

.stickyPopupMenu {
position: absolute;
right: 1em;
width: 2.3em;
height: 2.3em;
z-index: 10;
}

.sticky-menu-popup {
float: right;
position: sticky;
margin-top: 4em;
// position: sticky;
margin-top: 10px;
right: 2em;
width: 10em;
height: 2.3em;
Expand Down
Loading

0 comments on commit 29ea55a

Please sign in to comment.