@stratusjs/idx
Version:
AngularJS idx/property Service and Components bundle to be used as an add on to StratusJS
183 lines (181 loc) • 9.98 kB
JavaScript
System.register(["@stratusjs/runtime/stratus", "@stratusjs/core/environment", "@stratusjs/core/misc", "@stratusjs/angularjs-extras/filters/numeral", "@stratusjs/angular"], function (exports_1, context_1) {
"use strict";
var stratus_1, environment_1, misc_1, numeral_1, min, packageName, moduleName, componentName, localDir;
var __moduleName = context_1 && context_1.id;
return {
setters: [
function (stratus_1_1) {
stratus_1 = stratus_1_1;
},
function (environment_1_1) {
environment_1 = environment_1_1;
},
function (misc_1_1) {
misc_1 = misc_1_1;
},
function (numeral_1_1) {
numeral_1 = numeral_1_1;
},
function (_1) {
}
],
execute: function () {
min = !environment_1.cookie('env') ? '.min' : '';
packageName = 'idx';
moduleName = 'map';
componentName = 'map';
localDir = `${stratus_1.Stratus.BaseUrl}${stratus_1.Stratus.DeploymentPath}@stratusjs/${packageName}/src/${moduleName}/`;
stratus_1.Stratus.Components.IdxMap = {
bindings: {
listId: '@',
googleMapsKey: '@',
mapType: '@',
height: '@',
width: '@',
fullHeight: '@',
fullHeightMinusElements: '@',
referenceParent: '@',
zoom: '@',
zoomControl: '@',
scrollwheel: '@',
markerClickScroll: '@',
markerClickHighlight: '@',
markerPrice: '@',
markerIcon: '@',
markerIconHover: '@',
markerIconLabelOriginX: '@',
markerIconLabelOriginY: '@',
template: '@',
},
controller($attrs, $scope, Idx) {
$scope.uid = misc_1.safeUniqueId(packageName, moduleName, componentName);
stratus_1.Stratus.Instances[$scope.uid] = $scope;
$scope.elementId = $attrs.elementId || $scope.uid;
$scope.instancePath = $scope.elementId;
$scope.instanceFullPath = `Stratus.Instances.${$scope.instancePath}`;
this.$onInit = () => {
$scope.Idx = Idx;
$scope.listId = $attrs.listId || null;
$scope.initialized = false;
$scope.mapInitialized = false;
$scope.listInitialized = false;
$scope.googleMapsKey = $attrs.googleMapsKey || null;
$scope.mapMarkers = [];
$scope.mapType = $attrs.mapType || 'roadmap';
$scope.zoom = $attrs.zoom || 18;
$scope.zoomControl = $attrs.zoomControl || true;
$scope.scrollwheel = $attrs.scrollwheel || false;
$scope.height = $attrs.height || null;
$scope.width = $attrs.width || null;
$scope.markerClickScroll = $attrs.markerClickScroll && misc_1.isJSON($attrs.markerClickScroll) ?
JSON.parse($attrs.markerClickScroll) : false;
$scope.markerClickHighlight = $attrs.markerClickHighlight && misc_1.isJSON($attrs.markerClickHighlight) ?
JSON.parse($attrs.markerClickHighlight) : false;
$scope.markerPrice = $attrs.markerPrice && misc_1.isJSON($attrs.markerPrice) ?
JSON.parse($attrs.markerPrice) : false;
$scope.markerIcon = $attrs.markerIcon || ($scope.markerPrice ? `${localDir}images/map-marker-black.png` : null);
$scope.markerIconLabelOriginX = $attrs.markerIconLabelOriginX || ($scope.markerPrice ? 33 : null);
$scope.markerIconLabelOriginY = $attrs.markerIconLabelOriginX || ($scope.markerPrice ? 13 : null);
$scope.markerIconHover = $attrs.markerIconHover || null;
$scope.fullHeight = $attrs.fullHeight || null;
$scope.fullHeightMinusElements = $attrs.fullHeightMinusElements || null;
$scope.referenceParent = $attrs.referenceParent || 'document';
Idx.registerMapInstance($scope.elementId, $scope);
if ($scope.listId) {
Idx.devLog($scope.elementId, 'is watching for map to update from', $scope.listId);
Idx.on($scope.listId, 'init', (source) => {
$scope.list = source;
$scope.listInitialized = true;
prepareMapMarkers(source);
$scope.mapUpdate().then();
});
Idx.on($scope.listId, 'searched', (source) => {
prepareMapMarkers(source);
$scope.mapUpdate().then();
});
}
if ($scope.googleMapsKey) {
$scope.initialized = true;
}
else {
Idx.on('Idx', 'sessionInit', () => {
Idx.devLog('map received session init');
$scope.initialized = true;
});
}
Idx.emit('init', $scope);
};
const prepareMapMarkers = (source) => {
const markers = [];
let zIndexCounter = 100;
source.getPageModels().forEach((model) => {
if (Object.prototype.hasOwnProperty.call(model, 'Latitude') &&
Object.prototype.hasOwnProperty.call(model, 'Longitude')) {
const address = Idx.getStreetAddress(model);
const marker = {
position: { lat: model.Latitude, lng: model.Longitude },
title: address,
options: {
animation: 2
},
click: {
action: 'function',
function: () => {
if ($scope.list) {
if ($scope.markerClickScroll) {
$scope.list.scrollToModel(model);
}
if ($scope.markerClickHighlight) {
$scope.list.highlightModel(model, 6000);
}
}
}
}
};
if ($scope.markerPrice &&
(Object.prototype.hasOwnProperty.call(model, 'ListPrice') ||
Object.prototype.hasOwnProperty.call(model, 'ClosePrice')) &&
(model.ClosePrice || model.ListPrice)) {
marker.label = {
color: 'white',
text: numeral_1.numeralFormat(model.ClosePrice || model.ListPrice, 1, '$0[.]0a').toUpperCase()
};
marker.collisionBehavior = 'REQUIRED_AND_HIDES_OPTIONAL';
marker.zIndex = zIndexCounter--;
}
markers.push(marker);
}
});
$scope.mapMarkers = markers;
};
$scope.mapInitialize = async (map) => {
$scope.map = map;
$scope.$applyAsync(() => {
Idx.devLog('Map initialized', $scope.map);
$scope.mapInitialized = true;
});
await $scope.mapUpdate();
};
$scope.mapUpdate = async () => {
if ($scope.map) {
$scope.map.removeMarkers();
await $scope.mapMarkers.reduce((_unused, marker) => {
$scope.map.addMarker(marker);
}, undefined);
await new Promise(r => setTimeout(r, 500));
$scope.map.fitMarkerBounds();
}
};
$scope.getGoogleMapsKey = () => {
return $scope.googleMapsKey || Idx.getGoogleMapsKey();
};
$scope.on = (emitterName, callback) => Idx.on($scope.elementId, emitterName, callback);
$scope.remove = () => {
};
},
templateUrl: ($attrs) => `${localDir}${$attrs.template || componentName}.component${min}.html`
};
}
};
});
//# sourceMappingURL=map.component.js.map