MediaWiki:Test/Revamp.js

Замечание: Возможно, после публикации вам придётся очистить кэш своего браузера, чтобы увидеть изменения.

Firefox / Safari: Удерживая клавишу Shift, нажмите на панели инструментов Обновить либо нажмите Ctrl+F5 или Ctrl+R (⌘+R на Mac)
Google Chrome: Нажмите Ctrl+Shift+R (⌘+Shift+R на Mac)
Internet Explorer / Edge: Удерживая Ctrl, нажмите Обновить либо нажмите Ctrl+F5
Opera: Нажмите Ctrl+F5.

document.addEventListener('DOMContentLoaded', () => {

   // Конфигурация патронов
   const ammoConfig = {
       ammo1: { damage: 15, selector: '.AmmoTest1' },
       ammo2: { damage: 20, selector: '.AmmoTest2' }
   };

   // Инициализация системы боеприпасов
   class AmmoSystem {
       constructor() {
           this.totalDamage = 0;
           this.ammoElements = {};
           this.initAmmo();
           this.initDamageDisplay();
       }

       initAmmo() {
           Object.entries(ammoConfig).forEach(([key, config]) => {
               const element = document.querySelector(config.selector);
               if (element) {
                   element.dataset.damage = config.damage;
                   element.addEventListener('click', () => this.toggleAmmo(element));
                   this.ammoElements[key] = element;
               }
           });
       }

       initDamageDisplay() {
           this.damageDisplay = document.createElement('div');
           this.damageDisplay.className = 'damage-display';
           document.querySelector('.WeaponSummary').appendChild(this.damageDisplay);
           this.updateDisplay();
       }

       toggleAmmo(element) {
           element.classList.toggle('active');
           this.calculateDamage();
           this.animateDamage(element);
       }

       calculateDamage() {
           this.totalDamage = Object.values(this.ammoElements)
               .filter(ammo => ammo.classList.contains('active'))
               .reduce((sum, ammo) => sum + parseInt(ammo.dataset.damage), 0);
       }

       updateDisplay() {
           this.damageDisplay.textContent = `Суммарный урон: ${this.totalDamage}`;
           this.damageDisplay.classList.toggle('updated', false);
           void this.damageDisplay.offsetWidth; // Trigger reflow
           this.damageDisplay.classList.toggle('updated', true);
       }

       animateDamage(element) {
           element.style.transform = 'scale(1.1)';
           setTimeout(() => {
               element.style.transform = 'scale(1)';
               this.updateDisplay();
           }, 150);
       }
   }

   // Запуск системы
   new AmmoSystem();

});