leaflet.fullscreen - npm Package Compare versions

Comparing version 3.0.0 to 3.0.1

Control.FullScreen.js

@@ -1,19 +0,21 @@
-/*!_map
-* leaflet.fullscreen
-* (c) Bruno B.; MIT License
-* Uses fragments from the package 'screenfull'
-*/
+/*
+ * leaflet.fullscreen
+ * (c) Bruno B.; MIT License
+ * Uses fragments from the package 'screenfull'
+ */
 (function (root, factory) {
-  if (typeof define === 'function' && define.amd) {
+	if (typeof define === 'function' && define.amd) {
 		// define an AMD module that requires 'leaflet'
 		// and resolve to an object containing leaflet
 		define('leafletFullScreen', ['leaflet'], factory);
-  } else if (typeof module === 'object' && module.exports) {
+	} else if (typeof module === 'object' && module.exports) {
 		// define a CommonJS module that requires 'leaflet'
 		module.exports = factory(require('leaflet'));
-  } else {
+	} else {
 		// Assume 'leaflet' are loaded into global variable already
 		factory(root.L);
 	}
-}(typeof self !== 'undefined' ? self : this, function (leaflet) {
+}(typeof self !== 'undefined'
+	? self
+	: this, (leaflet) => {
 	'use strict';
@@ -69,4 +71,4 @@
 	const fullscreenAPI = {
-		request: function (element, options) {
-			return new Promise(function (resolve, reject) {
+		request(element, options) {
+			return new Promise((resolve, reject) => {
 				const onFullScreenEntered = function () {
@@ -83,6 +85,6 @@ this.off('change', onFullScreenEntered);
 				}
-			}.bind(this));
+			});
 		},
-		exit: function () {
-			return new Promise(function (resolve, reject) {
+		exit() {
+			return new Promise((resolve, reject) => {
 				if (!this.isFullscreen) {
@@ -103,6 +105,6 @@ resolve();
 				}
-			}.bind(this));
+			});
 		},
-		on: function (event, callback) {
-			var eventName = eventNameMap[event];
+		on(event, callback) {
+			const eventName = eventNameMap[event];
 			if (eventName) {
@@ -112,4 +114,4 @@ document.addEventListener(eventName, callback, false);
 		},
-		off: function (event, callback) {
-			var eventName = eventNameMap[event];
+		off(event, callback) {
+			const eventName = eventNameMap[event];
 			if (eventName) {
@@ -120,7 +122,7 @@ document.removeEventListener(eventName, callback, false);
 		nativeAPI: nativeAPI
-};
+	};
 
 	Object.defineProperties(fullscreenAPI, {
 		isFullscreen: {
-			get: function () {
+			get() {
 				return Boolean(document[nativeAPI.fullscreenElement]);
@@ -131,3 +133,3 @@ }
 			enumerable: true,
-			get: function () {
+			get() {
 				// Coerce to boolean in case of old WebKit
@@ -151,4 +153,6 @@ return Boolean(document[nativeAPI.fullscreenEnabled]);
 
-		onAdd: function (map) {
-			var className = 'leaflet-control-zoom-fullscreen', container, content = '';
+		onAdd(map) {
+			let className = 'leaflet-control-zoom-fullscreen';
+			let container;
+			let content = '';
 
@@ -175,3 +179,3 @@ if (map.zoomControl && !this.options.forceSeparateButton) {
 
-		onRemove: function () {
+		onRemove() {
 			leaflet.DomEvent
@@ -192,3 +196,3 @@ .off(this.link, 'click', leaflet.DomEvent.stop)
 
-		_createButton: function (title, className, content, container, fn, context) {
+		_createButton(title, className, content, container, fn, context) {
 			this.link = leaflet.DomUtil.create('a', className, container);
@@ -221,4 +225,4 @@ this.link.href = '#';
 
-		toggleFullScreen: function () {
-			var map = this._map;
+		toggleFullScreen() {
+			const map = this._map;
 			map._exitFired = false;
@@ -229,3 +233,5 @@ if (map._isFullscreen) {
 				} else {
-					leaflet.DomUtil.removeClass(this.options.fullscreenElement ? this.options.fullscreenElement : map._container, 'leaflet-pseudo-fullscreen');
+					leaflet.DomUtil.removeClass(this.options.fullscreenElement
+						? this.options.fullscreenElement
+						: map._container, 'leaflet-pseudo-fullscreen');
 					map.invalidateSize();
@@ -236,8 +242,11 @@ }
 				map._isFullscreen = false;
-			}
-			else {
+			} else {
 				if (this._screenfull.isEnabled && !this.options.forcePseudoFullscreen) {
-					this._screenfull.request(this.options.fullscreenElement ? this.options.fullscreenElement : map._container);
+					this._screenfull.request(this.options.fullscreenElement
+						? this.options.fullscreenElement
+						: map._container);
 				} else {
-					leaflet.DomUtil.addClass(this.options.fullscreenElement ? this.options.fullscreenElement : map._container, 'leaflet-pseudo-fullscreen');
+					leaflet.DomUtil.addClass(this.options.fullscreenElement
+						? this.options.fullscreenElement
+						: map._container, 'leaflet-pseudo-fullscreen');
 					map.invalidateSize();
@@ -250,11 +259,15 @@ }
 
-		_toggleState: function () {
-			this.link.title = this._map._isFullscreen ? this.options.title : this.options.titleCancel;
-			this._map._isFullscreen ? L.DomUtil.removeClass(this.link, 'leaflet-fullscreen-on') : L.DomUtil.addClass(this.link, 'leaflet-fullscreen-on');
+		_toggleState() {
+			this.link.title = this._map._isFullscreen
+				? this.options.title
+				: this.options.titleCancel;
+			this._map._isFullscreen
+				? L.DomUtil.removeClass(this.link, 'leaflet-fullscreen-on')
+				: L.DomUtil.addClass(this.link, 'leaflet-fullscreen-on');
 		},
 
-		_handleFullscreenChange: function () {
-			var map = this._map;
-			map.invalidateSize();
-			if (!this._screenfull.isFullscreen && !map._exitFired) {
+		_handleFullscreenChange(ev) {
+			const map = this._map;
+			if (ev.target === map.getContainer() && !this._screenfull.isFullscreen && !map._exitFired) {
+				map.invalidateSize();
 				map.fire('exitFullscreen');
@@ -268,3 +281,3 @@ map._exitFired = true;
 	leaflet.Map.include({
-		toggleFullscreen: function () {
+		toggleFullscreen() {
 			this.fullscreenControl.toggleFullScreen();
@@ -284,3 +297,3 @@ }
 
-	return {leaflet: leaflet};
+	return { leaflet };
 }));

package.json

 {
   "name": "leaflet.fullscreen",
-  "version": "3.0.0",
+  "version": "3.0.1",
   "description": "Simple plugin for Leaflet that adds fullscreen button to your maps.",
   "main": "Control.FullScreen.js",
   "scripts": {
-    "lint": "eslint --config .eslintrc Control.FullScreen.js",
+    "lint": "eslint . && stylelint **/*.css && prettier --check .",
+    "lint:fix": "eslint --fix . && stylelint --fix **/*.css && prettier --write .",
     "postversion": "git push && git push --tags && npm publish"
@@ -21,7 +22,13 @@ },
   "devDependencies": {
-    "eslint": "^8.1.0"
+    "@eslint/js": "^8.56.0",
+    "@stylistic/eslint-plugin": "^1.5.4",
+    "eslint": "^8.56.0",
+    "prettier": "^3.2.4",
+    "stylelint": "^16.2.0",
+    "stylelint-config-standard": "^36.0.0",
+    "stylelint-prettier": "^5.0.0"
   },
   "author": "b_b",
-  "license": "MIT License",
+  "license": "MIT",
   "readmeFilename": "README.md"
 }

README.md

@@ -1,6 +0,4 @@
-Leaflet.Control.FullScreen
-============
+# Leaflet.Control.FullScreen
 
-What's new ?
-------
+## What's new ?
 
@@ -16,23 +14,19 @@ **Version 3**
 
-What ?
-------
+## What ?
 
 Simple plugin for Leaflet that adds fullscreen button to your maps.
 
-Inspired by http://elidupuis.github.com/leaflet.zoomfs/
+Inspired by <http://elidupuis.github.com/leaflet.zoomfs/>
 
-Use the native javascript fullscreen API with help of https://github.com/sindresorhus/screenfull.js
-
 Icons from [Font Awesome v5.15.4](https://github.com/FortAwesome/Font-Awesome/releases/tag/5.15.4): [Creative Commons Attribution 4.0](https://fontawesome.com/license/free)
 
-Released under the MIT License http://opensource.org/licenses/mit-license.php
+Released under the MIT License <http://opensource.org/licenses/mit-license.php>
 
-How ?
-------
+## How ?
 
 Include Control.FullScreen.js and Control.FullScreen.css in your page:
 
-``` html
- <link rel="stylesheet" href="Control.FullScreen.css" />
- <script src="Control.FullScreen.js"></script>
+```html
+<link rel="stylesheet" href="Control.FullScreen.css" />
+<script src="Control.FullScreen.js"></script>
 ```
@@ -42,8 +36,8 @@
 
-``` js
-var map = new L.Map('map', {
-  fullscreenControl: true,
-  fullscreenControlOptions: {
-    position: 'topleft'
-  }
+```js
+let map = new L.Map('map', {
+	fullscreenControl: true,
+	fullscreenControlOptions: {
+		position: 'topleft'
+	}
 });
@@ -58,23 +52,25 @@ ```
 
-__Option, events and methods__:
+**Option, events and methods**:
 
-``` js
+```js
 // create a fullscreen button and add it to the map
-L.control.fullscreen({
-  position: 'topleft', // change the position of the button can be topleft, topright, bottomright or bottomleft, default topleft
-  title: 'Show me the fullscreen !', // change the title of the button, default Full Screen
-  titleCancel: 'Exit fullscreen mode', // change the title of the button when fullscreen is on, default Exit Full Screen
-  content: null, // change the content of the button, can be HTML, default null
-  forceSeparateButton: true, // force separate button to detach from zoom buttons, default false
-  forcePseudoFullscreen: true, // force use of pseudo full screen even if full screen API is available, default false
-  fullscreenElement: false // Dom element to render in full screen, false by default, fallback to map._container
-}).addTo(map);
+L.control
+	.fullscreen({
+		position: 'topleft', // change the position of the button can be topleft, topright, bottomright or bottomleft, default topleft
+		title: 'Show me the fullscreen !', // change the title of the button, default Full Screen
+		titleCancel: 'Exit fullscreen mode', // change the title of the button when fullscreen is on, default Exit Full Screen
+		content: null, // change the content of the button, can be HTML, default null
+		forceSeparateButton: true, // force separate button to detach from zoom buttons, default false
+		forcePseudoFullscreen: true, // force use of pseudo full screen even if full screen API is available, default false
+		fullscreenElement: false // Dom element to render in full screen, false by default, fallback to map._container
+	})
+	.addTo(map);
 
 // events are fired when entering or exiting fullscreen.
-map.on('enterFullscreen', function(){
-  console.log('entered fullscreen');
+map.on('enterFullscreen', function () {
+	console.log('entered fullscreen');
 });
 
-map.on('exitFullscreen', function(){
-  console.log('exited fullscreen');
+map.on('exitFullscreen', function () {
+	console.log('exited fullscreen');
 });
@@ -86,9 +82,8 @@
 
-Where ?
-------
+## Where ?
 
-Source code : https://github.com/brunob/leaflet.fullscreen
+Source code : <https://github.com/brunob/leaflet.fullscreen>
 
-Downloads : https://github.com/brunob/leaflet.fullscreen/releases
+Downloads : <https://github.com/brunob/leaflet.fullscreen/releases>
 
-Demo : https://brunob.github.io/leaflet.fullscreen/
+Demo : <https://brunob.github.io/leaflet.fullscreen/>

No alert changes

Improved metrics

Total package byte prevSize

17776

3.97%

Number of package files

12

50%

Lines of code

326

33.61%

Worsened metrics

Dev dependency count

7

600%

Number of lines in readme file

86

-5.49%

No dependency changes