User:MaxSem/map.js

function geoSearch( lat, lon ) {
	var api = new mw.Api();
	return api.get( {
		generator: 'geosearch',
		ggsradius: 10000,
		ggscoord: lat + '|' + lon,
		ggslimit: 50,
		prop: 'pageimages|extracts|coordinates',
		piprop: 'thumbnail',
		pithumbsize: 100,
		pilimit: 'max',
		exintro: 1,
		exchars: 200,
		explaintext: 1,
		exlimit: 'max',
		colimit: 'max',
		'continue': '',
	} )
		.then( function( data ) {
			var result = [];
			if ( data && data.query && data.query.pages ) {
				var pages = data.query.pages;
				$.each( pages, function( page ) {
					page = pages[page];
					if ( !page.coordinates ) {
						return;
					}
					var title = new mw.Title( page.title );
					var html = '<b>' + mw.html.element( 'a',
							{ href: title.getUrl() }, page.title
						)
						+ '</b>';
					if ( page.extract ) {
						html += '<br/>' + mw.html.escape( page.extract );
					}
					if ( page.thumbnail ) {
						html = $( '<img>' )
							.attr( 'src', page.thumbnail.source )
							.attr( 'style', 'float: left; margin: 5px;' )
							.attr( 'width', page.thumbnail.width )
							.attr( 'height', page.thumbnail.height )
							.get( 0 )
							.outerHTML
							+ html;
					}
					result.push( {
						lat: page.coordinates[0].lat,
						lon: page.coordinates[0].lon,
						html: html
					} );
				} );
			}
			return result;
		} );
}


function displayMap( lat, lon ) {
	mw.loader.using( 'jquery.ui' ).done( function() {
			var $map = $( '<div id="map" style="width:580; height: 580"></div>' );
			$map.dialog( { width: 600, height: 600 } );
			
			geoSearch( lat, lon ).done( function( points ) {
				$.each( points, function( poi ) {
					poi = points[poi];
					var marker = L.marker( [poi.lat, poi.lon] ).addTo( leaflet );
					marker.bindPopup( poi.html );
				} );
			} );
			
			var leaflet = L.map( 'map' ).setView( [ lat, lon ], 15 );
			L.control.scale( { imperial: false } ).addTo( leaflet );
			L.tileLayer( 'http://ns512621.ip-167-114-156.net/s1/{z}/{x}/{y}.png' ).addTo( leaflet );
		} );
}

$( "#coordinates a[href^='//tools.wmflabs.org/geohack/geohack.php']" ).click( function( e ) {
	e.preventDefault();
	var coords = mw.config.get( 'wgCoordinates' );
	if ( coords ) {
		displayMap( coords.lat, coords.lon );
	}
} );

mw.loader.load( 'https://karta.wmflabs.org/static/leaflet/leaflet.css', 'text/css' );
mw.loader.load( 'https://karta.wmflabs.org/static/leaflet/leaflet.js' );