diff --git a/app.js b/app.js index 2daf59f..b15cbd4 100644 --- a/app.js +++ b/app.js @@ -13,17 +13,17 @@ const PRESETS = { fast: { label: "FAST", quota: 6, - description: "6 coups par joueur et par partie.", + description: "6 coups par joueur.", }, freeze: { label: "FREEZE", quota: 8, - description: "8 coups par joueur et par partie.", + description: "8 coups par joueur.", }, masters: { label: "MASTERS", quota: 10, - description: "10 coups par joueur et par partie.", + description: "10 coups par joueur.", }, }; @@ -114,6 +114,8 @@ function initSetupPage() { const summary = document.querySelector("#setupSummary"); const loadDemoButton = document.querySelector("#loadDemoButton"); const resumeCard = document.querySelector("#resumeCard"); + const moveSecondsField = document.querySelector("#moveSecondsField"); + const moveSecondsInput = form?.querySelector('[name="moveSeconds"]'); if (!form || !summary || !loadDemoButton || !resumeCard) { return; @@ -125,17 +127,34 @@ function initSetupPage() { const quota = PRESETS[preset].quota; const blockDurationMs = getDurationInputMs(form, "blockSeconds", DEFAULT_BLOCK_DURATION_MS); const moveLimitMs = getDurationInputMs(form, "moveSeconds", DEFAULT_MOVE_LIMIT_MS); + const moveLimitActive = usesMoveLimit(mode); const timeImpact = mode === "time" - ? "Chronos cumules de 10 minutes, ajustes apres chaque phase cube avec plafond de 120 s pris en compte." + ? "Chronos cumules de 10 minutes par joueur, ajustes apres chaque phase cube avec plafond de 120 s pris en compte. Aucun temps par coup en mode Time." : "Le gagnant du cube commence la partie suivante, avec double coup V2 possible."; + const timingText = moveLimitActive + ? `Temps configures : partie ${formatClock(blockDurationMs)}, coup ${formatClock(moveLimitMs)}.` + : `Temps configure : Block ${formatClock(blockDurationMs)}.`; + const quotaText = moveLimitActive + ? `Quota actif : ${quota} coups par joueur.` + : `Quota actif : ${quota} coups par joueur et par Block.`; + + if (moveSecondsField instanceof HTMLElement) { + moveSecondsField.hidden = !moveLimitActive; + } + + if (moveSecondsInput instanceof HTMLInputElement) { + moveSecondsInput.disabled = !moveLimitActive; + } + + document.body.classList.toggle("time-setup-mode", !moveLimitActive); summary.innerHTML = ` ${MODES[mode].label} ${PRESETS[preset].description} - Temps configures : partie ${formatClock(blockDurationMs)}, coup ${formatClock(moveLimitMs)}. + ${timingText} ${timeImpact} - Quota actif : ${quota} coups par joueur. + ${quotaText} `; }; @@ -228,7 +247,9 @@ function initChronoPage() { title: document.querySelector("#chronoTitle"), subtitle: document.querySelector("#chronoSubtitle"), blockTimer: document.querySelector("#blockTimer"), + blockTimerLabel: document.querySelector("#blockTimerLabel"), moveTimer: document.querySelector("#moveTimer"), + moveTimerCard: document.querySelector("#moveTimerCard"), centerLabel: document.querySelector("#chronoCenterLabel"), centerValue: document.querySelector("#chronoCenterValue"), spineLabel: document.querySelector("#spineLabel"), @@ -299,7 +320,7 @@ function initChronoPage() { return; } - requestBlockClosure(match, "Cloture manuelle de la partie demandee par l'arbitre."); + requestBlockClosure(match, `Cloture manuelle ${getBlockGenitivePhrase(match)} demandee par l'arbitre.`); dirty = true; if (!match.result && match.phase === "cube") { goToCubePage(); @@ -310,7 +331,7 @@ function initChronoPage() { refs.arbiterTimeoutButton?.addEventListener("click", () => { syncRunningState(match); - if (match.result || match.phase !== "block") { + if (match.result || match.phase !== "block" || !usesMoveLimit(match)) { return; } @@ -326,7 +347,9 @@ function initChronoPage() { } match.currentTurn = opponentOf(match.currentTurn); - match.moveRemainingMs = getMoveLimitMs(match); + if (usesMoveLimit(match)) { + match.moveRemainingMs = getMoveLimitMs(match); + } logEvent(match, "Trait corrige manuellement par l'arbitre."); dirty = true; render(); @@ -416,17 +439,20 @@ function initChronoPage() { const clock = isWhite ? refs.whiteClock : refs.blackClock; const hint = isWhite ? refs.whiteHint : refs.blackHint; const zone = isWhite ? refs.whiteZone : refs.blackZone; - const actorName = playerName(match, color); const active = match.currentTurn === color; + const unitLabel = getBlockLabel(match); + const unitPhrase = getBlockPhrase(match); - name.textContent = actorName; + name.textContent = playerName(match, color); moves.textContent = `${match.moves[color]} / ${match.quota}`; - clock.textContent = match.clocks - ? `Chrono ${formatSignedClock(match.clocks[color])}` - : `Dernier cube ${renderLastCube(match, color)}`; + clock.textContent = match.clocks ? formatSignedClock(match.clocks[color]) : `Dernier cube ${renderLastCube(match, color)}`; button.classList.toggle("active-turn", active && !match.result); zone.classList.toggle("active-zone", active && !match.result); + zone.classList.toggle("has-player-clock", Boolean(match.clocks)); + clock.classList.toggle("player-clock", Boolean(match.clocks)); + clock.classList.toggle("negative-clock", Boolean(match.clocks) && match.clocks[color] < 0); + clock.classList.toggle("active-clock", Boolean(match.clocks) && active && !match.result); if (match.result) { button.textContent = resultText(match); @@ -436,10 +462,10 @@ function initChronoPage() { } if (!match.running) { - button.textContent = "Partie en pause"; + button.textContent = `${unitLabel} en pause`; button.disabled = true; hint.textContent = active - ? "La partie n'a pas encore demarre ou a ete mise en pause." + ? `${unitPhrase} n'a pas encore demarre ou a ete mis en pause.` : `${playerName(match, match.currentTurn)} reprendra au demarrage.`; return; } @@ -480,11 +506,21 @@ function initChronoPage() { return; } + const timeMode = isTimeMode(match); + const blockHeading = formatBlockHeading(match, match.blockNumber); + + document.body.classList.toggle("time-mode", timeMode); refs.title.textContent = match.config.matchLabel; - refs.subtitle.textContent = `Partie ${match.blockNumber} - ${MODES[match.config.mode].label} - ${renderModeContext(match)}`; + refs.subtitle.textContent = `${blockHeading} - ${MODES[match.config.mode].label} - ${renderModeContext(match)}`; + refs.blockTimerLabel.textContent = timeMode ? "Temps Block" : "Temps partie"; refs.blockTimer.textContent = formatClock(match.blockRemainingMs); - refs.moveTimer.textContent = formatClock(match.moveRemainingMs); - refs.arbiterTimeoutButton.textContent = `Depassement ${formatClock(getMoveLimitMs(match))}`; + refs.moveTimer.textContent = usesMoveLimit(match) ? formatClock(match.moveRemainingMs) : "--:--"; + refs.moveTimerCard.hidden = timeMode; + refs.arbiterTimeoutButton.hidden = timeMode; + refs.arbiterTimeoutButton.disabled = timeMode; + if (usesMoveLimit(match)) { + refs.arbiterTimeoutButton.textContent = `Depassement ${formatClock(getMoveLimitMs(match))}`; + } if (match.result) { refs.centerLabel.textContent = "Resultat"; @@ -498,20 +534,20 @@ function initChronoPage() { refs.centerLabel.textContent = "Trait"; refs.centerValue.textContent = playerName(match, match.currentTurn); refs.spineLabel.textContent = "Chrono en cours"; - refs.spineHeadline.textContent = `Partie ${match.blockNumber} active`; + refs.spineHeadline.textContent = `${blockHeading} actif`; refs.spineText.textContent = "Chaque joueur tape sur sa grande zone quand son coup est termine. La page cube s'ouvrira automatiquement a la fin de la phase chess."; refs.primaryButton.textContent = "Pause arbitre"; - refs.arbiterStatus.textContent = `Partie en cours. Joueur au trait : ${playerName(match, match.currentTurn)}.`; + refs.arbiterStatus.textContent = `${blockHeading} en cours. Joueur au trait : ${playerName(match, match.currentTurn)}.`; } else { refs.centerLabel.textContent = "Trait"; refs.centerValue.textContent = playerName(match, match.currentTurn); - refs.spineLabel.textContent = "Pret"; - refs.spineHeadline.textContent = `Partie ${match.blockNumber}`; + refs.spineLabel.textContent = timeMode ? "Etat du Block" : "Pret"; + refs.spineHeadline.textContent = blockHeading; refs.spineText.textContent = "Demarrez la partie, puis laissez uniquement les deux grandes zones aux joueurs. La page cube prendra automatiquement le relais."; - refs.primaryButton.textContent = "Demarrer la partie"; - refs.arbiterStatus.textContent = `Partie prete. ${playerName(match, match.currentTurn)} commencera.`; + refs.primaryButton.textContent = timeMode ? "Demarrer le Block" : "Demarrer la partie"; + refs.arbiterStatus.textContent = `${blockHeading} pret. ${playerName(match, match.currentTurn)} commencera.`; } refs.arbiterCloseBlockButton.textContent = "Passer au cube"; @@ -555,6 +591,7 @@ function initCubePage() { const refs = { title: document.querySelector("#cubeTitle"), subtitle: document.querySelector("#cubeSubtitle"), + blockLabelText: document.querySelector("#cubeBlockLabelText"), blockLabel: document.querySelector("#cubeBlockLabel"), elapsed: document.querySelector("#cubeElapsed"), centerLabel: document.querySelector("#cubeCenterLabel"), @@ -892,8 +929,11 @@ function initCubePage() { } function render() { + const blockHeading = formatBlockHeading(match, match.blockNumber); + refs.title.textContent = match.cube.number ? `Cube n${match.cube.number}` : "Phase cube"; - refs.subtitle.textContent = `Partie ${match.blockNumber} - ${MODES[match.config.mode].label} - ${renderModeContext(match)}`; + refs.subtitle.textContent = `${blockHeading} - ${MODES[match.config.mode].label} - ${renderModeContext(match)}`; + refs.blockLabelText.textContent = getBlockLabel(match); refs.blockLabel.textContent = `${match.blockNumber}`; refs.elapsed.textContent = renderCubeElapsed(match); @@ -923,7 +963,9 @@ function initCubePage() { refs.centerValue.textContent = "Phase cube complete"; refs.spineLabel.textContent = "Suite"; refs.spineHeadline.textContent = "Ouvrir la page chrono"; - refs.spineText.textContent = "Appliquer le resultat du cube pour preparer la partie suivante."; + refs.spineText.textContent = isTimeMode(match) + ? "Appliquer le resultat du cube pour preparer le Block suivant." + : "Appliquer le resultat du cube pour preparer la partie suivante."; refs.primaryButton.textContent = "Appliquer et ouvrir la page chrono"; refs.helpStatus.textContent = refs.spineText.textContent; } else if (match.cube.running) { @@ -1033,9 +1075,11 @@ function createMatch(config) { logEvent( newMatch, - `Match cree en mode ${MODES[config.mode].label}, cadence ${PRESETS[config.preset].label}, partie ${formatClock(config.blockDurationMs)} et coup ${formatClock(config.moveLimitMs)}.`, + usesMoveLimit(config.mode) + ? `Match cree en mode ${MODES[config.mode].label}, cadence ${PRESETS[config.preset].label}, partie ${formatClock(config.blockDurationMs)} et coup ${formatClock(config.moveLimitMs)}.` + : `Match cree en mode ${MODES[config.mode].label}, cadence ${PRESETS[config.preset].label}, Block ${formatClock(config.blockDurationMs)} sans temps par coup.`, ); - logEvent(newMatch, "Les Blancs commencent la partie 1."); + logEvent(newMatch, `Les Blancs commencent ${formatBlockHeading(config, 1)}.`); return newMatch; } @@ -1163,7 +1207,9 @@ function syncRunningState(storedMatch) { storedMatch.lastTickAt = now; storedMatch.blockRemainingMs = Math.max(0, storedMatch.blockRemainingMs - delta); - storedMatch.moveRemainingMs = Math.max(0, storedMatch.moveRemainingMs - delta); + if (usesMoveLimit(storedMatch)) { + storedMatch.moveRemainingMs = Math.max(0, storedMatch.moveRemainingMs - delta); + } if (storedMatch.clocks) { storedMatch.clocks[storedMatch.currentTurn] -= delta; @@ -1172,9 +1218,9 @@ function syncRunningState(storedMatch) { if (storedMatch.blockRemainingMs === 0) { requestBlockClosure( storedMatch, - `Le temps de partie ${formatClock(getBlockDurationMs(storedMatch))} est ecoule.`, + `Le temps ${getBlockGenitivePhrase(storedMatch)} ${formatClock(getBlockDurationMs(storedMatch))} est ecoule.`, ); - } else if (storedMatch.moveRemainingMs === 0) { + } else if (usesMoveLimit(storedMatch) && storedMatch.moveRemainingMs === 0) { registerMoveTimeout(storedMatch, true); } @@ -1193,8 +1239,8 @@ function startBlock(storedMatch) { logEvent( storedMatch, storedMatch.blockNumber === 1 && storedMatch.moves.white === 0 && storedMatch.moves.black === 0 - ? "Partie 1 demarre." - : `Partie ${storedMatch.blockNumber} relance.`, + ? `${formatBlockHeading(storedMatch, 1)} demarre.` + : `${formatBlockHeading(storedMatch, storedMatch.blockNumber)} relance.`, ); } @@ -1205,7 +1251,7 @@ function pauseBlock(storedMatch) { storedMatch.running = false; storedMatch.lastTickAt = null; - logEvent(storedMatch, `Partie ${storedMatch.blockNumber} mise en pause.`); + logEvent(storedMatch, `${formatBlockHeading(storedMatch, storedMatch.blockNumber)} passe en pause.`); } function requestBlockClosure(storedMatch, reason) { @@ -1388,7 +1434,7 @@ function prepareNextTimeBlock(storedMatch) { storedMatch.cube.number = null; logEvent( storedMatch, - `Partie ${storedMatch.blockNumber} prete. Le trait est conserve : ${playerName( + `${formatBlockHeading(storedMatch, storedMatch.blockNumber)} pret. Le trait est conserve : ${playerName( storedMatch, storedMatch.currentTurn, )} reprend.`, @@ -1489,7 +1535,7 @@ function registerFreeDoubleMove(storedMatch) { } function registerMoveTimeout(storedMatch, automatic) { - if (!storedMatch || storedMatch.phase !== "block") { + if (!storedMatch || storedMatch.phase !== "block" || !usesMoveLimit(storedMatch)) { return; } @@ -1718,6 +1764,34 @@ function getDurationInputMs(form, name, fallbackMs) { return seconds * 1000; } +function isTimeMode(matchOrConfig) { + const mode = + typeof matchOrConfig === "string" + ? matchOrConfig + : matchOrConfig?.config?.mode ?? matchOrConfig?.mode; + return mode === "time"; +} + +function usesMoveLimit(matchOrConfig) { + return !isTimeMode(matchOrConfig); +} + +function getBlockLabel(matchOrConfig) { + return isTimeMode(matchOrConfig) ? "Block" : "Partie"; +} + +function getBlockPhrase(matchOrConfig) { + return isTimeMode(matchOrConfig) ? "Le Block" : "La partie"; +} + +function getBlockGenitivePhrase(matchOrConfig) { + return isTimeMode(matchOrConfig) ? "du Block" : "de la partie"; +} + +function formatBlockHeading(matchOrConfig, blockNumber) { + return `${getBlockLabel(matchOrConfig)} ${blockNumber}`; +} + function playerName(storedMatch, color) { return color === "white" ? storedMatch.config.whiteName : storedMatch.config.blackName; } diff --git a/application.html b/application.html index 9593bf0..a44c38f 100644 --- a/application.html +++ b/application.html @@ -46,7 +46,7 @@
  • Configurer la rencontre
  • Passer à la page chrono
  • Basculer automatiquement sur la page cube
    • -
  • Revenir sur la page chrono pour la partie suivante
    • +
  • Revenir sur la page chrono pour le Block suivant
    • @@ -90,7 +90,7 @@ ChessCubing Time - Même structure de parties, avec chronos cumulés et alternance + Même structure de Blocks, avec chronos cumulés et alternance bloc - / bloc +. @@ -98,7 +98,7 @@
    - Cadence de la partie + Cadence du match
    @@ -76,13 +76,13 @@
    -

    État de la partie

    +

    État du Block

    Prêt à démarrer

    @@ -95,7 +95,7 @@
    0 / 6 - +
    diff --git a/cube.html b/cube.html index df7535a..dd75c1c 100644 --- a/cube.html +++ b/cube.html @@ -39,7 +39,7 @@
    - Partie + Block 1
    diff --git a/reglement.html b/reglement.html index 7dfc4ba..4940763 100644 --- a/reglement.html +++ b/reglement.html @@ -264,16 +264,16 @@
    Temps initial : 10 min / joueur - Partie : 180 s + Block : 180 s Cap cube pris en compte : 120 s

    Structure temporelle

      -
    • La structure des parties est identique à celle du Twice.
      • +
    • La structure des Blocks est identique à celle du Twice.
    • Les quotas de coups restent les mêmes : 6, 8 ou 10.
      • -
    • Chaque partie est suivie d'une phase cube obligatoire.
      • +
    • Chaque Block est suivi d'une phase cube obligatoire.
    • Le trait est conservé après la phase cube.
    • Aucun système de priorité ou de double coup n'existe.
    @@ -281,7 +281,7 @@
    - Partie impaire + Block impair Bloc -

    Le temps de résolution du cube est retiré du chrono du @@ -289,7 +289,7 @@

    - Partie paire + Block pair Bloc +

    Le temps de résolution du cube est ajouté au chrono adverse, diff --git a/styles.css b/styles.css index 6b06f50..7939dcf 100644 --- a/styles.css +++ b/styles.css @@ -2389,3 +2389,72 @@ body[data-page="chrono"] .spine-button { font-size: 0.9rem; } } + +body.time-setup-mode .timing-grid { + grid-template-columns: minmax(0, 1fr); +} + +body[data-page="chrono"].time-mode .status-strip { + grid-template-columns: repeat(2, minmax(0, 1fr)); +} + +body[data-page="chrono"] .has-player-clock .zone-stats { + gap: 0.45rem; +} + +body[data-page="chrono"] .has-player-clock .zone-stats strong { + color: var(--muted); + font-size: 0.92rem; + letter-spacing: 0.08em; +} + +body[data-page="chrono"] .player-clock { + display: inline-flex; + align-items: center; + justify-content: center; + justify-self: end; + min-width: min(100%, 10ch); + padding: 0.55rem 0.8rem; + border: 1px solid var(--panel-border-strong); + border-radius: 999px; + background: rgba(255, 255, 255, 0.06); + color: var(--text); + font-size: clamp(1.3rem, 3.6vw, 2.35rem); + font-weight: 900; + letter-spacing: 0.06em; + line-height: 1; + box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03); +} + +body[data-page="chrono"] #whiteClockChrono.player-clock { + color: var(--white-seat); + background: rgba(255, 177, 58, 0.12); + border-color: rgba(255, 177, 58, 0.28); +} + +body[data-page="chrono"] #blackClockChrono.player-clock { + color: var(--dark-seat); + background: rgba(23, 98, 255, 0.12); + border-color: rgba(23, 98, 255, 0.28); +} + +body[data-page="chrono"] .player-clock.active-clock { + box-shadow: + 0 0 0 1px rgba(255, 255, 255, 0.08), + 0 0 24px rgba(255, 255, 255, 0.06); + transform: translateY(-1px); +} + +body[data-page="chrono"] .player-clock.negative-clock { + color: #ffd6dc; + background: rgba(255, 100, 127, 0.16); + border-color: rgba(255, 100, 127, 0.34); +} + +@media (max-width: 900px) { + body[data-page="chrono"] .player-clock { + min-width: 7.7ch; + padding: 0.45rem 0.68rem; + font-size: clamp(1.05rem, 5.8vw, 1.7rem); + } +}