tchen-vuelayers
Version:
Web map Vue components with the power of OpenLayers
304 lines (257 loc) • 8.02 kB
JavaScript
/**
* VueLayers
* Web map Vue components with the power of OpenLayers
*
* @package vuelayers
* @author Vladimir Vershinin <ghettovoice@gmail.com>
* @version 0.11.1
* @license MIT
* @copyright (c) 2017-2019, Vladimir Vershinin <ghettovoice@gmail.com>
*/
import _regeneratorRuntime from '@babel/runtime-corejs2/regenerator';
import _asyncToGenerator from '@babel/runtime-corejs2/helpers/esm/asyncToGenerator';
import { altKeyOnly, always, primaryAction } from 'ol/events/condition';
import ModifyInteraction from 'ol/interaction/Modify';
import interaction from '../mixin/interaction';
import stylesContainer from '../mixin/styles-container';
import { createStyle, defaultEditStyle } from '../ol-ext/style';
import { isCollection, isVectorSource } from '../ol-ext/util';
import observableFromOlEvent from '../rx-ext/from-ol-event';
import { hasInteraction } from '../util/assert';
import { isFunction, mapValues, pick } from '../util/minilo';
import mergeDescriptors from '../util/multi-merge-descriptors';
import { makeWatchers } from '../util/vue-helpers';
import _Object$assign from '@babel/runtime-corejs2/core-js/object/assign';
/**
* @vueProps
*/
var props = {
/**
* Source or collection identifier from IdentityMap.
* @type {String}
*/
source: {
type: String,
required: true
},
/**
* A function that takes an `ol.MapBrowserEvent` and returns a boolean to indicate whether that event will be
* considered to add or move a vertex to the sketch. Default is `ol.events.condition.primaryAction`.
* @type {function|undefined}
*/
condition: {
type: Function,
default: primaryAction
},
/**
* A function that takes an `ol.MapBrowserEvent` and returns a boolean to indicate whether that event should be handled.
* By default, `ol.events.condition.singleClick` with `ol.events.condition.altKeyOnly` results in a vertex deletion.
* @type {function|undefined}
*/
deleteCondition: {
type: Function,
default: altKeyOnly
},
/**
* A function that takes an `ol.MapBrowserEvent` and returns a boolean to indicate whether a new vertex can be added
* to the sketch features. Default is `ol.events.condition.always`.
* @type {function|undefined}
*/
insertVertexCondition: {
type: Function,
default: always
},
/**
* Pixel tolerance for considering the pointer close enough to a segment or vertex for editing.
* @type {number}
*/
pixelTolerance: {
type: Number,
default: 10
},
/**
* Wrap the world horizontally on the sketch overlay.
* @type {boolean}
*/
wrapX: {
type: Boolean,
default: false
}
/**
* @vueMethods
*/
};
var methods = {
/**
* @return {Promise<Modify>}
* @protected
*/
createInteraction: function () {
var _createInteraction = _asyncToGenerator(
/*#__PURE__*/
_regeneratorRuntime.mark(function _callee() {
var sourceIdent, source, features;
return _regeneratorRuntime.wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
sourceIdent = this.makeIdent(this.source);
_context.next = 3;
return this.$identityMap.get(sourceIdent, this.$options.INSTANCE_PROMISE_POOL);
case 3:
source = _context.sent;
if (isFunction(source.getFeatures)) {
features = source.getFeatures();
if (isCollection(features)) {
source = features;
}
}
return _context.abrupt("return", new ModifyInteraction({
source: isVectorSource(source) ? source : undefined,
features: isCollection(source) ? source : undefined,
deleteCondition: this.deleteCondition,
insertVertexCondition: this.insertVertexCondition,
pixelTolerance: this.pixelTolerance,
style: this.createStyleFunc(),
wrapX: this.wrapX
}));
case 6:
case "end":
return _context.stop();
}
}
}, _callee, this);
}));
return function createInteraction() {
return _createInteraction.apply(this, arguments);
};
}(),
/**
* @return {function(feature: Feature): Style}
* @protected
*/
getDefaultStyles: function getDefaultStyles() {
var defaultStyles = mapValues(defaultEditStyle(), function (styles) {
return styles.map(createStyle);
});
return function __selectDefaultStyleFunc(feature) {
if (feature.getGeometry()) {
return defaultStyles[feature.getGeometry().getType()];
}
};
},
/**
* @returns {Object}
* @protected
*/
getServices: function getServices() {
return mergeDescriptors(interaction.methods.getServices.call(this), stylesContainer.methods.getServices.call(this));
},
/**
* @return {Interaction|undefined}
* @protected
*/
getStyleTarget: function getStyleTarget() {
return this.$interaction;
},
/**
* @return {void}
* @protected
*/
mount: function mount() {
interaction.methods.mount.call(this);
},
/**
* @return {void}
* @protected
*/
unmount: function unmount() {
interaction.methods.unmount.call(this);
},
/**
* @param {Array<{style: Style, condition: (function|boolean|undefined)}>|function(feature: Feature): Style|Vue|undefined} styles
* @return {void}
* @protected
*/
setStyle: function setStyle(styles) {
if (styles !== this._styles) {
this._styles = styles;
this.scheduleRefresh();
}
},
/**
* @return {void}
* @protected
*/
subscribeAll: function subscribeAll() {
subscribeToInteractionChanges.call(this);
}
};
var watch = makeWatchers(['source'], function () {
return function () {
this.scheduleRecreate();
};
});
/**
* @vueProto
* @alias module:modify-interaction/interaction
* @title vl-interaction-modify
*/
var script = {
name: 'vl-interaction-modify',
mixins: [interaction, stylesContainer],
props: props,
methods: methods,
watch: watch
/**
* @private
*/
};
function subscribeToInteractionChanges() {
var _this = this;
hasInteraction(this);
var modifyEvents = observableFromOlEvent(this.$interaction, ['modifystart', 'modifyend']);
this.subscribeTo(modifyEvents, function (evt) {
++_this.rev;
_this.$emit(evt.type, evt);
});
}
/* script */
var __vue_script__ = script;
/* template */
/* style */
var __vue_inject_styles__ = undefined;
/* scoped */
var __vue_scope_id__ = undefined;
/* module identifier */
var __vue_module_identifier__ = undefined;
/* functional template */
var __vue_is_functional_template__ = undefined;
/* component normalizer */
function __vue_normalize__(template, style, script$$1, scope, functional, moduleIdentifier, createInjector, createInjectorSSR) {
var component = (typeof script$$1 === 'function' ? script$$1.options : script$$1) || {}; // For security concerns, we use only base name in production mode.
component.__file = "interaction.vue";
if (!component.render) {
component.render = template.render;
component.staticRenderFns = template.staticRenderFns;
component._compiled = true;
if (functional) component.functional = true;
}
component._scopeId = scope;
return component;
}
/* style inject */
/* style inject SSR */
var Interaction = __vue_normalize__({}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, undefined, undefined);
function plugin(Vue) {
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
if (plugin.installed) {
return;
}
plugin.installed = true;
options = pick(options, 'dataProjection');
_Object$assign(Interaction, options);
Vue.component(Interaction.name, Interaction);
}
export default plugin;
export { Interaction, plugin as install };