☰

Nexus Clash Mini-Map (B4)

Adds a mini-map below the standard map view which can be clicked to toggle a full-sized plane map

目前為 2020-10-13 提交的版本，檢視 最新版本。

// ==UserScript==
// @name          Nexus Clash Mini-Map (B4)
// @namespace     https://roadha.us
// @author        haliphax
// @version       1.0.3
// @description   Adds a mini-map below the standard map view which can be clicked to toggle a full-sized plane map
// @include       https://www.nexusclash.com/modules.php?name=Game*
// ==/UserScript==

(function(){
	'use strict';

	const txt = document.querySelector('.tile_description b u').innerText,
		coords = /\(([0-9]+), ([0-9]+) ([^,]+), a/i.exec(txt);

	if (!coords) return;

	const x = parseInt(coords[1]),
		y = parseInt(coords[2]),
		offsetX = (x * 24 - 144) * -1,
		offsetY = (y * 24 - 144) * -1,
		row = document.createElement('tr'),
		styles = document.createElement('style');

	let mapName = coords[3].toLowerCase();

	if (mapName == 'laurentia') mapName = 'valhalla';

	row.innerHTML = `
		<td>
			<div id="ultramap" style="
				background-image: url(https://plscks.github.io/testHYPERMAP/${mapName}.png);
				background-position: ${offsetX}px ${offsetY}px;">
				<div id="position"></div>
			</div>
		</td>
		`;
	document.getElementById('mapheading').parentNode.parentNode.appendChild(row);
	styles.innerHTML = `
		#ultramap {
			background-repeat: no-repeat;
			height: 312px;
			margin: 0 auto;
			position: relative;
			width: 312px;
		}

		#ultramap.large {
			background-position: top left !important;
			height: 100vh;
			left: 0;
			position: absolute;
			top: 0;
			width: 100vw;
			z-index: 98;
		}

		#position {
			background: url(https://plscks.github.io/testHYPERMAP/icons/you.png);
			height: 72px;
			left: 120px;
			position: absolute;
			top: 120px;
			width: 72px;
			z-index: 99;
		}`;
	document.head.appendChild(styles);

	const map = document.getElementById('ultramap'),
		slot = row.querySelector('td:first-of-type'),
		pos = document.getElementById('position');

	map.addEventListener('click', (e) => {
		if (map.classList.toggle('large')) {
			document.body.appendChild(map);
			pos.style.setProperty('left', (24 * (x - 1)) + 'px');
			pos.style.setProperty('top', (24 * (y - 1)) + 'px');
		}
		else {
			slot.appendChild(map);
			pos.style.setProperty('left', '120px');
			pos.style.setProperty('top', '120px');
		}
	});
}());