Unit tests added

src/app/cartography/components/text-editor/text-editor.component.ts

@@ -92,6 +92,11 @@ export class TextEditorComponent implements OnInit, OnDestroy {
                     this.leftPosition = x.toString() + 'px';
                     this.topPosition = y.toString() + 'px';
                     this.temporaryTextElement.nativeElement.innerText = elem.text;
+
+                    this.renderer.setStyle(this.temporaryTextElement.nativeElement, 'color', elem.fill);
+                    this.renderer.setStyle(this.temporaryTextElement.nativeElement, 'font-family', elem.font_family);
+                    this.renderer.setStyle(this.temporaryTextElement.nativeElement, 'font-size', `${elem.font_size}pt`);
+                    this.renderer.setStyle(this.temporaryTextElement.nativeElement, 'font-weight', elem.font_weight);
     
                     let listener =  () => {
                         let innerText = this.temporaryTextElement.nativeElement.innerText;
@@ -105,6 +110,7 @@ export class TextEditorComponent implements OnInit, OnDestroy {
                         this.temporaryTextElement.nativeElement.innerText = '';
                         this.temporaryTextElement.nativeElement.removeEventListener("focusout", this.textListener);
 
+                        this.clearStyle();
                         this.renderer.setStyle(this.temporaryTextElement.nativeElement, 'display', 'none');
                     };
                     this.textListener = listener;
@@ -116,4 +122,11 @@ export class TextEditorComponent implements OnInit, OnDestroy {
     ngOnDestroy(){
         this.textAddingSubscription.unsubscribe();
     }
+
+    clearStyle(){
+        this.renderer.setStyle(this.temporaryTextElement.nativeElement, 'color', '#000000');
+        this.renderer.setStyle(this.temporaryTextElement.nativeElement, 'font-family', 'Noto Sans');
+        this.renderer.setStyle(this.temporaryTextElement.nativeElement, 'font-size', '11pt');
+        this.renderer.setStyle(this.temporaryTextElement.nativeElement, 'font-weight', 'bold');
+    }
 }

src/app/cartography/converters/map/map-drawing-to-svg-converter.ts

@@ -15,7 +15,6 @@ export class MapDrawingToSvgConverter implements Converter<MapDrawing, string> {
 
     convert(mapDrawing: MapDrawing) {
         let elem = ``;
-        console.log("!!!  ", mapDrawing.element);
         
         if (mapDrawing.element instanceof RectElement) {
             elem = `<rect fill=\"${mapDrawing.element.fill}\" fill-opacity=\"${mapDrawing.element.fill_opacity}\" height=\"${mapDrawing.element.height}\" width=\"${mapDrawing.element.width}\" stroke=\"${mapDrawing.element.stroke}\" stroke-width=\"${mapDrawing.element.stroke_width}\" />`;

src/app/components/project-map/context-menu/actions/edit-style-action/edit-style-action.component.ts

@@ -23,7 +23,7 @@ export class EditStyleActionComponent implements OnInit {
 
     editStyle() {
         const dialogRef = this.dialog.open(StyleEditorDialogComponent, {
-            width: '550px',
+            width: '450px',
         });
         let instance = dialogRef.componentInstance;
         instance.server = this.server;

src/app/components/project-map/context-menu/actions/edit-text-action/edit-text-action.component.ts

@@ -23,7 +23,7 @@ export class EditTextActionComponent implements OnInit {
 
     editText() {
         const dialogRef = this.dialog.open(TextEditorDialogComponent, {
-            width: '550px',
+            width: '450px',
         });
         let instance = dialogRef.componentInstance;
         instance.server = this.server;

src/app/components/project-map/context-menu/context-menu.component.spec.ts

@@ -1,14 +1,30 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-
 import { ContextMenuComponent } from './context-menu.component';
+import { BrowserModule } from '@angular/platform-browser';
+import { ChangeDetectorRef, NO_ERRORS_SCHEMA } from '@angular/core';
+import { ProjectService } from '../../../services/project.service';
+import { MockedProjectService } from '../../projects/add-blank-project-dialog/add-blank-project-dialog.component.spec';
+import { MatMenuModule, MatMenuTrigger } from '@angular/material';
+import { Drawing } from '../../../cartography/models/drawing';
+import { RectElement } from '../../../cartography/models/drawings/rect-element';
+import { TextElement } from '../../../cartography/models/drawings/text-element';
 
-describe('NodeContextMenuComponent', () => {
+describe('ContextMenuComponent', () => {
   let component: ContextMenuComponent;
   let fixture: ComponentFixture<ContextMenuComponent>;
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
-      declarations: [ ContextMenuComponent ]
+      imports: [
+        MatMenuModule,
+        BrowserModule
+      ],
+      providers: [
+        { provide: ChangeDetectorRef },
+        { provide: ProjectService, useClass: MockedProjectService }
+      ],
+      declarations: [ ContextMenuComponent ],
+      schemas:  [ NO_ERRORS_SCHEMA ]
     })
     .compileComponents();
   }));
@@ -19,7 +35,38 @@ describe('NodeContextMenuComponent', () => {
     fixture.detectChanges();
   });
 
-  // it('should create', () => {
+  it('should create', () => {
-  //   expect(component).toBeTruthy();
+    expect(component).toBeTruthy();
-  // });
+  });
+
+  it('should reset capabilities while opening menu for node', () => {
+    component.contextMenu = { openMenu(){} } as MatMenuTrigger;
+    var spy = spyOn<any>(component, "resetCapabilities");
+
+    component.openMenuForNode(null, 0, 0);
+
+    expect(spy.calls.any()).toBeTruthy();
+  });
+
+  it('should reset capabilities while opening menu for drawing', () => {
+    component.contextMenu = { openMenu(){} } as MatMenuTrigger;
+    let drawing = {} as Drawing;
+    drawing.element = new RectElement();
+    var spy = spyOn<any>(component, "resetCapabilities");
+    spyOn(component, 'setPosition').and.callFake(() => {});
+    component.openMenuForDrawing(drawing, 0, 0);
+
+    expect(spy.calls.any()).toBeTruthy();
+  });
+
+  it('should set correct flag while drawing is text element', () => {
+    component.contextMenu = { openMenu(){} } as MatMenuTrigger;
+    let drawing = {} as Drawing;
+    drawing.element = new TextElement();
+    var spy = spyOn<any>(component, "resetCapabilities");
+    spyOn(component, 'setPosition').and.callFake(() => {});
+    component.openMenuForDrawing(drawing, 0, 0);
+
+    expect(spy.calls.any()).toBeTruthy();
+  });
 });

src/app/components/project-map/drawings-editors/style-editor/style-editor.component.html

@@ -3,27 +3,22 @@
     <div class="item-name">Fill color: </div>
     <input class="input-color" type='color' [(ngModel)]="drawing.element.fill"/>
 </span>
-<br/>
 <span class="item">
     <div class="item-name">Border color: </div>
     <input class="input-color" type='color' [(ngModel)]="drawing.element.stroke"/>
 </span>
-<br/>
 <span class="item">
     <div class="item-name">Border width: </div>
     <input class="item-value" matInput type="text" [(ngModel)]="drawing.element.stroke_width"/>
 </span>
-<br/>
 <span *ngIf="drawing.element.stroke_dasharray" class="item">
     <div class="item-name">Border style: </div>
     <input class="item-value" matInput type="text" [(ngModel)]="drawing.element.stroke_dasharray"/>
 </span>
-<br/>
 <span class="item">
     <div class="item-name">Rotation: </div>
     <input class="item-value" matInput type="text" [(ngModel)]="rotation"/>
 </span>
-<br/>
 <div mat-dialog-actions>
     <button mat-button (click)="onNoClick()" color="accent">Cancel</button>
     <button mat-button (click)="onYesClick()" tabindex="2" mat-raised-button color="primary">Apply</button>

src/app/components/project-map/drawings-editors/style-editor/style-editor.component.scss

@@ -1,6 +1,8 @@
 .item {
     display: flex;
     height: 25px;
+    font-size:10pt;
+    margin-bottom: 10px;
 }
 
 .item-name {
@@ -9,6 +11,9 @@
 
 .item-value {
     width: 70%;
+    margin: 3px;
+    margin-right: 4px;
+    margin-left: 4px;
 }
 
 .input-color {

src/app/components/project-map/drawings-editors/text-editor/text-editor.component.html

@@ -3,12 +3,10 @@
     <div class="item-name">Fill color:</div>
     <input class="input-color" type="color" (ngModelChange)="changeTextColor($event)" [(ngModel)]="drawing.element.fill"/>
 </span>
-<br/>
 <span class="item">
     <div class="item-name">Rotation:</div>
     <input class="item-value" matInput type="text" [(ngModel)]="rotation"/>
 </span>
-<br/>
 <span>
     <textarea #textArea id="textArea" class="text" [(ngModel)]="drawing.element.text">
     </textarea>

src/app/components/project-map/drawings-editors/text-editor/text-editor.component.scss

@@ -1,6 +1,8 @@
 .item {
     display: flex;
     height: 25px;
+    font-size:10pt;
+    margin-bottom: 10px;
 }
 
 .item-name {
@@ -9,6 +11,8 @@
 
 .item-value {
     width: 70%;
+    margin-top: 3px;
+    margin-bottom: 3px;
 }
 
 .input-color {

src/app/services/drawing.service.spec.ts

@@ -117,6 +117,8 @@ describe('DrawingService', () => {
     drawing.x = 10;
     drawing.y = 20;
     drawing.z = 30;
+    drawing.rotation = 0;
+    drawing.svg = '<svg></svg>';
 
     service.update(server, drawing).subscribe();
 
@@ -126,7 +128,9 @@ describe('DrawingService', () => {
     expect(req.request.body).toEqual({
       'x': 10,
       'y': 20,
-      'z': 30
+      'z': 30,
+      'rotation': 0,
+      'svg': '<svg></svg>'
     });
   }));