document.addEventListener('DOMContentLoaded', () => {
  const METADATA_KEY = '__storage_metadata__';

  const containers = document.querySelectorAll('.image-card');

  // 获取本地存储数据
  const metaData = JSON.parse(localStorage.getItem(METADATA_KEY)) || {};

  containers.forEach(container => {
    const contentId = container.dataset.contentId;
    if (metaData[contentId]) {
      const progress = Math.round(metaData[contentId].progress);

      // 如何已完成，展示work图
      if (progress >= 100) {
        const img = container.querySelector('img');  // 获取当前div内的img元素
        img.src = img.src.replace('/page/', '/work/');
      }

      // 添加角标
      const badge = document.createElement('div');
      badge.className = 'progress-badge';
      badge.innerHTML = `<span>${progress >= 100 ? '✓' : progress + '%'}</span>`;
      badge.style.backgroundColor = progress >= 100 ? '#4CAF50' : '#FF5252';
      // 添加渐变动画
      badge.style.transition = 'background-color 0.3s ease';

      container.appendChild(badge);


    }
  });
});