MCBBS Wiki欢迎您共同参与编辑!在参与编辑之前请先阅读Wiki方针

如果在编辑的过程中遇到了什么问题,可以去讨论板提问。

为了您能够无阻碍地参与编辑 未验证/绑定过邮箱的用户,请尽快绑定/验证

MCBBS Wiki GitHub群组已上线!

您可以在回声洞中发表吐槽!

服务器状态监控。点击进入

本站由MCBBS用户自行搭建,与MCBBS及东银河系漫游指南(北京)科技有限公司没有从属关系。点此了解 MCBBS Wiki 不是什么>>

微件:SaltVoteContainer:修订间差异

来自MCBBS Wiki
跳到导航 跳到搜索
(一些问题修复 // 维基盐编辑器)
(编辑“微件:SaltVoteContainer” // 维基盐编辑器)
第48行: 第48行:
   /** 主流程 */
   /** 主流程 */
   /** @type {(el: HTMLDivElement) => void} */
   /** @type {(el: HTMLDivElement) => void} */
   const main = (el) => {
   const process = (el) => {
     console.log(el);
     el.classList.remove("not-init");
     const barEl = el.querySelector(".salt-vote-bar");
     const barEl = el.querySelector(".salt-vote-bar");
     const colorEl = el.querySelector(".salt-vote-color");
     const colorEl = el.querySelector(".salt-vote-color");
     const list = el.querySelector("ul");
     const list = el.querySelector(".salt-vote-options");
     const lists = list && list.querySelectorAll("li");
     const lists = list && list.querySelectorAll("li");
     /** 收集的投票信息 @type {{name: string, set: string[]}[]} */
    const descUl = el.querySelector(".salt-vote-describe");
    const descLi = descUl && descUl.querySelectorAll("li");
     /** 收集的投票信息 @type {{name: string, set: string[], li: HTMLElement, desc?: HTMLElement}[]} */
     const collect = [];
     const collect = [];
    /** 收集的投票信息 @type {{name: string, desc: HTMLElement}[]} */
    const descCollect = [];
     /** 有问题的投票信息 @type {Record<string, Set<string>>} */
     /** 有问题的投票信息 @type {Record<string, Set<string>>} */
     const wrongCollect = {};
     const wrongCollect = {};
第73行: 第77行:
       else color.push(...defaultColor);
       else color.push(...defaultColor);
     }
     }
    // 获取投票选项描述
    const descList = Array.from(descLi || []);
    descList.forEach((desc) => {
      const option = desc.querySelector(".salt-vote-desc-option");
      const value = desc.querySelector(".salt-vote-desc");
      if (!option || !value) return;
      const title = option.textContent || "";
      const thisCollect = { name: title, desc: value };
      descCollect.push(thisCollect);
      desc.style.setProperty("--height", "0");
    });
     // 获取投票信息
     // 获取投票信息
     const liList = Array.from(lists);
     const liList = Array.from(lists);
     liList.forEach((li, liIndex) => {
     liList.forEach((li, liIndex) => {
      // salt-vote-option salt-vote-voter
       const option = li.querySelector(".salt-vote-option");
       const option = li.querySelector(".salt-vote-option");
      /** @type {HTMLElement | null} */
       const voter = li.querySelector(".salt-vote-voter");
       const voter = li.querySelector(".salt-vote-voter");
       if (!option || !voter) return;
       if (!option || !voter) return;
第84行: 第97行:
       const voters = Array.from(voter.querySelectorAll("a"));
       const voters = Array.from(voter.querySelectorAll("a"));
       // if (title in collect) return;
       // if (title in collect) return;
       const thisCollect = { name: title, set: [] };
       const thisCollect = { name: title, set: [], li: li };
       voters.forEach((v) => {
       voters.forEach((v) => {
         const res = v.title
         const res = v.title
           .replace(/^(?:User|U|用户):/i, "")
           .replace(/^(?:User|U|用户):/i, "")
           .replace(/\s/, "_");
           .replace(/\s/g, "_");
         if (thisCollect.set.includes(res)) {
         if (thisCollect.set.includes(res)) {
           v.remove();
           v.remove();
第94行: 第107行:
         }
         }
         thisCollect.set.push(res);
         thisCollect.set.push(res);
         v.textContent = res;
         // 允许自定义用户名样式
        if (
          !v.textContent ||
          v.textContent.toUpperCase().trim().replace(/\s/g, "_") !==
            res.toUpperCase()
        )
          v.textContent = res;
       });
       });
       collect.push(thisCollect);
       collect.push(thisCollect);
       // 配色
       // 配色
       li.style.setProperty("--vote-color", at(color, liIndex));
       li.style.setProperty("--vote-color", at(color, liIndex));
      // 点击展开选项描述
      const desc = descCollect.find(({ name }) => name === title);
      if (desc) {
        const descEl = desc.desc;
        thisCollect.desc = descEl;
        li.classList.add("has-desc");
        descEl.classList.add("salt-vote-option-hooked");
        descEl.style.setProperty("--height", `${descEl.scrollHeight}px`);
        descEl.style.setProperty("--vote-color", at(color, liIndex));
        li.addEventListener("click", () => {
          if (descEl.classList.contains("show")) {
            descEl.classList.remove("show");
          } else {
            descEl.classList.add("show");
            descEl.style.setProperty("--height", `${descEl.scrollHeight}px`);
          }
        });
        li.appendChild(descEl);
      }
     });
     });
     // 绘制图形
     // 绘制图形
第104行: 第142行:
       barEl.innerHTML = renderBar(collect, color);
       barEl.innerHTML = renderBar(collect, color);
     }
     }
    console.log(collect, renderBar(collect, color));
    el.classList.remove("not-init");
   };
   };
  const main = () => getAllNotInitContainer().forEach((el) => process(el));
   setTimeout(() => {
   setTimeout(() => {
     getAllNotInitContainer().forEach((el) => main(el));
     main();
   }, 0);
   }, 0);
  setTimeout(() => {
    main();
  }, 66);
   setInterval(() => {
   setInterval(() => {
     getAllNotInitContainer().forEach((el) => main(el));
     main();
   }, 1000);
   }, 500);
})(window);
})(window);
</script></includeonly>
</script></includeonly>

2024年3月18日 (一) 01:52的版本

用于展示投票箱