From d5b87f23cfca476cb75c59aab93e37b55ee19263 Mon Sep 17 00:00:00 2001 From: Severin Opel Date: Thu, 12 Dec 2019 19:04:11 +0100 Subject: [PATCH] Updated generated content (Docs & dist). --- dist/iwmlib.pixi.js | 603 +++++++++++------ doc/out/AbstractPopup.html | 36 +- doc/out/Badge.html | 36 +- doc/out/BlurFilter.html | 36 +- doc/out/Button.html | 36 +- doc/out/ButtonGroup.html | 36 +- doc/out/DeepZoomImage.html | 36 +- doc/out/DeepZoomInfo.html | 36 +- doc/out/Flippable.html | 36 +- doc/out/FontInfo.html | 36 +- doc/out/Hypenate.html | 36 +- doc/out/InteractivePopup.html | 36 +- ...beledGraphics.exports.LabeledGraphics.html | 36 +- doc/out/LabeledGraphics.html | 36 +- doc/out/List.html | 36 +- doc/out/Message.html | 36 +- doc/out/MessageInteractivePopup.html | 36 +- doc/out/MessageMessageInteractivePopup.html | 36 +- doc/out/Modal.html | 36 +- doc/out/ModalInteractivePopup.html | 36 +- doc/out/ModalModalInteractivePopup.html | 36 +- doc/out/PIXIApp.html | 36 +- doc/out/Popup.html | 36 +- doc/out/PopupInteractivePopup.html | 36 +- doc/out/PopupMenu.html | 36 +- doc/out/PopupMenuPopupInteractivePopup.html | 36 +- ...pupMenuPopupMenuPopupInteractivePopup.html | 36 +- ...nuPopupMenuPopupPopupInteractivePopup.html | 36 +- .../PopupMenuPopupPopupInteractivePopup.html | 36 +- doc/out/PopupPopupInteractivePopup.html | 36 +- doc/out/Progress.html | 36 +- doc/out/Scrollview.html | 36 +- doc/out/Slider.html | 36 +- doc/out/Switch.html | 36 +- doc/out/TextLabel.TextLabel.html | 36 +- doc/out/Theme.html | 36 +- doc/out/ThemeDark.html | 36 +- doc/out/ThemeLight.html | 36 +- doc/out/ThemeRed.html | 36 +- doc/out/TileQuadNode.html | 36 +- doc/out/Tooltip.html | 36 +- doc/out/UITest.html | 36 +- doc/out/Volatile.html | 36 +- doc/out/global.html | 640 +++++++++--------- doc/out/index.html | 36 +- doc/out/pixi_abstractpopup.js.html | 36 +- doc/out/pixi_app.js.html | 36 +- doc/out/pixi_badge.js.html | 36 +- doc/out/pixi_blurfilter.js.html | 36 +- doc/out/pixi_button.js.html | 36 +- doc/out/pixi_buttongroup.js.html | 36 +- doc/out/pixi_deepzoom_image.js.html | 36 +- doc/out/pixi_flippable.js.html | 36 +- doc/out/pixi_labeledgraphics.js.html | 36 +- doc/out/pixi_list.js.html | 36 +- doc/out/pixi_message.js.html | 36 +- doc/out/pixi_modal.js.html | 36 +- doc/out/pixi_popup.js.html | 36 +- doc/out/pixi_popupmenu.js.html | 36 +- doc/out/pixi_progress.js.html | 36 +- doc/out/pixi_scrollview.js.html | 36 +- doc/out/pixi_slider.js.html | 36 +- doc/out/pixi_switch.js.html | 36 +- doc/out/pixi_theme.js.html | 36 +- doc/out/pixi_tooltip.js.html | 36 +- doc/out/pixi_volatile.js.html | 36 +- doc/out/uitest.js.html | 36 +- 67 files changed, 2727 insertions(+), 856 deletions(-) diff --git a/dist/iwmlib.pixi.js b/dist/iwmlib.pixi.js index 6c868f1..2084911 100644 --- a/dist/iwmlib.pixi.js +++ b/dist/iwmlib.pixi.js @@ -17088,6 +17088,12 @@ * Specialization of the DisplayObjectScatter with special behavior needed for maps. */ class AdvancedScatter extends DisplayObjectScatter { + constructor() { + super(...arguments); + + this.onMoved = new EventHandler('onMove'); + } + /** * Animates the throw and ensures that the map is always visible. This * is different from the standard behavior. @@ -17105,6 +17111,7 @@ //when the object is not thrown. if (this.velocity != null) { + this.onMoved.call(this); let dt = this._throwDeltaTime(); // This seems to just correct the velocity when its calculated wrong. // In what case can it get bigger? Velocity tends to always shrink, when no force is added. @@ -17796,8 +17803,6 @@ } } - - /** * Determines if the scatter covers the container. * @member {boolean} @@ -17805,6 +17810,14 @@ * @memberof GeoMap */ get cover() { + // For cloning we want to store the cover inside the map. + // But the scatter is responsible for the cover state. + // So we update the app's cover state every time + // we get the value. + if (this.image && this.image.scatter && this.image.scatter.cover != null) { + this._cover = this.image.scatter.cover; + } + return this._cover } @@ -17849,10 +17862,10 @@ */ lock({ rotatable = false, translatable = false, movableX = false, movableY = false, scalable = false } = {}) { if (this.image && this.image.scatter) { - this.image.scatter.translatable = rotatable; - this.image.scatter.movableX = translatable; - this.image.scatter.movableY = movableX; - this.image.scatter.rotatable = movableY; + this.image.scatter.translatable = translatable; + this.image.scatter.movableX = movableX; + this.image.scatter.movableY = movableY; + this.image.scatter.rotatable = rotatable; this.image.scatter.scalable = scalable; } } @@ -18453,7 +18466,7 @@ clone(container, scatter = null) { const map = new DeepZoomMap(this.mapProjection, this.tilesConfig, { alpha: this.alpha, - cover: this.image.scatter.cover, + cover: this.cover, debug: this.debug, startScale: this.startScale, minScale: this.minScale, @@ -18537,7 +18550,7 @@ clone(container = null, scatter = null) { const map = new ImageMap(new PIXI.Sprite(this.sprite.texture), this.mapProjection, { alpha: this.alpha, - cover: this.image.cover, + cover: this.cover, debug: this.debug, startScale: this.startScale, minScale: this.minScale, @@ -18925,6 +18938,7 @@ */ windowPointToMapPoint(map, point) { let pointOnMap = { x: 0, y: 0 }; + if (map['image'] && map.image['parent']) { let offset = map.image.parent.toGlobal({ x: 0, y: 0 }); pointOnMap = new PIXI.Point( @@ -21451,118 +21465,220 @@ * * It's highly configurable and adaptable to a variety of scenarios. * + * + * @export + * @class Overlay */ - class Overlay { /** - *Creates an instance of Overlay. - * @param {*} [{ - * name = "unnamed", {string} - * connector = false, - * connectorType = "line", - * location = null, - * label = false, - * labelType = null, - * labelLocation = null, - * labelAlignment = "center", - * labelVerticalAlign = "underneath", - * labelTarget = null, - * shape = "geometry", {string} - Defines the shape to be used: geometry, circle, rectangle - * geometry = null, - * geometryType = "point", - * geometryFallback = "circle", - * informationPopup = "infocard", - * - * }={}] + * Creates an instance of Overlay. + * @param {*} [options={}] + * type + * @param{object} name - Name of the item. + * @param{object} borderColor - + * @param{object} borderThickness - + * @param{object} enabled - Determines if enabled, disabled when false. + * @param{object} labelScale - + * @param{object} location - + * @param{object} label - + * @param{object} labelType - + * @param{object} labelLocation - + * @param{object} labelAlignment - + * @param{object} labelVerticalAlignment - + * @param{object} labelSpacing - + * @param{object} labelTarget - + * @param{object} geometry - + * @param{object} information - + * @param{object} informationPath - + * @param{object} informationType - + * @param{object} icon - + * @param{object} iconAlpha - + * @param{object} iconAnchor - + * @param{object} iconColor - + * @param{object} iconScale - + * @param{object} iconOffset - + * @param{object} items - + * @param{object} color - Color of te point. + * @param{object} fillAlpha - FillAlpha of the point. + * @param{object} size - Size of the point. + * @param{object} scale - Determines the scale of the graphics. + * @param{object} rescale - Rescales the graphics relative to the map, that they keep their original scale. Only works for the entire overlay atm. Therefore must be set in the global parameters and not inside the children. + * @param{object} popoverOffset - + * @param{object} zoomVisibility - + * @param{object} labelMultiLineAlign - + * @param{object} labelBreakWords - + * @param{object} labelDropShadow - + * @param{object} labelDropShadowAlpha - + * @param{object} labelDropShadowAngle - + * @param{object} labelDropShadowBlur - + * @param{object} labelDropShadowColor - + * @param{object} labelDropShadowDistance - + * @param{object} fontColor - + * @param{object} fontFamily - + * @param{object} fontSize - + * @param{object} fontStyle - + * @param{object} fontWeight - + * @param{object} labelStroke - + * @param{object} labelStrokeThickness - + * @param{object} wordWrap - + * @param{object} wordWrapWidth - + * @param{object} labelFill - + * @param{object} labelFillGradientType - + * @param{object} labelFillGradientStops - + * @param{object} fontVariant - + * @param{object} labelLeading - + * @param{object} letterSpacing - + * @param{object} labelLineHeight - + * @param{object} labelLineJoin - + * @param{object} labelMiterLimit - + * @param{object} labelPadding - + * @param{object} labelTrim - + * @param{object} textBaseline - + * @param{object} labelWhiteSpace - * @memberof Overlay */ - constructor(opts = {}) { + constructor(options = {}) { let defaultTextStyle = new PIXI.TextStyle(); - Object.assign( - this, - { - type: 'auto', - name: 'unnamed', + let defaultOptions = { + type: 'auto', + name: 'unnamed', - borderColor: 0x000000, - borderThickness: 5, + borderColor: 0x000000, + borderThickness: 5, + enabled: true, + labelScale: 1, + location: null, + label: false, + labelType: null, + labelLocation: null, + labelAlignment: 'center', + labelVerticalAlignment: 'underneath', + labelSpacing: 10, + labelTarget: null, + geometry: null, + information: '', + informationPath: null, + informationType: 'popup', + icon: null, + iconAlpha: 1, + iconAnchor: { x: 0.5, y: 0.5 }, + iconColor: 0xffffff, + iconScale: 1, + iconOffset: { x: 0, y: 0 }, + items: [], + color: 0xff00ff, + fillAlpha: 1, + size: 50, + scale: 1, + rescale: false, + popoverOffset: { x: 0, y: 0 }, + zoomVisibility: { min: 0, max: Number.MAX_VALUE }, - disabledAlpha: 1, - disabledColor: 0xaa1111, - disabledBorderColor: 0x000000, - enabled: true, - labelScale: 1, - location: null, - label: false, - labelType: null, - labelLocation: null, - labelAlignment: 'center', - labelVerticalAlign: 'underneath', - labelSpacing: 10, - labelTarget: null, - geometry: null, - information: '', - informationPath: null, - informationType: 'popup', - icon: null, - iconAlpha: 1, - iconAnchor: { x: 0.5, y: 0.5 }, - iconColor: 0xffffff, - iconScale: 1, - iconOffset: { x: 0, y: 0 }, - items: [], - color: 0xff00ff, - fillAlpha: 1, - size: 50, - scale: 1, - rescale: false, - popoverOffset: { x: 0, y: 0 }, - zoomVisibility: { min: 0, max: Number.MAX_VALUE }, + /** + * The following Attributes are taken from the TextStyle class + * of PIXI. All can be overwritten in the overlay's JSON file. + */ + labelMultiLineAlign: defaultTextStyle.align, + labelBreakWords: defaultTextStyle.breakWords, + labelDropShadow: defaultTextStyle.dropShadow, + labelDropShadowAlpha: defaultTextStyle.dropShadowAlpha, + labelDropShadowAngle: defaultTextStyle.dropShadowAngle, + labelDropShadowBlur: defaultTextStyle.dropShadowBlur, + labelDropShadowColor: defaultTextStyle.dropShadowColor, + labelDropShadowDistance: defaultTextStyle.dropShadowDistance, + fontColor: 0x000000, + fontFamily: defaultTextStyle.fontFamily, + fontSize: defaultTextStyle.fontSize, + fontStyle: defaultTextStyle.fontStyle, + fontWeight: defaultTextStyle.fontWeight, + labelStroke: defaultTextStyle.stroke, + labelStrokeThickness: defaultTextStyle.strokeThickness, + wordWrap: defaultTextStyle.wordWrap, + wordWrapWidth: defaultTextStyle.wordWrapWidth, + labelFill: defaultTextStyle.fill, + labelFillGradientType: defaultTextStyle.fillGradientType, + labelFillGradientStops: defaultTextStyle.fillGradientStops, + fontVariant: defaultTextStyle.fontVariant, + labelLeading: defaultTextStyle.leading, + letterSpacing: defaultTextStyle.letterSpacing, + labelLineHeight: defaultTextStyle.lineHeight, + labelLineJoin: defaultTextStyle.lineJoin, + labelMiterLimit: defaultTextStyle.miterLimit, + labelPadding: defaultTextStyle.padding, + labelTrim: defaultTextStyle.trim, + textBaseline: defaultTextStyle.textBaseline, + labelWhiteSpace: defaultTextStyle.whiteSpace + }; - /** - * The following Attributes are taken from the TextStyle class - * of PIXI. All can be overwritten in the overlay's JSON file. - */ - labelMultiLineAlign: defaultTextStyle.align, - labelBreakWords: defaultTextStyle.breakWords, - labelDropShadow: defaultTextStyle.dropShadow, - labelDropShadowAlpha: defaultTextStyle.dropShadowAlpha, - labelDropShadowAngle: defaultTextStyle.dropShadowAngle, - labelDropShadowBlur: defaultTextStyle.dropShadowBlur, - labelDropShadowColor: defaultTextStyle.dropShadowColor, - labelDropShadowDistance: defaultTextStyle.dropShadowDistance, - fontColor: 0x000000, - fontFamily: defaultTextStyle.fontFamily, - fontSize: defaultTextStyle.fontSize, - fontStyle: defaultTextStyle.fontStyle, - fontWeight: defaultTextStyle.fontWeight, - labelStroke: defaultTextStyle.stroke, - labelStrokeThickness: defaultTextStyle.strokeThickness, - wordWrap: defaultTextStyle.wordWrap, - wordWrapWidth: defaultTextStyle.wordWrapWidth, - labelFill: defaultTextStyle.fill, - labelFillGradientType: defaultTextStyle.fillGradientType, - labelFillGradientStops: defaultTextStyle.fillGradientStops, - fontVariant: defaultTextStyle.fontVariant, - labelLeading: defaultTextStyle.leading, - letterSpacing: defaultTextStyle.letterSpacing, - labelLineHeight: defaultTextStyle.lineHeight, - labelLineJoin: defaultTextStyle.lineJoin, - labelMiterLimit: defaultTextStyle.miterLimit, - labelPadding: defaultTextStyle.padding, - labelTrim: defaultTextStyle.trim, - textBaseline: defaultTextStyle.textBaseline, - labelWhiteSpace: defaultTextStyle.whiteSpace - }, - opts - ); + defaultOptions = this.addDisabled(defaultOptions); + + console.log('DISABLED VERTICALA.', defaultOptions.disabledLabelVerticalAlignment); + + options = this.addDisabled(options); + + options = Object.assign({}, defaultOptions, options); + + Object.assign(this, options); } + /** + * Some parameters shall not have a disabled option. + * These are defined here. + * + * @readonly + * @memberof Overlay + */ + get excludedDisableParameters() { + return ['items', 'rescale', 'name', 'type', 'enabled'] + } + + /** + * Copies the normal properties to the disabled version of the property, + * while conserving already set disabled properties. + * + * @param {*} options + * @returns + * @memberof Overlay + */ + addDisabled(options) { + for (let [key, value] of Object.entries(options)) { + if (this.excludedDisableParameters.indexOf(key) == -1) { + let disabledProperty = this.toDisabledPropertyString(key); + if (options[disabledProperty] == undefined) { + options[disabledProperty] = value; + } + } + } + return options + } + + /** + * Textures need to be loaded by the app. Texture parameters return all parameters that need to be evaluated for textures. + * @readonly + * @member {array} + * @memberof Overlay + */ get textureParameters() { - return ['icon'] + const textureParameters = ['icon']; + + textureParameters.forEach(textureParameter => { + textureParameters.push(this.toDisabledPropertyString(textureParameter)); + }); + + return textureParameters } + /** + * The required textures are saved inside the single items. + * Their texture string gets replaced by a texture object + * containing the path and the texture. + * + * @param {*} parameter + * @param {*} key + * @param {*} path + * @memberof Overlay + */ setTexture(parameter, key, path) { let obj = (this[parameter] = {}); obj._key = key; @@ -21590,6 +21706,14 @@ }); } + /** + * Recursively calls a function on child items. + * + * @param {*} parameter + * @param {*} func + * @param {*} [obj=null] + * @memberof Overlay + */ apply(parameter, func, obj = null) { if (obj == null) return if (Array.isArray(obj)) { @@ -21627,13 +21751,21 @@ adjustItems = null, cleanupItems = null } = {}) { - const name = this.name[0].toUpperCase() + this.name.slice(1).toLowerCase() + ' Overlay'; + console.log(this); + + const name = this.name + ? this.name[0].toUpperCase() + this.name.slice(1).toLowerCase() + ' Overlay' + : 'Unnamed Overlay'; + let geoLayer = new GeoLayer(new PIXI.Container(), { name }); geoLayer.visibility = this.zoomVisibility; if (this.rescale) geoLayer.rescale = this.rescale; this.items.forEach(item => { if (!excludeItems(item)) { + //Copies all values to a disabled state. + item = this.addDisabled(item); + if (adjustItems) { adjustItems(item); } @@ -21648,11 +21780,60 @@ }); return geoLayer } + + /** + * Used to pick a property or disabled property using an enabled parameter. + * + * @param {*} item + * @param {*} property + * @param {boolean} [enabled=true] + * @returns + * @memberof Overlay + */ + pickItemProperty(item, property, enabled = true) { + return enabled ? this.getItemProperty(item, property) : this.getDisabledItemProperty(item, property) + } + + toDisabledPropertyString(propertyName) { + const prefix = 'disabled'; + return prefix + propertyName[0].toUpperCase() + propertyName.slice(1) + } + + /** + * Get's the disabled version of the property as long as it is not excluded. + * + * @param {*} item + * @param {*} property + * @returns + * @memberof Overlay + */ + getDisabledItemProperty(item, property) { + if (this.excludedDisableParameters.indexOf(property) === -1) { + property = this.toDisabledPropertyString(property); + } + const propertyValue = this.getItemProperty(item, property); + return propertyValue + } + + /** + * Tries to get the infromation from an overlay item. + * If the item does not contain the property, the overlay definition will be used. + * When the overlay definition is not set, the default value is used. + * + * @param {OverlayItem} item - Item to get the informations from. + * @param {string} property - Name of the property. + * @returns {any} + * @memberof Overlay + */ getItemProperty(item, property) { let propertyValue = null; const propertyExistsOnItem = item[property] !== undefined; const propertyExistsOnOverlay = this[property] !== undefined; + if (property == 'disabledLabelVerticalAlignment') { + console.log(this); + console.log(this['disabledLabelVerticalAlignment'], propertyExistsOnItem, propertyExistsOnOverlay); + } if (propertyExistsOnItem) propertyValue = item[property]; else if (propertyExistsOnOverlay) propertyValue = this[property]; else { @@ -21669,6 +21850,15 @@ else return false } + /** + * An overlay can have a reference to another file. + * That single overlays are more easy to maintain. + * + * @param {*} item + * @param {*} property + * @returns + * @memberof Overlay + */ _resolveReference(item, property) { if (this._isReference(property)) { let referencedProperty = property['@property']; @@ -21721,18 +21911,30 @@ }); } + /** + * Creates a geographic for each item. + * By default it uses the regular routine but you may + * specify a factory for the defined type. + * + * @param {*} item + * @param {*} [informationCallback=null] + * @returns + * @memberof Overlay + */ createItem(item, informationCallback = null) { let geographics; + let type = this.getItemProperty(item, 'type'); + /** * Use a factory to draw the items, if a type is specified. */ - if (this.type != 'auto') { - let geographicsFactory = Overlay.requestFactory(this.type); + if (type != 'auto') { + let geographicsFactory = Overlay.requestFactory(type); if (!geographicsFactory) console.error( 'Invalid Overlay Mode: ' + - this.type + + type + '. Fallback to auto mode. Overlaymodes must be registeres beforehand. Valid modes are: ' + Overlay.listFactories().join(',') + '.' @@ -21758,84 +21960,100 @@ this._drawRoutine(geographics, item, informationCallback); } - this._drawLabel(item, geographics); + let label = this._createLabel(item, geographics); + if (label != null && geographics != null) { + console.log(geographics); + + geographics.graphics.addChild(label); + } } return geographics } - _drawLabel(item, geographics) { - let label = this.getItemProperty(item, 'label'); - if (label) { - let textStyle = this._gatherFontStyle(item); - let text = new PIXI.Text(label, textStyle); + /** + * + * Draws a label that is shown next to the item on the map. + * + * @param {*} item + * @returns + * @memberof Overlay + */ + _createLabel(item) { + let enabled = this.getItemProperty(item, 'enabled'); + let labelText = this.pickItemProperty(item, 'label', enabled); + let label = null; - let labelScale = this.getItemProperty(item, 'labelScale'); - text.scale.set(labelScale, labelScale); + if (labelText) { + let textStyle = this._gatherFontStyle(item); + label = new PIXI.Text(labelText, textStyle); + + let labelScale = this.pickItemProperty(item, 'labelScale', enabled); + label.scale.set(labelScale, labelScale); let position = new PIXI.Point(); - let align = this.getItemProperty(item, 'labelAlignment'); + let align = this.pickItemProperty(item, 'labelAlignment', enabled); if (align == 'left'); - else if (align == 'center') position.set(text.position.x - text.width / 2, text.position.y); - else if (align == 'right') position.set(text.position.x - text.width, text.position.y); + else if (align == 'center') position.set(label.position.x - label.width / 2, label.position.y); + else if (align == 'right') position.set(label.position.x - label.width, label.position.y); else this._logPropertyNotImplemented('labelAlignment', align); - let verticalAlign = this.getItemProperty(item, 'labelVerticalAlignment'); + let verticalAlign = this.pickItemProperty(item, 'labelVerticalAlignment', enabled); if (verticalAlign == 'underneath') { - let size = this.getItemProperty(item, 'size'); - let scale = this.getItemProperty(item, 'scale'); + let size = this.pickItemProperty(item, 'size', enabled); + let scale = this.pickItemProperty(item, 'scale', enabled); - let labelSpacing = this.getItemProperty(item, 'labelSpacing'); + let labelSpacing = this.pickItemProperty(item, 'labelSpacing', enabled); position.y += size * scale + labelSpacing; } else if (verticalAlign == 'above') { - let size = this.getItemProperty(item, 'size'); - let scale = this.getItemProperty(item, 'scale'); + let size = this.pickItemProperty(item, 'size', enabled); + let scale = this.pickItemProperty(item, 'scale', enabled); - let labelSpacing = this.getItemProperty(item, 'labelSpacing'); + let labelSpacing = this.pickItemProperty(item, 'labelSpacing', enabled); - position.y -= size * scale + text.height + labelSpacing; + position.y -= size * scale + label.height + labelSpacing; } else this._logPropertyNotImplemented('labelVerticalAlignment', verticalAlign); - text.position.set(position.x, position.y); - - geographics.graphics.addChild(text); + label.position.set(position.x, position.y); } + + return label } _gatherFontStyle(item) { + const enabled = this.getItemProperty(item, 'enabled'); return { - align: this.getItemProperty(item, 'labelMultiLineAlign'), - breakWords: this.getItemProperty(item, 'labelBreakWords'), - dropShadow: this.getItemProperty(item, 'labelDropShadow'), - dropShadowAlpha: this.getItemProperty(item, 'labelDropShadowAlpha'), - dropShadowAngle: this.getItemProperty(item, 'labelDropShadowAngle'), - dropShadowBlur: this.getItemProperty(item, 'labelDropShadowBlur'), - dropShadowColor: this.getItemProperty(item, 'labelDropShadowColor'), - dropShadowDistance: this.getItemProperty(item, 'labelDropShadowDistance'), - fontFamily: this.getItemProperty(item, 'fontFamily'), - fontSize: this.getItemProperty(item, 'fontSize'), - fontStyle: this.getItemProperty(item, 'fontStyle'), - fontWeight: this.getItemProperty(item, 'fontWeight'), - stroke: this.getItemProperty(item, 'labelStroke'), - strokeThickness: this.getItemProperty(item, 'labelStrokeThickness'), - wordWrap: this.getItemProperty(item, 'wordWrap'), - wordWrapWidth: this.getItemProperty(item, 'wordWrapWidth'), - - fill: this.getItemProperty(item, 'labelFill'), - fillGradientType: this.getItemProperty(item, 'labelFillGradientType'), - fillGradientStops: this.getItemProperty(item, 'labelFillGradientStops'), - fontVariant: this.getItemProperty(item, 'fontVariant'), - leading: this.getItemProperty(item, 'labelLeading'), - letterSpacing: this.getItemProperty(item, 'letterSpacing'), - lineHeight: this.getItemProperty(item, 'labelLineHeight'), - lineJoin: this.getItemProperty(item, 'labelLineJoin'), - miterLimit: this.getItemProperty(item, 'labelMiterLimit'), - padding: this.getItemProperty(item, 'labelPadding'), - trim: this.getItemProperty(item, 'labelTrim'), - textBaseline: this.getItemProperty(item, 'textBaseline'), - whiteSpace: this.getItemProperty(item, 'labelWhiteSpace') + align: this.pickItemProperty(item, 'labelMultiLineAlign', enabled), + breakWords: this.pickItemProperty(item, 'labelBreakWords', enabled), + dropShadow: this.pickItemProperty(item, 'labelDropShadow', enabled), + dropShadowAlpha: this.pickItemProperty(item, 'labelDropShadowAlpha', enabled), + dropShadowAngle: this.pickItemProperty(item, 'labelDropShadowAngle', enabled), + dropShadowBlur: this.pickItemProperty(item, 'labelDropShadowBlur', enabled), + dropShadowColor: this.pickItemProperty(item, 'labelDropShadowColor', enabled), + dropShadowDistance: this.pickItemProperty(item, 'labelDropShadowDistance', enabled), + fontFamily: this.pickItemProperty(item, 'fontFamily', enabled), + fontSize: this.pickItemProperty(item, 'fontSize', enabled), + fontStyle: this.pickItemProperty(item, 'fontStyle', enabled), + fontWeight: this.pickItemProperty(item, 'fontWeight', enabled), + stroke: this.pickItemProperty(item, 'labelStroke', enabled), + strokeThickness: this.pickItemProperty(item, 'labelStrokeThickness', enabled), + wordWrap: this.pickItemProperty(item, 'wordWrap', enabled), + wordWrapWidth: this.pickItemProperty(item, 'wordWrapWidth', enabled), + fill: this.pickItemProperty(item, 'labelFill', enabled), + fillGradientType: this.pickItemProperty(item, 'labelFillGradientType', enabled), + fillGradientStops: this.pickItemProperty(item, 'labelFillGradientStops', enabled), + fontVariant: this.pickItemProperty(item, 'fontVariant', enabled), + leading: this.pickItemProperty(item, 'labelLeading', enabled), + letterSpacing: this.pickItemProperty(item, 'letterSpacing', enabled), + lineHeight: this.pickItemProperty(item, 'labelLineHeight', enabled), + lineJoin: this.pickItemProperty(item, 'labelLineJoin', enabled), + miterLimit: this.pickItemProperty(item, 'labelMiterLimit', enabled), + padding: this.pickItemProperty(item, 'labelPadding', enabled), + trim: this.pickItemProperty(item, 'labelTrim', enabled), + textBaseline: this.pickItemProperty(item, 'textBaseline', enabled), + whiteSpace: this.pickItemProperty(item, 'labelWhiteSpace', enabled) } } @@ -21880,25 +22098,27 @@ } _createIcon(geographics, item) { - let icon = this.getItemProperty(item, 'icon'); + let enabled = this.getItemProperty(item, 'enabled'); + let icon = this.pickItemProperty(item, 'icon', enabled); + if (icon) { if (icon.texture) { let sprite = new PIXI.Sprite(icon.texture); - const iconAnchor = this.getItemProperty(item, 'iconAnchor'); + const iconAnchor = this.pickItemProperty(item, 'iconAnchor', enabled); sprite.anchor.set(iconAnchor.x, iconAnchor.y); - const iconScale = this.getItemProperty(item, 'iconScale'); + const iconScale = this.pickItemProperty(item, 'iconScale', enabled); if (iconScale) sprite.scale.set(iconScale, iconScale); - const iconOffset = this.getItemProperty(item, 'iconOffset'); + const iconOffset = this.pickItemProperty(item, 'iconOffset', enabled); if (iconOffset && iconOffset.x != null && iconOffset.y != null) sprite.position.set(iconOffset.x, iconOffset.y); - const iconColor = this.getItemProperty(item, 'iconColor'); + const iconColor = this.pickItemProperty(item, 'iconColor', enabled); if (iconColor) sprite.tint = iconColor; - const iconAlpha = this.getItemProperty(item, 'iconAlpha'); + const iconAlpha = this.pickItemProperty(item, 'iconAlpha', enabled); if (iconAlpha) sprite.alpha = iconAlpha; geographics.graphics.addChild(sprite); @@ -21908,28 +22128,6 @@ _createInformation(geographics, item, callback = null) { if (item.information) { - /** - * SO: The overlay class is quite convenient. - * But managing the information creation solely inside this - * class restricts us massively. - * - * Maybe a restructuring would be good, that we can handle - * the creation of information with a callback and can adapt - * to any occuring situation. - * - * e.g. - * - * overlay.informationHandler((geo, type, item)=>{ - * switch(type){ - * case "popup": - * createPopup(item.information) - * break; - * - * .... - * } - * }) - */ - geographics.graphics.interactive = true; const informationType = this.getItemProperty(item, 'informationType'); @@ -21978,17 +22176,21 @@ _fill(geographics, item) { const enabled = this.getItemProperty(item, 'enabled'); - const color = enabled ? this.getItemProperty(item, 'color') : this.getItemProperty(item, 'disabledColor'); - let alpha = enabled ? this.getItemProperty(item, 'fillAlpha') : this.getItemProperty(item, 'disabledAlpha'); + const color = this.pickItemProperty(item, 'color', enabled); + const alpha = this.pickItemProperty(item, 'fillAlpha', enabled); geographics.graphics.beginFill(color, alpha); } _drawPoint(item, informationCallback = null) { const overlay = this; + + const enabled = this.getItemProperty(item, 'enabled'); + + let that = this; let geographic = new GeoPoint(item.location, { onDraw: function() { overlay._fill.call(overlay, this, item); - const size = overlay.getItemProperty(item, 'size') ? overlay.getItemProperty(item, 'size') : 0; + const size = that.pickItemProperty(item, 'size', enabled); this.graphics.drawCircle(0, 0, size); overlay._drawRoutine.call(overlay, this, item, informationCallback); } @@ -22003,10 +22205,19 @@ Overlay.Modes = { auto: null }; - Overlay.createFactory = function(name, geographicsFactory) { - if (Overlay.Modes.hasOwnProperty(name)) - console.warn(`The mode ${name} was already implemented and was overwritten!`); - Overlay.Modes[name] = geographicsFactory; + /** + * Creates a factory for a specific type. + * + * @param {string} type - Name of the factory. When overlay items match the type, the factory is applied. + * @param {function} geographicsFactory - A function that is called with every item. Can be used to draw the geographics individually. + * + * @static + * @memberof {Overlay} + */ + Overlay.createFactory = function(type, geographicsFactory) { + if (Overlay.Modes.hasOwnProperty(type)) + console.warn(`The mode ${type} was already implemented and was overwritten!`); + Overlay.Modes[type] = geographicsFactory; }; Overlay.requestFactory = function(name) { diff --git a/doc/out/AbstractPopup.html b/doc/out/AbstractPopup.html index 6771959..52c03d8 100644 --- a/doc/out/AbstractPopup.html +++ b/doc/out/AbstractPopup.html @@ -58,10 +58,6 @@