change detection

src/app/app.component.ts

@@ -1,7 +1,8 @@
-import { Component , OnInit } from '@angular/core';
-import { ElasticService } from './elastic/elastic.service';
+import { Component , OnInit, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core';
+import { ElasticService } from './shared/elastic.service';
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.css']
@@ -13,11 +14,16 @@ export class AppComponent implements OnInit
   public types = [ "document" ];
   public selectedTypes = [ "document" ];
 
-  constructor(private elasticService: ElasticService) {}
+  constructor(private elasticService: ElasticService , private cdRef: ChangeDetectorRef) {}
 
   ngOnInit(){
-    this.elasticService.getMapping(this.endpoint).toPromise().then( response => {
+    this
+    .elasticService
+    .getMapping(this.endpoint)
+    .toPromise()
+    .then( response => {
       this.mapping = response.json();
+      this.cdRef.markForCheck();
     });
 
   }

src/app/app.module.ts

@@ -2,6 +2,8 @@ import { BrowserModule } from '@angular/platform-browser';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { NgModule } from '@angular/core';
 import { FormsModule }   from '@angular/forms';
+//import { CommonModule } from '@angular/common';
+import { HttpModule } from '@angular/http';
 
 import { AppComponent } from './app.component';
 import { QueryBlocksComponent } from "./queryBlocks/queryBlocks.component";
@@ -37,8 +39,8 @@ import { SpanTermQuery } from './queryBlocks/singlequery/queries/span_term.query
 import { SpanFirstQuery } from './queryBlocks/singlequery/queries/span_first.query';
 import { SortBlockComponent } from "./queryBlocks/sortBlock/sortBlock.component";
 
-import { ElasticModule } from './elastic/elastic.module';
-import { ElasticService } from './elastic/elastic.service';
+import { ElasticService } from './shared/elastic.service';
+import { MessageService } from './shared/message.service';
 
 import 
 {
@@ -94,7 +96,8 @@ import
 		BrowserModule,
 		BrowserAnimationsModule,
 		FormsModule,
-		ElasticModule,
+		//CommonModule,
+		HttpModule,
 		MatSelectModule,
 		MatButtonModule,
 		MatChipsModule,
@@ -106,7 +109,7 @@ import
 		MatButtonToggleModule,
 		MatMenuModule
   ],
-  providers: [ElasticService],
+  providers: [ElasticService,MessageService],
   bootstrap: [AppComponent]
 })
 export class AppModule { }

src/app/queryBlocks/compoundQuery/compoundQuery.component.html

@@ -3,10 +3,11 @@
 		<mat-icon  (click)="removeInQuery(query.id)">clear</mat-icon>
 		<div>Compound Query</div>
 	</div>
-	<div *ngFor="let error of query.errors">
+
+	<div *ngFor="let msg of messages | async">
 		<div class="warn">
 			<i class="material-icons">info_outline</i>
-			<span> {{ error }} </span>
+			<span> {{ msg }} </span>
 		</div>
 	</div>
 	<div class="compound-query-header">

src/app/queryBlocks/compoundQuery/compoundQuery.component.ts

@@ -1,6 +1,10 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy, ChangeDetectorRef, OnDestroy } from "@angular/core";
+import { MessageService } from "../../shared/message.service";
+import { BehaviorSubject } from "rxjs/BehaviorSubject";
+import { Observable } from "rxjs/Observable";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'compound-query',
 	templateUrl: 'compoundQuery.component.html',
 	styleUrls : [ 'compoundQuery.component.css' ],
@@ -10,8 +14,9 @@ import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angu
 		'setQueryFormat']
 })
 
-export class CompoundQueryComponent implements OnInit, OnChanges {
+export class CompoundQueryComponent implements OnInit, OnDestroy, OnChanges {
 
+	private messages : BehaviorSubject<string[]>;
 	public config: Object;
 	public queryList: any = this.queryList;
 	public addQuery: any;
@@ -26,12 +31,25 @@ export class CompoundQueryComponent implements OnInit, OnChanges {
 	@Input() types: any;
 	@Input() selectedTypes: any;
 	@Input() result: any;
+
+	constructor(
+		private messageService : MessageService , 
+		private cdRef : ChangeDetectorRef
+	) {}
 
 	ngOnInit() {
+		this.messages = this
+		.messageService
+		.getMessages(this.query.parent_id);
+
 		this.allFields = this.result.resultQuery.availableFields;
 		this.exeBuild();
 	}
 
+	ngOnDestroy(){
+		//this.messageService.unsubscribe();
+	}
+
 	ngOnChanges() {
 		this.allFields = this.result.resultQuery.availableFields;
 	}

src/app/queryBlocks/queryBlocks.component.ts

@@ -1,10 +1,12 @@
-import { Component, OnInit, OnChanges, EventEmitter, Input, Output } from "@angular/core";
+import { Component, OnInit, OnChanges, EventEmitter, Input, Output, ChangeDetectorRef, ChangeDetectionStrategy } from "@angular/core";
 import { queryList } from "../shared/queryList";
 import { QueryParser } from "../shared/QueryParser";
+import { MessageService } from "../shared/message.service";
 
 declare var $: any;
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'query-blocks',
 	templateUrl: 'queryBlocks.component.html',
 	styleUrls: ['queryBlocks.component.css'],
@@ -44,6 +46,8 @@ export class QueryBlocksComponent implements OnInit {
 	@Input() config: any;
 	@Output() setProp = new EventEmitter < any > ();
 
+	constructor( private messageService : MessageService ) {}
+
 	ngOnInit() {
 	}
 
@@ -93,10 +97,8 @@ export class QueryBlocksComponent implements OnInit {
 	}
 
 	// builquery - this function handles everything to build the query
-	buildQuery() {
-		var results = this.result.resultQuery.result;
-		var sort = this.result.sort;
-		var queryParser = new QueryParser(results,sort);
+	buildQuery = () => {
+		var queryParser = new QueryParser(this.result,this.messageService);
 		this.result.resultQuery.parsed = queryParser.parse();
 	}
 

src/app/queryBlocks/singlequery/queries/common.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'common-query',
 	templateUrl: 'common.query.html',
 	inputs: ['getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/exists.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'exists-query',
 	template: 	`<span class="col-xs-6 pd-0">
 				</span>`,

src/app/queryBlocks/singlequery/queries/fuzzy.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'fuzzy-query',
 	templateUrl:'fuzzy.query.html',
 	inputs: ['getQueryFormat', 'querySelector', 'querySelector']

src/app/queryBlocks/singlequery/queries/geoboundingbox.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
     selector: 'geo-bounding-box-query',
     templateUrl: 'geoboundingbox.query.html',
     inputs: ['getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/geodistance.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
     selector: 'geo-distance-query',
     templateUrl: 'geodistance.query.html',
     inputs: ['getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/geodistancerange.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
     selector: 'geo-distance-range-query',
     templateUrl: 'geodistancerange.query.html',
     inputs: ['getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/geohashcell.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
     selector: 'geohash-cell-query',
     templateUrl: 'geohashcell.query.html',
     inputs: ['getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/geopolygon.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
     selector: 'geo-polygon-query',
     templateUrl: 'geopolygon.query.html',
     inputs: ['getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/geoshape.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
     selector: 'geo-shape-query',
     templateUrl: 'geoshape.query.html',
     inputs: ['getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/gt.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'gt-query',
 	templateUrl: 'gt.query.html',
 	inputs: ['getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/ids.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'ids-query',
 	templateUrl: 'ids.query.html',
 	inputs: ['getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/lt.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'lt-query',
 	templateUrl: 'lt.query.html',
 	inputs: ['getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/match.query.ts

@@ -1,11 +1,12 @@
 // Editable component which converts input or dropdown into editable ui
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ViewChild, SimpleChange } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ViewChild, SimpleChange, ChangeDetectionStrategy } from "@angular/core";
 
 // Markup contains 2 parts
 // 1) primary input box: which is 3rd input box in query box, in which user will write value,
 //    addOption button is optional if query contains optional paramater then add it
 // 2) Optional parameter: It is collection of option rows, each row will contain option property name and value
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'match-query',
 	templateUrl: 'match.query.html',
 	inputs: ['getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/match_phase_prefix.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'match-phase-prefix-query',
 	templateUrl: 'match_phase_prefix.query.html',
 	inputs: [ 'getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/match_phrase.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'match_phrase-query',
 	templateUrl: 'match_phrase.query.html',
 	inputs: [ 'getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/missing.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'missing-query',
 	templateUrl:'missing.query.html',
 	inputs: [ 'getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/multi-match.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ViewChild, SimpleChange } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ViewChild, SimpleChange, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'multi_match-query',
 	templateUrl:'multi-match.query.html',
 	inputs: [ 'getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/prefix.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'prefix-query',
 	templateUrl: 'prefix.query.html',
 	inputs: [ 'getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/query_string.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ViewChild, SimpleChange } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ViewChild, SimpleChange, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'query_string-query',
 	templateUrl:'query_string.query.html',
 	inputs: [ 'getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/range.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'range-query',
 	templateUrl: 'range.query.html',
 	inputs: [ 'getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/regexp.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'regexp-query',
 	templateUrl:'regexp.query.html',
 	inputs: [ 'getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/simple_query_string.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ViewChild, SimpleChange } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ViewChild, SimpleChange, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
 	selector: 'simple_query_string-query',
 	templateUrl:'simple_query_string.query.html',
 	inputs: [ 'getQueryFormat', 'querySelector']

src/app/queryBlocks/singlequery/queries/span_first.query.ts

@@ -1,6 +1,7 @@
-import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ViewChild, SimpleChange } from "@angular/core";
+import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ViewChild, SimpleChange, ChangeDetectionStrategy } from "@angular/core";
 
 @Component({
+	changeDetection: ChangeDetectionStrategy.OnPush,
     selector: 'span-first-query',
     templateUrl:'span_first.query.html',
     inputs: ['getQueryFormat', 'querySelector']