feat(slides): improve slide controllerHEAD main

author: nsfisis <nsfisis@gmail.com> 2026-08-08 10:38:18 +0900
committer: nsfisis <nsfisis@gmail.com> 2026-08-08 10:38:18 +0900
commit: 4681e861efcdf9b0b73e3803e70712bc55162863 (patch)
tree: d910ef14d9549df19896d85a42e12a32db787fb6 /services/nuldoc/public/slides
parent: eca423774047122f7dfc4be9ac78626e32d733d3 (diff)
download: nsfisis.dev-main.tar.gz
nsfisis.dev-main.tar.zst
nsfisis.dev-main.zip
53 files changed, 1281 insertions, 257 deletions
diff --git a/services/nuldoc/public/slides/404.html b/services/nuldoc/public/slides/404.html
index 48bd5013..e262ba8d 100644
--- a/services/nuldoc/public/slides/404.html
+++ b/services/nuldoc/public/slides/404.html
@@ -14,7 +14,7 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>Page Not Found｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
     <header class="header">
diff --git a/services/nuldoc/public/slides/slide.js b/services/nuldoc/public/slides/slide.js
index a90fda7a..72f14bba 100644
--- a/services/nuldoc/public/slides/slide.js
+++ b/services/nuldoc/public/slides/slide.js
@@ -1,98 +1,367 @@
-import { getDocument, GlobalWorkerOptions } from "./pdf.min.mjs";
+import {
+  AnnotationLayer,
+  getDocument,
+  GlobalWorkerOptions,
+  TextLayer,
+} from "./pdf.min.mjs";
+
+const PAGE_HASH_PATTERN = /^#p(\d+)$/;
+// How long to wait before re-rendering, so a drag-resize does not redraw on every frame.
+const RESIZE_DEBOUNCE_MS = 150;
+// How long to wait before showing the indicator, so quick renders do not flash it.
+const RENDER_INDICATOR_DELAY_MS = 200;
+// How many pages around the current one to render ahead of time.
+const PREFETCH_RADIUS = 1;
+
+function pageFromHash(hash) {
+  const matched = PAGE_HASH_PATTERN.exec(hash);
+  if (matched === null) return null;
+  const num = Number(matched[1]);
+  return num >= 1 ? num : null;
+}
 
 async function init() {
   GlobalWorkerOptions.workerSrc = "/pdf.worker.min.mjs";
 
+  const container = document.getElementById("slide-container");
+  const stage = document.getElementById("slide-stage");
   const canvas = document.getElementById("slide");
   const ctx = canvas.getContext("2d");
-  const url = canvas.dataset.slideLink;
+  const textLayerDiv = document.getElementById("text-layer");
+  const annotationLayerDiv = document.getElementById("annotation-layer");
+  const status = document.getElementById("slide-status");
+  const prev = document.getElementById("prev");
+  const next = document.getElementById("next");
+  const pageInput = document.getElementById("page-input");
+  const pageCount = document.getElementById("page-count");
+  const url = container.dataset.slideLink;
 
-  let pageNum = 1;
   let doc = null;
-  let renderTask = null;
+  let pageNum = 1;
   let renderToken = 0;
+  let textLayer = null;
+  let stageWidth = 0;
+  // `${pageNumber}@${width}` -> { image, layers }. Both are promises.
+  const cache = new Map();
 
-  const backCanvas = document.createElement("canvas");
-  const backCtx = backCanvas.getContext("2d");
+  const hideStatus = () => {
+    status.hidden = true;
+    status.replaceChildren();
+    delete status.dataset.state;
+  };
 
-  const renderPage = async (num) => {
-    const token = ++renderToken;
-    if (renderTask !== null) {
-      renderTask.cancel();
-      renderTask = null;
-    }
+  const showStatus = (state, message) => {
+    status.dataset.state = state;
+    status.replaceChildren(message);
+    status.hidden = false;
+  };
 
-    const page = await doc.getPage(num);
-    if (token !== renderToken) return;
+  const showFailure = (message) => {
+    const description = document.createElement("p");
+    description.textContent = message;
+    const fallback = document.createElement("a");
+    fallback.href = url;
+    fallback.textContent = "PDF を直接開く";
+    status.dataset.state = "error";
+    status.replaceChildren(description, fallback);
+    status.hidden = false;
+  };
 
-    const baseViewport = page.getViewport({ scale: 1.0 });
-    const containerWidth = canvas.parentElement.clientWidth;
-    const scale = containerWidth / baseViewport.width;
+  const renderToOffscreenCanvas = async (page, width) => {
+    const scale = width / page.getViewport({ scale: 1 }).width;
     const viewport = page.getViewport({ scale });
-
     const outputScale = globalThis.devicePixelRatio || 1;
-    const cssWidth = Math.floor(viewport.width);
-    const cssHeight = Math.floor(viewport.height);
-    backCanvas.width = Math.floor(viewport.width * outputScale);
-    backCanvas.height = Math.floor(viewport.height * outputScale);
 
+    const target = document.createElement("canvas");
+    target.width = Math.floor(viewport.width * outputScale);
+    target.height = Math.floor(viewport.height * outputScale);
     const transform = outputScale !== 1
       ? [outputScale, 0, 0, outputScale, 0, 0]
       : null;
 
-    // TODO: error handling
-    const task = page.render({
-      canvasContext: backCtx,
+    await page.render({
+      canvasContext: target.getContext("2d"),
       viewport,
       transform,
+    }).promise;
+
+    return {
+      canvas: target,
+      viewport,
+      cssWidth: Math.floor(viewport.width),
+      cssHeight: Math.floor(viewport.height),
+      // Factor the text/annotation layers use to convert PDF units into CSS px.
+      totalScaleFactor: viewport.width / viewport.rawDims.pageWidth,
+    };
+  };
+
+  // Cache the rendered result itself; same page at the same width returns instantly.
+  const entryFor = (num, width) => {
+    const key = `${num}@${width}`;
+    const cached = cache.get(key);
+    if (cached !== undefined) return cached;
+
+    const page = doc.getPage(num);
+    const entry = {
+      image: page.then((p) => renderToOffscreenCanvas(p, width)),
+      layers: page.then(async (p) => ({
+        page: p,
+        textContent: await p.getTextContent(),
+        annotations: await p.getAnnotations({ intent: "display" }),
+      })),
+    };
+    // Drop rejected promises, otherwise a failure would never be retried.
+    const forget = () => {
+      if (cache.get(key) === entry) cache.delete(key);
+    };
+    entry.image.catch(forget);
+    entry.layers.catch(forget);
+
+    cache.set(key, entry);
+    return entry;
+  };
+
+  const sweepCache = () => {
+    for (const key of cache.keys()) {
+      const [num, width] = key.split("@").map(Number);
+      if (width !== stageWidth || Math.abs(num - pageNum) > PREFETCH_RADIUS) {
+        cache.delete(key);
+      }
+    }
+  };
+
+  const prefetchNeighbors = () => {
+    for (let d = 1; d <= PREFETCH_RADIUS; d++) {
+      for (const num of [pageNum + d, pageNum - d]) {
+        if (num < 1 || num > doc.numPages) continue;
+        entryFor(num, stageWidth);
+      }
+    }
+  };
+
+  const drawImage = ({ canvas: source, cssWidth, cssHeight }) => {
+    if (canvas.width !== source.width || canvas.height !== source.height) {
+      canvas.width = source.width;
+      canvas.height = source.height;
+    }
+    canvas.style.width = `${cssWidth}px`;
+    canvas.style.height = `${cssHeight}px`;
+    ctx.drawImage(source, 0, 0);
+  };
+
+  const renderOverlays = async (entry, viewport, token) => {
+    if (textLayer !== null) {
+      textLayer.cancel();
+      textLayer = null;
+    }
+    textLayerDiv.replaceChildren();
+    annotationLayerDiv.replaceChildren();
+
+    const { page, textContent, annotations } = await entry.layers;
+    if (token !== renderToken) return;
+
+    const layer = new TextLayer({
+      textContentSource: textContent,
+      container: textLayerDiv,
+      viewport,
     });
-    renderTask = task;
+    textLayer = layer;
     try {
-      await task.promise;
+      await layer.render();
+    } catch {
+      // Cancelled by a move to another page; leave it to the newer render.
+      return;
+    }
+    if (token !== renderToken) return;
+
+    if (annotations.length === 0) return;
+    await new AnnotationLayer({
+      div: annotationLayerDiv,
+      page,
+      viewport: viewport.clone({ dontFlip: true }),
+      linkService,
+    }).render({ annotations, renderForms: false });
+  };
+
+  const renderPage = async (num) => {
+    // No measurable width (e.g. hidden); leave it to the ResizeObserver re-render.
+    if (stageWidth === 0) return;
+
+    const token = ++renderToken;
+    const entry = entryFor(num, stageWidth);
+
+    const indicator = globalThis.setTimeout(() => {
+      if (token === renderToken) showStatus("loading", "描画中…");
+    }, RENDER_INDICATOR_DELAY_MS);
+
+    try {
+      const image = await entry.image;
+      if (token !== renderToken) return;
+
+      globalThis.clearTimeout(indicator);
+      hideStatus();
+      stage.style.setProperty("--total-scale-factor", image.totalScaleFactor);
+      drawImage(image);
+      await renderOverlays(entry, image.viewport, token);
     } catch (e) {
-      if (e?.name === "RenderingCancelledException") return;
-      throw e;
+      if (token !== renderToken) return;
+      console.error(e);
+      showFailure("スライドの描画に失敗しました。");
     } finally {
-      if (renderTask === task) renderTask = null;
+      globalThis.clearTimeout(indicator);
+      if (token === renderToken) {
+        sweepCache();
+        prefetchNeighbors();
+      }
     }
-    if (token !== renderToken) return;
+  };
 
-    if (canvas.width !== backCanvas.width || canvas.height !== backCanvas.height) {
-      canvas.width = backCanvas.width;
-      canvas.height = backCanvas.height;
-      canvas.style.width = cssWidth + "px";
-      canvas.style.height = cssHeight + "px";
+  const syncControls = () => {
+    prev.disabled = pageNum <= 1;
+    next.disabled = doc === null || pageNum >= doc.numPages;
+    if (document.activeElement !== pageInput) {
+      pageInput.value = String(pageNum);
     }
-    ctx.drawImage(backCanvas, 0, 0);
   };
 
-  const prev = document.getElementById("prev");
-  prev.addEventListener("click", () => {
-    if (pageNum <= 1) return;
-    pageNum--;
-    renderPage(pageNum);
-  });
-  const next = document.getElementById("next");
-  next.addEventListener("click", () => {
-    if (pageNum >= doc.numPages) return;
-    pageNum++;
+  const writeHash = (num) => {
+    const hash = `#p${num}`;
+    if (globalThis.location.hash === hash) return;
+    // Pushing an entry per page would make the back button useless.
+    globalThis.history.replaceState(null, "", hash);
+  };
+
+  const goToPage = (num, { updateHash = true } = {}) => {
+    if (doc === null || !Number.isFinite(num)) return;
+    pageNum = Math.min(Math.max(Math.trunc(num), 1), doc.numPages);
+    syncControls();
+    if (updateHash) writeHash(pageNum);
     renderPage(pageNum);
-  });
+  };
+
+  const linkService = {
+    addLinkAttributes(link, href, newWindow) {
+      link.href = href;
+      link.rel = "noopener noreferrer";
+      if (newWindow) link.target = "_blank";
+    },
+    getDestinationHash() {
+      return "#";
+    },
+    getAnchorUrl(hash) {
+      return hash;
+    },
+    async goToDestination(dest) {
+      if (doc === null) return;
+      const explicit = typeof dest === "string"
+        ? await doc.getDestination(dest)
+        : dest;
+      if (!Array.isArray(explicit) || explicit.length === 0) return;
+      const ref = explicit[0];
+      const index = typeof ref === "object" && ref !== null
+        ? await doc.getPageIndex(ref)
+        : Number(ref);
+      goToPage(index + 1);
+    },
+    executeNamedAction(action) {
+      switch (action) {
+        case "GoBack":
+        case "PrevPage":
+          goToPage(pageNum - 1);
+          break;
+        case "GoForward":
+        case "NextPage":
+          goToPage(pageNum + 1);
+          break;
+        case "FirstPage":
+          goToPage(1);
+          break;
+        case "LastPage":
+          goToPage(doc.numPages);
+          break;
+        default:
+          break;
+      }
+    },
+    executeSetOCGState() {},
+  };
+
+  prev.addEventListener("click", () => goToPage(pageNum - 1));
+  next.addEventListener("click", () => goToPage(pageNum + 1));
 
   document.addEventListener("keydown", (e) => {
+    if (e.target === pageInput) return;
+    if (e.altKey || e.ctrlKey || e.metaKey) return;
     if (e.key === "ArrowLeft" || e.key === "h") {
-      if (pageNum <= 1) return;
-      pageNum--;
-      renderPage(pageNum);
+      goToPage(pageNum - 1);
     } else if (e.key === "ArrowRight" || e.key === "l") {
-      if (pageNum >= doc.numPages) return;
-      pageNum++;
-      renderPage(pageNum);
+      goToPage(pageNum + 1);
+    } else {
+      return;
+    }
+    e.preventDefault();
+  });
+
+  const commitPageInput = () => {
+    const value = Number(pageInput.value);
+    if (Number.isFinite(value) && pageInput.value !== "") {
+      goToPage(value);
     }
+    pageInput.value = String(pageNum);
+  };
+  pageInput.addEventListener("change", commitPageInput);
+  pageInput.addEventListener("keydown", (e) => {
+    if (e.key !== "Enter") return;
+    e.preventDefault();
+    commitPageInput();
+  });
+
+  globalThis.addEventListener("hashchange", () => {
+    const num = pageFromHash(globalThis.location.hash);
+    if (num !== null && num !== pageNum) goToPage(num, { updateHash: false });
   });
 
-  // TODO: error handling
-  doc = await getDocument(url).promise;
+  let resizeTimer = 0;
+  const measure = () => Math.floor(container.clientWidth);
+  new ResizeObserver(() => {
+    globalThis.clearTimeout(resizeTimer);
+    resizeTimer = globalThis.setTimeout(() => {
+      const width = measure();
+      if (width === 0 || width === stageWidth) return;
+      stageWidth = width;
+      cache.clear();
+      if (doc !== null) renderPage(pageNum);
+    }, RESIZE_DEBOUNCE_MS);
+  }).observe(container);
+
+  stageWidth = measure();
+  syncControls();
+  showStatus("loading", "読み込み中……");
+
+  const loadingTask = getDocument(url);
+  loadingTask.onProgress = ({ loaded, total }) => {
+    if (doc !== null) return;
+    const percent = total > 0
+      ? Math.min(100, Math.round((loaded / total) * 100))
+      : null;
+    showStatus(
+      "loading",
+      percent === null ? "読み込み中……" : `読み込み中…… ${percent}%`,
+    );
+  };
+
+  try {
+    doc = await loadingTask.promise;
+  } catch (e) {
+    console.error(e);
+    showFailure("スライドの読み込みに失敗しました。");
+    return;
+  }
+
+  pageCount.textContent = String(doc.numPages);
+  pageInput.max = String(doc.numPages);
+  pageNum = Math.min(pageFromHash(globalThis.location.hash) ?? 1, doc.numPages);
+  syncControls();
   renderPage(pageNum);
 }
 
diff --git a/services/nuldoc/public/slides/slides.css b/services/nuldoc/public/slides/slides.css
index 17a9e183..703d66e1 100644
--- a/services/nuldoc/public/slides/slides.css
+++ b/services/nuldoc/public/slides/slides.css
@@ -4,12 +4,125 @@ main {
 }
 
 .slide-container {
+  position: relative;
   margin: 0 1rem;
 }
 
-.controllers {
+.slide-stage {
+  /* Variables read by pdf.js setLayerDimensions(). --total-scale-factor is
+     overwritten from JavaScript on every page render. */
+  --total-scale-factor: 1;
+  --scale-round-x: 1px;
+  --scale-round-y: 1px;
+  position: relative;
+  min-height: 6rem;
+}
+
+.slide-stage canvas {
+  display: block;
+}
+
+/* Text layer: selection, copy, in-page search and screen readers */
+
+.textLayer {
+  position: absolute;
+  inset: 0;
+  z-index: 1;
+  overflow: clip;
+  line-height: 1;
+  text-align: initial;
+  text-size-adjust: none;
+  forced-color-adjust: none;
+  transform-origin: 0 0;
+  caret-color: CanvasText;
+}
+
+.textLayer span,
+.textLayer br {
+  position: absolute;
+  margin: 0;
+  color: transparent;
+  white-space: pre;
+  cursor: text;
+  transform-origin: 0 0;
+}
+
+.textLayer ::selection {
+  background: rgb(0 0 255 / 25%);
+}
+
+.textLayer br::selection {
+  background: transparent;
+}
+
+/* Annotation layer: makes links inside the slides clickable */
+
+.annotationLayer {
+  position: absolute;
+  inset: 0;
+  z-index: 2;
+  pointer-events: none;
+  transform-origin: 0 0;
+}
+
+.annotationLayer section {
+  position: absolute;
+  margin: 0;
+  text-align: initial;
+  pointer-events: auto;
+  transform-origin: 0 0;
+}
+
+.annotationLayer .linkAnnotation > a {
+  position: absolute;
+  inset: 0;
+  font-size: 1em;
+  border: none;
+}
+
+.annotationLayer .linkAnnotation > a:hover {
+  background: rgb(255 255 0 / 20%);
+  box-shadow: 0 0 0 2px rgb(255 200 0 / 60%);
+}
+
+/* Loading and error overlay */
+
+.slide-status {
+  position: absolute;
+  inset: 0;
+  z-index: 3;
   display: flex;
+  flex-direction: column;
+  align-items: center;
   justify-content: center;
+  gap: 0.5rem;
+  background: rgb(255 255 255 / 90%);
+}
+
+.slide-status[hidden] {
+  display: none;
+}
+
+.slide-status p {
+  margin: 0;
+}
+
+.slide-status[data-state="error"] {
+  color: #a00;
+}
+
+.slide-noscript {
+  margin: 1rem;
+  text-align: center;
+}
+
+/* Controls */
+
+.controllers {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 0.5rem;
   margin: 1rem 0;
 }
 
@@ -35,3 +148,33 @@ main {
 .controllers button:hover {
   background: #555;
 }
+
+.controllers button:disabled {
+  background: #ccc;
+  cursor: default;
+}
+
+.page-indicator {
+  display: flex;
+  align-items: center;
+  gap: 0.3rem;
+  font-variant-numeric: tabular-nums;
+}
+
+.page-input {
+  width: 4rem;
+  height: 2rem;
+  padding: 0 0.3rem;
+  border: 1px solid #999;
+  border-radius: 0.3rem;
+  font: inherit;
+  text-align: right;
+}
+
+.page-count {
+  min-width: 2rem;
+}
+
+.slide-download {
+  font-size: 0.9rem;
+}
diff --git a/services/nuldoc/public/slides/slides/2023-01-18/phpstudy-tokyo-148/index.html b/services/nuldoc/public/slides/slides/2023-01-18/phpstudy-tokyo-148/index.html
index c4a4fe24..3019fbab 100644
--- a/services/nuldoc/public/slides/slides/2023-01-18/phpstudy-tokyo-148/index.html
+++ b/services/nuldoc/public/slides/slides/2023-01-18/phpstudy-tokyo-148/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>明日のあなたの役に立たない PHP コーディング技法～polyglot～ (PHP 勉強会@東京 第148 回)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -59,10 +59,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2023-01-18/phpstudy-tokyo-148/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2023-01-18/phpstudy-tokyo-148/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2023-01-18/phpstudy-tokyo-148/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -71,6 +87,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -78,8 +97,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2023-01-18/phpstudy-tokyo-148/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2023-02-15/phpstudy-tokyo-149/index.html b/services/nuldoc/public/slides/slides/2023-02-15/phpstudy-tokyo-149/index.html
index ec3139e9..da735978 100644
--- a/services/nuldoc/public/slides/slides/2023-02-15/phpstudy-tokyo-149/index.html
+++ b/services/nuldoc/public/slides/slides/2023-02-15/phpstudy-tokyo-149/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>PHPerKaigi 2023 のトークン問題でボツにした問題を供養する (PHP 勉強会@東京 第149 回)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -59,10 +59,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2023-02-15/phpstudy-tokyo-149/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2023-02-15/phpstudy-tokyo-149/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2023-02-15/phpstudy-tokyo-149/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -71,6 +87,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -78,8 +97,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2023-02-15/phpstudy-tokyo-149/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2023-03-15/phpstudy-tokyo-150/index.html b/services/nuldoc/public/slides/slides/2023-03-15/phpstudy-tokyo-150/index.html
index 270822e3..02d2ede3 100644
--- a/services/nuldoc/public/slides/slides/2023-03-15/phpstudy-tokyo-150/index.html
+++ b/services/nuldoc/public/slides/slides/2023-03-15/phpstudy-tokyo-150/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>明日のあなたの役に立たない PHP コーディング技法～細長い FizzBuzz を書く～ (PHP 勉強会@東京 第150 回)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -62,10 +62,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2023-03-15/phpstudy-tokyo-150/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2023-03-15/phpstudy-tokyo-150/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2023-03-15/phpstudy-tokyo-150/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -74,6 +90,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -81,8 +100,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2023-03-15/phpstudy-tokyo-150/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2023-03-24/phperkaigi-2023/index.html b/services/nuldoc/public/slides/slides/2023-03-24/phperkaigi-2023/index.html
index bccf3555..3cec569e 100644
--- a/services/nuldoc/public/slides/slides/2023-03-24/phperkaigi-2023/index.html
+++ b/services/nuldoc/public/slides/slides/2023-03-24/phperkaigi-2023/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>詳説「参照」PHP の参照を完全に理解する (PHPerKaigi 2023)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -62,10 +62,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2023-03-24/phperkaigi-2023/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2023-03-24/phperkaigi-2023/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2023-03-24/phperkaigi-2023/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -74,6 +90,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -81,8 +100,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2023-03-24/phperkaigi-2023/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2023-03-25/phperkaigi-2023-tokens/index.html b/services/nuldoc/public/slides/slides/2023-03-25/phperkaigi-2023-tokens/index.html
index 8d4d4bfa..b94b6bdf 100644
--- a/services/nuldoc/public/slides/slides/2023-03-25/phperkaigi-2023-tokens/index.html
+++ b/services/nuldoc/public/slides/slides/2023-03-25/phperkaigi-2023-tokens/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>PHPer チャレンジ解説 (デジタルサーカス株式会社) (PHPerKaigi 2023)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -62,10 +62,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2023-03-25/phperkaigi-2023-tokens/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2023-03-25/phperkaigi-2023-tokens/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2023-03-25/phperkaigi-2023-tokens/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -74,6 +90,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -81,8 +100,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2023-03-25/phperkaigi-2023-tokens/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2023-04-12/phpstudy-tokyo-151/index.html b/services/nuldoc/public/slides/slides/2023-04-12/phpstudy-tokyo-151/index.html
index 8a74c9b7..56e84d73 100644
--- a/services/nuldoc/public/slides/slides/2023-04-12/phpstudy-tokyo-151/index.html
+++ b/services/nuldoc/public/slides/slides/2023-04-12/phpstudy-tokyo-151/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>list でない array の末尾を探す (PHP 勉強会@東京 第151 回)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -59,10 +59,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2023-04-12/phpstudy-tokyo-151/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2023-04-12/phpstudy-tokyo-151/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2023-04-12/phpstudy-tokyo-151/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -71,6 +87,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -78,8 +97,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2023-04-12/phpstudy-tokyo-151/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2023-06-21/phpstudy-tokyo-153/index.html b/services/nuldoc/public/slides/slides/2023-06-21/phpstudy-tokyo-153/index.html
index eaa5f350..f6482842 100644
--- a/services/nuldoc/public/slides/slides/2023-06-21/phpstudy-tokyo-153/index.html
+++ b/services/nuldoc/public/slides/slides/2023-06-21/phpstudy-tokyo-153/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>テキストファイルの末尾には改行コードを入れよう (PHP 勉強会@東京 第153 回)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -59,10 +59,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2023-06-21/phpstudy-tokyo-153/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2023-06-21/phpstudy-tokyo-153/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2023-06-21/phpstudy-tokyo-153/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -71,6 +87,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -78,8 +97,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2023-06-21/phpstudy-tokyo-153/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2023-06-23/phpconfuk-2023-eve/index.html b/services/nuldoc/public/slides/slides/2023-06-23/phpconfuk-2023-eve/index.html
index e0734b16..b9dc2f64 100644
--- a/services/nuldoc/public/slides/slides/2023-06-23/phpconfuk-2023-eve/index.html
+++ b/services/nuldoc/public/slides/slides/2023-06-23/phpconfuk-2023-eve/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>巨大なコードベースへ突撃するために (PHP カンファレンス福岡 2023 前夜祭 (非公式))｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -59,10 +59,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2023-06-23/phpconfuk-2023-eve/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2023-06-23/phpconfuk-2023-eve/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2023-06-23/phpconfuk-2023-eve/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -71,6 +87,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -78,8 +97,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2023-06-23/phpconfuk-2023-eve/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2023-07-26/phpstudy-tokyo-154/index.html b/services/nuldoc/public/slides/slides/2023-07-26/phpstudy-tokyo-154/index.html
index e1b2707c..2516ae37 100644
--- a/services/nuldoc/public/slides/slides/2023-07-26/phpstudy-tokyo-154/index.html
+++ b/services/nuldoc/public/slides/slides/2023-07-26/phpstudy-tokyo-154/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>言語間で比較するエラーの通知と処理 (PHP 勉強会@東京 第154 回)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -59,10 +59,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2023-07-26/phpstudy-tokyo-154/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2023-07-26/phpstudy-tokyo-154/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2023-07-26/phpstudy-tokyo-154/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -71,6 +87,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -78,8 +97,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2023-07-26/phpstudy-tokyo-154/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2023-08-24/phpstudy-tokyo-155/index.html b/services/nuldoc/public/slides/slides/2023-08-24/phpstudy-tokyo-155/index.html
index 5a0af08b..355e9e3a 100644
--- a/services/nuldoc/public/slides/slides/2023-08-24/phpstudy-tokyo-155/index.html
+++ b/services/nuldoc/public/slides/slides/2023-08-24/phpstudy-tokyo-155/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>PHP 3.0 の処理系のソースを読んでみる (PHP 勉強会@東京 第155 回)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -59,10 +59,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2023-08-24/phpstudy-tokyo-155/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2023-08-24/phpstudy-tokyo-155/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2023-08-24/phpstudy-tokyo-155/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -71,6 +87,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -78,8 +97,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2023-08-24/phpstudy-tokyo-155/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2023-10-25/phpstudy-tokyo-157/index.html b/services/nuldoc/public/slides/slides/2023-10-25/phpstudy-tokyo-157/index.html
index 8461d7eb..498007c7 100644
--- a/services/nuldoc/public/slides/slides/2023-10-25/phpstudy-tokyo-157/index.html
+++ b/services/nuldoc/public/slides/slides/2023-10-25/phpstudy-tokyo-157/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>PHP コードを隔離された環境で安全に動かす (on WebAssembly) (PHP 勉強会@東京 第157 回)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -59,10 +59,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2023-10-25/phpstudy-tokyo-157/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2023-10-25/phpstudy-tokyo-157/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2023-10-25/phpstudy-tokyo-157/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -71,6 +87,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -78,8 +97,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2023-10-25/phpstudy-tokyo-157/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2024-01-24/phpstudy-tokyo-160/index.html b/services/nuldoc/public/slides/slides/2024-01-24/phpstudy-tokyo-160/index.html
index 9c174c05..1ace2961 100644
--- a/services/nuldoc/public/slides/slides/2024-01-24/phpstudy-tokyo-160/index.html
+++ b/services/nuldoc/public/slides/slides/2024-01-24/phpstudy-tokyo-160/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>PHPStan の力で Algebraic Data Types を実現する (PHP 勉強会@東京 第160 回)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -59,10 +59,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2024-01-24/phpstudy-tokyo-160/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2024-01-24/phpstudy-tokyo-160/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2024-01-24/phpstudy-tokyo-160/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -71,6 +87,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -78,8 +97,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2024-01-24/phpstudy-tokyo-160/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2024-03-08/phperkaigi-2024/index.html b/services/nuldoc/public/slides/slides/2024-03-08/phperkaigi-2024/index.html
index f8261c3f..31d13b08 100644
--- a/services/nuldoc/public/slides/slides/2024-03-08/phperkaigi-2024/index.html
+++ b/services/nuldoc/public/slides/slides/2024-03-08/phperkaigi-2024/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>WebAssembly を理解する 〜VM の作成を通して〜 (PHPerKaigi 2024)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -65,10 +65,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2024-03-08/phperkaigi-2024/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2024-03-08/phperkaigi-2024/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2024-03-08/phperkaigi-2024/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -77,6 +93,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -84,8 +103,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2024-03-08/phperkaigi-2024/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2024-03-15/ya8-2024/index.html b/services/nuldoc/public/slides/slides/2024-03-15/ya8-2024/index.html
index 779dca54..cde7a867 100644
--- a/services/nuldoc/public/slides/slides/2024-03-15/ya8-2024/index.html
+++ b/services/nuldoc/public/slides/slides/2024-03-15/ya8-2024/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>CLI の PHP プログラムを限界まで高速化してみる (Ya8 2024)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -62,10 +62,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2024-03-15/ya8-2024/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2024-03-15/ya8-2024/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2024-03-15/ya8-2024/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -74,6 +90,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -81,8 +100,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2024-03-15/ya8-2024/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2024-04-13/phpcon-odawara-2024/index.html b/services/nuldoc/public/slides/slides/2024-04-13/phpcon-odawara-2024/index.html
index 919e39a0..4e65330f 100644
--- a/services/nuldoc/public/slides/slides/2024-04-13/phpcon-odawara-2024/index.html
+++ b/services/nuldoc/public/slides/slides/2024-04-13/phpcon-odawara-2024/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>来る新 JIT エンジンについて知った気になる (PHP カンファレンス小田原 2024)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -62,10 +62,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2024-04-13/phpcon-odawara-2024/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2024-04-13/phpcon-odawara-2024/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2024-04-13/phpcon-odawara-2024/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -74,6 +90,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -81,8 +100,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2024-04-13/phpcon-odawara-2024/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2024-04-25/phpstudy-tokyo-163/index.html b/services/nuldoc/public/slides/slides/2024-04-25/phpstudy-tokyo-163/index.html
index 90a568bf..796ae200 100644
--- a/services/nuldoc/public/slides/slides/2024-04-25/phpstudy-tokyo-163/index.html
+++ b/services/nuldoc/public/slides/slides/2024-04-25/phpstudy-tokyo-163/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>Tracing JIT の発動条件 (PHP 勉強会@東京 第163回)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -59,10 +59,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2024-04-25/phpstudy-tokyo-163/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2024-04-25/phpstudy-tokyo-163/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2024-04-25/phpstudy-tokyo-163/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -71,6 +87,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -78,8 +97,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2024-04-25/phpstudy-tokyo-163/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2024-07-18/phpstudy-tokyo-166/index.html b/services/nuldoc/public/slides/slides/2024-07-18/phpstudy-tokyo-166/index.html
index f55f5259..cb9c851d 100644
--- a/services/nuldoc/public/slides/slides/2024-07-18/phpstudy-tokyo-166/index.html
+++ b/services/nuldoc/public/slides/slides/2024-07-18/phpstudy-tokyo-166/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>PHPerKaigi 2024 で発表した WebAssembly ランタイムのその後 (PHP 勉強会@東京 第166回)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -59,10 +59,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2024-07-18/phpstudy-tokyo-166/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2024-07-18/phpstudy-tokyo-166/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2024-07-18/phpstudy-tokyo-166/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -71,6 +87,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -78,8 +97,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2024-07-18/phpstudy-tokyo-166/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2024-10-30/phpstudy-tokyo-169/index.html b/services/nuldoc/public/slides/slides/2024-10-30/phpstudy-tokyo-169/index.html
index 8034f473..2388077c 100644
--- a/services/nuldoc/public/slides/slides/2024-10-30/phpstudy-tokyo-169/index.html
+++ b/services/nuldoc/public/slides/slides/2024-10-30/phpstudy-tokyo-169/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>PHP で PHP を作る (縮小版) (PHP 勉強会@東京 第169回)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -59,10 +59,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2024-10-30/phpstudy-tokyo-169/slide.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2024-10-30/phpstudy-tokyo-169/slide.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2024-10-30/phpstudy-tokyo-169/slide.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -71,6 +87,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -78,8 +97,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2024-10-30/phpstudy-tokyo-169/slide.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2024-11-30/cohackpp/index.html b/services/nuldoc/public/slides/slides/2024-11-30/cohackpp/index.html
index 4852055c..cca47dba 100644
--- a/services/nuldoc/public/slides/slides/2024-11-30/cohackpp/index.html
+++ b/services/nuldoc/public/slides/slides/2024-11-30/cohackpp/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>プログラミングマナー講座 (紅白ぺぱ合戦)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -59,10 +59,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2024-11-30/cohackpp/slides.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2024-11-30/cohackpp/slides.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2024-11-30/cohackpp/slides.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -71,6 +87,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -78,8 +97,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2024-11-30/cohackpp/slides.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2025-02-22/phpcon-nagoya-2025/index.html b/services/nuldoc/public/slides/slides/2025-02-22/phpcon-nagoya-2025/index.html
index 8596053c..831ab046 100644
--- a/services/nuldoc/public/slides/slides/2025-02-22/phpcon-nagoya-2025/index.html
+++ b/services/nuldoc/public/slides/slides/2025-02-22/phpcon-nagoya-2025/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>PHP 処理系の garbage collection を理解する～メモリはいつ解放されるのか～ (PHP カンファレンス名古屋 2025)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -62,10 +62,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2025-02-22/phpcon-nagoya-2025/slides.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2025-02-22/phpcon-nagoya-2025/slides.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2025-02-22/phpcon-nagoya-2025/slides.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -74,6 +90,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -81,8 +100,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2025-02-22/phpcon-nagoya-2025/slides.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2025-03-23/phperkaigi-2025/index.html b/services/nuldoc/public/slides/slides/2025-03-23/phperkaigi-2025/index.html
index 1aeb2f0f..dea19f96 100644
--- a/services/nuldoc/public/slides/slides/2025-03-23/phperkaigi-2025/index.html
+++ b/services/nuldoc/public/slides/slides/2025-03-23/phperkaigi-2025/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>PHPで作るPHP～セルフホストできる言語処理系を作ろう～ (PHPerKaigi 2025)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -62,10 +62,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2025-03-23/phperkaigi-2025/slides.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2025-03-23/phperkaigi-2025/slides.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2025-03-23/phperkaigi-2025/slides.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -74,6 +90,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -81,8 +100,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2025-03-23/phperkaigi-2025/slides.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2025-04-12/phpcon-odawara-2025/index.html b/services/nuldoc/public/slides/slides/2025-04-12/phpcon-odawara-2025/index.html
index 860f2451..7c5118b0 100644
--- a/services/nuldoc/public/slides/slides/2025-04-12/phpcon-odawara-2025/index.html
+++ b/services/nuldoc/public/slides/slides/2025-04-12/phpcon-odawara-2025/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>PHP 8.x 時代のクラス設計（property promotion から property hooks まで） (PHP カンファレンス小田原 2025)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -62,10 +62,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2025-04-12/phpcon-odawara-2025/slides.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2025-04-12/phpcon-odawara-2025/slides.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2025-04-12/phpcon-odawara-2025/slides.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -74,6 +90,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -81,8 +100,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2025-04-12/phpcon-odawara-2025/slides.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2025-07-26/techramen-25-conf/index.html b/services/nuldoc/public/slides/slides/2025-07-26/techramen-25-conf/index.html
index b3bbbcb3..89878996 100644
--- a/services/nuldoc/public/slides/slides/2025-07-26/techramen-25-conf/index.html
+++ b/services/nuldoc/public/slides/slides/2025-07-26/techramen-25-conf/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>セルフホスト可能なCコンパイラを2000行弱で書く (TechRAMEN 2025 Conference)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -62,10 +62,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2025-07-26/techramen-25-conf/slides.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2025-07-26/techramen-25-conf/slides.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2025-07-26/techramen-25-conf/slides.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -74,6 +90,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -81,8 +100,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2025-07-26/techramen-25-conf/slides.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2025-10-29/phpstudy-tokyo-180/index.html b/services/nuldoc/public/slides/slides/2025-10-29/phpstudy-tokyo-180/index.html
index 4d30109d..76ee160e 100644
--- a/services/nuldoc/public/slides/slides/2025-10-29/phpstudy-tokyo-180/index.html
+++ b/services/nuldoc/public/slides/slides/2025-10-29/phpstudy-tokyo-180/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>浮動小数点数の半開区間で単一値を指定する (PHP 勉強会@東京 第180回)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -59,10 +59,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2025-10-29/phpstudy-tokyo-180/slides.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2025-10-29/phpstudy-tokyo-180/slides.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2025-10-29/phpstudy-tokyo-180/slides.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -71,6 +87,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -78,8 +97,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2025-10-29/phpstudy-tokyo-180/slides.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2025-11-24/phpconkagawa-2025/index.html b/services/nuldoc/public/slides/slides/2025-11-24/phpconkagawa-2025/index.html
index 1e2996fd..12b749c5 100644
--- a/services/nuldoc/public/slides/slides/2025-11-24/phpconkagawa-2025/index.html
+++ b/services/nuldoc/public/slides/slides/2025-11-24/phpconkagawa-2025/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>Pure PHP で作る簡易 HTTP サーバ (PHP カンファレンス香川 2025)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -62,10 +62,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2025-11-24/phpconkagawa-2025/slides.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2025-11-24/phpconkagawa-2025/slides.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2025-11-24/phpconkagawa-2025/slides.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -74,6 +90,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -81,8 +100,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2025-11-24/phpconkagawa-2025/slides.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2026-03-21/phperkaigi-2026-book-revue/index.html b/services/nuldoc/public/slides/slides/2026-03-21/phperkaigi-2026-book-revue/index.html
index 90334d1c..72ba9983 100644
--- a/services/nuldoc/public/slides/slides/2026-03-21/phperkaigi-2026-book-revue/index.html
+++ b/services/nuldoc/public/slides/slides/2026-03-21/phperkaigi-2026-book-revue/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>Ruby ソースコード完全解説 (PHPerKaigi 2026)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -65,10 +65,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2026-03-21/phperkaigi-2026-book-revue/slides.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2026-03-21/phperkaigi-2026-book-revue/slides.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2026-03-21/phperkaigi-2026-book-revue/slides.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -77,6 +93,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -84,8 +103,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2026-03-21/phperkaigi-2026-book-revue/slides.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2026-03-22/phperkaigi-2026/index.html b/services/nuldoc/public/slides/slides/2026-03-22/phperkaigi-2026/index.html
index d0bdbb21..fc84c80b 100644
--- a/services/nuldoc/public/slides/slides/2026-03-22/phperkaigi-2026/index.html
+++ b/services/nuldoc/public/slides/slides/2026-03-22/phperkaigi-2026/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>PHP を魔改造して学ぶ言語処理系 (PHPerKaigi 2026)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -62,10 +62,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2026-03-22/phperkaigi-2026/slides.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2026-03-22/phperkaigi-2026/slides.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2026-03-22/phperkaigi-2026/slides.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -74,6 +90,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -81,8 +100,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2026-03-22/phperkaigi-2026/slides.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2026-04-11/phpcon-odawara-2026/index.html b/services/nuldoc/public/slides/slides/2026-04-11/phpcon-odawara-2026/index.html
index ccb95bd7..38f8facd 100644
--- a/services/nuldoc/public/slides/slides/2026-04-11/phpcon-odawara-2026/index.html
+++ b/services/nuldoc/public/slides/slides/2026-04-11/phpcon-odawara-2026/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>Deep Dive into Xdebug (PHP カンファレンス小田原 2026)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -65,10 +65,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2026-04-11/phpcon-odawara-2026/slides.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2026-04-11/phpcon-odawara-2026/slides.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2026-04-11/phpcon-odawara-2026/slides.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -77,6 +93,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -84,8 +103,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2026-04-11/phpcon-odawara-2026/slides.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2026-05-25/phperkaigi-mini-1/index.html b/services/nuldoc/public/slides/slides/2026-05-25/phperkaigi-mini-1/index.html
index 01b4d377..21c16b5b 100644
--- a/services/nuldoc/public/slides/slides/2026-05-25/phperkaigi-mini-1/index.html
+++ b/services/nuldoc/public/slides/slides/2026-05-25/phperkaigi-mini-1/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>最近作っている Rust 製 Composer の進捗 (PHPerKaigi mini #1)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -68,10 +68,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2026-05-25/phperkaigi-mini-1/slides.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2026-05-25/phperkaigi-mini-1/slides.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2026-05-25/phperkaigi-mini-1/slides.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -80,6 +96,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -87,8 +106,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2026-05-25/phperkaigi-mini-1/slides.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/2026-07-27/phperkaigi-mini-3/index.html b/services/nuldoc/public/slides/slides/2026-07-27/phperkaigi-mini-3/index.html
index ecabd1a1..cd898701 100644
--- a/services/nuldoc/public/slides/slides/2026-07-27/phperkaigi-mini-3/index.html
+++ b/services/nuldoc/public/slides/slides/2026-07-27/phperkaigi-mini-3/index.html
@@ -15,10 +15,10 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>最近作っている Rust 製 Composer の進捗 (2026年7月) (PHPerKaigi mini #3)｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="single">
-    <link rel="stylesheet" href="/slides.css?h=48ccba536579d1291e7c04ae27851b57">
+    <link rel="stylesheet" href="/slides.css?h=d1639dd95e0e0082996901b5bfcf5fd6">
     <header class="header">
       <div class="site-logo">
         <a href="https://nsfisis.dev/">nsfisis.dev</a>
@@ -68,10 +68,26 @@
               </li>
             </ol>
           </section>
-          <div class="slide-container">
-            <canvas data-slide-link="/slides/2026-07-27/phperkaigi-mini-3/slides.pdf" id="slide">
-            </canvas>
+          <div class="slide-container" data-slide-link="/slides/2026-07-27/phperkaigi-mini-3/slides.pdf" id="slide-container">
+            <div class="slide-stage" id="slide-stage">
+              <canvas id="slide">
+              </canvas>
+              <div class="textLayer" id="text-layer">
+              </div>
+              <div class="annotationLayer" id="annotation-layer">
+              </div>
+            </div>
+            <div aria-live="polite" class="slide-status" hidden="hidden" id="slide-status" role="status">
+            </div>
           </div>
+          <noscript>
+            <style>
+              .slide-container,.controllers-buttons{display:none}
+            </style>
+            <p class="slide-noscript">
+              <a href="/slides/2026-07-27/phperkaigi-mini-3/slides.pdf">PDF をダウンロード</a>
+            </p>
+          </noscript>
           <div class="controllers">
             <div class="controllers-buttons">
               <button aria-label="前のページ (←/h)" id="prev" title="前のページ (←/h)" type="button">
@@ -80,6 +96,9 @@
                   </path>
                 </svg>
               </button>
+              <div class="page-indicator">
+                <input aria-label="ページ番号" class="page-input" id="page-input" inputmode="numeric" min="1" step="1" type="number" value="1"><span class="page-separator">/</span><span class="page-count" id="page-count">–</span>
+              </div>
               <button aria-label="次のページ (→/l)" id="next" title="次のページ (→/l)" type="button">
                 <svg fill="none" height="20" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="20">
                   <path d="M9 18l6-6-6-6">
@@ -87,8 +106,9 @@
                 </svg>
               </button>
             </div>
+            <a class="slide-download" download="" href="/slides/2026-07-27/phperkaigi-mini-3/slides.pdf">PDF をダウンロード</a>
           </div>
-          <script src="/slide.js?h=dcdc1524058e7cb08242f930fa849473" type="module">
+          <script src="/slide.js?h=4c869c1409da703e66a0d73294863232" type="module">
           </script>
         </div>
       </article>
diff --git a/services/nuldoc/public/slides/slides/index.html b/services/nuldoc/public/slides/slides/index.html
index 1942e66a..6d4c49b0 100644
--- a/services/nuldoc/public/slides/slides/index.html
+++ b/services/nuldoc/public/slides/slides/index.html
@@ -15,7 +15,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/slides/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>スライド一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/style.css b/services/nuldoc/public/slides/style.css
index f886658b..1c854d5c 100644
--- a/services/nuldoc/public/slides/style.css
+++ b/services/nuldoc/public/slides/style.css
@@ -206,6 +206,18 @@ li.revision {
   list-style: inside;
 }
 
+.align-left {
+  text-align: left;
+}
+
+.align-center {
+  text-align: center;
+}
+
+.align-right {
+  text-align: right;
+}
+
 h1 {
   font-size: 1.75rem;
 }
diff --git a/services/nuldoc/public/slides/tags/c/index.html b/services/nuldoc/public/slides/tags/c/index.html
index 5e5f43d9..32f95bb4 100644
--- a/services/nuldoc/public/slides/tags/c/index.html
+++ b/services/nuldoc/public/slides/tags/c/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/c/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「C」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/cohackpp/index.html b/services/nuldoc/public/slides/tags/cohackpp/index.html
index 4e9c8638..5a071b40 100644
--- a/services/nuldoc/public/slides/tags/cohackpp/index.html
+++ b/services/nuldoc/public/slides/tags/cohackpp/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/cohackpp/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「紅白ぺぱ合戦」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/composer/index.html b/services/nuldoc/public/slides/tags/composer/index.html
index 8f81299a..9531c9a3 100644
--- a/services/nuldoc/public/slides/tags/composer/index.html
+++ b/services/nuldoc/public/slides/tags/composer/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/composer/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「Composer」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/conference/index.html b/services/nuldoc/public/slides/tags/conference/index.html
index bb0d8d01..ba47e6a1 100644
--- a/services/nuldoc/public/slides/tags/conference/index.html
+++ b/services/nuldoc/public/slides/tags/conference/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/conference/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「カンファレンス」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/index.html b/services/nuldoc/public/slides/tags/index.html
index e37e91ec..d9bdd352 100644
--- a/services/nuldoc/public/slides/tags/index.html
+++ b/services/nuldoc/public/slides/tags/index.html
@@ -14,7 +14,7 @@
     <meta name="Hatena::Bookmark" content="nocomment">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/php/index.html b/services/nuldoc/public/slides/tags/php/index.html
index 5b26deca..bf1342b6 100644
--- a/services/nuldoc/public/slides/tags/php/index.html
+++ b/services/nuldoc/public/slides/tags/php/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/php/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「PHP」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/phpcon-nagoya/index.html b/services/nuldoc/public/slides/tags/phpcon-nagoya/index.html
index db7c85c5..db146e72 100644
--- a/services/nuldoc/public/slides/tags/phpcon-nagoya/index.html
+++ b/services/nuldoc/public/slides/tags/phpcon-nagoya/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/phpcon-nagoya/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「PHP カンファレンス名古屋」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/phpcon-odawara/index.html b/services/nuldoc/public/slides/tags/phpcon-odawara/index.html
index f89dd75e..a2fb62d0 100644
--- a/services/nuldoc/public/slides/tags/phpcon-odawara/index.html
+++ b/services/nuldoc/public/slides/tags/phpcon-odawara/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/phpcon-odawara/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「PHP カンファレンス小田原」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/phpconfuk/index.html b/services/nuldoc/public/slides/tags/phpconfuk/index.html
index 02f5226a..f665e3e2 100644
--- a/services/nuldoc/public/slides/tags/phpconfuk/index.html
+++ b/services/nuldoc/public/slides/tags/phpconfuk/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/phpconfuk/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「PHP カンファレンス福岡」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/phpconkagawa/index.html b/services/nuldoc/public/slides/tags/phpconkagawa/index.html
index 7a626c0e..16050e6c 100644
--- a/services/nuldoc/public/slides/tags/phpconkagawa/index.html
+++ b/services/nuldoc/public/slides/tags/phpconkagawa/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/phpconkagawa/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「PHP カンファレンス香川」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/phperkaigi/index.html b/services/nuldoc/public/slides/tags/phperkaigi/index.html
index b23f8aa8..eafd859d 100644
--- a/services/nuldoc/public/slides/tags/phperkaigi/index.html
+++ b/services/nuldoc/public/slides/tags/phperkaigi/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/phperkaigi/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「PHPerKaigi」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/phpstudy-tokyo/index.html b/services/nuldoc/public/slides/tags/phpstudy-tokyo/index.html
index 37463953..d6e555ac 100644
--- a/services/nuldoc/public/slides/tags/phpstudy-tokyo/index.html
+++ b/services/nuldoc/public/slides/tags/phpstudy-tokyo/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/phpstudy-tokyo/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「PHP 勉強会@東京」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/ruby/index.html b/services/nuldoc/public/slides/tags/ruby/index.html
index 3f700df1..771ecbb4 100644
--- a/services/nuldoc/public/slides/tags/ruby/index.html
+++ b/services/nuldoc/public/slides/tags/ruby/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/ruby/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「Ruby」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/rust/index.html b/services/nuldoc/public/slides/tags/rust/index.html
index 6b4f3d97..9e8833c4 100644
--- a/services/nuldoc/public/slides/tags/rust/index.html
+++ b/services/nuldoc/public/slides/tags/rust/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/rust/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「Rust」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/techramen/index.html b/services/nuldoc/public/slides/tags/techramen/index.html
index 02b3d12d..8dcf1564 100644
--- a/services/nuldoc/public/slides/tags/techramen/index.html
+++ b/services/nuldoc/public/slides/tags/techramen/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/techramen/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「TechRAMEN」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/wasm/index.html b/services/nuldoc/public/slides/tags/wasm/index.html
index 6ecf937b..6204d395 100644
--- a/services/nuldoc/public/slides/tags/wasm/index.html
+++ b/services/nuldoc/public/slides/tags/wasm/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/wasm/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「WebAssembly」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/xdebug/index.html b/services/nuldoc/public/slides/tags/xdebug/index.html
index b3934589..79acd76f 100644
--- a/services/nuldoc/public/slides/tags/xdebug/index.html
+++ b/services/nuldoc/public/slides/tags/xdebug/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/xdebug/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「Xdebug」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
diff --git a/services/nuldoc/public/slides/tags/ya8/index.html b/services/nuldoc/public/slides/tags/ya8/index.html
index 08c10bf5..7d28d499 100644
--- a/services/nuldoc/public/slides/tags/ya8/index.html
+++ b/services/nuldoc/public/slides/tags/ya8/index.html
@@ -16,7 +16,7 @@
     <link rel="alternate" type="application/atom+xml" href="https://slides.nsfisis.dev/tags/ya8/atom.xml">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg">
     <title>タグ「Ya8」一覧｜nsfisis’s slides</title>
-    <link rel="stylesheet" href="/style.css?h=bf289421c09405fa3c89dc8b18742368">
+    <link rel="stylesheet" href="/style.css?h=61618c116e07057fc873f7751f158cd7">
   </head>
   <body class="list">
     <header class="header">
author	nsfisis <nsfisis@gmail.com>	2026-08-08 10:38:18 +0900
committer	nsfisis <nsfisis@gmail.com>	2026-08-08 10:38:18 +0900
commit	4681e861efcdf9b0b73e3803e70712bc55162863 (patch)
tree	d910ef14d9549df19896d85a42e12a32db787fb6 /services/nuldoc/public/slides
parent	eca423774047122f7dfc4be9ac78626e32d733d3 (diff)
download	nsfisis.dev-main.tar.gz nsfisis.dev-main.tar.zst nsfisis.dev-main.zip