diff options
Diffstat (limited to 'play.js')
| -rw-r--r-- | play.js | 197 |
1 files changed, 87 insertions, 110 deletions
@@ -17,7 +17,7 @@ let ui = { cu: [], }; -create_log_entry = function (text) { +function on_log(text) { let p = document.createElement("div"); text = text.replace(/&/g, "&"); text = text.replace(/</g, "<"); @@ -193,21 +193,21 @@ function update_units() { const cuX = 20; const cuY = 10; - update_marker(ui.turn, "Game Turn " + game.year); - if (game.regulars) + update_marker(ui.turn, "Game Turn " + view.year); + if (view.regulars) ui.turn.classList.remove("no-regulars"); else ui.turn.classList.add("no-regulars"); - update_marker(ui.congress, game.congress); + update_marker(ui.congress, view.congress); - update_marker(ui.french_alliance, "French Alliance Track " + game.french_alliance); - if (game.european_war) + update_marker(ui.french_alliance, "French Alliance Track " + view.french_alliance); + if (view.european_war) ui.french_alliance.classList.add("european-war"); else ui.french_alliance.classList.remove("european-war"); - if (game.french_navy == "French Reinforcements") { + if (view.french_navy == "French Reinforcements") { let x = BOXES["French Reinforcements"].x-130/2-10; let y = BOXES["French Reinforcements"].y-32; let w = 126/2; @@ -215,11 +215,11 @@ function update_units() { ui.french_navy.style.left = ((x-w/2)|0) + "px"; ui.french_navy.style.top = ((y-h/2)|0) + "px"; } else { - update_marker(ui.french_navy, game.french_navy); + update_marker(ui.french_navy, view.french_navy); } for (let space in SPACES) { - let space_pc = game.pc[space]; + let space_pc = view.pc[space]; let e = document.getElementById(space+"-pc"); if (e) { if (space_pc === BRITISH) { @@ -238,9 +238,9 @@ function update_units() { for (let c in COLONIES) { let control = 0; for (let space of COLONIES[c]) { - if (game.pc[space] == BRITISH) + if (view.pc[space] == BRITISH) --control; - else if (game.pc[space] == AMERICAN) + else if (view.pc[space] == AMERICAN) ++control; } if (control < 0) @@ -254,7 +254,7 @@ function update_units() { let offset = {}; for (let g in GENERALS) { let e = ui.generals[g]; - let unit = game.generals[g]; + let unit = view.generals[g]; let space = SPACES[unit.location] || BOXES[unit.location]; if (space) { let o = (offset[space.name]|0); @@ -264,7 +264,7 @@ function update_units() { } else { e.classList.add("offmap"); } - if (game.who == g) + if (view.who == g) e.classList.add("selected"); else e.classList.remove("selected"); @@ -273,8 +273,8 @@ function update_units() { // TODO: reuse CU elements offset = {}; clear_group("cu"); - for (let i = 0; i < game.cu.length; ++i) { - let cu = game.cu[i]; + for (let i = 0; i < view.cu.length; ++i) { + let cu = view.cu[i]; let space = SPACES[cu.location] || BOXES[cu.location]; let o = (offset[space.name]|0); let x = space.x + o * cuX; @@ -296,9 +296,9 @@ function player_info(player, nc, nq) { if (nq > 0) info += "\n" + nq + " OPS in queue."; if (player == AMERICAN) { - if (game.pennsylvania_and_new_jersey_line_mutinies) + if (view.pennsylvania_and_new_jersey_line_mutinies) info += "\nPennsylvania and New Jersey Line Mutinies!"; - if (game.congress == CONTINENTAL_CONGRESS_DISPERSED) + if (view.congress == CONTINENTAL_CONGRESS_DISPERSED) info += "\nContinental Congress Dispersed!"; } return info; @@ -307,13 +307,13 @@ function player_info(player, nc, nq) { function on_update() { let e; - document.getElementById("british_info").textContent = player_info(BRITISH, game.b_cards, game.b_queue); - document.getElementById("american_info").textContent = player_info(AMERICAN, game.a_cards, game.a_queue); + document.getElementById("british_info").textContent = player_info(BRITISH, view.b_cards, view.b_queue); + document.getElementById("american_info").textContent = player_info(AMERICAN, view.a_cards, view.a_queue); - if (!game.last_played) + if (!view.last_played) document.getElementById("last_played").className = "card show card_back"; else - document.getElementById("last_played").className = "card show card_" + game.last_played; + document.getElementById("last_played").className = "card show card_" + view.last_played; action_button("pickup_british_cu", "Pick up British CU"); action_button("pickup_american_cu", "Pick up American CU"); @@ -333,30 +333,30 @@ function on_update() { e.classList.remove("year_1781"); e.classList.remove("year_1782"); e.classList.remove("year_1783"); - if (game.war_ends) - e.classList.add("year_" + game.war_ends); + if (view.war_ends) + e.classList.add("year_" + view.war_ends); e = document.getElementById("played_british_reinforcements"); e.classList.remove("ops_1"); e.classList.remove("ops_2"); e.classList.remove("ops_3"); - e.classList.add("ops_" + game.played_british_reinforcements); + e.classList.add("ops_" + view.played_british_reinforcements); e = document.getElementById("played_american_reinforcements_1"); e.classList.remove("ops_1"); e.classList.remove("ops_2"); e.classList.remove("ops_3"); - if (game.played_american_reinforcements.length >= 1) - e.classList.add("ops_" + game.played_american_reinforcements[0]); + if (view.played_american_reinforcements.length >= 1) + e.classList.add("ops_" + view.played_american_reinforcements[0]); e = document.getElementById("played_american_reinforcements_2"); e.classList.remove("ops_1"); e.classList.remove("ops_2"); e.classList.remove("ops_3"); - if (game.played_american_reinforcements.length >= 2) - e.classList.add("ops_" + game.played_american_reinforcements[1]); + if (view.played_american_reinforcements.length >= 2) + e.classList.add("ops_" + view.played_american_reinforcements[1]); - let cards = game.hand; + let cards = view.hand; for (let c = 1; c <= 110; ++c) { ui.cards[c].classList.remove('enabled'); if (cards && cards.includes(c)) @@ -376,11 +376,11 @@ function on_update() { update_units(); - if (player != game.active) + if (player != view.active) return; - for (let action of Object.keys(game.actions)) { - let args = game.actions[action]; + for (let action of Object.keys(view.actions)) { + let args = view.actions[action]; switch (action) { case 'card_play_event': case 'card_discard_event': @@ -419,92 +419,73 @@ function on_update() { } } -let current_popup_card = 0; +function is_action(action, card) { + return view.actions && view.actions[action] && view.actions[action].includes(card) +} -function show_popup_menu(evt, list) { - document.querySelectorAll("#popup div").forEach(e => e.classList.remove('enabled')); - for (let item of list) { - let e = document.getElementById("menu_" + item); - e.classList.add('enabled'); +function show_popup_menu(evt, menu_id, target_id, title) { + let menu = document.getElementById(menu_id) + + let show = false + for (let item of menu.querySelectorAll("li")) { + let action = item.dataset.action + if (action) { + if (is_action(action, target_id)) { + show = true + item.classList.add("action") + item.classList.remove("disabled") + item.onclick = function () { + send_action(action, target_id) + hide_popup_menu() + evt.stopPropagation() + } + } else { + item.classList.remove("action") + item.classList.add("disabled") + item.onclick = null + } + } } - let popup = document.getElementById("popup"); - popup.style.display = 'block'; - popup.style.left = (evt.clientX-50) + "px"; - popup.style.top = (evt.clientY-12) + "px"; - ui.cards[current_popup_card].classList.add("selected"); -} -function hide_popup_menu() { - let popup = document.getElementById("popup"); - popup.style.display = 'none'; - if (current_popup_card) { - ui.cards[current_popup_card].classList.remove("selected"); - current_popup_card = 0; + if (show) { + menu.onmouseleave = hide_popup_menu + menu.style.display = "block" + if (title) { + let item = menu.querySelector("li.title") + if (item) { + item.onclick = hide_popup_menu + item.textContent = title + } + } + + let w = menu.clientWidth + let h = menu.clientHeight + let x = Math.max(5, Math.min(evt.clientX - w / 2, window.innerWidth - w - 5)) + let y = Math.max(5, Math.min(evt.clientY - 12, window.innerHeight - h - 40)) + menu.style.left = x + "px" + menu.style.top = y + "px" + + return true } -} -function on_card_play_event() { - send_action('card_play_event', current_popup_card); - hide_popup_menu(); -} -function on_card_discard_event() { - send_action('card_discard_event', current_popup_card); - hide_popup_menu(); + return false } -function on_card_campaign() { - send_action('card_campaign', current_popup_card); - hide_popup_menu(); -} -function on_card_ops_general() { - send_action('card_ops_general', current_popup_card); - hide_popup_menu(); -} -function on_card_ops_pc() { - send_action('card_ops_pc', current_popup_card); - hide_popup_menu(); -} -function on_card_ops_reinforcements() { - send_action('card_ops_reinforcements', current_popup_card); - hide_popup_menu(); -} -function on_card_ops_queue() { - send_action('card_ops_queue', current_popup_card); - hide_popup_menu(); -} -function on_card_ops_queue() { - send_action('card_ops_queue', current_popup_card); - hide_popup_menu(); -} -function on_card_battle_play() { - send_action('card_battle_play', current_popup_card); - hide_popup_menu(); -} -function on_card_battle_discard() { - send_action('card_battle_discard', current_popup_card); - hide_popup_menu(); -} -function on_exchange_for_discard() { - send_action('exchange_for_discard', current_popup_card); - hide_popup_menu(); + +function hide_popup_menu() { + document.getElementById("popup").style.display = "none" } function on_card(evt) { - if (game.actions) { + if (view.actions) { let c = evt.target.id.split("+")[1] | 0; - let menu = []; - for (let action in game.actions) - if (Array.isArray(game.actions[action]) && game.actions[action].includes(c)) - menu.push(action); - if (menu.length > 0) { - current_popup_card = c; - show_popup_menu(evt, menu); - } + show_popup_menu(evt, "popup", c, CARDS[c].title) + evt.stopPropagation() } } function get_action_from_arg(x) { - for (let action of Object.keys(game.actions)) { - let args = game.actions[action]; + for (let action of Object.keys(view.actions)) { + let args = view.actions[action]; if (Array.isArray(args) && args.includes(x)) return action; } @@ -512,7 +493,7 @@ function get_action_from_arg(x) { } function on_space(evt) { - if (game.actions) { + if (view.actions) { let space = evt.target.id; let action = get_action_from_arg(space); if (action) @@ -521,7 +502,7 @@ function on_space(evt) { } function on_general(evt) { - if (game.actions) { + if (view.actions) { let general = evt.target.id; let action = get_action_from_arg(general); if (action) @@ -533,7 +514,3 @@ function toggle_markers() { document.querySelector("#map").classList.toggle("hide_markers"); } -scroll_with_middle_mouse("main", 2); -init_map_zoom(); -init_shift_zoom(); -init_client(["American", "British"]); |