From 4e1c25827ef79e803f5523a3e2da769351dcbed4 Mon Sep 17 00:00:00 2001 From: Tor Andersson Date: Thu, 22 Aug 2024 11:49:35 +0200 Subject: tips --- play.js | 114 ++++++++++++++++++++++++++++++++++++++++------------------------ 1 file changed, 72 insertions(+), 42 deletions(-) diff --git a/play.js b/play.js index 991bf75..3d577c0 100644 --- a/play.js +++ b/play.js @@ -154,9 +154,12 @@ let ui = { favicon: document.getElementById("favicon"), header: document.querySelector("header"), status: document.getElementById("status"), + tooltip: document.getElementById("tooltip"), - turn_info: document.getElementById("turn_info"), war_ends: document.getElementById("war_ends"), + played_british_reinforcements: document.getElementById("played_british_reinforcements"), + played_american_reinforcements_1: document.getElementById("played_american_reinforcements_1"), + played_american_reinforcements_2: document.getElementById("played_american_reinforcements_2"), last_played: document.getElementById("last_played"), reshuffle: document.getElementById("reshuffle"), hand: document.getElementById("hand"), @@ -265,6 +268,7 @@ function on_init() { e.style.height = h - 10 + "px" register_action(e, "space", s) + register_tooltip(e, info.name) ui.spaces_element.appendChild(e) @@ -292,6 +296,7 @@ function on_init() { e.style.height = h - 14 + "px" register_action(e, "sea", s) + register_tooltip(e, data.seas[s].map(x => data.spaces[x].name).join(", ")) ui.spaces_element.appendChild(e) } @@ -299,12 +304,19 @@ function on_init() { for (let g = 0; g < general_count; ++g) { let e = ui.generals[g] = build_piece("marker general small " + data.generals[g].name, 45+2, 45+2) register_action(e, "general", g) + let info = data.generals[g] + let tip = `${info.name} ${info.strategy}-${info.battle}-${info.agility}` + if (info.bonus) + tip += "+2R" + register_tooltip(e, tip) } for (let i = 0; i < 14; ++i) { let [ x, y ] = data.layout.colony[i] ui.a_colony[i] = build_marker("marker small control american", x, y, 45+2, 45+2) ui.b_colony[i] = build_marker("marker small control british", x, y, 45+2, 45+2) + register_tooltip(ui.a_colony[i], data.colony_name[i]) + register_tooltip(ui.b_colony[i], data.colony_name[i]) } ui.congress = build_piece("marker large congress", 55+2, 55+2) @@ -720,29 +732,25 @@ function on_update() { } } - e = document.getElementById("war_ends") if (view.war_ends) - e.className = "year_" + CARDS[view.war_ends].year + ui.war_ends.className = "year_" + CARDS[view.war_ends].year else - e.className = "" + ui.war_ends.className = "" - e = document.getElementById("played_british_reinforcements") if (view.reinforcements[0] > 0) - e.className = "reinforcements ops_" + CARDS[view.reinforcements[0]].count + ui.played_british_reinforcements.className = "reinforcements ops_" + CARDS[view.reinforcements[0]].count else - e.className = "" + ui.played_british_reinforcements.className = "" - e = document.getElementById("played_american_reinforcements_1") if (view.reinforcements[1] > 0) - e.className = "reinforcements ops_" + CARDS[view.reinforcements[1]].count + ui.played_american_reinforcements_1.className = "reinforcements ops_" + CARDS[view.reinforcements[1]].count else - e.className = "" + ui.played_american_reinforcements_1.className = "" - e = document.getElementById("played_american_reinforcements_2") if (view.reinforcements[2] > 0) - e.className = "reinforcements ops_" + CARDS[view.reinforcements[2]].count + ui.played_american_reinforcements_2.className = "reinforcements ops_" + CARDS[view.reinforcements[2]].count else - e.className = "" + ui.played_american_reinforcements_2.className = "" for (let e of action_register) e.classList.toggle("action", is_action(e.my_action, e.my_id)) @@ -780,34 +788,25 @@ function on_update() { } -/* LOG */ - -function sub_space(_match, p1) { - let x = p1 | 0 - let n = data.spaces[x].name - if (n === "Wilmington DE") - n = "Wilmington" - n = n.replaceAll(" ", "\xa0") - let co = data.spaces[x].colony - if (co) - n += "\xa0(" + data.colony_name[data.spaces[x].colony] + ")" - return `${n}` -} +/* TOOLTIPS */ -function sub_general(_match, p1) { - let x = p1 | 0 - let n = data.generals[x].name - return `${n}` +function register_tooltip(elt, focus, blur) { + if (typeof focus === "function") + elt.onmouseenter = focus + else + elt.onmouseenter = () => on_focus(focus) + if (typeof blur === "function") + elt.onmouseleave = blur + else + elt.onmouseleave = on_blur } -function sub_minus(_match, p1) { - return "\u2212" + p1 +function on_focus(text) { + ui.status.textContent = text } -function sub_card(_match, p1) { - let x = p1 | 0 - let n = data.cards[x].title - return `${n}` +function on_blur() { + ui.status.textContent = "" } function on_click_space_tip(s) { @@ -835,29 +834,60 @@ function on_blur_general_tip(s) { } function on_focus_card_tip(c) { - document.getElementById("tooltip").className = "card card_" + c + ui.tooltip.className = "card card_" + c } function on_blur_card_tip() { - document.getElementById("tooltip").classList = "hide" + ui.tooltip.classList = "hide" } function on_focus_last_played() { if (view.last_played) - document.getElementById("tooltip").className = "card card_" + view.last_played + ui.tooltip.className = "card card_" + view.last_played } function on_blur_last_played() { - document.getElementById("tooltip").classList = "hide" + ui.tooltip.classList = "hide" } function on_focus_war_ends() { if (view.war_ends) - document.getElementById("tooltip").className = "card card_" + view.war_ends + ui.tooltip.className = "card card_" + view.war_ends } function on_blur_war_ends() { - document.getElementById("tooltip").classList = "hide" + ui.tooltip.classList = "hide" +} + + +/* LOG */ + +function sub_space(_match, p1) { + let x = p1 | 0 + let n = data.spaces[x].name + if (n === "Wilmington DE") + n = "Wilmington" + n = n.replaceAll(" ", "\xa0") + let co = data.spaces[x].colony + if (co) + n += "\xa0(" + data.colony_name[data.spaces[x].colony] + ")" + return `${n}` +} + +function sub_general(_match, p1) { + let x = p1 | 0 + let n = data.generals[x].name + return `${n}` +} + +function sub_minus(_match, p1) { + return "\u2212" + p1 +} + +function sub_card(_match, p1) { + let x = p1 | 0 + let n = data.cards[x].title + return `${n}` } const ICONS = { -- cgit v1.2.3