Merge 500edc0 into 1b90622

yagajs · Feb 9, 2018 · 1f057a9 · 1f057a9
2 parents 1b90622 + 500edc0
commit 1f057a9
Show file tree

Hide file tree

Showing 3 changed files with 54 additions and 4 deletions.
diff --git a/examples/marker-directive/index.ts b/examples/marker-directive/index.ts
@@ -30,6 +30,7 @@ const template: string = `
         [(lat)]="getDuplexPropertyByName('lat').value"
         [(lng)]="getDuplexPropertyByName('lng').value"
         [(position)]="getDuplexPropertyByName('position').value"
+        [(zIndexOffset)]="getDuplexPropertyByName('zIndexOffset').value"
         (dragend)="handleEvent('dragend', $event);"
         (dragstart)="handleEvent('dragstart', $event);"
         (movestart)="handleEvent('movestart', $event);"
@@ -83,7 +84,7 @@ export class AppComponent extends ExampleAppComponentBlueprint {
             {name: 'opacity', value: 0.5, type: 'relative'},
             {name: 'draggable', value: true, type: 'checkbox'},
             {name: 'display', value: true, type: 'checkbox'},
-            {name: 'zindex', value: 255, type: 'number'},
+            {name: 'zIndexOffset', value: 255, type: 'number'},
             // {name: 'icon', value:, type: ''},
             {name: 'tooltipOpened', value: false, type: 'checkbox'},
             {name: 'popupOpened', value: false, type: 'checkbox'},
@@ -114,7 +115,6 @@ export class AppComponent extends ExampleAppComponentBlueprint {
         ],
     };
 
-
     public iconUrl: string = 'http://leafletjs.com/examples/custom-icons/leaf-green.png';
     public iconSize: Point = new Point(38, 95);
     public iconAnchor: Point = new Point(22, 94);

diff --git a/ts/marker.directive.spec.ts b/ts/marker.directive.spec.ts
@@ -141,6 +141,43 @@ describe('Marker Directive', () => {
             layer.setOpacity(val);
         });
     });
+    describe('[(zIndexOffset)]', () => {
+        it('should be changed in Leaflet when changing in Angular', () => {
+            const val: number = randomNumber();
+            layer.zIndexOffset = val;
+            expect(layer.options.zIndexOffset).to.equal(val);
+        });
+        it('should be changed in Angular when changing in Angular', () => {
+            const val: number = randomNumber();
+            layer.zIndexOffset = val;
+            expect(layer.zIndexOffset).to.equal(val);
+        });
+        it('should be changed in Angular when changing in Leaflet', () => {
+            const val: number = randomNumber();
+            layer.setZIndexOffset(val);
+            expect(layer.zIndexOffset).to.equal(val);
+        });
+        it('should fire an event when changing in Angular', (done: MochaDone) => {
+            const val: number = randomNumber();
+
+            layer.zIndexOffsetChange.subscribe((eventVal: number) => {
+                expect(eventVal).to.equal(val);
+                return done();
+            });
+
+            layer.zIndexOffset = val;
+        });
+        it('should fire an event when changing in Leaflet', (done: MochaDone) => {
+            const val: number = randomNumber();
+
+            layer.zIndexOffsetChange.subscribe((eventVal: number) => {
+                expect(eventVal).to.equal(val);
+                return done();
+            });
+
+            layer.setZIndexOffset(val);
+        });
+    });
 
     describe('[(lat)]', () => {
         beforeEach(() => {

diff --git a/ts/marker.directive.ts b/ts/marker.directive.ts
@@ -34,7 +34,7 @@ export class MarkerDirective extends Marker implements AfterContentInit, OnDestr
     @Output() public lngChange: EventEmitter<number> = new EventEmitter();
     @Output() public opacityChange: EventEmitter<number> = new EventEmitter();
     @Output() public displayChange: EventEmitter<boolean> = new EventEmitter();
-    @Output() public zindexChange: EventEmitter<number> = new EventEmitter();
+    @Output() public zIndexOffsetChange: EventEmitter<number> = new EventEmitter();
     @Output() public draggableChange: EventEmitter<boolean> = new EventEmitter();
     @Output() public iconChange: EventEmitter<Icon | DivIcon> = new EventEmitter();
     @Output() public tooltipOpenedChange: EventEmitter<boolean> = new EventEmitter();
@@ -244,7 +244,7 @@ export class MarkerDirective extends Marker implements AfterContentInit, OnDestr
 
     public setOpacity(val: number): this {
         if (this.opacity === val) {
-            return;
+            return this;
         }
         this.opacityChange.emit(val);
         return super.setOpacity(val);
@@ -278,6 +278,19 @@ export class MarkerDirective extends Marker implements AfterContentInit, OnDestr
     public get draggable(): boolean {
         return this.dragging.enabled();
     }
+    public setZIndexOffset(val: number): this {
+        if (this.zIndexOffset === val) {
+            return this;
+        }
+        this.zIndexOffsetChange.emit(val);
+        return super.setZIndexOffset(val);
+    }
+    @Input() public set zIndexOffset(val: number) {
+        this.setZIndexOffset(val);
+    }
+    public get zIndexOffset(): number {
+        return this.options.zIndexOffset;
+    }
 
     @Input() public set title(val: string) {
         this.options.title = val;