feat(nuldoc): first implementation of rendering slide

9 files changed, 115 insertions, 0 deletions

diff --git a/public/slide.js b/public/slide.js
new file mode 100644
index 0000000..77e49ac
--- /dev/null
+++ b/public/slide.js
@@ -0,0 +1,59 @@
+document.addEventListener("DOMContentLoaded", async () => {
+  const pdfjsLib = globalThis.pdfjsLib;
+  pdfjsLib.GlobalWorkerOptions.workerSrc = "https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.4.120/pdf.worker.min.js";
+
+  const canvas = document.getElementById("slide");
+  const ctx = canvas.getContext("2d");
+  const url = canvas.dataset.slideLink;
+
+  let pageNum = 1;
+  let pageNumPending = null;
+  let pageRendering = false;
+  let doc = null;
+
+  const renderPage = async (num) => {
+    pageRendering = true;
+    const page = await doc.getPage(num);
+
+    var viewport = page.getViewport({ scale: 1.0 });
+    canvas.height = viewport.height;
+    canvas.width = viewport.width;
+
+    // TODO: error handling
+    await page.render({
+      canvasContext: ctx,
+      viewport: viewport,
+    });
+
+    pageRendering = false;
+    if (pageNumPending !== null) {
+      renderPage(pageNumPending);
+      pageNumPending = null;
+    }
+  };
+
+  const queueRenderPage = (num) => {
+    if (pageRendering) {
+      pageNumPending = num;
+    } else {
+      renderPage(num);
+    }
+  };
+
+  const prev = document.getElementById("prev");
+  prev.addEventListener("click", () => {
+    if (pageNum <= 1) return;
+    pageNum--;
+    queueRenderPage(pageNum);
+  });
+  const next = document.getElementById("next");
+  next.addEventListener("click", () => {
+    if (pageNum >= doc.numPages) return;
+    pageNum++;
+    queueRenderPage(pageNum);
+  });
+
+  // TODO: error handling
+  doc = await pdfjsLib.getDocument(url).promise;
+  queueRenderPage(pageNum);
+});
diff --git a/public/slides/2023-01-18/phpstudy-tokyo-148/index.html b/public/slides/2023-01-18/phpstudy-tokyo-148/index.html
index 8c7dc09..df84fd0 100644
--- a/public/slides/2023-01-18/phpstudy-tokyo-148/index.html
+++ b/public/slides/2023-01-18/phpstudy-tokyo-148/index.html
@@ -56,6 +56,20 @@
               </li>
             </ol>
           </section>
+          <canvas data-slide-link="/slides/2023-01-18/phpstudy-tokyo-148/slide.pdf" id="slide">
+          </canvas>
+          <div>
+            <button id="prev">
+              Prev
+            </button>
+            <button id="next">
+              Next
+            </button>
+          </div>
+          <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.4.120/pdf.min.js">
+          </script>
+          <script src="/slide.js" type="module">
+          </script>
         </div>
       </article>
     </main>
diff --git a/public/slides/2023-01-18/phpstudy-tokyo-148/slide.pdf b/public/slides/2023-01-18/phpstudy-tokyo-148/slide.pdf
new file mode 100644
index 0000000..e50d08e
--- /dev/null
+++ b/public/slides/2023-01-18/phpstudy-tokyo-148/slide.pdf
diff --git a/public/slides/2023-02-15/phpstudy-tokyo-149/index.html b/public/slides/2023-02-15/phpstudy-tokyo-149/index.html
index 81b8b35..1bce7a6 100644
--- a/public/slides/2023-02-15/phpstudy-tokyo-149/index.html
+++ b/public/slides/2023-02-15/phpstudy-tokyo-149/index.html
@@ -56,6 +56,20 @@
               </li>
             </ol>
           </section>
+          <canvas data-slide-link="/slides/2023-02-15/phpstudy-tokyo-149/slide.pdf" id="slide">
+          </canvas>
+          <div>
+            <button id="prev">
+              Prev
+            </button>
+            <button id="next">
+              Next
+            </button>
+          </div>
+          <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.4.120/pdf.min.js">
+          </script>
+          <script src="/slide.js" type="module">
+          </script>
         </div>
       </article>
     </main>
diff --git a/public/slides/2023-02-15/phpstudy-tokyo-149/slide.pdf b/public/slides/2023-02-15/phpstudy-tokyo-149/slide.pdf
new file mode 100644
index 0000000..f51f6f8
--- /dev/null
+++ b/public/slides/2023-02-15/phpstudy-tokyo-149/slide.pdf
diff --git a/public/slides/2023-03-15/phpstudy-tokyo-150/index.html b/public/slides/2023-03-15/phpstudy-tokyo-150/index.html
index da09cc7..91e35ef 100644
--- a/public/slides/2023-03-15/phpstudy-tokyo-150/index.html
+++ b/public/slides/2023-03-15/phpstudy-tokyo-150/index.html
@@ -59,6 +59,20 @@
               </li>
             </ol>
           </section>
+          <canvas data-slide-link="/slides/2023-03-15/phpstudy-tokyo-150/slide.pdf" id="slide">
+          </canvas>
+          <div>
+            <button id="prev">
+              Prev
+            </button>
+            <button id="next">
+              Next
+            </button>
+          </div>
+          <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.4.120/pdf.min.js">
+          </script>
+          <script src="/slide.js" type="module">
+          </script>
         </div>
       </article>
     </main>
diff --git a/public/slides/2023-03-15/phpstudy-tokyo-150/slide.pdf b/public/slides/2023-03-15/phpstudy-tokyo-150/slide.pdf
new file mode 100644
index 0000000..fdc070c
--- /dev/null
+++ b/public/slides/2023-03-15/phpstudy-tokyo-150/slide.pdf
diff --git a/public/slides/2023-03-24/phperkaigi-2023/index.html b/public/slides/2023-03-24/phperkaigi-2023/index.html
index ab519dc..a07c224 100644
--- a/public/slides/2023-03-24/phperkaigi-2023/index.html
+++ b/public/slides/2023-03-24/phperkaigi-2023/index.html
@@ -56,6 +56,20 @@
               </li>
             </ol>
           </section>
+          <canvas data-slide-link="/slides/2023-03-24/phperkaigi-2023/slide.pdf" id="slide">
+          </canvas>
+          <div>
+            <button id="prev">
+              Prev
+            </button>
+            <button id="next">
+              Next
+            </button>
+          </div>
+          <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.4.120/pdf.min.js">
+          </script>
+          <script src="/slide.js" type="module">
+          </script>
         </div>
       </article>
     </main>
diff --git a/public/slides/2023-03-24/phperkaigi-2023/slide.pdf b/public/slides/2023-03-24/phperkaigi-2023/slide.pdf
new file mode 100644
index 0000000..6d3d9c3
--- /dev/null
+++ b/public/slides/2023-03-24/phperkaigi-2023/slide.pdf