archive.html

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <meta name="robots" content="noindex,nofollow">
  <meta name="description" content="FridrichMethod's DEEMO 1 Artwork Archive, keeping the publicly downloadable original files and per-image provenance." data-i18n-attr="content:meta.description">
  <title data-i18n="meta.title">DEEMO 1 Artwork Archive · FridrichMethod</title>
  <link rel="icon" href="assets/site/icons/favicon.ico">
  <link rel="manifest" href="site.webmanifest">
  <link rel="stylesheet" href="src/archive.css">
  <!-- Without JavaScript nothing loads, so the status line does not claim it; the notice at the top of <main> explains. -->
  <noscript><style>#count { display: none; }</style></noscript>
  <script src="src/i18n.js" defer></script>
  <script src="src/i18n/common.js" defer></script>
  <script src="src/i18n/archive.js" defer></script>
  <script src="data/catalog.js" defer></script>
  <script src="src/archive.js" defer></script>
</head>
<body>
  <header>
    <p class="eyebrow" lang="en" translate="no">FRIDRICHMETHOD / PERSONAL COLLECTION</p>
    <div class="heading-row">
      <div><h1 data-i18n="header.title">DEEMO 1 Artwork Archive</h1><p data-i18n="header.tagline">Artist releases, game textures and community versions. Files are kept as they are, and every image is traced back to its source.</p></div>
      <nav aria-label="Navigation" data-i18n-attr="aria-label:nav.label"><a href="index.html" data-lang-link data-i18n="nav.slideshow">Slideshow</a><a href="https://github.com/FridrichMethod/deemo" target="_blank" rel="noopener noreferrer">GitHub ↗</a><button type="button" class="lang-toggle" data-lang-toggle title="Switch to Simplified Chinese"><span lang="zh-CN">中文</span></button></nav>
    </div>
  </header>
  <main>
    <noscript><p class="noscript">Browsing the Artwork Archive requires JavaScript. Every file, with its path and source, is listed in <a href="data/catalog.json">data/catalog.json</a>, and the files themselves can be browsed in the <a href="https://github.com/FridrichMethod/deemo/tree/main/assets">GitHub repository</a>. <span lang="zh-CN">浏览曲绘档案需要 JavaScript。所有文件及其路径和来源都列在 <a href="data/catalog.json">data/catalog.json</a> 中，文件本身可在 <a href="https://github.com/FridrichMethod/deemo/tree/main/assets">GitHub 仓库</a>中浏览。</span></p></noscript>
    <form id="filters" class="filters" role="search">
      <label class="search"><span data-i18n="filters.query">Search song titles, artists, collections</span><input id="query" type="search" placeholder="Magnolia / SnowEgg / Sakuzyo …" autocomplete="off"></label>
      <label><span data-i18n="filters.family">Source</span><select id="family">
        <option value="" data-i18n="filters.family.all">All sources</option>
        <option value="artists" data-i18n="family.artists">Artists (original posts)</option>
        <option value="wikis" data-i18n="family.wikis">Wiki</option>
        <option value="archives" data-i18n="family.archives">Public archives / reposts</option>
        <option value="legacy" data-i18n="family.legacy">Original repository</option>
      </select></label>
      <label><span data-i18n="filters.kind">Type</span><select id="kind"><option value="" data-i18n="filters.kind.all">All images</option><option value="song_art" data-i18n="filters.kind.song_art">Song artwork</option><option value="collection_cover" data-i18n="filters.kind.collection_cover">Collection covers</option><option value="contact_sheet" data-i18n="filters.kind.contact_sheet">Long images / contact sheets</option><option value="illustration" data-i18n="filters.kind.illustration">Other illustrations</option><option value="reference" data-i18n="filters.kind.reference">Scans / references</option></select></label>
      <label><span data-i18n="filters.minimum">Minimum long edge</span><select id="minimum"><option value="0" data-i18n="filters.minimum.any">Any size</option><option value="1024">1024 px</option><option value="1500">1500 px</option><option value="2048">2048 px</option><option value="3000">3000 px</option></select></label>
      <label><span data-i18n="filters.sort">Sort</span><select id="sort"><option value="source" data-i18n="filters.sort.source">Source first</option><option value="title" data-i18n="filters.sort.title">Title</option><option value="resolution" data-i18n="filters.sort.resolution">Pixel area ↓</option></select></label>
      <button id="reset-filters" type="button" data-i18n="filters.reset">Reset</button>
    </form>
    <div class="result-row"><p id="count" role="status" aria-live="polite"><span data-i18n="results.loading">Loading local catalog…</span></p><p data-i18n="results.note">Size does not equal quality; different crops and versions are all kept.</p></div>
    <div id="grid" class="grid"></div>
    <p id="empty" hidden data-i18n="results.empty">No matching images. Try a shorter search term or looser filters.</p>
    <button id="more" class="more" type="button" hidden data-i18n="results.more">Load more</button>
    <details class="source-inventory"><summary data-i18n="inventory.title">Source inventory, reference files and retrieval status</summary><p id="inventory-summary"></p><div id="references"></div><div class="table-scroll"><table><thead><tr><th data-i18n="inventory.source">Source</th><th data-i18n="inventory.records">File records</th><th data-i18n="inventory.status">Status / notes</th></tr></thead><tbody id="sources"></tbody></table></div><div id="failures"></div></details>
  </main>
  <footer><span data-i18n="footer.maintained">Maintained by </span><a href="https://github.com/FridrichMethod">FridrichMethod</a> · <span data-i18n="footer.original">Original gallery by Mashiro</span> · <span data-i18n="footer.rights">Artwork © Rayark Inc. / respective artists</span> · <a href="https://github.com/FridrichMethod/deemo/blob/main/NOTICE" data-i18n="footer.attribution">Attribution</a> · <a href="data/catalog.json" data-i18n="footer.catalog">Full source manifest JSON</a></footer>
  <dialog id="viewer" aria-labelledby="viewer-title">
    <button id="close" class="close" type="button" aria-label="Close preview" data-i18n-attr="aria-label:viewer.close"><svg class="icon" viewBox="0 0 15 15" width="15" height="15" aria-hidden="true" focusable="false"><path d="M3 3l9 9M12 3l-9 9"/></svg></button>
    <div class="viewer-image"><img id="full-image" alt=""><p id="image-error" hidden data-i18n="viewer.image_error">The image failed to load. Use the original-file link to check it.</p></div>
    <div class="viewer-info"><div class="viewer-controls"><button id="previous" type="button" aria-label="Previous image" data-i18n-attr="aria-label:viewer.previous"><svg class="icon" viewBox="0 0 16 16" width="16" height="16" aria-hidden="true" focusable="false"><path d="M12.5 8h-9M7 4.5 3.5 8 7 11.5"/></svg></button><span id="position"></span><button id="next" type="button" aria-label="Next image" data-i18n-attr="aria-label:viewer.next"><svg class="icon" viewBox="0 0 16 16" width="16" height="16" aria-hidden="true" focusable="false"><path d="M3.5 8h9M9 4.5 12.5 8 9 11.5"/></svg></button></div><h2 id="viewer-title"></h2><p id="viewer-meta"></p><p class="links"><a id="download" download data-i18n="viewer.download">Download original file</a><a id="slideshow" data-i18n="viewer.slideshow">View in slideshow</a><a id="original" target="_blank" rel="noopener noreferrer" data-i18n="viewer.original">Open original file in browser ↗</a></p><div id="provenance"></div><details><summary data-i18n="viewer.file_info">File info</summary><p id="file-info"></p></details></div>
  </dialog>
</body>
</html>