https://zheyeshiyu.github.io/js/memos/photo.js

1function whenDOMReady() {
2  if (location.pathname == '/photos/') photos();
3}
4whenDOMReady()
5document.addEventListener("pjax:complete", whenDOMReady)
6
7// 适配pjax
8
9window.onresize = () => {
10  if (location.pathname == '/photos/') waterfall('.gallery-photos');
11};
12
13// 自适应
14
15function photos() {
16  fetch('https://memos.yurenyiyuji.top/api/v1/memo?creatorId=1&tag=相册&limit=200').then(res => res.json()).then(data => { // 记得修改memos地址
17      if (data && data.data) {
18          let html = '', imgs = [];
19          data.data.forEach(item => {
20              if (item && item.content) {
21                  let imageMatches = item.content.match(/\!\[.*?\]\(.*?\)/g);
22                  if (imageMatches) {
23                      imgs = imgs.concat(imageMatches);
24                  }
25              }
26          });
27
28          imgs.forEach(item => {
29              let img = item.replace(/!\[.*?\]\((.*?)\)/g, '$1'),
30                  time, title, tat = item.replace(/!\[(.*?)\]\(.*?\)/g, '$1');
31              if (tat.indexOf(' ') != -1) {
32                  time = tat.split(' ')[0];
33                  title = tat.split(' ')[1];
34              } else title = tat
35
36              html += `<div class="gallery-photo"><a href="${img}" data-fancybox="gallery" class="fancybox" data-thumb="${img}"><img class="photo-img" loading='lazy' decoding="async" src="${img}"></a>`;
37              title ? html += `<span class="photo-title">${title}</span>` : '';
38              time ? html += `<span class="photo-time">${time}</span>` : '';
39              html += `</div>`;
40          });
41
42          document.querySelector('.gallery-photos.page').innerHTML = html
43          imgStatus.watch('.photo-img', () => { waterfall('.gallery-photos'); });
44          window.Lately && Lately.init({ target: '.photo-time' });
45      }
46  }).catch(error => {
47      console.error("Error fetching data: ", error);
48  });
49}
50