fix debounced versions of refresh, recreate and remount, use se…

…lf functions on each instance

code style, remove messy comments

package.json

@@ -1,7 +1,7 @@
 {
   "name": "vuelayers",
   "fullname": "VueLayers",
-  "version": "0.11.0-rc.6",
+  "version": "0.11.0-rc.7",
   "description": "Web map Vue components with the power of OpenLayers",
   "author": "Vladimir Vershinin <ghettovoice@gmail.com>",
   "main": "./lib/index.js",

src/component/circle-geom/geom.vue

@@ -1,5 +1,4 @@
 <script>
-  /** @module circle-geom/geom */
   import Circle from 'ol/geom/Circle'
   import geometry from '../../mixin/geometry'
   import { GEOMETRY_TYPE } from '../../ol-ext/consts'

src/component/cluster-source/source.vue

@@ -1,8 +1,5 @@
 <script>
   import sourceContainer from '../../mixin/source-container'
-  /**
-   * @module cluster-source/source
-   */
   import vectorSource from '../../mixin/vector-source'
   import { createPointGeom, findPointOnSurface } from '../../ol-ext/geom'
   import mergeDescriptors from '../../util/multi-merge-descriptors'

src/component/feature/feature.vue

@@ -5,9 +5,6 @@
 </template>
 
 <script>
-  /**
-   * @module feature/feature
-   */
   import Feature from 'ol/Feature'
   import { Observable } from 'rxjs'
   import { merge as mergeObs } from 'rxjs/observable'

src/component/geoloc/geoloc.vue

@@ -7,7 +7,6 @@
 </template>
 
 <script>
-  /** @module geoloc/geoloc */
   import Geolocation from 'ol/Geolocation'
   import { merge } from 'rxjs/observable'
   import { olCmp, useMapCmp, projTransforms } from '../../mixin'

src/component/image-layer/layer.vue

@@ -1,5 +1,4 @@
 <script>
-  /** @module image-layer/layer */
   import ImageLayer from 'ol/layer/Image'
   import layer from '../../mixin/layer'
 

src/component/line-string-geom/geom.vue

@@ -1,7 +1,4 @@
 <script>
-  /**
-   * @module line-string-geom/geom
-   */
   import LineString from 'ol/geom/LineString'
   import geometry from '../../mixin/geometry'
   import { GEOMETRY_TYPE } from '../../ol-ext/consts'

src/component/map/map.vue

@@ -310,6 +310,11 @@
      */
     unmount () {
       hasMap(this)
+
+      this.clearLayers()
+      this.clearInteractions()
+      this.clearOverlays()
+
       this.unsubscribeAll()
       this.$map.setTarget(undefined)
     },

src/component/mapbox-source/source.vue

@@ -1,7 +1,4 @@
 <script>
-  /**
-   * @module mapbox-source/source
-   */
   import xyzSource from '../../mixin/xyz-source'
   import { EPSG_3857, TILE_FORMAT } from '../../ol-ext/consts'
   import { coalesce } from '../../util/minilo'

src/component/modify-interaction/interaction.vue

@@ -149,7 +149,7 @@
     setStyle (styles) {
       if (styles !== this._styles) {
         this._styles = styles
-        this.refresh()
+        this.scheduleRefresh()
       }
     },
     /**

src/component/multi-line-string-geom/geom.vue

@@ -1,7 +1,4 @@
 <script>
-  /**
-   * @module multi-line-string-geom/geom
-   */
   import MultiLineString from 'ol/geom/MultiLineString'
   import geometry from '../../mixin/geometry'
   import { GEOMETRY_TYPE } from '../../ol-ext/consts'

src/component/multi-point-geom/geom.vue

@@ -1,7 +1,4 @@
 <script>
-  /**
-   * @module multi-point-geom/geom
-   */
   import MultiPoint from 'ol/geom/MultiPoint'
   import geometry from '../../mixin/geometry'
   import { GEOMETRY_TYPE } from '../../ol-ext/consts'

src/component/multi-polygon-geom/geom.vue

@@ -1,7 +1,4 @@
 <script>
-  /**
-   * @module multi-polygon-geom/geom
-   */
   import MultiPolygon from 'ol/geom/MultiPolygon'
   import geometry from '../../mixin/geometry'
   import { GEOMETRY_TYPE } from '../../ol-ext/consts'

src/component/osm-source/source.vue

@@ -1,7 +1,4 @@
 <script>
-  /**
-   * @module osm-source/source
-   */
   import OSMSource from 'ol/source/OSM'
   import xyzSource from '../../mixin/xyz-source'
 

src/component/point-geom/geom.vue

@@ -1,7 +1,4 @@
 <script>
-  /**
-   * @module point-geom/geom
-   */
   import Point from 'ol/geom/Point'
   import geometry from '../../mixin/geometry'
   import { GEOMETRY_TYPE } from '../../ol-ext/consts'

src/component/polygon-geom/geom.vue

@@ -1,7 +1,4 @@
 <script>
-  /**
-   * @module polygon-geom/geom
-   */
   import Polygon from 'ol/geom/Polygon'
   import geometry from '../../mixin/geometry'
   import { GEOMETRY_TYPE } from '../../ol-ext/consts'

src/component/sputnik-source/source.vue

@@ -1,9 +1,9 @@
 <script>
+  import xyzSource from '../../mixin/xyz-source'
+
   /**
    * Layer source to work with Sputnik.ru tile server.
-   * @module sputnik-source/source
    */
-  import xyzSource from '../../mixin/xyz-source'
 
   const SPUTNIK_URL_TEMPLATE = 'http://tiles.maps.sputnik.ru/{z}/{x}/{y}.png?apikey={apikey}'
   const SPUTNIK_ATTRIBUTIONS = '<a href="http://maps.sputnik.ru/" target="_blank">Спутник</a> ' +

src/component/style-func/style.vue

@@ -1,19 +1,17 @@
 <script>
-  /**
-   * Style function component for advanced styling.
-   * Plays the role of both a style that mounts itself to style target component (vl-layer-vector, vl-feature & etc.)
-   * and style target for inner style containers (vl-style-box) as fallback style.
-   * @module style-func/style
-   */
-  import { first as firstObs } from 'rxjs/operators'
-  import { observableFromOlEvent } from '../../rx-ext'
   import style from '../../mixin/style'
   import stylesContainer from '../../mixin/styles-container'
   import { hasMap } from '../../util/assert'
   import { warn } from '../../util/log'
   import { isFunction, noop } from '../../util/minilo'
   import mergeDescriptors from '../../util/multi-merge-descriptors'
 
+  /**
+   * Style function component for advanced styling.
+   * Plays the role of both a style that mounts itself to style target component (vl-layer-vector, vl-feature & etc.)
+   * and style target for inner style containers (vl-style-box) as fallback style.
+   */
+
   const props = {
     /**
      * @type {function(): function(feature: Feature): Style}
@@ -104,20 +102,8 @@
      * @return {Promise}
      */
     refresh () {
-      if (this.$olObject == null) return Promise.resolve()
       // recreate style
       return this.recreate()
-        .then(() => {
-          if (!this.$map) {
-            return
-          }
-
-          this.$map.render()
-
-          return observableFromOlEvent(this.$map, 'postcompose')
-            .pipe(firstObs())
-            .toPromise()
-        })
     },
   }
 

src/component/tile-layer/layer.vue

@@ -1,7 +1,4 @@
 <script>
-  /**
-   * @module tile-layer/layer
-   */
   import TileLayer from 'ol/layer/Tile'
   import layer from '../../mixin/layer'
 

src/component/vector-layer/layer.vue

@@ -1,5 +1,4 @@
 <script>
-  /** @module vector-layer/layer */
   import VectorLayer from 'ol/layer/Vector'
   import vectorLayer from '../../mixin/vector-layer'
 

src/component/vector-source/source.vue

@@ -1,12 +1,12 @@
 <script>
-  import { fetch } from 'whatwg-fetch'
   import VectorSource from 'ol/source/Vector'
+  import { fetch } from 'whatwg-fetch'
   import vectorSource from '../../mixin/vector-source'
   import { getFeatureId } from '../../ol-ext/feature'
   import { createGeoJsonFmt } from '../../ol-ext/format'
   import { loadingAll } from '../../ol-ext/load-strategy'
   import { transform } from '../../ol-ext/proj'
-  import { constant, difference, isFinite, isFunction, stubArray, isEmpty } from '../../util/minilo'
+  import { constant, difference, isEmpty, isFinite, isFunction, stubArray } from '../../util/minilo'
 
   const props = {
     /**
@@ -195,10 +195,16 @@
         credentials: 'same-origin',
         mode: 'cors',
       }).then(response => response.text())
-        .then(text => vm.$source.getFormat().readFeatures(text, {
-          featureProjection: vm.viewProjection,
-          dataProjection: vm.resolvedDataProjection,
-        }))
+        .then(text => {
+          if (!vm.$source) {
+            return []
+          }
+
+          return vm.$source.getFormat().readFeatures(text, {
+            featureProjection: vm.viewProjection,
+            dataProjection: vm.resolvedDataProjection,
+          })
+        })
     }
   }
 

src/component/wmts-source/source.vue

@@ -1,7 +1,4 @@
 <script>
-  /**
-   * @module wmts-source/source
-   */
   import WMTSSource from 'ol/source/WMTS'
   import WMTSTileGrid from 'ol/tilegrid/WMTS'
   import tileSource from '../../mixin/tile-source'

src/component/xyz-source/source.vue

@@ -1,7 +1,4 @@
 <script>
-  /**
-   * @module xyz-source/source
-   */
   import xyzSource from '../../mixin/xyz-source'
 
   const props = {}

src/mixin/features-container.js

@@ -105,7 +105,4 @@ const methods = {
 export default {
   mixins: [projTransforms],
   methods,
-  destroyed () {
-    this.clearFeatures()
-  },
 }

src/mixin/ident-map.js

@@ -1,7 +1,7 @@
-/** @module mixin/ident-map */
 import Vue from 'vue'
 import IdentityMap from '../util/identity-map'
 import { identity } from '../util/minilo'
+
 // todo uncomment when IE 11 will die
 // const IDENTITY_MAP_PROP = Symbol('identityMap')
 const IDENTITY_MAP_PROP = 'identityMap'

src/mixin/image-source.js

@@ -1,5 +1,4 @@
 import { EPSG_3857 } from '../ol-ext/consts'
-/** @module mixin/image-source */
 import source from './source'
 
 /**

src/mixin/image-style.js

@@ -1,6 +1,4 @@
 import style from './style'
-import { first as firstObs } from 'rxjs/operators'
-import { observableFromOlEvent } from '../rx-ext'
 
 const props = {
 }
@@ -45,20 +43,8 @@ const methods = {
    * @return {Promise}
    */
   refresh () {
-    if (this.$olObject == null) return Promise.resolve()
     // recreate style
     return this.recreate()
-      .then(() => {
-        if (!this.$map) {
-          return
-        }
-
-        this.$map.render()
-
-        return observableFromOlEvent(this.$map, 'postcompose')
-          .pipe(firstObs())
-          .toPromise()
-      })
   },
 }
 

src/mixin/index.js

@@ -1,6 +1,3 @@
-/**
- * @module mixin
- */
 export arcgisSource from './arcgis-source'
 export featuresContainer from './features-container'
 export geometry from './geometry'

src/mixin/interactions-container.js

@@ -85,7 +85,4 @@ const methods = {
 
 export default {
   methods,
-  destroyed () {
-    this.clearInteractions()
-  },
 }

src/mixin/layer.js

@@ -1,6 +1,3 @@
-/**
- * @module mixin/layer
- */
 import uuid from 'uuid/v4'
 import Vue from 'vue'
 import { hasLayer, hasMap } from '../util/assert'
@@ -10,10 +7,7 @@ import cmp from './ol-virt-cmp'
 import sourceContainer from './source-container'
 import useMapCmp from './use-map-cmp'
 
-/**
- * @vueProps
- */
-const props = /** @lends module:mixin/layer# */{
+const props = {
   id: {
     type: [String, Number],
     default: () => uuid(),

src/mixin/layers-container.js

@@ -69,7 +69,4 @@ const methods = {
 
 export default {
   methods,
-  destroyed () {
-    this.clearLayers()
-  },
 }