Widget:技能

<script> function skillMain() {

   const unittype = ;
   let stables = document.getElementsByClassName('skill-table');
   let lvctrls = document.getElementsByClassName('lv-control');
   let lvcds = document.getElementsByClassName('skill-lvcd');
   for (let i = lvctrls.length; i--;) {
       let input = document.createElement('input');
       input.type = 'range';
       input.max = unittype ==  ? (lvctrls.length - i < 3 ? 5 : 10) : 10;
       input.min = 1;
       let stable = stables[i];
       let container = lvctrls[i];
       let lvcd = lvcds[i];
       if (stable.dataset.val) {
           input.valLists = [stable.dataset.val.split(';').map(x => x.split(','))];
           input.slots = [stable.querySelectorAll('tr:nth-child(4) .skill')];
       } else {
           input.slots = stable.getElementsByTagName('p');
           input.currentLv = 9;
       }
       let lvcdspans = [...lvcd.getElementsByTagName('span')];
       if (unittype == 'squad') {
         const label = document.createElement('label');
         input.id = label.htmlFor = `skill${i+1}-lv`;
         lvcd.replaceChild(label, lvcdspans[0]);
         lvcdspans[0] = label;
         container = lvcd;
       }
       input.targetLv = lvcdspans[0];
       if (lvcdspans.length > 1) {
         input.targetCd = lvcdspans[lvcdspans.length-1];
         if (lvcdspans.length == 3) {
           input.cdLists = stable.dataset.cd.split(',').map(x => +((x/30).toFixed(1)));
           input.startCds = [~~(stable.dataset.cdStart/30)];
           lvcdspans[1].textContent = input.startCds;
           input.targetStart = lvcdspans[1];
         } else if (unittype == 'squad') {
           input.cdLists = stable.dataset.cd.split(',').map(x => +((x/30).toFixed(1)));
         } else input.cdLists = stable.dataset.cd.split(',');
         if (input.cdLists.length == 1) {
           input.cdLists = Array(+input.max).fill(input.cdLists[0]);
         }
         input.cdLists = [input.cdLists];
       } else input.nocd = true;
       input.isRes = 0;
       container.appendChild(input);
       input.addEventListener('input', e => { updateVals(e.target); });
       input.value = input.max;
       updateVals(input);
       if (stable.id == 'skill1' && unittype == ) {
           input.cdLists.push(stable.dataset.cdRes.split(',').map(x => +((x/30).toFixed(1))));
           input.valLists.push(stable.dataset.res.split(';').map(x => x.split(',')));
           input.slots.push(stable.querySelectorAll('tr:nth-child(5) .skill'));
           input.startCds?.push?.(~~(stable.dataset.resStart/30));

           let label = document.createElement('label');
           label.textContent = '满解析';
           let toggle = document.createElement('input');
           toggle.type = 'checkbox';
           toggle.targetInput = input;
           label.appendChild(toggle);
           stable.querySelector('.skill-signature td:last-child').appendChild(label);
           toggle.addEventListener('click', e => {
               let target = e.target.targetInput;
               if (e.target.checked) target.isRes = 1;
               else target.isRes = 0;
               let tbody = target.parentElement.parentElement.parentElement;
               tbody.children[3+target.isRes].className = "";
               tbody.children[4-target.isRes].className = 'desc-hidden';
               if (target.targetStart) target.targetStart.textContent = target.startCds[target.isRes];
               updateVals(target);
           });
           toggle.click();
       }
   }

}

function updateVals(handler) {

   let lv = handler.value - 1;
   if (handler.valLists) {
       let slots = handler.slots[handler.isRes];
       let vallist = handler.valLists[handler.isRes];
       for (let i = vallist.length; i--;) slots[i].textContent = vallist[i][lv];
   } else {
       handler.slots[handler.currentLv].className = "";
       handler.currentLv = lv;
       handler.slots[lv].className = 'desc-shown';
   }
   handler.targetLv.textContent = '等级' + handler.value;
   if (!handler.nocd) handler.targetCd.textContent = handler.cdLists[handler.isRes][lv];

}

window.onload = () => { attrMain(); skillMain(); } </script>