}\n * @private\n */\n this.eventListeners_ = {};\n\n enableTouchScroll(this.content_);\n\n if (options.content) {\n this.content = options.content;\n }\n }\n\n //noinspection JSAnnotator\n /**\n * @type {HTMLCollection} Inner content of popup.\n */\n set content(content) {\n this.setContent(content);\n }\n\n //noinspection JSUnusedGlobalSymbols\n /**\n * @type {Element} Inner content of popup.\n */\n get content() {\n return this.getContent();\n }\n\n /**\n * @param {Element | HTMLCollection | string} content Update popup inner content.\n */\n setContent(content) {\n util.emptyElement(this.content_);\n\n if (util.isElement(content)) {\n this.content_.appendChild(content);\n } else if (util.isString(content)) {\n this.content_.insertAdjacentHTML('afterBegin', content);\n } else if (util.isArrayLike(content)) {\n util.toArray(content).forEach(elem => this.content_.appendChild(elem));\n }\n }\n\n /**\n * @returns {Element} Inner content of popup.\n */\n getContent() {\n return this.content_;\n }\n\n //noinspection JSUnusedGlobalSymbols\n /**\n * @param {ol.Map} map OpenLayers map object.\n */\n setMap(map) {\n super.setMap(map);\n\n if (map) {\n this.bindEvents_();\n this.bringToFront();\n } else {\n this.unbindEvents_();\n }\n }\n\n /**\n * Show on top of other popups.\n */\n bringToFront() {\n const container = this.getElement().parentNode;\n const overlaysContainer = container.parentNode;\n const lastOverlay = util.toArray(overlaysContainer.querySelectorAll(\".ol-overlay-container\")).pop();\n\n if (lastOverlay && lastOverlay !== container) {\n overlaysContainer.insertBefore(container, lastOverlay.nextSibling);\n }\n }\n\n /**\n * Shows popup.\n *\n * @param {ol.Coordinate} [coordinate] New popup position.\n * @param {Element | HTMLCollection | string} [content] Replace inner content.\n * @return {Promise} Returns Promise that resolves when showing completes.\n * @fires Popup#show Show event.\n */\n show(coordinate, content) {\n if (content) {\n this.content = content;\n }\n\n const elem = this.getElement();\n elem.style.display = \"block\";\n elem.style.visibility = \"hidden\";\n\n if (coordinate) {\n this.setPosition(coordinate);\n }\n\n return Promise.resolve(this.beforeShow_(this))\n .then(() => {\n elem.style.visibility = \"visible\";\n /**\n * Show event.\n *\n * @event Popup#show\n */\n this.dispatchEvent(PopupEventType.SHOW);\n this.set(\"visible\", true);\n });\n }\n\n /**\n * Hides popup.\n *\n * @return {Promise} Returns Promise that resolves when hiding completes.\n * @fires Popup#hide Hide event.\n */\n hide() {\n this.closer_.blur();\n\n return Promise.resolve(this.beforeHide_(this))\n .then(() => {\n this.getElement().style.display = \"none\";\n /**\n * Hide event.\n *\n * @event Popup#hide\n */\n this.dispatchEvent(PopupEventType.HIDE);\n this.set(\"visible\", false);\n });\n }\n\n /**\n * @private\n */\n bindEvents_() {\n this.listenEvent_('closerclick', this.closer_, 'click', evt => {\n evt.preventDefault();\n this.hide();\n });\n\n const elemListener = ::this.bringToFront;\n [\"click\", \"focus\"].forEach(eventName => this.listenEvent_('elem' + eventName, this.getElement(), eventName, elemListener));\n }\n\n /**\n * @private\n */\n unbindEvents_() {\n Object.keys(this.eventListeners_).forEach(::this.unlistenEvent_);\n }\n\n /**\n * @param {string} name Unique name\n * @param {Element} target\n * @param {string} event\n * @param {function} listener\n * @private\n */\n listenEvent_(name, target, event, listener) {\n if (this.eventListeners_[name]) {\n this.unlistenEvent_(name);\n }\n\n target.addEventListener(event, listener);\n\n this.eventListeners_[name] = {\n target,\n event,\n listener\n };\n }\n\n /**\n * @param {string} name Unique name\n * @private\n */\n unlistenEvent_(name) {\n if (this.eventListeners_[name]) {\n const { target, event, listener } = this.eventListeners_[name];\n\n target.removeEventListener(event, listener);\n }\n }\n}\n\n/**\n * @return {Element}\n * @private\n */\nfunction createDOMElement() {\n const element = util.createElement('div', 'ol-popup');\n const closer = util.createElement('a', 'ol-popup-closer', {\n href: '#'\n });\n\n element.appendChild(closer);\n\n // append content container\n const content = util.createElement('div', 'ol-popup-content');\n element.appendChild(content);\n\n return element;\n}\n\n/**\n * Determine if the current browser supports touch events. Adapted from\n * https://gist.github.com/chrismbarr/4107472\n * @private\n */\nfunction isTouchDevice() {\n try {\n document.createEvent(\"TouchEvent\");\n\n return true;\n } catch (e) {\n return false;\n }\n}\n\n/**\n * Apply workaround to enable scrolling of overflowing content within an\n * element. Adapted from https://gist.github.com/chrismbarr/4107472\n * @private\n */\nfunction enableTouchScroll(elm) {\n if (isTouchDevice()) {\n let scrollStartPos = 0;\n\n elm.addEventListener(\"touchstart\", function (event) {\n scrollStartPos = this.scrollTop + event.touches[0].pageY;\n }, false);\n\n elm.addEventListener(\"touchmove\", function (event) {\n this.scrollTop = scrollStartPos - event.touches[0].pageY;\n }, false);\n }\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/Popup.js","/**\n * Easing functions pack\n */\n//noinspection JSUnusedGlobalSymbols\n/**\n * @param t\n * @return {number}\n */\nexport function easeInQuad(t) {\n return t * t;\n}\n\n//noinspection JSUnusedGlobalSymbols\n/**\n * @param t\n * @return {number}\n */\nexport function easeOutQuad(t) {\n return t * (2 - t);\n}\n\n//noinspection JSUnusedGlobalSymbols\n/**\n * @param t\n * @return {number}\n */\nexport function easeInOutQuad(t) {\n return t < .5 ?\n 2 * t * t :\n -1 + (4 - 2 * t) * t;\n}\n\n//noinspection JSUnusedGlobalSymbols\n/**\n * @param t\n * @return {number}\n */\nexport function easeInCubic(t) {\n return t * t * t;\n}\n\n//noinspection JSUnusedGlobalSymbols\n/**\n * @param t\n * @return {number}\n */\nexport function easeOutCubic(t) {\n return (--t) * t * t + 1;\n}\n\n/**\n * @param t\n * @return {number}\n */\nexport function easeInOutCubic(t) {\n return t < .5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./src/easing.js","/**\n * @param {*} arg1 Value to check.\n * @param {*} arg2 Value to check.\n * @param {...*} [args] Values to check.\n * @return {*} First argument that is not equal `undefined` or `null`\n */\nexport function coalesce(arg1, arg2, ...args) {\n return [].slice.call(arguments).find(value => value != null);\n}\n\n/**\n * @param {*} value\n * @return {Array}\n */\nexport function toArray(value) {\n return isArrayLike(value) ? [].slice.call(value) : [];\n}\n\n/**\n * @param {string} tagName\n * @param {string|string[]} [classes] CSS classes.\n * @param {Object} [attributes] Element attributes.\n * @returns {Element}\n */\nexport function createElement(tagName, classes, attributes) {\n const elem = document.createElement(tagName);\n\n if (classes) {\n elem.classList.add.apply(elem.classList, typeof classes === 'string' ? classes.split(' ') : classes);\n }\n\n if (attributes) {\n Object.keys(attributes).forEach(attribute => elem.setAttribute(attribute, attributes[attribute]));\n }\n\n return elem;\n}\n\n/**\n * Checks if `value` is likely a DOM element.\n *\n * @param {*} value\n * @return {boolean}\n * @link https://github.com/lodash/lodash/blob/4.13.1/lodash.js#L10755\n */\nexport function isElement(value) {\n return !!value && isObject(value) && value.nodeType === 1;\n}\n\n/**\n * @param {*} value\n * @return {boolean}\n * @link https://github.com/lodash/lodash/blob/4.13.1/lodash.js#L11055\n */\nexport function isObject(value) {\n return !!value && typeof value === 'object';\n}\n\n/**\n * Checks if `value` is likely a string.\n *\n * @param {*} value\n * @return {boolean}\n * @link https://github.com/lodash/lodash/blob/4.13.1/lodash.js#L11457\n */\nexport function isString(value) {\n return value != null && (\n typeof value === 'string' ||\n isObject(value) && Object.prototype.toString.call(value) === '[object String]'\n );\n}\n\n/**\n * Checks if `value` is Array like object.\n *\n * @param value\n * @returns {boolean}\n * @link https://github.com/lodash/lodash/blob/4.13.1/lodash.js#L10638\n */\nexport function isArrayLike(value) {\n return !!value && typeof value.length === 'number';\n}\n\n/**\n * @param {Element} elem\n */\nexport function emptyElement(elem) {\n while (elem.hasChildNodes()) {\n elem.removeChild(elem.lastChild);\n }\n}\n\n/**\n * Empty function\n *\n * @return void\n */\nexport function noop() { }\n\n\n\n// WEBPACK FOOTER //\n// ./src/util.js","module.exports = __WEBPACK_EXTERNAL_MODULE_5__;\n\n\n//////////////////\n// WEBPACK FOOTER\n// external {\"root\":\"ol\",\"amd\":\"openlayers\",\"commonjs\":\"openlayers\",\"commonjs2\":\"openlayers\"}\n// module id = 5\n// module chunks = 0"],"sourceRoot":""}
\ No newline at end of file
diff --git a/examples/scroll.html b/examples/scroll.html
index 21d92ed..df4c181 100644
--- a/examples/scroll.html
+++ b/examples/scroll.html
@@ -42,7 +42,7 @@
map.on('singleclick', function(evt) {
var content = 'If the popup content is quite long then by default it will scroll vertically.
';
- content += 'This behaviour together with the minimum width and maximum height can be changed by overriding the rules for the CSS class .ol-popup-content
defined in src/ol3-popup.css
.
';
+ content += 'This behaviour together with the minimum width and maximum height can be changed by overriding the rules for the CSS class .ol-popup-content
defined in src/ol-popup.css
.
';
content += '
';
content += 'This text is here to demonstrate the content scrolling due to there being too much content to display :-)
';
popup.show(evt.coordinate, content);
diff --git a/ol3-popup-umd.iml b/ol-popup-umd.iml
similarity index 62%
rename from ol3-popup-umd.iml
rename to ol-popup-umd.iml
index f1ff38a..cee11ed 100644
--- a/ol3-popup-umd.iml
+++ b/ol-popup-umd.iml
@@ -11,5 +11,16 @@
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/package.json b/package.json
index f4ecaf6..3b8ba2c 100644
--- a/package.json
+++ b/package.json
@@ -1,38 +1,39 @@
{
- "name": "ol3-popup-umd",
- "version": "1.3.0",
- "description": "Popup overlay for OpenLayers 3 with UMD wrapper",
+ "name": "ol-popup-umd",
+ "version": "1.3.1",
+ "description": "Popup overlay for OpenLayers with UMD wrapper",
"main": "dist/bundle.js",
"scripts": {
"release": "webpack --release --verbose",
"build": "webpack --build --verbose",
"serv": "webpack-dev-server",
+ "start": "npm run serv",
"docs": "node util/docgen.js",
"test": "mocha-phantomjs tests/test.html",
"all": "npm run build && npm run release && npm run test && npm run docs"
},
"repository": {
"type": "git",
- "url": "https://github.com/ghettovoice/ol3-popup-umd.git"
+ "url": "https://github.com/ghettovoice/ol-popup-umd.git"
},
- "homepage": "https://github.com/ghettovoice/ol3-popup-umd",
- "author": "Vladimir Vershinin (https://github.com/ghettovoice)",
+ "homepage": "https://github.com/ghettovoice/ol-popup-umd",
+ "author": "Vladimir Vershinin ",
"contributors": [
"Matt Walker (http://longwayaround.org.uk)",
"Avi Kelman "
],
"license": "MIT",
"bugs": {
- "url": "https://github.com/ghettovoice/ol3-popup-umd/issues"
+ "url": "https://github.com/ghettovoice/ol-popup-umd/issues"
},
"keywords": [
- "ol3",
+ "ol",
"openlayers",
- "ol3-popup-umd"
+ "ol-popup-umd"
],
"dependencies": {},
"peerDependencies": {
- "openlayers": ">= 3.14"
+ "openlayers": ">=3.14"
},
"devDependencies": {
"autoprefixer": "^6.5.1",
@@ -53,7 +54,7 @@
"mocha": "^3.1.2",
"mocha-phantomjs": "^4.1.0",
"node-sass": "^3.10.1",
- "openlayers": "^3.19.1",
+ "openlayers": "^4.0.1",
"postcss-import": "^8.1.2",
"postcss-loader": "^1.1.0",
"precss": "^1.4.0",
diff --git a/src/Popup.js b/src/Popup.js
index 274384c..511d256 100644
--- a/src/Popup.js
+++ b/src/Popup.js
@@ -50,7 +50,7 @@ const PopupEventType = {
};
/**
- * Popup Overlay for OpenLayer 3.
+ * Popup Overlay for OpenLayers.
*/
export default class Popup extends ol.Overlay {
/**
diff --git a/src/index.js b/src/index.js
index e9c0e63..2850216 100644
--- a/src/index.js
+++ b/src/index.js
@@ -6,8 +6,7 @@
* @author Matt Walker (http://longwayaround.org.uk)
* @author Avi Kelman
* @licence MIT https://opensource.org/licenses/MIT
- * Based on OpenLayers 3. Copyright 2005-2016 OpenLayers Contributors. All rights reserved. http://openlayers.org
- * @copyright (c) 2016 Matt Walker, Vladimir Vershinin
+ * @copyright (c) 2016-2017 Matt Walker, Vladimir Vershinin
*/
import Popup from './Popup';
import './popup.scss';
diff --git a/util/README.md b/util/README.md
index 13f98b6..03c6828 100644
--- a/util/README.md
+++ b/util/README.md
@@ -1,9 +1,12 @@
-[![Build Status](https://travis-ci.org/ghettovoice/ol3-popup-umd.svg?branch=master)](https://travis-ci.org/ghettovoice/ol3-popup-umd)
-[![view on npm](http://img.shields.io/npm/v/ol3-popup-umd.svg)](https://www.npmjs.org/package/ol3-popup-umd)
+[![Build Status](https://travis-ci.org/ghettovoice/ol-popup-umd.svg?branch=master)](https://travis-ci.org/ghettovoice/ol-popup-umd)
+[![view on npm](http://img.shields.io/npm/v/ol-popup-umd.svg)](https://www.npmjs.org/package/ol-popup-umd)
+[![License](https://img.shields.io/github/license/ghettovoice/ol-popup-umd.svg)](https://github.com/ghettovoice/ol-popup-umd/blob/master/LICENSE)
-# ol3-popup-umd
+# ol-popup-umd
-Basic popup for an OpenLayers 3 map. By default the map is centered so that the popup is entirely visible.
+> Popup overlay for OpenLayers with UMD wrapper
+
+Basic popup for an [OpenLayers](http://openlayers.org) lib. By default the map is centered so that the popup is entirely visible.
This project originally forked from [ol3-popup](https://github.com/walkermatt/ol3-popup) by Matt Walker
and extended with new features like event emitting, additional methods and others, also packed as UMD package.
@@ -12,13 +15,13 @@ and extended with new features like event emitting, additional methods and other
Install it thought NPM:
```shell
-npm install ol3-popup-umd
+npm install ol-popup-umd
```
Or download the latest version archive and add it with script tag:
```html
-
+
```
## Usage
@@ -26,8 +29,8 @@ Or download the latest version archive and add it with script tag:
Plugin is packed into UMD wrapper, import it with CommonJS or ES6:
```js
-import PopupOverlay from 'ol3-popup-umd';
-const PopupOverlay = require('ol3-popup-umd');
+import PopupOverlay from 'ol-popup-umd';
+const PopupOverlay = require('ol-popup-umd');
```
In Browser environment it is available as `ol.PopupOverlay`.
diff --git a/webpack.config.js b/webpack.config.js
index 3c30617..1a17d10 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -43,8 +43,7 @@ Fork of Matt Walker ol3-popup https://github.com/walkermatt/ol3-popup
${packageJson.contributors.map(author => '@author ' + author)}
@version ${packageJson.version}
@licence MIT https://opensource.org/licenses/MIT
- Based on OpenLayers 3. Copyright 2005-2016 OpenLayers Contributors. All rights reserved. http://openlayers.org
-@copyright (c) 2016 Matt Walker, ${packageJson.author}`;
+@copyright (c) 2016-${new Date().getFullYear()} Matt Walker, ${packageJson.author}`;
const plugins = [
new webpack.optimize.OccurenceOrderPlugin(),