Public-Repositories/contao-leaflet-libraries
1
0
Fork 0
forked from Snck3rs/contao-leaflet-libraries
Code Pull Requests Activity

Update Leaflet.Control.FullScreen to version 1.6.0

Browse Source
This commit is contained in:
David Molineus
2020-12-18 10:44:16 +01:00
parent 1baae82984
commit bddadbe22a
7 changed files with 54 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
assets/leaflet-fullscreen/Control.FullScreen.js vendored
View File

@@ -26,32 +26,53 @@ L.Control.FullScreen = L.Control.extend({
}
this._createButton(this.options.title, className, content, container, this.toggleFullScreen, this);
this._map.fullscreenControl = this;
this._map.on('enterFullscreen exitFullscreen', this._toggleTitle, this);
return container;
},
onRemove: function (map) {
L.DomEvent
.off(this.link, 'click', L.DomEvent.stopPropagation)
.off(this.link, 'click', L.DomEvent.preventDefault)
.off(this.link, 'click', this.toggleFullScreen, this);
L.DomEvent
.off(this._container, fullScreenApi.fullScreenEventName, L.DomEvent.stopPropagation)
.off(this._container, fullScreenApi.fullScreenEventName, L.DomEvent.preventDefault)
.off(this._container, fullScreenApi.fullScreenEventName, this._handleFullscreenChange, this);
L.DomEvent
.off(document, fullScreenApi.fullScreenEventName, L.DomEvent.stopPropagation)
.off(document, fullScreenApi.fullScreenEventName, L.DomEvent.preventDefault)
.off(document, fullScreenApi.fullScreenEventName, this._handleFullscreenChange, this);
},
_createButton: function (title, className, content, container, fn, context) {
this.link = L.DomUtil.create('a', className, container);
this.link.href = '#';
this.link.title = title;
this.link.innerHTML = content;
this.link.setAttribute('role', 'button');
this.link.setAttribute('aria-label', title);
L.DomEvent
.addListener(this.link, 'click', L.DomEvent.stopPropagation)
.addListener(this.link, 'click', L.DomEvent.preventDefault)
.addListener(this.link, 'click', fn, context);
.on(this.link, 'click', L.DomEvent.stopPropagation)
.on(this.link, 'click', L.DomEvent.preventDefault)
.on(this.link, 'click', fn, context);
L.DomEvent
.addListener(container, fullScreenApi.fullScreenEventName, L.DomEvent.stopPropagation)
.addListener(container, fullScreenApi.fullScreenEventName, L.DomEvent.preventDefault)
.addListener(container, fullScreenApi.fullScreenEventName, this._handleFullscreenChange, context);
.on(container, fullScreenApi.fullScreenEventName, L.DomEvent.stopPropagation)
.on(container, fullScreenApi.fullScreenEventName, L.DomEvent.preventDefault)
.on(container, fullScreenApi.fullScreenEventName, this._handleFullscreenChange, context);
L.DomEvent
.addListener(document, fullScreenApi.fullScreenEventName, L.DomEvent.stopPropagation)
.addListener(document, fullScreenApi.fullScreenEventName, L.DomEvent.preventDefault)
.addListener(document, fullScreenApi.fullScreenEventName, this._handleFullscreenChange, context);
.on(document, fullScreenApi.fullScreenEventName, L.DomEvent.stopPropagation)
.on(document, fullScreenApi.fullScreenEventName, L.DomEvent.preventDefault)
.on(document, fullScreenApi.fullScreenEventName, this._handleFullscreenChange, context);
return this.link;
},
@@ -95,10 +116,15 @@ L.Control.FullScreen = L.Control.extend({
}
});
L.Map.include({
toggleFullscreen: function () {
this.fullscreenControl.toggleFullScreen();
}
});
L.Map.addInitHook(function () {
if (this.options.fullscreenControl) {
this.fullscreenControl = L.control.fullscreen(this.options.fullscreenControlOptions);
this.addControl(this.fullscreenControl);
this.addControl(L.control.fullscreen(this.options.fullscreenControlOptions));
}
});

3
assets/leaflet-fullscreen/README.md
View File

@@ -61,6 +61,9 @@ map.on('enterFullscreen', function(){
map.on('exitFullscreen', function(){
console.log('exited fullscreen');
});
// you can also toggle fullscreen from map object
map.toggleFullScreen();
```
Where ?

33
assets/leaflet-fullscreen/bower.json
View File

@@ -1,33 +0,0 @@
{
"name": "leaflet.fullscreen",
"version": "1.4.5",
"homepage": "https://github.com/brunob/leaflet.fullscreen",
"license": "MIT",
"authors": [
"brunob <brunobergot@gmail.com>"
],
"description": "Leaflet.Control.FullScreen for Leaflet",
"main": [
"Control.FullScreen.js",
"Control.FullScreen.css",
"icon-fullscreen.png",
"icon-fullscreen-2x.png"
],
"devDependencies": {
"eslint": "2.3.0"
},
"keywords": [
"leaflet",
"plugins",
"maps",
"fullscreen"
],
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"test",
"tests",
"index.html"
]
}

19
assets/leaflet-fullscreen/index.html
View File

@@ -3,18 +3,19 @@
<head>
<meta charset='utf-8'>
<title>Leaflet.Control.FullScreen Demo</title>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.1/dist/leaflet.css" />
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.5.1/dist/leaflet.css" />
<style type="text/css">
#map { width: 700px; height: 433px; }
.fullscreen-icon { background-image: url(icon-fullscreen.png); }
.leaflet-retina .fullscreen-icon { background-image: url(icon-fullscreen-2x.png); background-size: 26px 26px; }
/* one selector per rule as explained here : http://www.sitepoint.com/html5-full-screen-api/ */
#map:-webkit-full-screen { width: 100% !important; height: 100% !important; z-index: 99999; }
#map:-ms-fullscreen { width: 100% !important; height: 100% !important; z-index: 99999; }
#map:full-screen { width: 100% !important; height: 100% !important; z-index: 99999; }
#map:fullscreen { width: 100% !important; height: 100% !important; z-index: 99999; }
.leaflet-container:-webkit-full-screen { width: 100% !important; height: 100% !important; z-index: 99999; }
.leaflet-container:-ms-fullscreen { width: 100% !important; height: 100% !important; z-index: 99999; }
.leaflet-container:full-screen { width: 100% !important; height: 100% !important; z-index: 99999; }
.leaflet-container:fullscreen { width: 100% !important; height: 100% !important; z-index: 99999; }
.leaflet-pseudo-fullscreen { position: fixed !important; width: 100% !important; height: 100% !important; top: 0px !important; left: 0px !important; z-index: 99999; }
</style>
<script src="https://unpkg.com/leaflet@1.3.1/dist/leaflet.js"></script>
<script src="https://unpkg.com/leaflet@1.5.1/dist/leaflet.js"></script>
<script src="Control.FullScreen.js"></script>
</head>
<body>
@@ -22,13 +23,13 @@
<div id="map"></div>
<script>
var base = new L.TileLayer('http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png', {
var base = L.tileLayer('https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png', {
maxZoom: 19,
subdomains: 'abcd',
attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> &copy; <a href="http://cartodb.com/attributions">CartoDB</a>'
attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors &copy; <a href="https://carto.com/attributions">CARTO</a>',
});
var map = new L.Map('map', {
var map = L.map('map', {
layers: [base],
center: new L.LatLng(48.5, -4.5),
zoom: 5,

4
assets/leaflet-fullscreen/package.json
View File

@@ -1,6 +1,6 @@
{
"name": "leaflet.fullscreen",
"version": "1.4.5",
"version": "1.6.0",
"description": "Simple plugin for Leaflet that adds fullscreen button to your maps.",
"main": "Control.FullScreen.js",
"scripts": {
@@ -17,7 +17,7 @@
"fullscreen"
],
"devDependencies": {
"eslint": "2.3.0"
"eslint": "^5.4.0"
},
"author": "b_b",
"license": "MIT License",