unarylab.github.io/software.html at main · UnaryLab/unarylab.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Software — Unary Lab</title>
  <link rel="icon" href="file/logo/unary-logo-black.svg" type="image/svg+xml">
  <link rel="stylesheet" href="css/style.css?v=1">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css"
        crossorigin="anonymous" referrerpolicy="no-referrer">
</head>
<body>

<div id="nav-placeholder"></div>

<main>
  <div class="container">
    <div id="software-root">
      <p style="color:#9ca3af;font-size:14px;padding:10px 0">Loading…</p>
    </div>
  </div>
</main>

<script src="js/utils.js?v=1"></script>
<script>
async function resolvePaper(pub) {
  const field = (pub['paper/slide/poster'] || '').trim();
  if (!field) return null;
  if (/^https?:\/\//.test(field)) return field;
  return probeFile(`file/publication/${field}-paper.pdf`);
}

function renderSoftwareItem(p) {
  const dateDisplay = formatNewsDate(p.date);
  const links = [
    p._paper && `[<a href="${esc(p._paper)}" target="_blank" rel="noopener">paper</a>]`,
    p.code   && `[<a href="${esc(p.code)}"   target="_blank" rel="noopener">code</a>]`,
  ].filter(Boolean).join(' ');
  const awards = [p.award1, p.award2, p.award3]
    .filter(Boolean)
    .map(a => `<div class="pub-award">🏅 ${esc(a)}</div>`)
    .join('');

  return `
    <li class="software-item">
      <div class="software-thumb">
        <iframe src="file/software/${esc(p.software)}.pdf#toolbar=0&navpanes=0" title="${esc(p.software)}"
                scrolling="no" class="software-thumb-pdf"></iframe>
      </div>
      <div class="software-info">
        <div class="software-name">${esc(p.software)}</div>
        <div class="software-venue"><em>${esc(p.venue)}</em>${dateDisplay ? `, ${dateDisplay}` : ''}</div>
        <div class="software-desc">${esc(p.description)}</div>
        ${links ? `<div class="pub-links">${links}</div>` : ''}
        ${awards}
      </div>
    </li>`;
}

document.addEventListener('DOMContentLoaded', async () => {
  try {
    const rawPubs = await loadCSV('data/publication.csv');
    const filtered = rawPubs.filter(p =>
      p.software && p.software.trim() && p.description && p.description.trim()
    );
    const software = sortDescByDate(await Promise.all(filtered.map(async p => ({
      ...p,
      _paper: await resolvePaper(p),
    }))));

    const root = document.getElementById('software-root');
    if (software.length === 0) {
      root.innerHTML = '<h1 class="page-title">Software</h1><p style="color:#9ca3af;font-size:14px;padding:10px 0">No software listed yet.</p>';
    } else {
      root.innerHTML = `<h1 class="page-title">Software</h1><ul class="software-list">${software.map(renderSoftwareItem).join('')}</ul>`;
      root.querySelectorAll('.software-thumb').forEach(thumb => {
        thumb.style.cursor = 'zoom-in';
        const iframe = thumb.querySelector('iframe');
        thumb.addEventListener('click', () => {
          if (window.openLightbox) window.openLightbox(iframe.src);
        });
      });
    }
  } catch (e) {
    document.getElementById('software-root').innerHTML =
      '<p style="color:#9ca3af;font-size:14px;padding:10px 0">Could not load software data.</p>';
    console.error(e);
  }
});
</script>
</body>
</html>