From 4f13ac7bd8676cd5a39fb402555586f78fc59ba1 Mon Sep 17 00:00:00 2001
From: Dobromir Popov <dobromir.popov@gateway.one>
Date: Mon, 4 Mar 2024 12:20:49 +0200
Subject: [PATCH 1/3] try to use pdf viewer

---
 components/pdfViewer.jsx | 30 ++++++++++++++++++++++++++++++
 1 file changed, 30 insertions(+)
 create mode 100644 components/pdfViewer.jsx

diff --git a/components/pdfViewer.jsx b/components/pdfViewer.jsx
new file mode 100644
index 0000000..8d2fcf2
--- /dev/null
+++ b/components/pdfViewer.jsx
@@ -0,0 +1,30 @@
+import React, { useState, useEffect } from 'react';
+import { pdfjs, Document, Page } from 'react-pdf';
+
+// Set workerSrc to load PDF.js worker (important for performance)
+//pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`;
+
+const PDFJsViewer = ({ fileUrl }) => {
+    const [numPages, setNumPages] = useState(null);
+
+    function onDocumentLoadSuccess({ numPages }) {
+        setNumPages(numPages);
+        console.log("PDF pages: " + numPages);
+    }
+
+    return (
+        <div>
+            <Document
+                file={fileUrl}
+                onLoadSuccess={onDocumentLoadSuccess}
+                options={{ workerSrc: "https://unpkg.com/pdfjs-dist@3.4.120/build/pdf.worker.min.js" }}
+            >
+                {Array.from(new Array(numPages), (el, index) => (
+                    <Page key={`page_${index + 1}`} pageNumber={index + 1} />
+                ))}
+            </Document>
+        </div>
+    );
+};
+
+export default PDFJsViewer;

From 34cf8732e177757b00675807532ff857872b9222 Mon Sep 17 00:00:00 2001
From: Dobromir Popov <dobromir.popov@gateway.one>
Date: Mon, 4 Mar 2024 12:42:38 +0200
Subject: [PATCH 2/3] try using embed instaed of object to fix apple view

---
 pages/guidelines.tsx | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/pages/guidelines.tsx b/pages/guidelines.tsx
index c0eeccd..689105a 100644
--- a/pages/guidelines.tsx
+++ b/pages/guidelines.tsx
@@ -25,7 +25,7 @@ const PDFViewerPage = () => {
     };
 
     return (
-        <Layout>
+        <Layout><script src="https://mozilla.github.io/pdf.js/dist/pdf.js"></script>
             <h1 className="text-3xl font-bold">Напътствия</h1>
             <div className="guidelines-section mb-5 p-4 bg-gray-100 rounded-lg">
                 <h2 className="text-2xl font-semibold mb-3">Важни напътствия за службата</h2>
@@ -59,12 +59,17 @@ const PDFViewerPage = () => {
                         </React.Fragment>
                     ))}
                 </div>
-                <div style={{ width: 'calc(100% - 1rem)', height: '100%', margin: '0 0' }}> {/* Center the PDF with 2rem margin */}
-                    <object data={pdfFile} type="application/pdf" style={{ width: '100%', height: '100%' }}>
+                <div style={{ width: 'calc(100% - 1rem)', height: '100%', margin: '0 0' }}>
+                    <embed src={pdfFile} type="application/pdf" style={{ width: '100%', height: '100%' }} />
+                    {/* <object data={pdfFile} type="application/pdf" page="2" style={{ width: '100%', height: '100%' }}>
+
                         <p>Your browser does not support PDFs. Please download the PDF to view it: <a href={pdfFile}>Свали PDF файла</a>.</p>
                         <p>Вашият браузър не поддържа PDFs файлове. Моля свалете файла за да го разгледате: <a href={pdfFile}>Свали PDF файла</a>.</p>
-                    </object>
+                    </object> */}
                 </div>
+                {/* <iframe src={`https://docs.google.com/gview?url=${baseUrl}${pdfFile}&embedded=true`} style={{ width: '100%', height: '100%' }} frameBorder="0"></iframe> */}
+
+
             </div>
         </Layout >
     );

From 0793dbb164d87053fe75422e29f8d2b272c66305 Mon Sep 17 00:00:00 2001
From: Dobromir Popov <dobromir.popov@gateway.one>
Date: Mon, 4 Mar 2024 12:55:17 +0200
Subject: [PATCH 3/3] added link to guidelines as view is not showing full PDF
 on all devices

---
 pages/guidelines.tsx | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/pages/guidelines.tsx b/pages/guidelines.tsx
index 689105a..823df6a 100644
--- a/pages/guidelines.tsx
+++ b/pages/guidelines.tsx
@@ -59,6 +59,12 @@ const PDFViewerPage = () => {
                         </React.Fragment>
                     ))}
                 </div>
+                <p className="p-2 pb-5">
+                    <a href={pdfFile} className="text-blue-600 hover:text-blue-800 visited:text-purple-600 underline" target='_blank'>
+                        Свали Напътствията
+                    </a>
+                </p>
+
                 <div style={{ width: 'calc(100% - 1rem)', height: '100%', margin: '0 0' }}>
                     <embed src={pdfFile} type="application/pdf" style={{ width: '100%', height: '100%' }} />
                     {/* <object data={pdfFile} type="application/pdf" page="2" style={{ width: '100%', height: '100%' }}>