diff options
author | 2019-02-20 20:28:22 +0530 | |
---|---|---|
committer | 2019-02-20 20:28:31 +0530 | |
commit | f93a1f6c6daef09948cc7c0cd2cc4ef030b68957 (patch) | |
tree | e40efb33f88f55d2e93f4946e93e1ecb6ac2279b | |
parent | 4a4fe2b34cc3072902d37ead2105f72538f20991 (diff) |
Editor component
Added editor component to modify module
Issue-ID: CCSDK-975
Change-Id: Iee1f9f54e78af199f8e0d6b5133f7a278b900cf9
Signed-off-by: Arundathi Patil <arundpil@in.ibm.com>
3 files changed, 27 insertions, 13 deletions
diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html index 1ba944a30..d59597021 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.html @@ -50,18 +50,10 @@ limitations under the License. <div class="outerDiv divtwo" (click)="on = !on" ondrop="dropcalled(event)" ondragover="allowDrop(event)" id="svgDiv"> - <!-- <canvas class="cnv" height="500"> --> - <!-- <div cdkDropList #doneList="cdkDropList" [cdkDropListData]="done" [cdkDropListConnectedTo]="[pendingList,reviewList]" - style="height: 100%;width: 100%" (cdkDropListDropped)="drop($event)"> --> - <!-- <canvas id="canvasArea" class="cnv" height="500" width="500" (click)="selected($event)"> --> - <!-- <div class="item-box" *ngFor="let item of done" cdkDrag>{{item}}</div> --> - <!-- </canvas> --> - <!-- </div> --> - <!-- </canvas> --> - <!-- <svg id="svgArea" width="1000px" height="100%" style="background-color: #C0C0C0"> --> - <!-- <rect x="0" y="0" width="300" height="200" fill="yellow"></rect> --> - <!-- </svg> --> - <app-designer></app-designer> + <button style="cursor: pointer; position: absolute;top: 4em;right: 27em; padding: 6px;color: white; background-color:#3f51b5;margin-right: 2em;border-radius: 2em; ">Enrichment</button> + <button (click) ="changeView()" style="cursor: pointer; position: absolute;top: 4em;right: 22em; padding: 6px;color: white;background-color:#3f51b5; border-radius: 2em">{{viewText}}</button> + <app-designer *ngIf="designerMode" (onNodeSelect)="on = !on; viewNodeDetails($event)"></app-designer> + <app-editor *ngIf="editorMode"></app-editor> </div> diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.ts b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.ts index a02bb97fa..1efdefce6 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.ts +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.component.ts @@ -28,9 +28,29 @@ import { Component, OnInit } from '@angular/core'; }) export class ModifyTemplateComponent implements OnInit { + designerMode: boolean = true; + editorMode: boolean = false; + viewText: string = "Editor View"; + constructor() { } ngOnInit() { } + viewNodeDetails(nodeTemplate) { + console.log(nodeTemplate); + } + + changeView() { + if(this.viewText == 'Editor View') { + this.editorMode = true; + this.designerMode = false; + this.viewText = 'Designer View' + } else { + this.editorMode = false; + this.designerMode = true; + this.viewText = 'Editor View' + } + } + } diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.module.ts b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.module.ts index 9ccb9977f..1ab7a8045 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.module.ts +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/modify-template.module.ts @@ -26,11 +26,13 @@ import { ModifyTemplateComponent } from './modify-template.component'; import { ModifyTemplateRoutingModule } from './modify-template-routing.module'; import { AppMaterialModule } from '../../../common/modules/app-material.module'; import { DesignerComponent } from './designer/designer.component'; +import { EditorComponent } from './editor/editor.component'; @NgModule({ declarations: [ ModifyTemplateComponent, - DesignerComponent + DesignerComponent, + EditorComponent ], exports: [ ModifyTemplateComponent, |