adding DSL-Definition component

Issue-ID: CCSDK-2066

Signed-off-by: shaaban Altanany <shaaban.eltanany.ext@orange.com>
Change-Id: I8b16e78cf3961c0c37a721fd37898fb3a7a850a0

2 files changed, 31 insertions, 26 deletions

diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.html
index f934888a6..24423cfac 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.html
@@ -1 +1 @@
-<ace-editor [(text)]="text" [mode]="'javascript'" #editor style="height:150px;"></ace-editor>
\ No newline at end of file
+<ace-editor (textChanged)="onChange($event)" [(text)]="Data" [mode]="lang" #editor style="height:150px;"></ace-editor>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.ts
index 9c3435d98..a63dfa7e0 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit, ViewChild, Input, AfterViewInit } from '@angular/core';
+import {AfterViewInit, Component, EventEmitter, Input, OnInit, Output, ViewChild} from '@angular/core';
 // import 'brace/ext/searchbox';
 // import 'ace-builds/webpack-resolver';
 // import 'brace';
@@ -6,39 +6,44 @@ import { Component, OnInit, ViewChild, Input, AfterViewInit } from '@angular/cor
 // import 'ace-builds/src-min-noconflict/snippets/html';
 
 @Component({
-  selector: 'app-source-editor',
-  templateUrl: './source-editor.component.html',
-  styleUrls: ['./source-editor.component.css']
+    selector: 'app-source-editor',
+    templateUrl: './source-editor.component.html',
+    styleUrls: ['./source-editor.component.css']
 })
 export class SourceEditorComponent implements OnInit, AfterViewInit {
 
 
-  @Input() Data: string;
-  @Input() lang: string;
-  mode = 'json';
-  @ViewChild('editor', { static: false }) editor;
-  text = '';
+    @Input() Data: string;
+    @Output() DataChange = new EventEmitter();
+    @Input() lang: string;
+    mode = 'json';
+    @ViewChild('editor', {static: false}) editor;
+    text = '';
 
-  ngOnInit(): void {
-    //  throw new Error("Method not implemented.");
-  }
+    ngOnInit(): void {
+        //  throw new Error("Method not implemented.");
+    }
 
 
+    ngAfterViewInit() {
+        this.editor.setTheme('eclipse');
 
-  ngAfterViewInit() {
-    this.editor.setTheme('eclipse');
+        this.editor.getEditor().setOptions({
+            enableBasicAutocompletion: true
+        });
 
-    this.editor.getEditor().setOptions({
-      enableBasicAutocompletion: true
-    });
+        this.editor.getEditor().commands.addCommand({
+            name: 'showOtherCompletions',
+            bindKey: 'Ctrl-.',
+            exec(editor) {
 
-    this.editor.getEditor().commands.addCommand({
-      name: 'showOtherCompletions',
-      bindKey: 'Ctrl-.',
-      exec(editor) {
-
-      }
-    });
-  }
+            }
+        });
+    }
 
+    onChange($event: {}) {
+        console.log('editor action');
+        console.log(this.Data);
+        console.log($event);
+    }
 }