// main.js

// 当整个页面的HTML内容加载完成后，执行此函数
document.addEventListener('DOMContentLoaded', () => {
  // 获取页面上的关键元素
  const textInput = document.getElementById('text-input');
  const generateBtn = document.getElementById('generate-btn');
  const qrcodeContainer = document.getElementById('qrcode-container');

  // 为“生成二维码”按钮添加点击事件监听器
  generateBtn.addEventListener('click', () => {
    // 获取输入框中的文本，并用 trim() 清除前后的空白字符
    const text = textInput.value.trim();

    // 在生成新的二维码之前，清空之前可能存在的旧二维码
    qrcodeContainer.innerHTML = '';

    // 如果文本为空，则不执行任何操作
    if (!text) {
      console.log('输入内容为空，已中止生成。');
      return;
    }

    // 定义每个二维码的最大字符数
    const chunkSize = 2000;
    // 计算需要生成多少个二维码
    const totalChunks = Math.ceil(text.length / chunkSize);

    console.log(`总字符数: ${text.length}，将生成 ${totalChunks} 个二维码。`);

    // 循环处理每一块文本
    for (let i = 0; i < totalChunks; i++) {
      // 计算当前块的起始和结束位置
      const start = i * chunkSize;
      const end = start + chunkSize;
      // 从总文本中截取当前块的文本
      const chunk = text.substring(start, end);

      // --- 创建包裹单个二维码及其标签的容器 ---
      const itemDiv = document.createElement('div');
      itemDiv.className = 'qrcode-item';

      // --- 创建并添加序号标签 ---
      const label = document.createElement('p');
      label.className = 'qrcode-label';
      // 如果总数大于1，则显示 "二维码 x/y"，否则只显示 "二维码"
      label.textContent = totalChunks > 1 ? `二维码 ${i + 1}/${totalChunks}` : '二维码';
      itemDiv.appendChild(label);

      // --- 创建用于生成二维码的占位符元素 ---
      const qrcodeDiv = document.createElement('div');
      // 给这个div一个唯一的ID，虽然qrcodejs也可以直接接收元素对象
      qrcodeDiv.id = `qrcode-${i}`;
      itemDiv.appendChild(qrcodeDiv);

      // --- 将完整的二维码项（标签+占位符）添加到主容器中 ---
      qrcodeContainer.appendChild(itemDiv);

      // --- 使用 qrcode.js 库生成二维码 ---
      // 实例化 QRCode 对象
      // 第一个参数是二维码要渲染到的DOM元素
      // 第二个参数是配置对象
      new QRCode(qrcodeDiv, {
        text: chunk, // 当前块的文本内容
        width: 400,  // 二维码宽度
        height: 400, // 二维码高度
        colorDark: '#000000', // 二维码颜色
        colorLight: '#ffffff', // 二维码背景色
        correctLevel: QRCode.CorrectLevel.H // 纠错级别，H是最高级
      });
      
      console.log(`已为第 ${i + 1} 块内容生成二维码。`);
    }
  });
});