feat(query): queryService is now independant of the featureService

src/demo-app/app/app.component.html

@@ -93,6 +93,7 @@
         igoLayerContext
         igoMapBrowserBinding
         igoDropGeoFile
+        (query)="handleQueryResults($event)"
         [map]="map">
         <igo-zoom-button [map]="map" color="primary"></igo-zoom-button>
         <igo-geolocate-button [map]="map" color="primary"></igo-geolocate-button>

src/demo-app/app/app.component.ts

@@ -46,7 +46,6 @@ export class AppComponent implements OnInit {
     // you can simply do contextService.setContext(context)
     // where "context" is an object with the same interface
     // as the contexts in ../contexts/
-
     this.demoForm = this.formBuilder.group({
       location: ['', [
         Validators.required
@@ -94,4 +93,10 @@ export class AppComponent implements OnInit {
     console.log(data);
     console.log(isValid);
   }
+
+  handleQueryResults(features: Feature[]) {
+    if (features[0]) {
+      this.featureService.updateFeatures(features, features[0].source);
+    }
+  }
 }

src/lib/query/shared/query.directive.ts

@@ -1,6 +1,9 @@
-import { Directive, Self, Output, EventEmitter,
+import { Directive, Self, Input, Output, EventEmitter,
          OnDestroy, AfterViewInit } from '@angular/core';
+
 import { Subscription } from 'rxjs/Subscription';
+import { Observable } from 'rxjs/Observable';
+import { forkJoin } from 'rxjs/observable/forkJoin';
 
 import { IgoMap } from '../../map/shared';
 import { MapBrowserComponent } from '../../map/map-browser';
@@ -17,12 +20,20 @@ export class QueryDirective implements AfterViewInit, OnDestroy {
 
   private queryLayers: Layer[];
   private queryLayers$$: Subscription;
+  private subscriptions: Subscription[] = [];
 
   get map(): IgoMap {
     return this.component.map;
   }
 
-  @Output() query = new EventEmitter<Feature>();
+  @Input()
+  get waitForAllQueries(): boolean { return this._waitForAllQueries; }
+  set waitForAllQueries(value: boolean) {
+    this._waitForAllQueries = value;
+  }
+  private _waitForAllQueries: boolean = false;
+
+  @Output() query = new EventEmitter<Feature[] | Feature[][]>();
 
   constructor(@Self() private component: MapBrowserComponent,
               private queryService: QueryService) {}
@@ -36,6 +47,7 @@ export class QueryDirective implements AfterViewInit, OnDestroy {
 
   ngOnDestroy() {
     this.queryLayers$$.unsubscribe();
+    this.unsubscribe();
     this.map.ol.un('singleclick', this.handleMapClick, this);
   }
 
@@ -51,11 +63,25 @@ export class QueryDirective implements AfterViewInit, OnDestroy {
   }
 
   private handleMapClick(event: ol.MapBrowserEvent) {
+    this.unsubscribe();
+
     const view = this.map.ol.getView();
-    this.queryService.query(this.queryLayers, {
+    const query$ = this.queryService.query(this.queryLayers, {
       coordinates: event.coordinate,
       projection: this.map.projection,
       resolution: view.getResolution()
     });
+
+    if (this.waitForAllQueries) {
+      forkJoin(...query$).subscribe((features: Feature[][]) => this.query.emit(features));
+    } else {
+      query$.forEach((query$$: Observable<Feature[]>) => {
+        query$$.subscribe((features: Feature[]) => this.query.emit(features));
+      });
+    }
+  }
+
+  private unsubscribe() {
+    this.subscriptions.forEach((sub: Subscription) => sub.unsubscribe());
   }
 }

src/lib/query/shared/query.service.ts

@@ -1,6 +1,7 @@
 import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
-import { Subscription } from 'rxjs/Subscription';
+
+import { Observable } from 'rxjs/Observable';
 
 import { uuid } from '../../utils/uuid';
 import { Feature, FeatureType, FeatureFormat, SourceFeatureType,
@@ -15,35 +16,26 @@ import { QueryOptions } from './query.interface';
 @Injectable()
 export class QueryService {
 
-  private subscriptions: Subscription[] = [];
 
   constructor(private http: HttpClient,
               private featureService: FeatureService) { }
 
-  query(layers: Layer[], options: QueryOptions) {
-    this.unsubscribe();
+  query(layers: Layer[], options: QueryOptions): Observable<Feature[]>[] {
 
-    this.subscriptions = layers
+    return layers
       .filter((layer: Layer) => layer.visible && layer.isInResolutionsRange)
       .map((layer: Layer) => this.queryDataSource(layer.dataSource, options, layer.zIndex));
   }
 
-  queryDataSource(dataSource: DataSource, options: QueryOptions, zIndex: number) {
+  queryDataSource(dataSource: DataSource, options: QueryOptions,
+    zIndex: number): Observable<Feature[]> {
+
     const url = (dataSource as any as QueryableDataSource).getQueryUrl(options);
     const request = this.http.get(url, {responseType: 'text'});
 
     this.featureService.clear();
-    return request.map(res => this.extractData(res, dataSource, options, url, zIndex))
-      .subscribe((features: Feature[]) =>
-        this.handleQueryResults(features, dataSource));
-  }
-
-  private unsubscribe() {
-    this.subscriptions.forEach((sub: Subscription) => sub.unsubscribe());
-  }
 
-  private handleQueryResults(features: Feature[], dataSource: DataSource) {
-    this.featureService.updateFeatures(features, dataSource.title);
+    return request.map(res => this.extractData(res, dataSource, options, url, zIndex));
   }
 
   private extractData(res, dataSource: DataSource, options: QueryOptions,