radar portrait #167

This commit is contained in:
Matt Walsh
2026-04-22 22:23:10 -05:00
parent 0395e2cd08
commit 5bbc032c5e
6 changed files with 53 additions and 19 deletions

View File

@@ -4,8 +4,13 @@ const radarFinalSize = () => {
const size = {
width: 640, height: 367,
};
if (settings.wide?.value && settings.enhanced?.value) {
size.width = 854;
if (settings.enhanced?.value) {
if (settings.wide?.value) {
size.width = 854;
}
if (settings.portrait?.value) {
size.height = 1024;
}
}
return size;
};
@@ -15,8 +20,13 @@ const radarSourceSize = () => {
width: 240,
height: 163,
};
if (settings.wide?.value && settings.enhanced?.value) {
size.width = 240 / 640 * 854; // original size of 640 scaled up to wide at 854
if (settings.enhanced?.value) {
if (settings.wide?.value) {
size.width = 240 / 640 * 854; // original size of 640 scaled up to wide at 854
}
if (settings.portrait?.value) {
size.height = 163 / 367 * 1024;// original size of 367 scaled up to portrait at 1024
}
}
return size;
};
@@ -26,9 +36,15 @@ const radarOffset = () => {
x: 240,
y: 138,
};
if (settings.wide?.value && settings.enhanced?.value) {
// 107 is the margins shift, 640/854 is the scaling factor normal => wide, /2 is because of the fixed 2:1 scaling between source radar and map tiles
offset.x = 240 + (107 * 640 / 854 / 2); // original size of 640 scaled up to wide at 854;
if (settings.enhanced?.value) {
if (settings.wide?.value) {
// 107 is the margins shift, 640/854 is the scaling factor normal => wide, /2 is because of the fixed 2:1 scaling between source radar and map tiles
offset.x = 240 + (107 * 640 / 854 / 2); // original size of 640 scaled up to wide at 854;
}
if (settings.portrait?.value) {
// 825 is the margins shift, 367/1024 is the scaling factor normal => portrait, /2 is because of the fixed 2:1 scaling between source radar and map tiles
offset.y = 138 + (815 * 367 / 1024 / 2);
}
}
return offset;
@@ -40,8 +56,13 @@ const radarShift = () => {
x: 0,
y: 0,
};
if (settings.wide?.value && settings.enhanced?.value) {
shift.x = 107;
if (settings.enhanced?.value) {
if (settings.wide?.value) {
shift.x = 107;
}
if (settings.portrait?.value) {
shift.y = 328;
}
}
return shift;
};

View File

@@ -37,6 +37,12 @@ const setTiles = (data) => {
pixelToFile(sourceXY.x + TILE_SIZE.x * 0, sourceXY.y + TILE_SIZE.y),
pixelToFile(sourceXY.x + TILE_SIZE.x * 1, sourceXY.y + TILE_SIZE.y),
pixelToFile(sourceXY.x + TILE_SIZE.x * 2, sourceXY.y + TILE_SIZE.y),
pixelToFile(sourceXY.x + TILE_SIZE.x * 0, sourceXY.y + TILE_SIZE.y * 2),
pixelToFile(sourceXY.x + TILE_SIZE.x * 1, sourceXY.y + TILE_SIZE.y * 2),
pixelToFile(sourceXY.x + TILE_SIZE.x * 2, sourceXY.y + TILE_SIZE.y * 2),
pixelToFile(sourceXY.x + TILE_SIZE.x * 0, sourceXY.y + TILE_SIZE.y * 3),
pixelToFile(sourceXY.x + TILE_SIZE.x * 1, sourceXY.y + TILE_SIZE.y * 3),
pixelToFile(sourceXY.x + TILE_SIZE.x * 2, sourceXY.y + TILE_SIZE.y * 3),
];
// do some calculations
@@ -48,16 +54,19 @@ const setTiles = (data) => {
const tileShift = modTile(sourceXY.x, sourceXY.y);
// determine which tiles are used
const secondRow = tileShift.y + TILE_SIZE.y > RADAR_FINAL_SIZE().height;
const secondRow = TILE_SIZE.y - tileShift.y < RADAR_FINAL_SIZE().height;
const thirdRow = (TILE_SIZE.y * 2) - tileShift.y < RADAR_FINAL_SIZE().height;
const fourthRow = (TILE_SIZE.y * 3) - tileShift.y < RADAR_FINAL_SIZE().height;
const usedTiles = [
true,
tileShift.x + TILE_SIZE.x > RADAR_FINAL_SIZE().width,
tileShift.x + (TILE_SIZE.x * 2) > RADAR_FINAL_SIZE().width,
secondRow,
TILE_SIZE.x - tileShift.x < RADAR_FINAL_SIZE().width,
(TILE_SIZE.x * 2) - tileShift.x < RADAR_FINAL_SIZE().width,
];
// second row is a copy of the first row when in use
// rows 2, 3 and 4 are a copy of the first row when in use
// calculate T[4] and T[5]
usedTiles.push(secondRow && usedTiles[1], secondRow && usedTiles[2]);
usedTiles.push(secondRow && usedTiles[0], secondRow && usedTiles[1], secondRow && usedTiles[2]);
usedTiles.push(thirdRow && usedTiles[0], thirdRow && usedTiles[1], thirdRow && usedTiles[2]);
usedTiles.push(fourthRow && usedTiles[0], fourthRow && usedTiles[1], fourthRow && usedTiles[2]);
// helper function for populating tiles
const populateTile = (tileName) => (elem, index) => {

View File

@@ -111,6 +111,10 @@
height: 367px;
width: p.$standard-width;
.portrait.enhanced & {
height: 1024px;
}
.container {
.tiles {

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long