MediaWiki:Gadget-KartoLayer.js

Une page de Wikipédia, l'encyclopédie libre.
Note : après avoir enregistré la page, vous devrez forcer le rechargement complet du cache de votre navigateur pour voir les changements.

Mozilla / Firefox / Konqueror / Safari : maintenez la touche Majuscule (Shift) en cliquant sur le bouton Actualiser (Reload) ou pressez Maj-Ctrl-R (Cmd-R sur Apple Mac) ;

Chrome / Internet Explorer / Opera : maintenez la touche Ctrl en cliquant sur le bouton Actualiser ou pressez Ctrl-F5.
/*
* KartoLayer
*
* Ajoute la possibilité au lecteur d'utiliser d'autres fonds de cartes que celui
* disponible de base, et enregistre ce choix via un cookie pour les affichages suivants.
*
* Ce script est en partie issu de https://en.wikivoyage.org/wiki/MediaWiki:Kartographer.js
*
* {{Projet:JavaScript/Script|KartoLayer}}
*/
//<nowiki>

mw.loader.using( [ 'ext.kartographer.frame', 'ext.kartographer.wv', 'mediawiki.cookie' ] ).done( function() {
	var wv,
	/* jscs:disable validateQuoteMarks, disallowQuotedKeysInObjects */
	maptiles = {
		"mapnik": {
			"tilesUrl": "//{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
			"options": {
				"wvIsExternal": true,
				"wvName": "Mapnik",
				"subdomains": [
					"a",
					"b",
					"c"
				],
				"attribs": [ {
					"url": "http://www.openstreetmap.org/copyright",
					"name": "OpenStreetMap",
					"label": "Map data"
				} ]
			}
		},
		"traffic-line-network": {
			"tilesUrl": "http://www.openptmap.org/tiles/{z}/{x}/{y}.png",
			"options": {
				"wvIsOverlay": true,
				"wvIsExternal": true,
				"wvName": "Lignes de transports",
				"attribs": [ {
					"url": "http://openptmap.org/",
					"name": "Openptmap.org",
					"label": "Lignes de transports"
				} ],
				"opacity": 0.5,
				"maxNativeZoom": 17
			}
		},
		"boundaries": {
			"tilesUrl": "http://korona.geog.uni-heidelberg.de/tiles/adminb/x={x}&y={y}&z={z}",
			"options": {
				"wvIsOverlay": true,
				"wvIsExternal": true,
				"wvName": "Frontières",
				"attribs": []
			}
		},
		"cycling": {
			"tilesUrl": "http://tile.waymarkedtrails.org/cycling/{z}/{x}/{y}.png",
			"options": {
				"wvIsOverlay": true,
				"wvIsExternal": true,
				"wvName": "Pistes cyclables",
				"attribs": [ {
					"url": "http://cycling.waymarkedtrails.org",
					"name": "Waymarked Trails",
					"label": "Pistes cyclables"
				} ]
			}
		},
		"hiking": {
			"tilesUrl": "http://tile.waymarkedtrails.org/hiking/{z}/{x}/{y}.png",
			"options": {
				"wvIsOverlay": true,
				"wvIsExternal": true,
				"wvName": "Randonnée",
				"attribs": [ {
					"url": "http://hiking.waymarkedtrails.org",
					"name": "Waymarked Trails",
					"label": "Chemins de randonnée"
				} ]
			}
		},
		"hill-shading": {
			"tilesUrl": "http://{s}.tiles.wmflabs.org/hillshading/{z}/{x}/{y}.png",
			"options": {
				"wvIsOverlay": true,
				"wvIsExternal": true,
				"wvName": "Relief",
				"attribs": [ {
					"url": "http://www2.jpl.nasa.gov/srtm/",
					"name": "NASA",
					"label": "Ombrage du relief"
				} ]
			}
		}
	};
	/* jscs:enable validateQuoteMarks, disallowQuotedKeysInObjects */

	wv = mw.loader.require( 'ext.kartographer.wv' );

	mw.loader.using('oojs-ui').then(function() {
		$.each( maptiles, function( i, tile ) {
			wv.wikivoyage.addTileLayer( i, tile.tilesUrl, tile.options );
		});
	});

	var layers;
	if ( mw.cookie.get( 'karto-layer' ) !== null ) {
		layers = JSON.parse( mw.cookie.get( 'karto-layer' ) );
	} else {
		layers = {
			base: '',
			overlays: [],
		};
	}

	/*
	 * Add layers to Kartographer's map
	 */
	mw.hook( 'wikipage.maps' ).add( function( maps ) {
		// `maps` can be an array
		maps = Array.isArray( maps ) ? maps : [ maps ];

		// customize each map
		function addLayerToMap( i, map ) {
			var wvmap = new wv.WVMap( map );
			try { wvmap.controlLayers()
				.basemap( 'mapnik' )
				.overlay( 'traffic-line-network' )
				.overlay( 'boundaries' )
				.overlay( 'hill-shading' )
				.overlay( 'cycling' )
				.overlay( 'hiking' )
				.datalayer( map.dataLayers )
				.update();
			} catch (e) {
				mw.log.error(e); // e.g. [[Albert_Schmidt_House_and_Studio]]
				return
			}

			$.each( wvmap.controlLayers().control._layers, function( key, layer ) {
				if ( layer.layer.options !== undefined ) {
					if ( layers.overlays.includes( layer.layer.options.wvLayerId ) ) {
						map.addLayer( wvmap.controlLayers().control._layers[ key ].layer );
					}
				}
			} );
			if ( layers.base !== '' ) {
				var inputs = wvmap.controlLayers().control._form.getElementsByTagName( 'input' );
				$.each( inputs, function( key, input ) {
					if ( wvmap.controlLayers().control._layers[ input.layerId ].layer.options.wvLayerId === layers.base ) {
						$( input ).trigger( 'click' );
						$( '.leaflet-control-layers-expanded' ).removeClass( 'leaflet-control-layers-expanded' );
						return false;
					}
				} );
			}

			map.on( 'baselayerchange overlayadd overlayremove', function( e ) {
				if ( e.layer.options.wvLayerId !== undefined ) {
					layers.base = e.layer.options.wvLayerId;
				} else {
					layers.base = '';
				}
				mw.cookie.set( 'karto-layer', JSON.stringify( layers ) );
			} );
			map.on( 'baselayerchange overlayadd overlayremove', function( e ) {
				if ( !layers.overlays.includes( e.layer.options.wvLayerId ) ) {
					layers.overlays.push( e.layer.options.wvLayerId );
				}
				mw.cookie.set( 'karto-layer', JSON.stringify( layers ) );
			} );
			map.on( 'boverlayremove', function( e ) {
				var index = layers.overlays.indexOf( e.layer.options.wvLayerId );
				if ( index > -1 ) {
					layers.overlays.splice( index, 1 );
				}
				mw.cookie.set( 'karto-layer', JSON.stringify( layers ) );
			} );
		}
		$.each( maps, addLayerToMap );
	} );

	/*
	 * Add layers to KartoEditor's map (if this gadget is enabled)
	 */
	mw.hook( 'kartoeditor.ready' ).add( function( ke ) {
		var map = ke.map;
		var baseMaps = {
			"Wikimedia": ke.baseLayer,
		};
		var overlayMaps = {};
		$.each( maptiles, function( key, maptile ) {
			if ( maptile.options.wvIsOverlay !== true ) {
				baseMaps[ maptile.options.wvName ] = L.tileLayer( maptile.tilesUrl, maptile.options );
			}
			else {
				overlayMaps[ maptile.options.wvName ] = L.tileLayer( maptile.tilesUrl, maptile.options );
			}
		} );

		L.control.layers(baseMaps, overlayMaps).addTo(map);
	} );
} );

//</nowiki>