changeset 1:59b7c3afcc6b

first interface and http request.
author Robert Casties <casties@mpiwg-berlin.mpg.de>
date Mon, 11 Jan 2016 19:25:53 +0100
parents 39ec75917ef7
children 80270f5a5735
files app/app.component.ts app/query-mode.ts app/query-select.component.ts app/query.service.ts index.html package.json
diffstat 6 files changed, 97 insertions(+), 19 deletions(-) [+]
line wrap: on
line diff
--- a/app/app.component.ts	Thu Jan 07 15:04:15 2016 +0100
+++ b/app/app.component.ts	Mon Jan 11 19:25:53 2016 +0100
@@ -11,7 +11,9 @@
         `,
     directives: [QuerySelectComponent]
 })
+    
 export class AppComponent { 
     public title = 'huhu!';
-    public selectedOption = 'unknown';    
+    public selectedOption = 'unknown';
+    
 }
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/app/query-mode.ts	Mon Jan 11 19:25:53 2016 +0100
@@ -0,0 +1,4 @@
+export interface QueryMode {
+    id: string;
+    label: string;
+}
\ No newline at end of file
--- a/app/query-select.component.ts	Thu Jan 07 15:04:15 2016 +0100
+++ b/app/query-select.component.ts	Mon Jan 11 19:25:53 2016 +0100
@@ -1,31 +1,47 @@
-import {Component} from 'angular2/core';
+import {Component, OnInit} from 'angular2/core';
+import {HTTP_PROVIDERS} from 'angular2/http';
+
+import {QueryService} from './query.service';
+import {QueryMode} from './query-mode';
+
 
 @Component({
     selector: 'query-select',
     template: `
         <p>Selected option: {{selectedQuery}}</p>
         <select (change)="onSelectType($event)">
-            <option *ngFor="#option of queryTypes" [value]="option">
-                {{option}}
+            <option *ngFor="#mode of queryModes" [value]="mode.id">
+                {{mode.label}}
             </option>
         </select>
         <select [(ngModel)]="selectedQuery">
-            <option *ngFor="#option of query2Types" [value]="option">
+            <option *ngFor="#option of query2Options" [value]="option">
                 {{option}}
             </option>
         </select>
-        `
+        `,
+    providers: [QueryService, HTTP_PROVIDERS]
 })
-export class QuerySelectComponent { 
-    public queryTypes = ['Object type is', 'Attribute contains'];
+   
+export class QuerySelectComponent implements OnInit { 
+    public queryModes;
     public selectedQuery = 'unknown';
-    public query2Types = ['a', 'b', 'c'];
+    public query2Options;
+    
+    constructor(private _queryService: QueryService) {}
+    
+    ngOnInit() {
+        this.setupQueryModes();
+    }
+    
+    setupQueryModes() {
+        this.queryModes = this._queryService.getQueryModes();
+        this._queryService.getIsmiObjectTypes();
+    }
     
     onSelectType(event: any) {
-        var selected = event.target.value
-        this.selectedQuery = selected;
-        if (selected == 'Attribute contains') {
-            this.query2Types = ['d', 'e', 'f'];
-        }
+        var selected = event.target.value;
+        this._queryService.getQueryOptions(selected).then(
+            options => this.query2Options = options);
     }
 }
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/app/query.service.ts	Mon Jan 11 19:25:53 2016 +0100
@@ -0,0 +1,55 @@
+import {Injectable} from 'angular2/core';
+import {Http, Headers} from 'angular2/http';
+
+import 'rxjs/Rx'; // import all RxJS operators
+
+import {QueryMode} from './query-mode';
+
+@Injectable()
+export class QueryService {
+        
+    public QUERY_MODES: QueryMode[] = [
+        {id: 'type_is', label:'Object type is'},
+        {id: 'att_contains', label: 'Attribute contains'}];
+        
+    constructor(private _http: Http) {}
+    
+    getQueryModes(): QueryMode[] {
+        return this.QUERY_MODES;
+    }
+    
+    getQueryOptions(queryMode: string) {
+        var options = ['a1', 'b1', 'c1'];
+        if (queryMode == 'Attribute contains') {
+            options = ['d', 'e', 'f'];
+        }
+        return Promise.resolve(options);
+    }
+    
+    getIsmiObjectTypes() {
+        var headers = new Headers();
+        headers.append('Authorization', 'Basic ' + btoa('neo4j'+':'+'neo5j'));
+        headers.append('Content-Type', 'application/json');
+        headers.append('Accept', 'application/json');
+        var data = {
+                'query': `MATCH (n)
+WITH DISTINCT labels(n) AS labels
+UNWIND labels AS label
+RETURN DISTINCT label
+ORDER BY label`,
+                'params': {}
+            };
+        
+        console.debug("http:", this._http, " headers:", headers, " data:", data);
+        
+        var post = this._http.post('http://localhost:7474/db/data/cypher/', JSON.stringify(data), {'headers': headers});
+        console.debug("post:", post);
+        var map = post.map(res => res.json());
+        console.debug("map:", map);
+        map.subscribe(
+      data => console.debug("neo4j data=", data),
+      err => console.error("neo4j error=", err),
+      () => console.debug('neo4j query Complete')
+    );
+    }
+}
\ No newline at end of file
--- a/index.html	Thu Jan 07 15:04:15 2016 +0100
+++ b/index.html	Mon Jan 11 19:25:53 2016 +0100
@@ -8,6 +8,7 @@
     <script src="node_modules/systemjs/dist/system.src.js"></script>
     <script src="node_modules/rxjs/bundles/Rx.js"></script>
     <script src="node_modules/angular2/bundles/angular2.dev.js"></script>
+    <script src="node_modules/angular2/bundles/http.dev.js"></script>
 
     <!-- 2. Configure SystemJS -->
     <script>
--- a/package.json	Thu Jan 07 15:04:15 2016 +0100
+++ b/package.json	Mon Jan 11 19:25:53 2016 +0100
@@ -1,5 +1,5 @@
 {
-  "name": "angular2-quickstart",
+  "name": "ng2-ismi-query-app",
   "version": "1.0.0",
   "scripts": {
     "tsc": "tsc",
@@ -9,13 +9,13 @@
   },
   "license": "ISC",
   "dependencies": {
-    "angular2": "2.0.0-beta.0",
-    "systemjs": "0.19.6",
+    "angular2": "2.0.0-beta.1",
     "es6-promise": "^3.0.2",
     "es6-shim": "^0.33.3",
-    "reflect-metadata": "0.1.2",
+    "reflect-metadata": "^0.1.2",
     "rxjs": "5.0.0-beta.0",
-    "zone.js": "0.5.10"
+    "systemjs": "0.19.14",
+    "zone.js": "0.5.10",
   },
   "devDependencies": {
     "concurrently": "^1.0.0",