From 4d69d2fc3578791bcc23c0760eb69f54dcacd417 Mon Sep 17 00:00:00 2001 From: iainp5 Date: Sun, 14 Jul 2024 14:35:37 +0100 Subject: Update play.js --- play.js | 89 +++++++++++------------------------------------------------------ 1 file changed, 14 insertions(+), 75 deletions(-) diff --git a/play.js b/play.js index 7ecdbd2..db60e1b 100644 --- a/play.js +++ b/play.js @@ -21,23 +21,17 @@ const countries= [ "Bulgaria" ] - const overlay = document.getElementById('overlay'); const spaceNameElement = document.getElementById('space-name'); const spaceCharacteristicsElement = document.getElementById('space-characteristics'); - -// Event listener to track mouse movement over the map - document.querySelector('.map').addEventListener('mousemove', function(event) { - const x = event.offsetX; // X-coordinate of mouse relative to container - const y = event.offsetY; // Y-coordinate of mouse relative to container +document.querySelector('.map').addEventListener('mousemove', function(event) { + const x = event.offsetX; // X-coordinate of mouse relative to container + const y = event.offsetY; // Y-coordinate of mouse relative to container spaceCharacteristicsElement.innerText = `X: ${x}, Y: ${y}`; - }) - - - // Create map areas dynamically based on coordinates +}) - function create_ui() { +function create_ui() { // CREATE MAP @@ -54,15 +48,7 @@ const spaceCharacteristicsElement = document.getElementById('space-characteristi spaceArea.style.zIndex = 2; spaceArea.my_space = space.name_unique; spaceArea.addEventListener('mousedown', on_click_space); - //spaceArea.addEventListener('click', finishSupportCheck) - - /*if (space.demInfl > 0 && space.demInfl - space.comInfl >= space.stability) { - const img = document.createElement('img') - img.classList.add('demInfl', space.country) - img.id=space.name - img.src = `images/US_${space.demInfl}.gif` - spaceArea.appendChild(img) - } else if (space.demInfl > 0) {*/ + const dem_img = document.createElement('div') dem_img.classList.add('demInfl', space.country) dem_img.style.display = 'none' @@ -81,15 +67,7 @@ const spaceCharacteristicsElement = document.getElementById('space-characteristi demInflValue.my_space = space.name_unique; demInflValue.addEventListener('mousedown', on_click_space); spaceArea.appendChild(demInflValue) - //} - - /*} else if (space.comInfl > 0 && space.comInfl - space.demInfl >= space.stability) { - const img = document.createElement('img') - img.className='comInfl' - img.id=space.name - img.src = `images/SV_${space.comInfl}.gif` - spaceArea.appendChild(img) - } else if (space.comInfl > 0) {*/ + const com_img = document.createElement('div') com_img.className='comInfl' com_img.style.display='none' @@ -108,7 +86,6 @@ const spaceCharacteristicsElement = document.getElementById('space-characteristi comInflValue.my_space = space.name_unique; comInflValue.addEventListener('mousedown', on_click_space); spaceArea.appendChild(comInflValue) - //} mapContainer.appendChild(spaceArea); } @@ -126,7 +103,7 @@ const spaceCharacteristicsElement = document.getElementById('space-characteristi hand_card.addEventListener('mousedown', on_click_card); ui.cards.push(hand_card); } - //for (let card of power_cards) + for (let card of power_cards) { if (!card) continue; const power_card = document.createElement('img'); @@ -143,34 +120,26 @@ const spaceCharacteristicsElement = document.getElementById('space-characteristi function on_click_space(evt) { if (evt.button === 0) { const space = evt.target.my_space; - //console.log('on_click_space_called with space:', space); if (send_action('infl', space)) { evt.stopPropagation(); } else if (send_action('sc', space)) { - //console.log('send_action with sc:', space); evt.stopPropagation(); } else { - // console.log('send_action failed for space:', space); } } //hide_popup_menu(); } function on_click_card(evt) { - //console.log('on_click_card') if (evt.button === 0) { const card = evt.target.my_card; - // console.log('on_click_card_called with card:', card); if (send_action('card', card)) { evt.stopPropagation(); - } else { - // console.log('send_action failed for card:', card); - } + } } } function is_action(action) { - //console.log('is_action called with: ', action) if (view.actions && view.actions[action]) return true return false @@ -234,10 +203,6 @@ let ui = { } function on_update() { - //console.log('on_update called') - //console.log('view.valid_spaces: ', view.valid_spaces) -// console.log('view.actions: ', view.actions) - //console.log('view.power_cards:', view.power_cards) document.querySelectorAll('[id^="space_"].selected').forEach(spaceElement => {spaceElement.classList.remove('selected');}); document.getElementById("power_hand")?.querySelectorAll('.selected').forEach(cardElement => {cardElement.classList.remove('selected');}); view.valid_spaces.forEach(space_id => { @@ -320,13 +285,8 @@ function on_update() { if (view.hand.length && view.is_pwr_struggle === false) { document.getElementById("hand_panel").classList.remove("hide") for (let c of view.hand) { - //const cardElement = ui.cards[c]; - //if (cardElement) { document.getElementById("hand").appendChild(ui.cards[c]); - /*} else { - console.error(`Card with key ${c} not found in ui.cards`); - }*/ - } + } } else { document.getElementById("hand_panel").classList.add("hide") } @@ -345,8 +305,6 @@ function on_update() { if (view.is_pwr_struggle) { document.getElementById("power_panel").classList.remove("hide") - //console.log('ui.power_cards: ', ui.power_cards) - //console.log('ui.cards: ', ui.cards) const power_hand = document.getElementById("power_hand"); @@ -354,56 +312,37 @@ const power_hand = document.getElementById("power_hand"); if (!power_hand) { console.error("Element with id 'power_hand' not found."); } else { - //console.log('view.power_hand: ', view.power_hand) - //console.log('view.hand:', view.hand) - //console.log('view.valid_cards: ', view.valid_cards) for (let card_number of view.power_hand) { - const power_card = ui.power_cards.find(card => card.my_card === card_number); - if (power_card instanceof Node) { - //console.log(`Checking card number: ${card_number}`) - //console.log(`Is card number ${card_number} valid? ${view.valid_cards.includes(card_number)}`); + const power_card = ui.power_cards.find(card => card.my_card === card_number); + if (power_card instanceof Node) { const cardInfo = power_cards.find(card => card.number === card_number); - - if (cardInfo) { - //console.log(`Card info for number ${card_number}:`, cardInfo); - // console.log(`Socio value for card ${card_number}: ${cardInfo.socio}`); - } if (view.valid_cards.includes(card_number)) { power_card.classList.add('selected'); } power_hand.appendChild(power_card); - } else { - // console.error(`ui.power_cards[${index-1}] is not a valid DOM node.`); - } + } } } } else { - //console.log('document.getElementById("power_panel"): ', document.getElementById("power_panel")) + document.getElementById("power_panel").classList.add("hide") } // UPDATE BOARD MARKERS ui.turn.className = `t${view.turn}` - //console.log('view.round_player: ', view.round_player) if (view.round_player === 'Democrat') { - //console.log('in democrat') ui.round.className = `dem-action-round-tracker r${view.round}` } else { - //console.log('in communist') ui.round.className = `com-action-round-tracker r${view.round}` } ui.stability.className = `s${view.stability}` ui.dem_TST.className = `tst${view.dem_tst}` - //console.log('view.com_tst: ', view.com_tst) ui.com_TST.className = `tst${view.com_tst}` ui.vp.className = `vp${view.vp}` console.log('strategy discard: ', view.strategy_discard) console.log('valid spaces: ', view.valid_spaces) -//console.log('view.pieces: ', view.pieces) - - action_button("strike", "Strike") action_button("march", "March") action_button("rally", "Rally in the Square") -- cgit v1.2.3