Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature: Angular result selection (merged) #196

Merged
merged 57 commits into from May 16, 2019
Merged
Changes from 1 commit
Commits
Show all changes
57 commits
Select commit Hold shift + click to select a range
b2d551c
[IT-2647] Initially added the Angular module and embedded it into the…
finnmartens Mar 4, 2019
07239e5
[IT-2647] Added models for the result selection service and methods f…
finnmartens Mar 8, 2019
60b8290
[IT-2647] Only include used parameters in the service and added model…
finnmartens Mar 8, 2019
109675a
[IT-2647] Added foundation for Time frame selection and testing alter…
finnmartens Mar 14, 2019
41d0f51
[IT-2647/49] Changed timepicker to ng-datetime-picker.
finnmartens Mar 22, 2019
c37e9d4
[IT-2649] Added comparative time selection.
finnmartens Mar 26, 2019
48aaec1
[IT-2647] Add aggregation interval field and change behaviour for man…
DanielSteger Mar 27, 2019
60b4577
Merge develop into feature/angularModuleForResultSelection
DanielSteger Mar 29, 2019
20275bf
merged the result-selection service and optimized the timeframe
Mar 29, 2019
8733b92
[IT-2647] Comment out the module and fix timezone in time frame selec…
DanielSteger Apr 2, 2019
28fac0f
[IT-2649] Removed empty component.
finnmartens Apr 9, 2019
9664717
[IT-2649] Imported needed Modules for initial Angular tests. Removed …
finnmartens Apr 9, 2019
21d414b
[IT-2649] package-lock.json
finnmartens Apr 10, 2019
1d76530
[IT-2649] Added tests for the time frame selection and changed the la…
finnmartens Apr 10, 2019
8007b2b
[2650]added jobgroup selection and shared service for communication b…
Apr 16, 2019
8510922
[IT-2650] sorted the jobgroups alphabetically
Apr 17, 2019
dd70935
[IT-2651] package-lock.json
finnmartens Apr 18, 2019
ca9b8d7
[IT-2651] Added ng-select dependency for having a searchable and modi…
finnmartens Apr 18, 2019
aefdb24
[IT-2651] Added first draft for the page location connectivity result…
finnmartens Apr 18, 2019
e2cab7a
[IT-2651] Included the new component so the initial test can run succ…
finnmartens Apr 18, 2019
1e2a83f
[IT-2650] Added filter tags
Apr 24, 2019
4499e5e
[IT-2650] changed the filter behaviour
Apr 26, 2019
8964bca
[IT-2651] Refactored selection of values and added i18n.
finnmartens Apr 30, 2019
932a8d6
[IT-2651] Removed test data and loading.
finnmartens Apr 30, 2019
18615fd
[IT-2650] Added some tests and changed the behavior for the filter ta…
Apr 30, 2019
eca6323
[IT-2651] Added filter mechanism so that the selectable sub-category …
May 2, 2019
4d78a29
[IT-2651] Fixed wrongly associated label and created initial basic te…
May 2, 2019
efdd813
[IT-2650] Added more tests and disabled selection for the dates in th…
May 3, 2019
a7f24bd
[IT-2651] Added additional test case.
finnmartens May 6, 2019
95eeeda
Merge remote-tracking branch 'origin/develop' into feature/angularPag…
finnmartens May 6, 2019
94133b0
[IT-2649] Removed reference to currently disabled component, all para…
finnmartens May 7, 2019
6d89294
[IT-2649] Removed log.
finnmartens May 7, 2019
5b0220a
Merge remote-tracking branch 'origin/develop' into feature/angularMod…
finnmartens May 7, 2019
8d84c32
[IT-2650] deleted the data sharing from time frame component and opti…
May 7, 2019
761fa59
Update frontend/src/app/modules/result-selection/components/result-se…
finnmartens May 8, 2019
7cf69fa
Update frontend/src/app/modules/result-selection/components/result-se…
finnmartens May 8, 2019
99cc1bb
Update frontend/src/app/modules/result-selection/components/result-se…
finnmartens May 8, 2019
160e3f5
Update frontend/src/app/modules/result-selection/result-selection.com…
finnmartens May 8, 2019
c7630cf
Update frontend/src/app/modules/result-selection/components/result-se…
finnmartens May 8, 2019
31393e3
Update frontend/src/app/modules/result-selection/components/result-se…
finnmartens May 8, 2019
2685967
Apply suggestions from code review
finnmartens May 8, 2019
65f4de3
[IT-2650] handled job groups selection and renamed jobGroup component…
jiayiw5 May 8, 2019
4246496
[IT-2650] deleted the references to the component in gsp
jiayiw5 May 8, 2019
7f6de87
Merge branch 'develop' into feature/angularPageBrowserConnectivityRes…
PhilAlbrecht May 8, 2019
4eade6c
[IT-2700] Add measurand component
DanielSteger May 9, 2019
7753404
[IT-2700] Change model in measurand component
DanielSteger May 9, 2019
a199579
[IT-2700] Add observables in measurand component
DanielSteger May 10, 2019
ea819d1
Merge branch 'develop' into feature/angularModuleForResultSelection
finnmartens May 14, 2019
9ec0d3b
[IT-2700] Fix tests
DanielSteger May 14, 2019
168b635
Fix typo
DanielSteger May 14, 2019
164dce9
Merge branch 'develop' into feature/angularModuleForResultSelection
finnmartens May 15, 2019
122d71a
Merge remote-tracking branch 'origin/develop' into feature/angularRes…
finnmartens May 16, 2019
d4c03cc
Merge remote-tracking branch 'origin/feature/angularModuleForJobGroup…
finnmartens May 16, 2019
aa1ea2c
Merge branch 'feature/angularPageBrowserConnectivityResultSelection' …
finnmartens May 16, 2019
15ad28f
Merge remote-tracking branch 'origin/feature/angularMeasurandsResultS…
finnmartens May 16, 2019
e9bad0c
Additional merge changes
finnmartens May 16, 2019
4781f62
Merge branch 'develop' into feature/angularResultSelection
finnmartens May 16, 2019
File filter...
Filter file types
Jump to…
Jump to file or symbol
Failed to load files and symbols.

Always

Just for now

[IT-2650] Added some tests and changed the behavior for the filter ta…

…g selection
  • Loading branch information...
jiayi
jiayi committed Apr 30, 2019
commit 18615fd4e8814ef681e1c99f53c7226259cc65cd
@@ -1,7 +1,7 @@
<div class="card form-horizontal">
<h2>{{ 'frontend.de.iteratec.osm.resultSelection.jobGroup.title' | translate }}</h2>
<div class="form-group">
<select multiple class="form-control" >
<select multiple class="form-control" id='job-groups-selection'>
<ng-container *ngIf="!isEmpty; else elseBlock" >
<option *ngFor="let jobGroup of filteredJobGroups" [ngValue]="jobGroup.name" >
{{jobGroup.name}}
@@ -1,16 +1,18 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { async, ComponentFixture, TestBed} from '@angular/core/testing';
import { ResultSelectionJobGroupComponent } from './result-selection-job-group.component';
import { SelectableApplication } from 'src/app/models/application.model';
import { ResultSelectionService } from '../../services/result-selection.service';
import { SharedMocksModule } from 'src/app/testing/shared-mocks.module';
import { OsmLangService } from 'src/app/services/osm-lang.service';
import { GrailsBridgeService } from 'src/app/services/grails-bridge.service';
import { SharedService } from '../../services/sharedService';
import { of } from 'rxjs';


describe('ResultSelectionTimeFrameComponent', () => {
describe('ResultSelectionJobGroupComponent', () => {
let component: ResultSelectionJobGroupComponent;
let fixture: ComponentFixture<ResultSelectionJobGroupComponent>;
let resultSelectionService: ResultSelectionService;

beforeEach(async(() => {
TestBed.configureTestingModule({
@@ -28,6 +30,7 @@ describe('ResultSelectionTimeFrameComponent', () => {

beforeEach(() => {
fixture = TestBed.createComponent(ResultSelectionJobGroupComponent);

component = fixture.componentInstance;
fixture.detectChanges();
});
@@ -36,12 +39,67 @@ describe('ResultSelectionTimeFrameComponent', () => {
expect(component).toBeTruthy();
});

it('should correctly represent the job groups according to the filter by tags', () =>{
const selectableTags: string[] = component.selectableTags;
const showFilteredApplicationSelection: HTMLButtonElement = fixture.nativeElement.querySelector('#filterBtn');
showFilteredApplicationSelection.click();
fixture.detectChanges();
it('should correctly show the tags according to the available job groups', () =>{
component.jobGroupMappings$ = of([new SelectableApplication({
id: 3,
name: 'test_Application',
tags: ['test','application']
}),
new SelectableApplication({
id: 1,
name: 'test2_Application',
tags: ['test2','application']
})])
let tags: string[] = ['test', 'application', 'test2'];

//expect(component.filteredJobGroups).toEqual();
component.getJobGroupTags();
expect(component.selectableTags).toEqual(tags);
});

it('should correctly show the job groups accordings to the selected tag',() => {
component.jobGroupMappings$ = of([new SelectableApplication({
id: 3,
name: 'test_Application',
tags: ['test','application']
}),
new SelectableApplication({
id: 1,
name: 'test2_Application',
tags: ['test2','application']
})])
component.upadteJobGroups();
component.getJobGroupTags();
let tagJobGroupsMapping = getTagJobGroupsMapping(component.jobGroups, component.selectableTags);

expect(component.filteredJobGroups).toEqual(component.jobGroups);

component.filterByTag(component.selectableTags[0]);
expect(component.filteredJobGroups).toEqual(tagJobGroupsMapping[0]);

component.filterByTag(component.selectableTags[1]);
expect(component.filteredJobGroups).toEqual(tagJobGroupsMapping[1]);

component.filterByTag(component.selectableTags[2]);
expect(component.filteredJobGroups).toEqual(tagJobGroupsMapping[2]);

component.filterByTag(component.selectableTags[2]);
expect(component.filteredJobGroups).toEqual(component.jobGroups);
});
});

function getTagJobGroupsMapping(jobGroups: SelectableApplication[], selectableTags: string[]): any{
if(selectableTags){
let sortedJobGroups = [];
for(let i=1; i<=selectableTags.length; i++){
sortedJobGroups.push([]);
}
selectableTags.forEach(tag =>{
jobGroups.forEach(element => {
if(element.tags.indexOf(tag) > -1){
sortedJobGroups[selectableTags.indexOf(tag)].push(element);
}
})
});
return sortedJobGroups;
}
}
@@ -27,7 +27,7 @@ export class ResultSelectionJobGroupComponent implements OnInit {
isEmpty = true;
selectableTags: string[];
filteredJobGroups: SelectableApplication[];
selectedTag: string;
selectedTag: string ='';
isSelected = false;

constructor(private resultSelectionService: ResultSelectionService, private sharedService: SharedService) {
@@ -60,15 +60,15 @@ export class ResultSelectionJobGroupComponent implements OnInit {
registerTimeFrameChangeEvents(dates: Date[]):void {
this.resultSelectionCommand.from = dates[0];
this.resultSelectionCommand.to = dates[1];
this.getJobGroups(this.resultSelectionCommand);
this.resultSelectionService.loadSelectableApplications(this.resultSelectionCommand);
this.jobGroupMappings$ = this.resultSelectionService.applications$;
this.upadteJobGroups();
this.getJobGroupTags();
}

getJobGroups(resultSelectionCommand: ResultSelectionCommand) {
this.resultSelectionService.loadSelectableApplications(resultSelectionCommand);
this.jobGroupMappings$ = this.resultSelectionService.applications$;
this.jobGroupMappings$.subscribe(jobGroups => this.sortJobGroupsByName(jobGroups));
}
upadteJobGroups() {
this.jobGroupMappings$.subscribe(jobGroups => this.sortJobGroupsByName(jobGroups));
}

getJobGroupTags(){
this.jobGroupMappings$.subscribe(next => {
@@ -104,11 +104,7 @@ export class ResultSelectionJobGroupComponent implements OnInit {
filteredJobGroups.push(element);
}
});
}
if(filteredJobGroups.length > 0){
this.filteredJobGroups = filteredJobGroups;
}else{
this.filteredJobGroups = this.jobGroups;
}
}

@@ -125,9 +121,10 @@ export class ResultSelectionJobGroupComponent implements OnInit {
return 0;
});
this.jobGroups = jobGroups;
if(this.isSelected === true){
if(this.isSelected === true && (this.selectableTags.indexOf(this.selectedTag)>-1)){
this.setFilteredJobGroups(this.selectedTag);
}else{
this.isSelected = false;
this.filteredJobGroups = jobGroups;
}
}else{
@@ -1,14 +1,26 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { ResultSelectionTimeFrameComponent } from './result-selection-time-frame.component';
import { SharedMocksModule } from 'src/app/testing/shared-mocks.module';
import { ResultSelectionService } from '../../services/result-selection.service';
import { OsmLangService } from 'src/app/services/osm-lang.service';
import { GrailsBridgeService } from 'src/app/services/grails-bridge.service';
import { SharedService } from '../../services/sharedService';

describe('ResultSelectionTimeFrameComponent', () => {
let component: ResultSelectionTimeFrameComponent;
let fixture: ComponentFixture<ResultSelectionTimeFrameComponent>;

beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ResultSelectionTimeFrameComponent ]
declarations: [ ResultSelectionTimeFrameComponent ],
imports: [SharedMocksModule],
providers: [
ResultSelectionService,
OsmLangService,
GrailsBridgeService,
SharedService
]
})
.compileComponents();
}));
@@ -1,14 +1,34 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { ResultSelectionComponent } from './result-selection.component';
import { ResultSelectionTimeFrameComponent } from './components/result-selection-time-frame/result-selection-time-frame.component';
import { ResultSelectionJobGroupComponent } from './components/result-selection-job-group/result-selection-job-group.component';
import { SharedMocksModule } from 'src/app/testing/shared-mocks.module';
import { ResultSelectionService } from './services/result-selection.service';
import { OsmLangService } from 'src/app/services/osm-lang.service';
import { GrailsBridgeService } from 'src/app/services/grails-bridge.service';
import { SharedService } from './services/sharedService';

describe('ResultSelectionComponent', () => {
let component: ResultSelectionComponent;
let fixture: ComponentFixture<ResultSelectionComponent>;

beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ResultSelectionComponent ]
declarations: [
ResultSelectionComponent,
ResultSelectionTimeFrameComponent,
ResultSelectionJobGroupComponent
],
imports: [
SharedMocksModule
],
providers: [
ResultSelectionService,
OsmLangService,
GrailsBridgeService,
SharedService
]
})
.compileComponents();
}));
@@ -7,8 +7,6 @@ import {catchError, map, switchMap, startWith} from "rxjs/operators";
import {Application, SelectableApplication, ApplicationWithPages} from "../../../models/application.model";
import {Page} from "../../../models/page.model";
import {Caller, ResultSelectionCommand} from "../models/result-selection-command.model";
//import {SelectableHeroTiming} from "../models/selectable-hero-timing.model";
//import {SelectableUserTiming} from "../models/selectable-user-timing.model";
import {Chart} from "../models/chart.model";
import {Connectivity} from 'src/app/models/connectivity.model';
import {Location} from 'src/app/models/location.model';
@@ -26,14 +24,11 @@ export class ResultSelectionService {
selectedApplications$: ReplaySubject<Application[]> = new ReplaySubject<Application[]>(1);
selectedPages$: ReplaySubject<Page[]> = new ReplaySubject<Page[]>(1);

// TODO
applications$: ReplaySubject<SelectableApplication[]> = new ReplaySubject(1);
applicationsAndPages$: ReplaySubject<ApplicationWithPages[]> = new ReplaySubject(1);
eventsAndPages$: ReplaySubject<MeasuredEvent[]> = new ReplaySubject(1);
locationsAndBrowsers$: ReplaySubject<Location[]> = new ReplaySubject(1);
connectivities$: ReplaySubject<Connectivity[]> = new ReplaySubject(1);
//selectableHeroTimings$: ReplaySubject<SelectableHeroTiming[]> = new ReplaySubject<SelectableHeroTiming[]>(1);
//selectableUserTimings$: ReplaySubject<SelectableUserTiming[]> = new ReplaySubject<SelectableUserTiming[]>(1);
resultCount$: ReplaySubject<string> = new ReplaySubject<string>(1);

constructor(private http: HttpClient) {
@@ -154,8 +149,6 @@ export class ResultSelectionService {
loadSelectableData(resultSelectionCommand: ResultSelectionCommand, chart: Chart): void {

this.loadResultCount(resultSelectionCommand);
//this.loadSelectableUserTimings(resultSelectionCommand);
//this.loadSelectableHeroTimings(resultSelectionCommand);

if(chart !== Chart.PageComparison) {
this.loadSelectableApplications(resultSelectionCommand);
@@ -194,21 +187,13 @@ export class ResultSelectionService {
this.updateSelectableConnectivities(resultSelectionCommand).subscribe(next => this.connectivities$.next(next));
}

/*loadSelectableUserTimings(resultSelectionCommand: ResultSelectionCommand): void {
this.updateSelectableUserTimings(resultSelectionCommand).subscribe(next => this.selectableUserTimings$.next(next));
}
loadSelectableHeroTimings(resultSelectionCommand: ResultSelectionCommand): void {
this.updateSelectableHeroTimings(resultSelectionCommand).subscribe(next => this.selectableHeroTimings$.next(next));
}
*/

loadResultCount(resultSelectionCommand: ResultSelectionCommand): void {
this.updateResultCount(resultSelectionCommand).subscribe(next => this.resultCount$.next(next));
}

updateSelectableApplications(resultSelectionCommand: ResultSelectionCommand): Observable<SelectableApplication[]> {
const params = this.createParams(resultSelectionCommand);
//console.log(params);
return this.http.get<SelectableApplication[]>('/resultSelection/getJobGroups', {params: params}).pipe(
handleError(),
startWith(null)
@@ -247,22 +232,6 @@ export class ResultSelectionService {
)
}

/*updateSelectableUserTimings(resultSelectionCommand: ResultSelectionCommand): Observable<SelectableUserTiming[]> {
const params = this.createParams(resultSelectionCommand);
return this.http.get('/resultSelection/getUserTimings', {params: params}).pipe(
handleError(),
startWith(null)
)
}
updateSelectableHeroTimings(resultSelectionCommand: ResultSelectionCommand): Observable<SelectableHeroTiming[]> {
const params = this.createParams(resultSelectionCommand);
return this.http.get('/resultSelection/getHeroTimings', {params: params}).pipe(
handleError(),
startWith(null)
)
}
*/
updateResultCount(resultSelectionCommand: ResultSelectionCommand): Observable<string> {
const params = this.createParams(resultSelectionCommand);
return this.http.get('/resultSelection/getResultCount', {params: params}).pipe(
@@ -5,6 +5,7 @@ import {HttpClientTestingModule} from '@angular/common/http/testing';
import {RouterTestingModule} from '@angular/router/testing';
import {FormsModule} from "@angular/forms";
import {NgxSmartModalModule} from "ngx-smart-modal";
import {OwlDateTimeModule, OwlNativeDateTimeModule} from "ng-pick-datetime";


@NgModule({
@@ -18,14 +19,18 @@ import {NgxSmartModalModule} from "ngx-smart-modal";
FormsModule,
HttpClientTestingModule,
RouterTestingModule,
NgxSmartModalModule.forRoot()
NgxSmartModalModule.forRoot(),
OwlDateTimeModule,
OwlNativeDateTimeModule
],
exports: [
TranslateModule,
HttpClientTestingModule,
RouterTestingModule,
FormsModule,
NgxSmartModalModule
NgxSmartModalModule,
OwlDateTimeModule,
OwlNativeDateTimeModule
]
})
export class SharedMocksModule {
ProTip! Use n and p to navigate between commits in a pull request.
You can’t perform that action at this time.