<?php $__env->startSection('title', $siteName . ' — ' . $newspaper->publish_date->format('d M Y')); ?>
<?php $__env->startSection('meta_description', 'Read ' . $newspaper->publish_date->format('d M Y') . ' edition of ' . $siteName); ?>
<?php $__env->startPush('styles'); ?>
<style>
/* ════════════════════════════════════════════════════════
READER — 80% newspaper | 20% right sidebar
════════════════════════════════════════════════════════ */
.main-content { padding: 0 !important; display: flex !important; flex-direction: column !important; }
.reader-shell { display: flex; flex-direction: column; flex: 1; }
/* ── Two-column body ──────────────────────────────────── */
.r-body { display: flex; align-items: flex-start; }
/* ── LEFT 80% — newspaper page ──────────────────────── */
.r-paper {
flex: 1;
min-width: 0;
background: #d0c8b8;
padding: 0;
display: flex;
flex-direction: column;
}
/* page panels */
.r-page-panel { display: none; width: 100%; }
.r-page-panel.active { display: block; }
.r-zoom-target { transform-origin: top left; transition: transform .2s ease; }
.r-page-wrap {
position: relative;
background: #fff;
box-shadow: 2px 0 12px rgba(0,0,0,.18);
overflow: hidden;
width: 100%;
}
.r-page-wrap img {
display: block;
width: 100%;
height: auto;
}
.r-page-title {
text-align: center; padding: 6px 0;
font-family: 'Playfair Display',serif; font-size:.82rem;
color:#fff; text-transform:uppercase; letter-spacing:1px;
background:#2c2c2c;
}
/* ── RIGHT 20% — sidebar (calendar + ad) ────────────── */
.r-sidebar {
width: 210px;
flex-shrink: 0;
background: #fff;
border-left: 1px solid #ddd;
padding: 12px 10px;
display: flex;
flex-direction: column;
gap: 14px;
}
/* Calendar widget */
.cal-widget { font-family:'Inter',sans-serif; }
.cal-head-label {
font-size:.62rem; font-weight:700; text-transform:uppercase;
letter-spacing:1.4px; color:#999; border-bottom:2px solid #c0392b;
padding-bottom:6px; margin-bottom:8px;
display:flex; align-items:center; gap:5px;
}
.cal-nav {
display:flex; align-items:center; justify-content:space-between;
margin-bottom:8px;
}
.cal-nav-btn {
background:none; border:1px solid #e0e0e0; border-radius:4px;
width:24px; height:24px; cursor:pointer; font-size:.75rem;
display:flex; align-items:center; justify-content:center;
transition:background .15s;
}
.cal-nav-btn:hover { background:#fdf0e0; border-color:#c0392b; color:#c0392b; }
.cal-month-title { font-size:.78rem; font-weight:700; color:#1a1a2e; }
.cal-weekdays {
display:grid; grid-template-columns:repeat(7,1fr);
text-align:center; margin-bottom:4px;
}
.cal-weekdays span { font-size:.55rem; font-weight:700; color:#bbb; padding:2px 0; }
.cal-days { display:grid; grid-template-columns:repeat(7,1fr); gap:2px; }
.cal-day {
aspect-ratio:1; border-radius:4px; font-size:.68rem;
display:flex; align-items:center; justify-content:center;
cursor:default; color:#ccc;
}
.cal-day.has-edition {
background:#fdf6ea; color:#333; cursor:pointer; font-weight:600;
border:1px solid #f0e0c0; text-decoration:none;
transition:background .15s;
}
.cal-day.has-edition:hover { background:#f5d5b0; border-color:#c0392b; color:#c0392b; }
.cal-day.today { background:#c0392b !important; color:#fff !important; border-color:#c0392b !important; font-weight:700; }
.cal-day.empty { cursor:default; }
/* Ad slot */
.r-ad-slot {
background:#f8f8f8; border:1px dashed #ddd; border-radius:6px;
min-height:120px; display:flex; align-items:center; justify-content:center;
font-family:'Inter',sans-serif; font-size:.7rem; color:#bbb;
text-align:center; flex-direction:column; gap:6px; padding:10px;
overflow:hidden;
}
.r-ad-slot--filled {
background:none; border:none; border-radius:0;
padding:0; min-height:0; display:block;
}
.r-ad-slot--filled img { width:100%; height:auto; display:block; }
.r-ad-slot--filled a { display:block; }
/* ── Hotspot overlay ──────────────────────────────────── */
.hotspot-area {
position: absolute;
cursor: pointer;
box-sizing: border-box;
border: 2px solid transparent;
background: rgba(192,57,43,0);
transition: background .2s, border-color .2s;
z-index: 10;
}
.hotspot-area:hover {
background: rgba(192,57,43,.13);
border-color: rgba(192,57,43,.8);
}
.hotspot-area::before { /* pulsing dot */
content: '';
position: absolute; top: 5px; left: 5px;
width: 9px; height: 9px; border-radius: 50%;
background: #c0392b;
animation: hs-dot 2s infinite;
}
@keyframes hs-dot {
0%,100% { box-shadow: 0 0 0 0 rgba(192,57,43,.7); }
50% { box-shadow: 0 0 0 6px rgba(192,57,43,0); }
}
/* ════════════════════════════════════════════════════════
ARTICLE POPUP — transparent overlay canvas viewer
════════════════════════════════════════════════════════ */
.hs-overlay {
display: none;
position: fixed; inset: 0;
z-index: 9999;
flex-direction: column;
background: rgba(0,0,0,.82);
}
.hs-overlay.open { display: flex; }
/* Floating close button — top-right corner */
.hs-close-btn {
position: fixed; top: 14px; right: 18px; z-index: 10000;
background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.25);
color: #fff; border-radius: 6px; padding: 6px 14px;
font-family: 'Inter', sans-serif; font-size: .8rem; font-weight: 500;
cursor: pointer;
display: flex; align-items: center; gap: 6px;
transition: background .15s;
}
.hs-close-btn:hover { background: rgba(192,57,43,.75); border-color: #c0392b; }
.hs-body {
flex: 1; overflow-y: auto; overflow-x: hidden;
display: flex; flex-direction: column; align-items: center;
background: transparent;
padding-top: 50px;
}
.hs-loading {
flex: 1; display: flex; align-items: center; justify-content: center;
flex-direction: column; gap: 12px;
color: #c0c0c0; font-family: 'Inter', sans-serif; font-size: .85rem;
}
.hs-spinner {
width: 36px; height: 36px;
border: 3px solid rgba(255,255,255,.15);
border-top-color: #c0392b;
border-radius: 50%;
animation: spin .7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
#hsCropCanvas { display: block; max-width: 100%; height: auto; box-shadow: 0 8px 40px rgba(0,0,0,.6); }
.hs-bottombar {
background: rgba(20,20,40,.88); padding: 9px 18px;
display: flex; align-items: center; justify-content: space-between; gap: 12px;
flex-shrink: 0; border-top: 1px solid rgba(255,255,255,.07);
backdrop-filter: blur(6px);
}
.hs-bottombar-left { display: flex; align-items: center; gap: 8px; }
.hs-zoomlabel { font-family:'Inter',sans-serif; font-size:.72rem; color:#8892b0; }
.hs-zoom-btn {
background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);
color: #ccc; border-radius: 4px; width: 28px; height: 28px;
cursor: pointer; font-size: .85rem;
display: flex; align-items: center; justify-content: center;
transition: background .15s;
}
.hs-zoom-btn:hover { background: rgba(255,255,255,.2); color: #fff; }
.hs-readmore-btn {
background: #c0392b; color: #fff; border: none; border-radius: 5px;
padding: 7px 18px; font-family: 'Inter', sans-serif;
font-size: .82rem; font-weight: 600;
cursor: pointer; text-decoration: none;
display: inline-flex; align-items: center; gap: 6px;
transition: background .15s; white-space: nowrap;
}
.hs-readmore-btn:hover { background: #a93226; color: #fff; }
.hs-readmore-btn.hidden { display: none; }
/* ── Page number strip ──────────────────────────────── */
.r-page-strip {
display: flex;
align-items: center;
gap: 5px;
padding: 8px 12px;
background: #f7f7f7;
border-bottom: 1px solid #e5e5e5;
flex-wrap: wrap;
}
.r-pg-num {
min-width: 34px; height: 30px;
padding: 0 8px;
border: 1px solid #d1d5db;
background: #fff;
border-radius: 4px;
font-family: 'Inter', sans-serif;
font-size: .8rem; font-weight: 700;
cursor: pointer; color: #374151;
display: flex; align-items: center; justify-content: center;
transition: background .15s, color .15s, border-color .15s;
}
.r-pg-num:hover { background: #f0f0f0; border-color: #aaa; }
.r-pg-num.active { background: #c0392b; color: #fff; border-color: #c0392b; }
.r-pg-arrow {
height: 30px; padding: 0 10px;
border: 1px solid #d1d5db;
background: #fff;
border-radius: 4px;
font-size: .8rem; font-family: 'Inter', sans-serif;
cursor: pointer; color: #374151;
display: flex; align-items: center; gap: 4px;
transition: background .15s;
}
.r-pg-arrow:hover { background: #f0f0f0; }
.r-pg-arrow:disabled { opacity: .35; cursor: default; }
/* ── mobile responsive ────────────────────────────────── */
@media (max-width: 768px) {
.r-sidebar { display: none; }
.r-paper { padding: 10px 8px; }
}
</style>
<?php $__env->stopPush(); ?>
<?php $__env->startSection('content'); ?>
<div class="reader-shell">
<div class="r-body">
<div class="r-paper" id="rPaper">
<?php if($newspaper->pages->count() > 1): ?>
<div class="r-page-strip">
<button id="btnPrevPage" type="button" class="r-pg-arrow" disabled>
<i class="bi bi-chevron-left"></i> পূর্ববর্তী
</button>
<?php $__currentLoopData = $newspaper->pages; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $page): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
<button type="button"
class="r-pg-num page-nav-link <?php echo e($loop->first ? 'active' : ''); ?>"
data-page="<?php echo e($page->page_number); ?>">
<?php echo e($page->page_number); ?>
</button>
<?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
<button id="btnNextPage" type="button" class="r-pg-arrow">
পরবর্তী <i class="bi bi-chevron-right"></i>
</button>
</div>
<?php else: ?>
<button id="btnPrevPage" type="button" style="display:none" disabled></button>
<button id="btnNextPage" type="button" style="display:none" disabled></button>
<?php endif; ?>
<?php $__currentLoopData = $newspaper->pages; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $page): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
<div class="r-page-panel <?php echo e($loop->first ? 'active' : ''); ?>"
id="panel-<?php echo e($page->page_number); ?>">
<?php if($page->title): ?>
<div class="r-page-title">
Page <?php echo e($page->page_number); ?>: <?php echo e($page->title); ?>
</div>
<?php endif; ?>
<div class="r-zoom-target" id="zt-<?php echo e($page->page_number); ?>">
<div class="r-page-wrap">
<img src="<?php echo e($page->image_url); ?>"
alt="Page <?php echo e($page->page_number); ?>"
id="img-<?php echo e($page->page_number); ?>">
<?php $__currentLoopData = $page->hotspots; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $hotspot): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
<div class="hotspot-area"
role="button" tabindex="0"
data-title="<?php echo e($hotspot->title); ?>"
data-image="<?php echo e($page->image_url); ?>"
data-x="<?php echo e($hotspot->x_percent); ?>"
data-y="<?php echo e($hotspot->y_percent); ?>"
data-w="<?php echo e($hotspot->width_percent); ?>"
data-h="<?php echo e($hotspot->height_percent); ?>"
data-link-type="<?php echo e($hotspot->link_type); ?>"
data-link-val="<?php echo e($hotspot->link_value); ?>"
aria-label="<?php echo e($hotspot->title ?: 'View article'); ?>"
style="left:<?php echo e($hotspot->x_percent); ?>%;top:<?php echo e($hotspot->y_percent); ?>%;
width:<?php echo e($hotspot->width_percent); ?>%;height:<?php echo e($hotspot->height_percent); ?>%">
</div>
<?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
</div>
</div>
</div>
<?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
</div>
<div class="r-sidebar" id="rSidebar">
<div class="cal-widget">
<div class="cal-head-label">
<i class="bi bi-calendar3"></i> আর্কাইভ
</div>
<div class="cal-nav">
<button class="cal-nav-btn" id="calPrev" title="আগের মাস">‹</button>
<span class="cal-month-title" id="calTitle"></span>
<button class="cal-nav-btn" id="calNext" title="পরের মাস">›</button>
</div>
<div class="cal-weekdays">
<span>র</span><span>সো</span><span>ম</span>
<span>বু</span><span>বৃ</span><span>শু</span><span>শ</span>
</div>
<div class="cal-days" id="calDays"></div>
</div>
<?php
$ad1 = \App\Models\Setting::get('sidebar_ad_1');
$ad2 = \App\Models\Setting::get('sidebar_ad_2');
?>
<?php if($ad1): ?>
<div class="r-ad-slot r-ad-slot--filled"><?php echo $ad1; ?></div>
<?php else: ?>
<div class="r-ad-slot">
<i class="bi bi-image" style="font-size:1.6rem;opacity:.3"></i>
<span>বিজ্ঞাপন ১</span>
</div>
<?php endif; ?>
<?php if($ad2): ?>
<div class="r-ad-slot r-ad-slot--filled"><?php echo $ad2; ?></div>
<?php else: ?>
<div class="r-ad-slot">
<i class="bi bi-image" style="font-size:1.6rem;opacity:.3"></i>
<span>বিজ্ঞাপন ২</span>
</div>
<?php endif; ?>
</div>
</div>
</div>
<div class="hs-overlay" id="hsOverlay" role="dialog" aria-modal="true">
<button class="hs-close-btn" id="hsClose">
<i class="bi bi-x-lg"></i> Close
</button>
<div class="hs-body" id="hsBody">
<div class="hs-loading" id="hsLoading">
<div class="hs-spinner"></div>
<span>Loading article…</span>
</div>
<canvas id="hsCropCanvas" style="display:none"></canvas>
</div>
<div class="hs-bottombar">
<div class="hs-bottombar-left">
<span class="hs-zoomlabel" id="hsZoomPct">100%</span>
<button class="hs-zoom-btn" id="hsZoomIn" title="Zoom in"><i class="bi bi-plus"></i></button>
<button class="hs-zoom-btn" id="hsZoomOut" title="Zoom out"><i class="bi bi-dash"></i></button>
<button class="hs-zoom-btn" id="hsZoomFit" title="Fit"><i class="bi bi-aspect-ratio"></i></button>
</div>
<a href="#" id="hsReadMore" class="hs-readmore-btn hidden" target="_blank" rel="noopener noreferrer">
<i class="bi bi-box-arrow-up-right"></i> Read More
</a>
</div>
</div>
<?php $__env->stopSection(); ?>
<?php $__env->startPush('scripts'); ?>
<script>
(function () {
'use strict';
/* ══════════════════════════════════════════════════
0. CALENDAR ARCHIVE WIDGET
══════════════════════════════════════════════════ */
(function () {
var availableDates = <?php echo json_encode($allDates, 15, 512) ?>;
var dateSet = {};
availableDates.forEach(function(d) { dateSet[d] = true; });
var currentDate = '<?php echo e($newspaper->publish_date->format("Y-m-d")); ?>';
var parts = currentDate.split('-');
var calYear = parseInt(parts[0]);
var calMonth = parseInt(parts[1]); // 1-based
var monthsBn = ['জানুয়ারি','ফেব্রুয়ারি','মার্চ','এপ্রিল','মে','জুন',
'জুলাই','আগস্ট','সেপ্টেম্বর','অক্টোবর','নভেম্বর','ডিসেম্বর'];
function pad(n) { return n < 10 ? '0' + n : '' + n; }
function renderCalendar() {
document.getElementById('calTitle').textContent =
monthsBn[calMonth - 1] + ' ' + calYear;
var grid = document.getElementById('calDays');
grid.innerHTML = '';
var firstDay = new Date(calYear, calMonth - 1, 1).getDay(); // 0=Sun
var daysInMonth = new Date(calYear, calMonth, 0).getDate();
var today = new Date().toISOString().slice(0, 10);
// blank cells for days before month start
for (var i = 0; i < firstDay; i++) {
var blank = document.createElement('span');
blank.className = 'cal-day empty';
grid.appendChild(blank);
}
for (var d = 1; d <= daysInMonth; d++) {
var dateStr = calYear + '-' + pad(calMonth) + '-' + pad(d);
var el;
if (dateSet[dateStr]) {
el = document.createElement('a');
el.href = '<?php echo e(url("/newspaper")); ?>/' + dateStr;
el.className = 'cal-day has-edition' +
(dateStr === currentDate ? ' today' : '');
el.title = dateStr;
} else {
el = document.createElement('span');
el.className = 'cal-day' + (dateStr === today ? ' today' : '');
}
el.textContent = d;
grid.appendChild(el);
}
}
document.getElementById('calPrev').addEventListener('click', function () {
calMonth--;
if (calMonth < 1) { calMonth = 12; calYear--; }
renderCalendar();
});
document.getElementById('calNext').addEventListener('click', function () {
calMonth++;
if (calMonth > 12) { calMonth = 1; calYear++; }
renderCalendar();
});
renderCalendar();
})();
/* ══════════════════════════════════════════════════
1. PAGE SWITCHING
══════════════════════════════════════════════════ */
var currentPage = 1;
function switchPage(num) {
/* hide old panel */
var old = document.querySelector('.r-page-panel.active');
if (old) old.classList.remove('active');
/* show new panel */
var panel = document.getElementById('panel-' + num);
if (!panel) return;
panel.classList.add('active');
currentPage = num;
/* scroll viewer back to top */
document.getElementById('rPaper').scrollTop = 0;
}
/* ══════════════════════════════════════════════════
2. ARTICLE CANVAS POPUP
══════════════════════════════════════════════════ */
var overlay = document.getElementById('hsOverlay');
var hsBody = document.getElementById('hsBody');
var canvas = document.getElementById('hsCropCanvas');
var ctx = canvas.getContext('2d');
var loading = document.getElementById('hsLoading');
var readMore = document.getElementById('hsReadMore');
var zoomPct = document.getElementById('hsZoomPct');
var imgCache = {};
var current = null;
var artZoom = 0.75;
function renderCanvas(img, x, y, w, h, zoom) {
var dpr = window.devicePixelRatio || 1;
var srcX = img.naturalWidth * x / 100;
var srcY = img.naturalHeight * y / 100;
var srcW = img.naturalWidth * w / 100;
var srcH = img.naturalHeight * h / 100;
/* CSS display size */
var cssW = Math.round(window.innerWidth * zoom);
var cssH = Math.round(srcH / srcW * cssW);
/* Physical pixel budget — draw at full device resolution */
var physW = Math.round(cssW * dpr);
var physH = Math.round(cssH * dpr);
canvas.width = physW;
canvas.height = physH;
canvas.style.width = cssW + 'px';
canvas.style.height = cssH + 'px';
ctx.imageSmoothingEnabled = true;
ctx.imageSmoothingQuality = 'high';
ctx.drawImage(img, srcX, srcY, srcW, srcH, 0, 0, physW, physH);
canvas.style.display = 'block';
loading.style.display = 'none';
hsBody.scrollTop = 0;
zoomPct.textContent = Math.round(zoom * 100) + '%';
}
function openPopup(hs) {
var title = hs.dataset.title || '';
var imageUrl = hs.dataset.image;
var x = parseFloat(hs.dataset.x);
var y = parseFloat(hs.dataset.y);
var w = parseFloat(hs.dataset.w);
var h = parseFloat(hs.dataset.h);
var linkType = hs.dataset.linkType || '';
var linkVal = hs.dataset.linkVal || '';
artZoom = 0.75;
current = { imageUrl: imageUrl, x: x, y: y, w: w, h: h };
canvas.style.display = 'none';
loading.style.display = 'flex';
overlay.classList.add('open');
document.body.style.overflow = 'hidden';
/* Read More */
var href = '';
if (linkType === 'url' && linkVal) href = linkVal;
if (linkType === 'page' && linkVal) href = '#panel-' + linkVal;
if (linkType === 'anchor' && linkVal) href = '#' + linkVal;
if (href) {
readMore.href = href;
readMore.classList.remove('hidden');
if (linkType === 'url') {
readMore.setAttribute('target', '_blank');
readMore.onclick = null;
} else {
readMore.removeAttribute('target');
readMore.onclick = function (e) {
e.preventDefault();
closePopup();
if (linkType === 'page') switchPage(parseInt(linkVal, 10));
};
}
} else {
readMore.classList.add('hidden');
}
/* draw */
if (imgCache[imageUrl]) {
renderCanvas(imgCache[imageUrl], x, y, w, h, artZoom);
} else {
var tmp = new Image();
tmp.onload = function () {
imgCache[imageUrl] = tmp;
if (overlay.classList.contains('open')) {
renderCanvas(tmp, x, y, w, h, artZoom);
}
};
tmp.src = imageUrl;
}
}
function closePopup() {
overlay.classList.remove('open');
document.body.style.overflow = '';
current = null;
}
function reZoom(z) {
artZoom = Math.min(4, Math.max(0.5, z));
if (current && imgCache[current.imageUrl]) {
renderCanvas(imgCache[current.imageUrl],
current.x, current.y, current.w, current.h, artZoom);
}
}
document.getElementById('hsZoomIn').onclick = function () { reZoom(artZoom + 0.25); };
document.getElementById('hsZoomOut').onclick = function () { reZoom(artZoom - 0.25); };
document.getElementById('hsZoomFit').onclick = function () { reZoom(1); };
document.getElementById('hsClose').addEventListener('click', closePopup);
document.addEventListener('keydown', function (e) { if (e.key === 'Escape') closePopup(); });
/* pinch zoom on mobile */
var pinch0 = null;
hsBody.addEventListener('touchstart', function (e) {
if (e.touches.length === 2)
pinch0 = Math.hypot(e.touches[1].clientX - e.touches[0].clientX,
e.touches[1].clientY - e.touches[0].clientY);
}, { passive: true });
hsBody.addEventListener('touchmove', function (e) {
if (e.touches.length !== 2 || !pinch0) return;
var d = Math.hypot(e.touches[1].clientX - e.touches[0].clientX,
e.touches[1].clientY - e.touches[0].clientY);
reZoom(artZoom * (d / pinch0));
pinch0 = d;
}, { passive: true });
/* wire hotspots */
document.querySelectorAll('.hotspot-area').forEach(function (hs) {
hs.addEventListener('click', function (e) { e.stopPropagation(); openPopup(this); });
hs.addEventListener('keydown', function (e) {
if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); openPopup(this); }
});
});
/* ══════════════════════════════════════════════════
4. NAVBAR PAGE LINKS
══════════════════════════════════════════════════ */
var btnPrevPage = document.getElementById('btnPrevPage');
var btnNextPage = document.getElementById('btnNextPage');
var totalPages = <?php echo e($newspaper->pages->count()); ?>;
function updatePageNavBtns() {
if (btnPrevPage) btnPrevPage.disabled = (currentPage <= 1);
if (btnNextPage) btnNextPage.disabled = (currentPage >= totalPages);
}
if (btnPrevPage) {
btnPrevPage.addEventListener('click', function () {
if (currentPage > 1) switchPage(currentPage - 1);
});
}
if (btnNextPage) {
btnNextPage.addEventListener('click', function () {
if (currentPage < totalPages) switchPage(currentPage + 1);
});
}
document.querySelectorAll('.page-nav-link').forEach(function (a) {
a.addEventListener('click', function (e) {
e.preventDefault();
switchPage(parseInt(this.dataset.page, 10));
});
});
/* keep navbar active state + prev/next buttons in sync with switchPage */
var _origSwitch = switchPage;
switchPage = function (num) {
_origSwitch(num);
document.querySelectorAll('.page-nav-link').forEach(function (a) {
a.classList.toggle('active', parseInt(a.dataset.page, 10) === num);
});
updatePageNavBtns();
};
updatePageNavBtns();
})();
</script>
<?php $__env->stopPush(); ?>
<?php echo $__env->make('layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /home/boguraj1/public_html/epaper/resources/views/frontend/reader.blade.php ENDPATH**/ ?>