Skip to content

Commit

Permalink
fix: style
Browse files Browse the repository at this point in the history
  • Loading branch information
@guideloince
guideloince committed Jun 14, 2024
1 parent aa80a0f commit f26c7da
Show file tree
Hide file tree
Showing 2 changed files with 98 additions and 27 deletions.
40 changes: 35 additions & 5 deletions src/global.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4478,11 +4478,12 @@ button.build-it_premium:hover {
color: #6f9fc8 !important;
}

div.ogi-movement .ogi-movement-target .ogi-movement-target-coords .ogk-coords-hostile,
#eventContent .ogk-coords-hostile {
color: rgb(210 27 56);
color: #e23b3a;
}

div.ogi-movement .ogi-movement-target .ogi-movement-target-coords .ogk-coords-neutral,
#eventContent .ogk-coords-neutral {
color: #d29d00;
}
Expand All @@ -4498,10 +4499,13 @@ button.build-it_premium:hover {
font-style: italic;
}

div.ogi-movement .ogi-movement-target .ogi-movement-target-coords .ogk-coords-debris,
#eventContent .ogk-coords-debris {
color: green !important;
}


div.ogi-movement .ogi-movement-target .ogi-movement-target-coords .ogk-coords-expedition,
#eventContent .ogk-coords-expedition {
color: #4162a5 !important;
}
Expand Down Expand Up @@ -8249,14 +8253,40 @@ div#eventboxFilled p.event_list {
position: relative;
}

div.ogi-movement > div,
div.ogi-movement > div > div {
div.ogi-movement,
div.ogi-movement > div {
display: grid;
align-content: center;
justify-content: center;
min-height: 20px;
}

div.ogi-movement > div {
grid-template-columns: repeat(3, minmax(0, 1fr));
div.ogi-movement {
grid-template-columns: repeat(3, auto);
column-gap: 0.5rem;
row-gap: 0.25rem;
line-height: 16px;
}

div.ogi-movement .ogi-movement-target {
display: grid;
align-content: center;
justify-content: center;
grid-template-columns: 16px repeat(2, auto);
gap: 0.25rem;
}

div.ogi-movement .ogi-movement-target .ogi-movement-target-coords {
display: grid;
align-content: center;
justify-content: center;
grid-template-columns: 45px 16px;
gap: 0.125rem;
}

div.ogi-movement .ogi-movement-target > div:nth-child(1) {
display: grid;
align-content: center;
justify-content: center;
height: 16px;
}
85 changes: 63 additions & 22 deletions src/ogkush.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16839,6 +16839,8 @@ class OGInfinity {
const date = new Date();
date.setTime(timestamp * 1000);

flying.missionType = row.getAttribute("data-mission-type");
flying.date = timestamp;
flying.arrivalTime = date.toLocaleTimeString();
flying.missionFleetIcon = cols[2].querySelector("img").src;

Expand All @@ -16850,6 +16852,7 @@ class OGInfinity {
flying.missionFleetTitle = flying.missionFleetTitle.split("(")[0].trim();

flying.origin = cols[3].textContent.trim();
flying.originMoon = !!cols[3].querySelector('.moon');
flying.originCoords = cols[4].textContent.replace("[", "").replace("]", "").trim();
flying.originLink = cols[4].querySelector("a").href;
flying.fleetCount = cols[5].textContent;
Expand All @@ -16865,6 +16868,8 @@ class OGInfinity {
);

flying.dest = cols[7].textContent.trim();
flying.destMoon = cols[7].querySelector('.moon');
flying.destDebris = cols[7].querySelector('.tf');
flying.destCoords = cols[8].textContent.replace("[", "").replace("]", "").trim();
flying.destLink = cols[8].querySelector("a").href;
if (!FLYING_PER_PLANETS[flying.originCoords]) FLYING_PER_PLANETS[flying.originCoords] = {};
Expand Down Expand Up @@ -16907,15 +16912,13 @@ class OGInfinity {
const movementTooltip = DOM.createDOM("div", { class: "ogi-movement" });
const movementTooltipHeader = DOM.createDOM("div");

movementTooltipHeader.appendChild(DOM.createDOM("div", {}, "Type"));
movementTooltipHeader.appendChild(DOM.createDOM("div", {}, "Target"));
movementTooltipHeader.appendChild(DOM.createDOM("div", {}, "Time"));

movementTooltip.appendChild(movementTooltipHeader);
movementTooltip.appendChild(DOM.createDOM("div", {}, "Type"));
movementTooltip.appendChild(DOM.createDOM("div", {}, "Target"));
movementTooltip.appendChild(DOM.createDOM("div", {}, "Time"));

const movementsList = [];
Object.keys(movements).forEach((movementKey, i) => {
if (i < 8) {
const movementTooltipRow = DOM.createDOM("div");
const nbrMovements = Object.keys(movements).length;
const movement = movements[movementKey];
let size = sizeDiv;
Expand All @@ -16924,32 +16927,70 @@ class OGInfinity {
}
const img = DOM.createDOM("img");
img.src = movement.icon;
movement.data.forEach((m) => {
const symbolDirection = m.direction === "go" ? "🡒" : "🡐";

const rowType = DOM.createDOM("div");
rowType.appendChild(img.cloneNode(true));
movementTooltipRow.appendChild(rowType);

const rowTarget = DOM.createDOM("div");
rowTarget.appendChild(DOM.createDOM("span", {}, `${symbolDirection} ${m.dest}[${m.destCoords}]`));
movementTooltipRow.appendChild(rowTarget);

const rowTime = DOM.createDOM("div");
rowTime.appendChild(DOM.createDOM("span", {}, `${m.arrivalTime}`));
movementTooltipRow.appendChild(rowTime);
});
movement.data.forEach((m) => { movementsList.push({ ...m, img: img.cloneNode(true), }); });

img.style = `position: initial !important; width: ${size}px; height: ${size}px; margin: 1px !important;`;
movementTooltip.append(movementTooltipRow);

div.appendChild(img);
}
});

movementsList.sort((a, b) => {
if (a.date < b.date) return -1;
if (a.date > b.date) return 1;
return 0;
});

movementsList.forEach((m) => {
const symbolDirection = m.direction === "go" ? "🡒" : "🡐";

const rowType = DOM.createDOM("div");
rowType.appendChild(m.img);
movementTooltip.appendChild(rowType);

const rowTarget = DOM.createDOM("div", { class: "ogi-movement-target" });
const fromMoon = DOM.createDOM("div");
const rowTargetDirection = DOM.createDOM("div", {} , symbolDirection);
const rowTargetCoords = DOM.createDOM("div", { class: "ogi-movement-target-coords" });

const coordsSpan = rowTargetCoords.appendChild(DOM.createDOM("span", {}, m.destCoords));

if (parseInt(m.missionType) === 8) {
coordsSpan.classList.add("ogk-coords-debris");
} else if (parseInt(m.missionType) === 3) {
coordsSpan.classList.add("ogk-coords-neutral");
} else if (parseInt(m.missionType) === 6 || parseInt(m.missionType) === 1) {
coordsSpan.classList.add("ogk-coords-hostile");
} else if (parseInt(m.missionType) === 15) {
coordsSpan.classList.add("ogk-coords-expedition");
}

if (m.originMoon) {
fromMoon.appendChild(DOM.createDOM("figure", { class: "planetIcon moon"} ));
}

if (m.destMoon) {
rowTargetCoords.appendChild(DOM.createDOM("figure", { class: "planetIcon moon"} ));
}

if (m.destDebris) {
rowTargetCoords.appendChild(DOM.createDOM("figure", { class: "planetIcon tf"} ));
}

rowTarget.appendChild(fromMoon);
rowTarget.appendChild(rowTargetDirection);
rowTarget.appendChild(rowTargetCoords);

movementTooltip.appendChild(rowTarget);

const rowTime = DOM.createDOM("div");
rowTime.appendChild(DOM.createDOM("span", {}, `${m.arrivalTime}`));
movementTooltip.appendChild(rowTime);
});

div.addEventListener("ontouchstart" in document.documentElement ? "touchstart" : "mouseenter", () => {
tooltip(div, movementTooltip, true, false, 50);
tooltip(div, movementTooltip, true, { bottom: true}, 50);
});
}
});
Expand Down

0 comments on commit f26c7da

Please sign in to comment.