atriusmaps-node-sdk
Version:
This project provides an API to Atrius Personal Wayfinder maps within a Node environment. See the README.md for more information
200 lines (170 loc) • 6.51 kB
JavaScript
;
var R = require('ramda');
var navGraphDebug = require('../plugins/wayfinder/src/navGraphDebug.js');
var dom = require('./utils/dom.js');
var funcs = require('./utils/funcs.js');
function _interopNamespaceDefault(e) {
var n = Object.create(null);
if (e) {
Object.keys(e).forEach(function (k) {
if (k !== 'default') {
var d = Object.getOwnPropertyDescriptor(e, k);
Object.defineProperty(n, k, d.get ? d : {
enumerable: true,
get: function () { return e[k]; }
});
}
});
}
n.default = e;
return Object.freeze(n);
}
var R__namespace = /*#__PURE__*/_interopNamespaceDefault(R);
if (typeof window !== 'undefined') window.R = R__namespace; // helps use Rambda in console... probably don't want to do this once we integrate with customer content
// NOTE:
// The exported functions from this module all get placed into the app.debug (accessable from console via _app.debug) and bound to
// the app instance. So the `this` context will contain the app instance when these are run. This allows you to access objects like
// the bus via `this.bus` or configuration via `this.config`
// Update: these are now also available in MoL by searching for `debug:<funcname>` - such as `debug:showIcons`
const showIcons = () => {
dom.$('#mapRenderDiv').innerHTML =
'<style> div { display: inline-block; text-align: center; border: 1px solid lightblue; }</style>' +
dom.$$('svg symbol')
.map(e => `<div><svg><use xlink:href="#${e.id}"/></svg><br/>${e.id}</div>`)
.join('');
};
function poisByCategory() {
return this.bus
.send('poi/getAll')
.then(r => r[0])
.then(p => Object.values(p))
.then(R__namespace.groupBy(o => o.category));
}
const highlightNodes = () =>
dom.ad(
{
tag: 'style',
html: '* { background-color: rgba(255,0,0,.2); } * * { background-color: rgba(0,255,0,.2); } * * * { background-color: rgba(0,0,255,.2); } * * * * { background-color: rgba(255,0,255,.2); } * * * * * { background-color: rgba(0,255,255,.2); } * * * * * * { background-color: rgba(255,255,0,.2); } * * * * * * * { background-color: rgba(255,0,0,.2); } * * * * * * * * { background-color: rgba(0,255,0,.2); } * * * * * * * * * { background-color: rgba(0,0,255,.2); }',
},
dom.$('head'),
);
function getPoiById(id) {
return this.bus.send('poi/getById', { id }).then(r => r[0]);
}
async function showOrphaned() {
const navGraph = await this.bus.get('wayfinder/_getNavGraph');
const oob = navGraphDebug.orphanTest(navGraph._nodes);
this.bus.send('map/showOrphanedGraphNodes', { orphanedNodes: oob.orphaned });
}
async function showgraph() {
const navGraph = await this.bus.get('wayfinder/getNavGraphFeatures');
this.bus.send('map/showNavGraphFeatures', { navGraph });
monitorDebugFeaturesReset('map/resetNavGraphFeatures', this.bus);
}
async function bounds() {
const venueCenter = await this.bus.get('venueData/getVenueCenter');
const { venueRadius, bounds } = await this.bus.get('venueData/getVenueData');
this.bus.send('map/showVenueBounds', { venueCenter, venueRadius, bounds });
monitorDebugFeaturesReset('map/resetVenueBounds', this.bus);
}
async function buildingBounds(nameFilter) {
this.bus.send('map/showBuildingBounds', { nameFilter });
monitorDebugFeaturesReset('map/resetVenueBounds', this.bus);
showCenter.apply(this);
}
async function floorBounds(nameFilter) {
const bus = this.bus;
bus.send('map/showFloorBounds', { nameFilter });
monitorDebugFeaturesReset('map/resetVenueBounds', bus);
const unsubFloorChanges = bus.monitor('map/floorChanged', () => bus.send('map/showFloorBounds', { nameFilter }));
onNextSearchClear(unsubFloorChanges, bus);
showCenter.apply(this);
}
async function padding() {
this.bus.send('map/togglePadding');
monitorDebugFeaturesReset('map/togglePadding', this.bus);
}
const monitorDebugFeaturesReset = (resetEventName, bus) => onNextSearchClear(() => bus.send(resetEventName), bus);
const onNextSearchClear = (fn, bus) => {
const unsubscribe = bus.monitor('homeview/performSearch', ({ term }) => {
if (!term) {
fn();
unsubscribe();
}
});
};
async function showCenter() {
const padding = await this.bus.get('map/getPadding');
const leftAdj = (padding.left - padding.right) / 2; // how much to adjust left from true center to account for padding
const topAdj = (padding.top - padding.bottom) / 2; // how much to adjust top from true center to account for padding
const crosshair = dom.ad(
{
html: `<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"><path stroke="#fF000080" stroke-width="2" d="M0 50h45M55 50h45M50 0v45M50 55v45"/></svg>`,
styles: {
position: 'absolute',
left: '50%',
top: '50%',
'margin-left': -50 + leftAdj + 'px',
'margin-top': -50 + topAdj + 'px',
},
},
dom.$('.maplibregl-map'),
);
onNextSearchClear(() => dom.del(crosshair), this.bus);
}
function dndGo() {
const bus = this.bus;
const toggleActive = (e, indicateDragVisual) => {
e.preventDefault();
if (indicateDragVisual) e.target.classList.add('dragover');
else e.target.classList.remove('dragover');
};
const handlers = {
drop: async function (e) {
toggleActive(e, false);
// Load the file into the player
for (const file of e.dataTransfer.files) {
const filename = file.name;
if (file.type === 'application/json' || file.type.startsWith('text/')) {
const reader = new FileReader();
reader.onload = funcs.singleFile(async e =>
bus.send(`debugTools/fileDrop`, {
file,
filename,
content: e.target.result,
}),
);
reader.readAsText(file);
}
}
},
// Drag-over event
dragover: function (e) {
toggleActive(e, true);
},
// Drag-leave event
dragleave: function (e) {
toggleActive(e, false);
},
}; // end of handlers def
Object.keys(handlers).forEach(function (event) {
document.body.addEventListener(event, handlers[event]);
});
console.log('DnD Listeners installed');
} // end of function installDragNDrop
var debugTools = {
bounds,
buildingBounds,
dndGo,
floorBounds,
getPoiById,
highlightNodes,
orphanTest: navGraphDebug.orphanTest,
padding,
poisByCategory,
showCenter,
showgraph,
showIcons,
showOrphaned,
};
module.exports = debugTools;