@carmaclouds/core 2.3.1

package/src/modules/companions-manager.js

@@ -0,0 +1,178 @@
+/**
+ * Companions Manager Module
+ *
+ * Handles companion/familiar display and interaction.
+ * - Displays companion stats, abilities, and actions
+ * - Provides attack and damage roll buttons for companion actions
+ *
+ * Loaded as a plain script (no ES6 modules) to export to window.
+ */
+
+(function() {
+  'use strict';
+
+  /**
+   * Build and display companions list
+   * @param {Array} companions - Array of companion objects
+   */
+  function buildCompanionsDisplay(companions) {
+    const container = document.getElementById('companions-container');
+    const section = document.getElementById('companions-section');
+
+    // Show the companions section
+    section.style.display = 'block';
+
+    container.innerHTML = '';
+
+    companions.forEach(companion => {
+      debug.log('🔍 DEBUG: Companion object in popup:', companion);
+      debug.log('🔍 DEBUG: Companion abilities:', companion.abilities);
+      debug.log('🔍 DEBUG: Companion abilities keys:', Object.keys(companion.abilities));
+
+      const companionCard = document.createElement('div');
+      companionCard.className = 'action-card';
+      companionCard.style.background = 'var(--bg-card)';
+      companionCard.style.borderColor = 'var(--border-card)';
+
+      // Header with name and basic info
+      const header = document.createElement('div');
+      header.className = 'action-header';
+      header.style.cursor = 'pointer';
+
+      const nameDiv = document.createElement('div');
+      nameDiv.innerHTML = `
+        <div class="action-name">🐾 ${companion.name}</div>
+        <div style="font-size: 0.85em; color: var(--text-secondary); font-style: italic;">
+          ${companion.size} ${companion.type}${companion.alignment ? ', ' + companion.alignment : ''}
+        </div>
+      `;
+
+      header.appendChild(nameDiv);
+      companionCard.appendChild(header);
+
+      // Stats block
+      const statsDiv = document.createElement('div');
+      statsDiv.className = 'action-description expanded';
+      statsDiv.style.display = 'block';
+      statsDiv.style.background = 'var(--bg-secondary)';
+      statsDiv.style.padding = '12px';
+      statsDiv.style.borderRadius = '4px';
+      statsDiv.style.marginTop = '10px';
+
+      let statsHTML = '<div style="display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 10px;">';
+
+      // AC, HP, Speed
+      if (companion.ac) statsHTML += `<div><strong>AC:</strong> ${companion.ac}</div>`;
+      if (companion.hp) statsHTML += `<div><strong>HP:</strong> ${companion.hp}</div>`;
+      if (companion.speed) statsHTML += `<div style="grid-column: span 3;"><strong>Speed:</strong> ${companion.speed}</div>`;
+
+      statsHTML += '</div>';
+
+      // Abilities
+      if (Object.keys(companion.abilities).length > 0) {
+        statsHTML += '<div style="display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; text-align: center; margin: 10px 0; padding: 8px; background: var(--bg-tertiary); border-radius: 4px;">';
+        ['str', 'dex', 'con', 'int', 'wis', 'cha'].forEach(ability => {
+          if (companion.abilities[ability]) {
+            const abil = companion.abilities[ability];
+            statsHTML += `
+              <div>
+                <div style="font-weight: bold; font-size: 0.75em; color: var(--text-secondary);">${ability.toUpperCase()}</div>
+                <div style="font-size: 1.1em; color: var(--text-primary);">${abil.score}</div>
+                <div style="font-size: 0.9em; color: var(--accent-success);">(${abil.modifier >= 0 ? '+' : ''}${abil.modifier})</div>
+              </div>
+            `;
+          }
+        });
+        statsHTML += '</div>';
+      }
+
+      // Senses, Languages, PB
+      if (companion.senses) statsHTML += `<div style="margin: 5px 0; color: var(--text-primary);"><strong>Senses:</strong> ${companion.senses}</div>`;
+      if (companion.languages) statsHTML += `<div style="margin: 5px 0; color: var(--text-primary);"><strong>Languages:</strong> ${companion.languages}</div>`;
+      if (companion.proficiencyBonus) statsHTML += `<div style="margin: 5px 0; color: var(--text-primary);"><strong>Proficiency Bonus:</strong> +${companion.proficiencyBonus}</div>`;
+
+      // Features
+      if (companion.features && companion.features.length > 0) {
+        statsHTML += '<div style="margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border-color);">';
+        companion.features.forEach(feature => {
+          statsHTML += `<div style="margin: 8px 0; color: var(--text-primary);"><strong>${feature.name}.</strong> ${feature.description}</div>`;
+        });
+        statsHTML += '</div>';
+      }
+
+      // Actions with attack buttons
+      if (companion.actions && companion.actions.length > 0) {
+        statsHTML += '<div style="margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border-color); color: var(--text-primary);"><strong>Actions</strong></div>';
+        companion.actions.forEach(action => {
+          statsHTML += `
+            <div style="margin: 10px 0; padding: 8px; background: var(--bg-action); border: 1px solid var(--accent-danger); border-radius: 4px;">
+              <div style="display: flex; justify-content: space-between; align-items: center;">
+                <div style="color: var(--text-primary);">
+                  <strong>${action.name}.</strong> Melee Weapon Attack: +${action.attackBonus} to hit, ${action.reach}. <em>Hit:</em> ${action.damage}
+                </div>
+                <div style="display: flex; gap: 8px;">
+                  <button class="attack-btn companion-attack-btn" data-name="${companion.name} - ${action.name}" data-bonus="${action.attackBonus}">⚔️ Attack</button>
+                  <button class="damage-btn companion-damage-btn" data-name="${companion.name} - ${action.name}" data-damage="${action.damage}">💥 Damage</button>
+                </div>
+              </div>
+            </div>
+          `;
+        });
+      }
+
+      statsDiv.innerHTML = statsHTML;
+      companionCard.appendChild(statsDiv);
+
+      // Add event listeners for attack/damage buttons
+      companionCard.querySelectorAll('.companion-attack-btn').forEach(btn => {
+        btn.addEventListener('click', (e) => {
+          e.stopPropagation();
+          const name = btn.dataset.name;
+          const bonus = parseInt(btn.dataset.bonus);
+
+          // Announce companion attack
+          const announcement = `&{template:default} {{name=${getColoredBanner(characterData)}${characterData.name}'s ${name} attacks!}} {{Type=Companion Attack}}`;
+          const messageData = {
+            action: 'announceSpell',
+            message: announcement,
+            color: characterData.notificationColor
+          };
+
+          sendToRoll20(messageData);
+
+          roll(`${name} - Attack`, `1d20+${bonus}`);
+        });
+      });
+
+      companionCard.querySelectorAll('.companion-damage-btn').forEach(btn => {
+        btn.addEventListener('click', (e) => {
+          e.stopPropagation();
+          const name = btn.dataset.name;
+          const damage = btn.dataset.damage;
+
+          // Announce companion damage
+          const announcement = `&{template:default} {{name=${getColoredBanner(characterData)}${characterData.name}'s ${name} deals damage!}} {{Type=Companion Damage}}`;
+          const messageData = {
+            action: 'announceSpell',
+            message: announcement,
+            color: characterData.notificationColor
+          };
+
+          sendToRoll20(messageData);
+
+          roll(`${name} - Damage`, damage);
+        });
+      });
+
+      container.appendChild(companionCard);
+    });
+  }
+
+  // Export function to globalThis
+  Object.assign(globalThis, {
+    buildCompanionsDisplay
+  });
+
+  console.log('✅ Companions Manager module loaded');
+
+})();

package/src/modules/concentration-tracker.js

@@ -0,0 +1,178 @@
+/**
+ * Concentration Tracker Module
+ *
+ * Manages spell concentration mechanics:
+ * - Tracks which spell the character is concentrating on
+ * - Displays concentration indicator UI
+ * - Handles dropping concentration
+ * - Auto-hides for non-spellcasters
+ *
+ * Concentration is a core D&D 5e mechanic where certain spells require
+ * ongoing focus to maintain their effects. Only one concentration spell
+ * can be active at a time.
+ *
+ * Loaded as a plain script (no ES6 modules) to export to globalThis.
+ *
+ * Functions exported to globalThis:
+ * - updateConcentrationDisplay()
+ * - initConcentrationTracker()
+ * - setConcentration(spellName)
+ * - dropConcentration()
+ *
+ * State exported to globalThis:
+ * - concentratingSpell (via getter/setter)
+ */
+
+(function() {
+  'use strict';
+
+  // Track concentration state
+  let concentratingSpell = null;
+
+  /**
+   * Update the concentration indicator UI
+   * Shows/hides the concentration banner based on current state
+   * Auto-hides for characters without spell slots (e.g., rogues, fighters)
+   */
+  function updateConcentrationDisplay() {
+    const concentrationIndicator = document.getElementById('concentration-indicator');
+    const concentrationSpell = document.getElementById('concentration-spell');
+
+    if (!concentrationIndicator || !concentrationSpell) return;
+
+    // Hide concentration row if character has no spell slots (e.g., rogues)
+    if (characterData && characterData.spellSlots) {
+      const spellSlots = characterData.spellSlots;
+      let hasSpellSlots = false;
+
+      // Check for regular spell slots (levels 1-9)
+      for (let level = 1; level <= 9; level++) {
+        if ((spellSlots[`level${level}SpellSlotsMax`] || 0) > 0) {
+          hasSpellSlots = true;
+          break;
+        }
+      }
+
+      // Also check for pact magic (warlocks)
+      if ((spellSlots.pactMagicSlotsMax || 0) > 0) {
+        hasSpellSlots = true;
+      }
+
+      // If no spell slots, hide the concentration tracker entirely
+      if (!hasSpellSlots) {
+        concentrationIndicator.style.display = 'none';
+        return;
+      }
+    }
+
+    // Show/hide based on concentration state
+    if (concentratingSpell) {
+      concentrationIndicator.style.display = 'flex';
+      if (concentrationSpell) {
+        concentrationSpell.textContent = concentratingSpell;
+      }
+    } else {
+      concentrationIndicator.style.display = 'none';
+    }
+  }
+
+  /**
+   * Initialize concentration tracker button
+   * Sets up click handler for the "Drop Concentration" button
+   */
+  function initConcentrationTracker() {
+    const dropConcentrationBtn = document.getElementById('drop-concentration-btn');
+
+    if (dropConcentrationBtn) {
+      dropConcentrationBtn.addEventListener('click', () => {
+        dropConcentration();
+      });
+    }
+
+    debug.log('✅ Concentration tracker initialized');
+  }
+
+  /**
+   * Set concentration on a spell
+   * Automatically drops concentration on any previous spell
+   * @param {string} spellName - Name of the spell to concentrate on
+   */
+  function setConcentration(spellName) {
+    debug.log(`🧠 setConcentration called with: "${spellName}"`);
+    debug.log(`🧠 Current concentration: "${concentratingSpell}"`);
+    
+    // Track if this is a replacement
+    const isReplacement = concentratingSpell && concentratingSpell !== spellName;
+    
+    // If already concentrating on a different spell, notify that it's being dropped
+    if (isReplacement) {
+      const previousSpell = concentratingSpell;
+      showNotification(`⚠️ Dropped concentration on ${previousSpell} to concentrate on ${spellName}`);
+      debug.log(`🔄 Replacing concentration: ${previousSpell} → ${spellName}`);
+    }
+
+    concentratingSpell = spellName;
+    debug.log(`🧠 Updated concentratingSpell variable to: "${concentratingSpell}"`);
+    
+    if (characterData) {
+      characterData.concentrationSpell = spellName;
+      debug.log(`🧠 Updated characterData.concentrationSpell to: "${spellName}"`);
+      saveCharacterData();
+    }
+    
+    updateConcentrationDisplay();
+    debug.log(`🧠 Called updateConcentrationDisplay()`);
+
+    // Update status bar if available
+    if (typeof sendStatusUpdate === 'function') {
+      sendStatusUpdate();
+    }
+
+    // Only show "Concentrating on" notification if this is a new concentration (not replacement)
+    if (!isReplacement) {
+      showNotification(`🧠 Concentrating on: ${spellName}`);
+    }
+    debug.log(`🧠 Concentration set complete: ${spellName}`);
+  }
+
+  /**
+   * Drop concentration on the current spell
+   */
+  function dropConcentration() {
+    if (!concentratingSpell) return;
+
+    const spellName = concentratingSpell;
+    concentratingSpell = null;
+    if (characterData) {
+      characterData.concentrationSpell = null;
+      saveCharacterData();
+    }
+    updateConcentrationDisplay();
+
+    // Update status bar if available
+    if (typeof sendStatusUpdate === 'function') {
+      sendStatusUpdate();
+    }
+
+    showNotification(`✅ Dropped concentration on ${spellName}`);
+    debug.log(`🗑️ Concentration dropped: ${spellName}`);
+  }
+
+  // ===== EXPORTS =====
+
+  // Export concentratingSpell state variable to window (for access from content script context)
+  Object.defineProperty(window, 'concentratingSpell', {
+    get: () => concentratingSpell,
+    set: (value) => { concentratingSpell = value; },
+    configurable: true
+  });
+
+  // Export functions to window
+  window.updateConcentrationDisplay = updateConcentrationDisplay;
+  window.initConcentrationTracker = initConcentrationTracker;
+  window.setConcentration = setConcentration;
+  window.dropConcentration = dropConcentration;
+
+  debug.log('✅ Concentration Tracker module loaded');
+
+})();