ng2-heremaps
Version:
Here Maps for Angular 6
329 lines • 10.7 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
import * as tslib_1 from "tslib";
import { Directive, Input, Output, EventEmitter, forwardRef } from '@angular/core';
import { HereMapsManager } from '../services/maps-manager';
import { BaseMapComponent } from './base-map-component';
import { toLatLng } from '../utils/position';
/**
* Holds instance of the heremap marker. Please note that directive must be placed inside
* map component, otherwise it will never be rendered.
*/
var MapMakerDirective = /** @class */ (function (_super) {
tslib_1.__extends(MapMakerDirective, _super);
function MapMakerDirective(_mapsManager) {
var _this = _super.call(this) || this;
_this._mapsManager = _mapsManager;
/**
* This event is fired when the marker icon was clicked.
*/
_this.click = new EventEmitter();
/**
* This event is fired when the marker icon was double clicked.
*/
_this.dblclick = new EventEmitter();
/**
* This event is fired for a rightclick on the marker.
*/
_this.rightclick = new EventEmitter();
/**
* This event is fired when the marker position property changes.
*/
_this.position_changed = new EventEmitter();
/**
* This event is fired when the marker icon property changes.
*/
_this.icon_changed = new EventEmitter();
/**
* This event is fired when the marker title property changes.
*/
_this.title_changed = new EventEmitter();
/**
* This event is fired when the marker visible property changes.
*/
_this.visible_changed = new EventEmitter();
_this._clickable = true;
return _this;
}
Object.defineProperty(MapMakerDirective.prototype, "position", {
set: /**
* Marker position
* @param {?} point
* @return {?}
*/
function (point) {
var _this = this;
var /** @type {?} */ position = toLatLng(point);
this._mapsManager
.createMarker({ position: position })
.then(function (marker) {
_this.bindEvents(marker);
_this.proxyResolver(marker);
});
this.proxy.then(function (marker) {
marker.setPosition(toLatLng(point));
});
},
enumerable: true,
configurable: true
});
Object.defineProperty(MapMakerDirective.prototype, "clickable", {
set: /**
* If true, the marker receives mouse and touch events.
* Default value is true.
* @param {?} mode
* @return {?}
*/
function (mode) {
// this.proxy.then(marker => marker.setClickable(mode));
this._clickable = mode;
},
enumerable: true,
configurable: true
});
Object.defineProperty(MapMakerDirective.prototype, "icon", {
set: /**
* Icon for the foreground. If a string is provided,
* it is treated as though it were an Icon with the string as url.
* @param {?} value
* @return {?}
*/
function (value) {
this.proxy.then(function (marker) {
if (typeof value === 'string') {
value = new H.map.Icon(value, {
size: { w: 20, h: 20 },
crossOrigin: false
});
}
marker.setIcon(value);
});
},
enumerable: true,
configurable: true
});
Object.defineProperty(MapMakerDirective.prototype, "opacity", {
set: /**
* The marker's opacity between 0.0 and 1.0.
* @param {?} value
* @return {?}
*/
function (value) {
// this.proxy.then(marker => marker.setOpacity(value));
},
enumerable: true,
configurable: true
});
Object.defineProperty(MapMakerDirective.prototype, "title", {
set: /**
* Rollover text
* @param {?} value
* @return {?}
*/
function (value) {
// this.proxy.then(marker => marker.setTitle(value));
},
enumerable: true,
configurable: true
});
Object.defineProperty(MapMakerDirective.prototype, "visible", {
set: /**
* If true, the marker is visible
* @param {?} mode
* @return {?}
*/
function (mode) {
this.proxy.then(function (marker) { return marker.setVisibility(mode); });
},
enumerable: true,
configurable: true
});
Object.defineProperty(MapMakerDirective.prototype, "zIndex", {
set: /**
* Set marker zIndex for displayed on the map
* @param {?} value
* @return {?}
*/
function (value) {
this.proxy.then(function (marker) { return marker.setZIndex(value); });
},
enumerable: true,
configurable: true
});
Object.defineProperty(MapMakerDirective.prototype, "setDelay", {
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
this.delay = value;
},
enumerable: true,
configurable: true
});
/**
* @return {?}
*/
MapMakerDirective.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
var _this = this;
this.proxy.then(function (marker) {
marker.dispose();
_this.mapComponent.getMap().then(function (map) {
if (map.getObjects().indexOf(marker) >= 0) {
map.removeObject(marker);
}
});
});
};
/**
* @return {?}
*/
MapMakerDirective.prototype.hasMapComponent = /**
* @return {?}
*/
function () {
return !!this.mapComponent;
};
/**
* @param {?} component
* @param {?} map
* @param {?} ui
* @return {?}
*/
MapMakerDirective.prototype.setMapComponent = /**
* @param {?} component
* @param {?} map
* @param {?} ui
* @return {?}
*/
function (component, map, ui) {
var _this = this;
this.mapComponent = component;
this.proxy.then(function (mapObject) {
return setTimeout(function () {
if (mapObject instanceof H.map.Object) {
map.addObject(mapObject);
}
}, _this.delay || 0);
});
};
/**
* @param {?} marker
* @return {?}
*/
MapMakerDirective.prototype.bindEvents = /**
* @param {?} marker
* @return {?}
*/
function (marker) {
var _this = this;
marker.addEventListener('tap', function (e) {
if (_this._clickable) {
_this.click.emit(e);
}
});
marker.addEventListener('dbltap', function (e) {
if (_this._clickable) {
_this.dblclick.emit(e);
}
});
// marker.addEventListener('position_changed', e => this.position_changed.emit(e));
// marker.addEventListener('title_changed', e => this.title_changed.emit(e));
// marker.addEventListener('icon_changed', e => this.icon_changed.emit(e));
marker.addEventListener('visibilitychange', function (e) {
return _this.visible_changed.emit(e);
});
};
MapMakerDirective.decorators = [
{ type: Directive, args: [{
selector: 'map-marker',
providers: [
{
provide: BaseMapComponent,
useExisting: forwardRef(function () { return MapMakerDirective; })
}
]
},] }
];
/** @nocollapse */
MapMakerDirective.ctorParameters = function () { return [
{ type: HereMapsManager, },
]; };
MapMakerDirective.propDecorators = {
"click": [{ type: Output },],
"dblclick": [{ type: Output },],
"rightclick": [{ type: Output },],
"position_changed": [{ type: Output },],
"icon_changed": [{ type: Output },],
"title_changed": [{ type: Output },],
"visible_changed": [{ type: Output },],
"position": [{ type: Input },],
"clickable": [{ type: Input },],
"icon": [{ type: Input },],
"opacity": [{ type: Input },],
"title": [{ type: Input },],
"visible": [{ type: Input },],
"zIndex": [{ type: Input },],
"setDelay": [{ type: Input, args: ['delay',] },],
};
return MapMakerDirective;
}(BaseMapComponent));
export { MapMakerDirective };
function MapMakerDirective_tsickle_Closure_declarations() {
/** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
MapMakerDirective.decorators;
/**
* @nocollapse
* @type {function(): !Array<(null|{type: ?, decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>)})>}
*/
MapMakerDirective.ctorParameters;
/** @type {!Object<string,!Array<{type: !Function, args: (undefined|!Array<?>)}>>} */
MapMakerDirective.propDecorators;
/**
* This event is fired when the marker icon was clicked.
* @type {?}
*/
MapMakerDirective.prototype.click;
/**
* This event is fired when the marker icon was double clicked.
* @type {?}
*/
MapMakerDirective.prototype.dblclick;
/**
* This event is fired for a rightclick on the marker.
* @type {?}
*/
MapMakerDirective.prototype.rightclick;
/**
* This event is fired when the marker position property changes.
* @type {?}
*/
MapMakerDirective.prototype.position_changed;
/**
* This event is fired when the marker icon property changes.
* @type {?}
*/
MapMakerDirective.prototype.icon_changed;
/**
* This event is fired when the marker title property changes.
* @type {?}
*/
MapMakerDirective.prototype.title_changed;
/**
* This event is fired when the marker visible property changes.
* @type {?}
*/
MapMakerDirective.prototype.visible_changed;
/** @type {?} */
MapMakerDirective.prototype.mapComponent;
/** @type {?} */
MapMakerDirective.prototype._clickable;
/** @type {?} */
MapMakerDirective.prototype._mapsManager;
}
//# sourceMappingURL=map-marker.js.map