编辑“Widget:Map3/single”

<includeonly>
	<style>
		#map-wrap .map-setting-btn {
			zoom: 0.8;
			font-size: 8px;
			width: 32px;
			height: 32px;
		}
		#map-wrap #map-menu .mapShrink {
		    display: none;
		}
	</style>

	<style>
		.leaflet-container { background: rgb(23,75,86)!important; }
		.leaflet-control-attribution {display:none}
		.leaflet-left {
			transition: all 0.5s;
		}
		.leaflet-popup-content-wrapper {border-radius:0}

		.leaflet-bar a, .leaflet-bar a:hover {
			background: rgba(0, 0, 0, 0.8);
			color: #CED3DE;
			border: 0;
		}

		.leaflet-bar a:hover {
			background: rgba(33, 33, 33, 0.8);
		}

		.leaflet-pm-toolbar .control-icon {
			filter: invert() brightness(1.25);
		}

		#map-wrap {
			border: 1px solid rgba(0, 0, 0, 0.1)
		}
	</style>


	<script name="map.main.js">
		var map; // 地图对象
		var mapApi = new BwikiMapApi(); // 地图api
		var mapModel, self;
		var markTypeName = "<!--{$markTypeName}-->", markType;
		var bounds = [ [0,0],[0,0]];

		var mapData = {
			getIconUrl : function (icon) {
				return `https://prod-patch-wiki.biligame.com/res/ys/map/icons/${icon}?v=${mapData.default.srcVersion}`
			},
			getCenter: function () {
				// #接参数可以走缓存，而?会慢一些
				var center = (util.getUrlValue('hash', 'center').replace(/ /g, '') || '').split(',')
				return center.length === 2 ? center : [0, 0]
			},
			getCategoryData: function () {
				var categoryDataJson = $("#mapData #categoryData").text().trim();
				if (categoryDataJson !== "") {
					categoryDataJson = JSON.parse(categoryDataJson)

					var categoryDataJsonExtension = $("#mapData #categoryDataExtension").text().trim();
					if (categoryDataJsonExtension !== "") {
						categoryDataJsonExtension = JSON.parse(categoryDataJsonExtension)
						categoryDataJson = categoryDataJson.concat(categoryDataJsonExtension)
					}

					var categoryTemp = {}, categoryList = [], categoryData = []
					$.each(categoryDataJson, function (i, v) {
						if(v.markTypeName !== markTypeName) return true;
						markType = v.markType;
						v.defaultShow = 1;
						v.icon = v.icon.indexOf("http") === 0 ? v.icon : mapData.getIconUrl(v.icon);
						if (!categoryTemp[v.type]) {
							categoryList.push(v.type)
							categoryTemp[v.type] = {name: v.type, data: []}
						}
						categoryTemp[v.type].data.push(v)
					})
					$.each(categoryList, function (i, v) {
						categoryData[i] = categoryTemp[v]
					})
					return categoryData
				}
				return []
			},
			setCategoryData: function (data) {
				data.length > 0 ? mapModel.setMarkerLayer(data) : mapModel.getMarkerList();
			},
			setMarkersData: function () {
				var data = $("#mapData #markersData").text().trim();
				data = (new Function('return ' + (data || "[]")))();
				data[0].markType = markType;
				bounds = [ [data[0].point.lat, data[0].point.lng], [data[0].point.lat, data[0].point.lng]];
				$.each(data, function (i, p) {
					bounds[0][0] = Math.max(bounds[0][0], p.point.lat);
					bounds[0][1] = Math.min(bounds[0][1], p.point.lng);
					bounds[1][0] = Math.min(bounds[1][0], p.point.lat);
					bounds[1][1] = Math.max(bounds[1][1], p.point.lng) ;
				})
				mapModel.markersData({[markType]:data});
                window.afterSetMarkersData();
			},
			setMarkerWithInfo: function () {
				var data = $("#mapData #markerWithInfo").text().trim().replace(RegExp(`${mapModel.dataPrefix()}\\/point\\/`,"g"), "").split(", ");
				mapModel.markerWithInfo(data);
			},
			getTileUrl: function(coords) {
							coords = function (coords) {
								var y = -coords.y + -1, r = Math.ceil((1 << coords.z - 1)/2);
								return ( -r <= coords.x && coords.x < r  && -r <= y && y <= r - 1 && 
									{x: coords.x, y: -coords.y + -1, z: coords.z})
							}(coords);
							return coords ? `https://wiki-prod-patch-oss.oss-cn-hangzhou.aliyuncs.com/res/ys/map-4.4/tiles/${coords.z}/tile-${coords.x}_${coords.y}.png?v=${mapModel.srcVersion()}` :
								`https://prod-patch-wiki.biligame.com/res/ys/map/tiles/default.png?v=${mapModel.srcVersion()}`;
						},			
			setGeoData: function () {
				mapModel.areaData(JSON.parse($("#mapData #mapAreaData").text().trim()));
				// mapModel.routeData(JSON.parse($("#mapData #mapAreaData").text().trim()));
			},
			
		}

		var $ready = function () {
			$.fn.swipe = swipe;
			$("#map-wrap").swipe();
			mapApi.set({game: 'ys', site: mw.config.get("wgGameName"), dataPrefix: 'Data:Map'}) 
			ko.applyBindings(mapModel = new MapModel(mapData.default = {
				game: 'ys',
				site: mw.config.get("wgGameName"),
				mapid: 'map3',
				dataPrefix: 'Data:Map',
				mapCenter: [-51.085105, 38.289228],
				srcVersion: '3.0.13',  
				minZoom: 4,
				maxZoom: 7,
				isPhone: window.innerWidth < 540,
				toolbox: false,
				dataList: [],
				showMenu: false
			}));
			self = mapModel;

			var categoryData = mapData.getCategoryData();    
			window.afterSetMarkersData = function(){
				mapModel.map.init();
				mapData.setCategoryData(categoryData);
				mapData.setMarkerWithInfo();
				mapData.setGeoData();
				if(categoryData[0].name === "坐标"){
					// bounds[0][0] += 1
					// bounds[1][0] -= 0.5
					var $tab = $("#"+mapData.default.mapid).parents(".resp-tabs");
					if($tab.length>0) $tab.find(".bili-list-style").click(function(){map.invalidateSize(false)})
				} else {
					bounds[0][0] += 2.2
					bounds[1][0] -= 0.3
				}
				map.fitBounds(bounds);
	
				window.onresize=function(){  
					if(window.innerWidth < 540 && !mapModel.isPhone()) return mapModel.isPhone(true)
					if(window.innerWidth >= 540 && mapModel.isPhone()) return mapModel.isPhone(false)
				}
			}

			if($("#mapData #markersData").text().trim()) {
			    mapData.setMarkersData();
			} else {
			    $.ajax({
			    	"url": "/" + mapData.default.site + "/" + mapData.default.dataPrefix + "/type/" + markType + "/json?action=raw",
			    	"success": function(data) {
			    		console.log(data);
			    		data = (new Function('return ' + (data || "[]")))();
			    		data[0].markType = markType;
			    		bounds = [ [data[0].point.lat, data[0].point.lng], [data[0].point.lat, data[0].point.lng]];
			    		$.each(data, function (i, p) {
			    			bounds[0][0] = Math.max(bounds[0][0], p.point.lat);
			    			bounds[0][1] = Math.min(bounds[0][1], p.point.lng);
			    			bounds[1][0] = Math.min(bounds[1][0], p.point.lat);
			    			bounds[1][1] = Math.max(bounds[1][1], p.point.lng) ;
			    		})
			    		mapModel.markersData({[markType]:data});
			    		afterSetMarkersData();
			    	}
			    });
			}

		};
	</script>
	<script>(function () {var t = function () {window.jQuery && window.mw ? mw.loader.load('ext.gadget.Map3') : window.setTimeout(t, 100); }; t(); })();</script>
</includeonly>