2023-11-18 12:29:03 +00:00
|
|
|
L.TileLayer.CRSSLayer = L.TileLayer.extend({
|
|
|
|
getTileUrl: function(coordinate) {
|
|
|
|
const tileX = coordinate.x;
|
|
|
|
const tileY = coordinate.y;
|
|
|
|
|
2023-11-18 13:55:20 +00:00
|
|
|
const tileZ = coordinate.z;
|
|
|
|
|
2024-03-03 10:46:11 +00:00
|
|
|
const url = ('https://cdn-new.theclashfruit.me/crss/tiles/zoom.{z}/{xd}/{yd}/tile.{x}.{y}.png')
|
2023-11-18 12:29:03 +00:00
|
|
|
.replace('{yd}', Math.floor(tileY / 10))
|
|
|
|
.replace('{xd}', Math.floor(tileX / 10))
|
|
|
|
.replace('{y}', tileY)
|
2023-11-18 13:55:20 +00:00
|
|
|
.replace('{x}', tileX)
|
|
|
|
.replace('{z}', tileZ);
|
2023-11-18 12:29:03 +00:00
|
|
|
|
|
|
|
return url;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
L.tileLayer.crssLayer = function(templateUrl, options) {
|
|
|
|
return new L.TileLayer.CRSSLayer(templateUrl, options);
|
|
|
|
}
|
|
|
|
|
2024-03-03 10:46:11 +00:00
|
|
|
let mapLayer = L.tileLayer.crssLayer('https://cdn-new.theclashfruit.me/crss/tiles/zoom.{z}/{xd}/{yd}/tile.{x}.{y}.png', {
|
2023-11-28 17:38:23 +00:00
|
|
|
attribution: '© <a href="https://crss.blurryface.xyz/">CRSS</a> Players | Tiles With <a href="https://unmined.net/">uNmINeD</a>.',
|
2023-11-18 12:29:03 +00:00
|
|
|
|
|
|
|
tileSize: 256,
|
|
|
|
|
|
|
|
noWrap: true,
|
|
|
|
|
|
|
|
maxNativeZoom: 0,
|
2023-11-18 13:55:20 +00:00
|
|
|
minNativeZoom: -4,
|
2023-11-18 12:29:03 +00:00
|
|
|
|
2023-11-18 13:55:20 +00:00
|
|
|
minZoom: -4,
|
|
|
|
maxZoom: -4 + 8,
|
2023-11-18 12:29:03 +00:00
|
|
|
|
2023-11-18 13:55:20 +00:00
|
|
|
zoomOffset: -8
|
2023-11-18 12:29:03 +00:00
|
|
|
});
|
|
|
|
|
2024-01-13 22:12:46 +00:00
|
|
|
let ropMarkers = L.layerGroup([]);
|
|
|
|
|
|
|
|
let drrMarkers = L.layerGroup([]);
|
|
|
|
|
|
|
|
let miscMarkers = L.layerGroup([]);
|
|
|
|
|
|
|
|
markers.forEach(marker => {
|
|
|
|
const coords = marker.data.split(';');
|
|
|
|
|
|
|
|
switch (marker.category) {
|
|
|
|
case 'rop':
|
|
|
|
ropMarkers
|
|
|
|
.addLayer(
|
|
|
|
L.marker([
|
|
|
|
parseInt(coords[0]), parseInt(coords[1])
|
|
|
|
]).bindPopup(marker.name)
|
|
|
|
);
|
|
|
|
break;
|
|
|
|
case 'drr':
|
|
|
|
drrMarkers.addLayer(
|
|
|
|
L.marker([
|
|
|
|
parseInt(coords[0]), parseInt(coords[1])
|
|
|
|
]).bindPopup(marker.name)
|
|
|
|
);
|
|
|
|
break;
|
|
|
|
default:
|
|
|
|
miscMarkers.addLayer(
|
|
|
|
L.marker([
|
|
|
|
parseInt(coords[0]), parseInt(coords[1])
|
|
|
|
]).bindPopup(marker.name)
|
|
|
|
);
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
});
|
2023-11-18 12:29:03 +00:00
|
|
|
|
|
|
|
let playerMarkers = L.layerGroup([
|
|
|
|
|
|
|
|
]);
|
|
|
|
|
|
|
|
console.log(L.CRS.Simple.infinite)
|
|
|
|
|
|
|
|
let map = L.map('map', {
|
2023-11-28 17:38:23 +00:00
|
|
|
layers: [
|
|
|
|
mapLayer,
|
|
|
|
|
|
|
|
miscMarkers,
|
|
|
|
|
|
|
|
ropMarkers,
|
|
|
|
drrMarkers,
|
|
|
|
|
|
|
|
playerMarkers
|
|
|
|
],
|
2023-11-18 12:29:03 +00:00
|
|
|
preferCanvas: true,
|
|
|
|
crs: L.Util.extend(L.CRS.Simple, {
|
|
|
|
transformation: new L.Transformation(1, 0, 1, 0),
|
|
|
|
projection: L.Projection.LonLat
|
|
|
|
}),
|
2023-11-28 17:38:23 +00:00
|
|
|
}).setView([
|
|
|
|
parseInt(center.split(';')[1]),
|
|
|
|
parseInt(center.split(';')[0])
|
|
|
|
], 2);
|
2023-11-18 12:29:03 +00:00
|
|
|
|
|
|
|
let baseMaps = {
|
|
|
|
"Overworld": mapLayer
|
|
|
|
};
|
|
|
|
|
|
|
|
let overlayMaps = {
|
|
|
|
"Players": playerMarkers,
|
|
|
|
"Miscellaneous Markers": miscMarkers,
|
|
|
|
"Markers in RoP": ropMarkers,
|
2023-11-28 17:38:23 +00:00
|
|
|
"Markers in DRR": drrMarkers,
|
2023-11-18 12:29:03 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
let layerControl = L.control.layers(baseMaps, overlayMaps).addTo(map);
|
|
|
|
|
|
|
|
L.control.mousePosition({
|
|
|
|
position: 'bottomright',
|
|
|
|
separator: '; ',
|
|
|
|
lngFormatter: (x) => {
|
|
|
|
return Math.floor(x)
|
|
|
|
},
|
|
|
|
latFormatter: (y) => {
|
|
|
|
return Math.floor(y)
|
|
|
|
},
|
|
|
|
wrapLng: false,
|
|
|
|
lngFirst: true
|
|
|
|
}).addTo(map);
|
|
|
|
|
|
|
|
const mappedPlayers = {}
|
|
|
|
|
|
|
|
const updatePlayerPos = (players) =>{
|
|
|
|
for (const player of players) {
|
|
|
|
const playerMarker = mappedPlayers[player.uniqueId];
|
|
|
|
|
|
|
|
if(playerMarker) {
|
|
|
|
playerMarker.setLatLng([player.location.z, player.location.x]);
|
|
|
|
playerMarker.setPopupContent(`${player.displayName} (${Math.floor(player.location.x)}; ${Math.floor(player.location.y)}; ${Math.floor(player.location.z)})`);
|
|
|
|
|
|
|
|
mappedPlayers[player.uniqueId] = playerMarker;
|
|
|
|
} else {
|
|
|
|
const playerIcon = L.icon({
|
2024-01-13 23:58:35 +00:00
|
|
|
iconUrl: `https://mc-heads.net/avatar/${player.displayName}/16`,
|
2023-11-18 12:29:03 +00:00
|
|
|
iconSize: [28, 28],
|
|
|
|
iconAnchor: [14, 14],
|
|
|
|
popupAnchor: [0, -14]
|
|
|
|
});
|
|
|
|
|
2024-01-13 23:58:35 +00:00
|
|
|
const marker = L.marker([player.location.z, player.location.x], { icon: playerIcon, alt: player.displayName })
|
2023-11-18 12:29:03 +00:00
|
|
|
.bindPopup(`${player.displayName} (${Math.floor(player.location.x)}; ${Math.floor(player.location.y)}; ${Math.floor(player.location.z)})`);
|
|
|
|
|
|
|
|
playerMarkers.addLayer(marker);
|
|
|
|
|
|
|
|
mappedPlayers[player.uniqueId] = marker;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
for (const [uniqueId, playerMarker] of Object.entries(mappedPlayers)) {
|
|
|
|
if(!players.find(p => p.uniqueId === uniqueId)) {
|
|
|
|
playerMarkers.removeLayer(playerMarker);
|
|
|
|
|
|
|
|
delete mappedPlayers[uniqueId];
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
fetch('https://crss.blurryface.xyz/api/v1/players')
|
|
|
|
.then(r => r.json())
|
|
|
|
.then(p => {
|
|
|
|
updatePlayerPos(p);
|
|
|
|
});
|
|
|
|
|
|
|
|
setInterval(() => {
|
|
|
|
fetch('https://crss.blurryface.xyz/api/v1/players')
|
|
|
|
.then(r => r.json())
|
|
|
|
.then(p => {
|
|
|
|
updatePlayerPos(p);
|
|
|
|
});
|
|
|
|
}, 1000);
|