ychernenko/hockey_new
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

BUILD123 — обновлённые «Пятёрки»

Browse Source
This commit is contained in:
Юрий Черненко
2026-08-26 15:15:45 +03:00
parent fe164c17f2
commit aca538811f
3 changed files with 29 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
ui_builder/static/app.js
View File

@@ -7007,17 +7007,21 @@ function openTimerQuickEditor(focusActionId = "") {
return payload;
}
function hockeyLinePlayerCard(side, player) {
function hockeyLinePlayerCard(side, player, slotNumber = 0) {
const node = div("hockey-line-player");
const playerId = String(player?.external_id || player?.id || "");
const assignedLine = String(player?.line || "").trim();
const savedOrder = Number(player?.line_sort_order || 0);
const effectiveOrder = assignedLine ? (savedOrder > 0 ? savedOrder : Number(slotNumber || 0)) : 0;
node.draggable = true;
node.dataset.playerId = playerId;
node.dataset.side = side;
if (effectiveOrder > 0) node.dataset.lineSortOrder = String(effectiveOrder);
node.innerHTML = `
<span class="hockey-line-drag">⋮⋮</span>
<b>${escapeHtml(player?.number ? `#${player.number}` : "—")}</b>
<strong>${escapeHtml(player?.name || "Игрок")}</strong>
<small>${escapeHtml(player?.position || "")}</small>
<span class="hockey-line-drag" title="Перетащить">⋮⋮</span>
<b class="hockey-line-player-number">${escapeHtml(player?.number ? `#${player.number}` : "—")}</b>
<strong title="${escapeHtml(player?.name || "Игрок")}">${escapeHtml(player?.name || "Игрок")}</strong>
${effectiveOrder > 0 ? `<span class="hockey-line-order" title="Порядок в звене / line_sort_order: ${effectiveOrder}">${effectiveOrder}</span>` : ""}
`;
node.addEventListener("dragstart", (event) => {
const payload = JSON.stringify({ side, playerId });
@@ -7046,8 +7050,8 @@ function openTimerQuickEditor(focusActionId = "") {
zone.dataset.side = side;
zone.dataset.line = String(lineNumber || "");
if (!players.length) zone.innerHTML = `<span>Перетащите игрока сюда</span>`;
players.forEach((player) => {
const card = hockeyLinePlayerCard(side, player);
players.forEach((player, index) => {
const card = hockeyLinePlayerCard(side, player, index + 1);
card.addEventListener("dragover", (event) => {
event.preventDefault();
event.stopPropagation();
@@ -7162,7 +7166,7 @@ function openTimerQuickEditor(focusActionId = "") {
return workspace;
}
const intro = div("hockey-lines-intro");
intro.innerHTML = `<div><strong>Пятёрки / звенья</strong><span>Перетаскивайте игроков между звеньями и меняйте порядок внутри звена. Изменения сохраняются в базе автоматически.</span></div><small>SQL: hockey_game_rosters.line_number + line_sort_order</small>`;
intro.innerHTML = `<div><strong>Пятёрки / звенья</strong><span>Перетаскивайте игроков между звеньями. Цифра справа у игрока — его сохранённый порядок 1–5 внутри звена.</span></div><small>SQL: line_number + line_sort_order</small>`;
workspace.append(intro);
const teams = div("hockey-lines-columns");
teams.append(hockeyLineTeamColumn("home"), hockeyLineTeamColumn("away"));
@@ -13625,7 +13629,7 @@ function renderHockeyPenaltyDashboard(node, component, runtime) {
// uniformly on smaller screens and may now grow on larger/F11 viewports.
// A bounded 150% scale keeps the fixed logical canvas stable while using
// otherwise empty screen space.
const maxScale = fixedHockeyCanvas ? 1.6 : 1.8;
const maxScale = state.activeTab === "lines" ? 1.8 : fixedHockeyCanvas ? 1.6 : 1.8;
const heightRatio = available.height / canvasHeight;
const rawScale = Math.min(maxScale, available.width / canvasWidth, heightRatio);
const scale = Math.max(0.1, Math.floor(rawScale * 10000) / 10000);

27
ui_builder/static/styles.css
View File

@@ -7779,25 +7779,28 @@ body.hockey-navigation-open .runtime-viewport.has-hockey-pbp { gap: 14px !import
.quick-score-control{padding-inline:4px}
}
/* BUILD122 — drag-and-drop hockey line/five sorter. */
/* BUILD123 — roomier three-across hockey line/five sorter with persisted slot numbers. */
.hockey-lines-workspace{
position:absolute;inset:0;display:grid;grid-template-rows:auto minmax(0,1fr);gap:10px;
padding:14px;box-sizing:border-box;color:#dcecff;background:linear-gradient(180deg,#0a1522 0%,#09131f 100%);overflow:hidden;
position:absolute;inset:0;display:grid;grid-template-rows:auto minmax(0,1fr);gap:7px;
padding:8px;box-sizing:border-box;color:#dcecff;background:linear-gradient(180deg,#0a1522 0%,#09131f 100%);overflow:hidden;
}
.hockey-lines-intro{
min-height:54px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 13px;
border:1px solid #263f56;border-radius:11px;background:#0c1b2a;
min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:7px 11px;
border:1px solid #263f56;border-radius:10px;background:#0c1b2a;
}
.hockey-lines-intro>div{min-width:0;display:grid;gap:3px}.hockey-lines-intro strong{font-size:15px}.hockey-lines-intro span{color:#7f96ad;font-size:8px}.hockey-lines-intro small{color:#56e3c1;font-size:8px;font-weight:850;white-space:nowrap}
.hockey-lines-columns{min-height:0;display:grid;grid-template-columns:1fr 1fr;gap:12px;overflow:hidden}
.hockey-lines-team{min-width:0;min-height:0;display:flex;flex-direction:column;gap:8px;padding:10px;border:1px solid #243a50;border-radius:12px;background:#0b1725;overflow-y:auto}
.hockey-lines-intro>div{min-width:0;display:grid;gap:2px}.hockey-lines-intro strong{font-size:14px}.hockey-lines-intro span{color:#7f96ad;font-size:8px}.hockey-lines-intro small{color:#56e3c1;font-size:8px;font-weight:850;white-space:nowrap}
.hockey-lines-columns{min-height:0;display:grid;grid-template-columns:1fr 1fr;gap:8px;overflow:hidden}
.hockey-lines-team{min-width:0;min-height:0;display:flex;flex-direction:column;gap:7px;padding:8px;border:1px solid #243a50;border-radius:11px;background:#0b1725;overflow-y:auto}
.hockey-lines-team.side-home{box-shadow:inset 3px 0 0 #4d9cff}.hockey-lines-team.side-away{box-shadow:inset -3px 0 0 #ff5f79}
.hockey-lines-team-header{display:flex;align-items:center;justify-content:space-between;gap:10px;position:sticky;top:-10px;z-index:3;padding:7px 4px 8px;background:#0b1725}
.hockey-lines-team-header{display:flex;align-items:center;justify-content:space-between;gap:10px;position:sticky;top:-8px;z-index:3;padding:6px 3px 7px;background:#0b1725}
.hockey-lines-team-header>div{min-width:0;display:grid;gap:2px}.hockey-lines-team-header span{color:#70879f;font-size:7px;font-weight:950;letter-spacing:.09em}.hockey-lines-team-header strong{overflow:hidden;font-size:13px;text-overflow:ellipsis;white-space:nowrap}.hockey-lines-team-header em{padding:4px 8px;border:1px solid #2b475f;border-radius:999px;color:#80a0ba;background:#102235;font-size:7px;font-style:normal;font-weight:900}
.hockey-lines-actions{display:flex;gap:6px}.hockey-lines-actions button{min-height:28px;padding:0 10px;border:1px solid #31516a;border-radius:7px;color:#cfe3f3;background:#10263a;font-size:8px;font-weight:900;cursor:pointer}.hockey-lines-actions button:hover{border-color:#54dcbf;color:#fff}.hockey-lines-actions button:disabled{opacity:.45;cursor:default}
.hockey-line-card{display:grid;gap:6px;padding:7px;border:1px solid #22394f;border-radius:10px;background:#0e1d2c}.hockey-line-card.is-unassigned{border-style:dashed;background:#0a1622}
.hockey-line-card{display:grid;gap:5px;padding:7px;border:1px solid #22394f;border-radius:9px;background:#0e1d2c}.hockey-line-card.is-unassigned{border-style:dashed;background:#0a1622}
.hockey-line-card>header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 2px}.hockey-line-card>header strong{font-size:9px}.hockey-line-card>header span{display:grid;place-items:center;min-width:22px;height:18px;padding:0 5px;border-radius:999px;color:#7e97af;background:#14283b;font-size:7px;font-weight:950}
.hockey-line-dropzone{min-height:38px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;padding:4px;border:1px solid transparent;border-radius:8px;transition:border-color .12s,background .12s}
.hockey-line-dropzone{min-height:42px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;padding:3px;border:1px solid transparent;border-radius:8px;transition:border-color .12s,background .12s}
.hockey-line-dropzone>span{grid-column:1/-1;align-self:center;color:#4f6880;font-size:8px;text-align:center}.hockey-line-dropzone.is-over{border-color:#54dcbf;background:rgba(84,220,191,.06)}
.hockey-line-player{min-width:0;display:grid;grid-template-columns:12px 31px minmax(0,1fr);grid-template-rows:auto auto;column-gap:5px;align-items:center;padding:5px 6px;border:1px solid #29445c;border-radius:8px;background:#102235;cursor:grab;transition:transform .1s,border-color .1s,opacity .1s}.hockey-line-player:hover{border-color:#47708f;transform:translateY(-1px)}.hockey-line-player.is-dragging{opacity:.35}.hockey-line-player.is-drop-before{border-color:#54e5c4;box-shadow:inset 3px 0 0 #54e5c4}.hockey-line-drag{grid-row:1/3;color:#58738c;font-size:9px;letter-spacing:-2px}.hockey-line-player b{grid-row:1/3;display:grid;place-items:center;min-height:27px;border-radius:6px;color:#dcecff;background:#0a1724;font-size:8px}.hockey-line-player strong{min-width:0;overflow:hidden;font-size:9px;text-overflow:ellipsis;white-space:nowrap}.hockey-line-player small{min-width:0;overflow:hidden;color:#6f879e;font-size:7px;text-overflow:ellipsis;white-space:nowrap}
.hockey-line-player{min-width:0;min-height:34px;display:grid;grid-template-columns:10px 30px minmax(0,1fr) 22px;gap:4px;align-items:center;padding:4px 5px;border:1px solid #29445c;border-radius:8px;background:#102235;cursor:grab;transition:transform .1s,border-color .1s,opacity .1s}.hockey-line-player:hover{border-color:#47708f;transform:translateY(-1px)}.hockey-line-player.is-dragging{opacity:.35}.hockey-line-player.is-drop-before{border-color:#54e5c4;box-shadow:inset 3px 0 0 #54e5c4}
.hockey-line-drag{color:#58738c;font-size:9px;letter-spacing:-2px;line-height:1}.hockey-line-player-number{display:grid;place-items:center;min-height:25px;border-radius:6px;color:#dcecff;background:#0a1724;font-size:8px}.hockey-line-player strong{min-width:0;overflow:hidden;font-size:8.5px;line-height:1.15;text-overflow:ellipsis;white-space:nowrap}
.hockey-line-order{display:grid;place-items:center;width:22px;height:22px;border:1px solid rgba(84,229,196,.34);border-radius:999px;color:#07130f;background:#54e5c4;font-size:9px;font-weight:950;font-variant-numeric:tabular-nums}
.hockey-line-card.is-unassigned .hockey-line-player{grid-template-columns:10px 30px minmax(0,1fr)}
.hockey-lines-empty{position:absolute;inset:0;display:grid;place-content:center;gap:6px;color:#7890a8;text-align:center}.hockey-lines-empty strong{color:#d9e8f6;font-size:17px}.hockey-lines-empty span{font-size:9px}