@php
    // Fallbacki bezpieczne dla renderowania bez kompletu props.
    $_vebId = $id ?? 'view-export-toolbar';
    $_vebTargetSelector = $targetSelector ?? '#view-export-root';
    $_vebFilenamePrefix = $filenamePrefix ?? 'Widok';
    $_vebTitleDoc = $titleDoc ?? 'Eksport do DOC';
    $_vebTitlePdf = $titlePdf ?? 'Eksport do PDF';
    $_vebTitlePng = $titlePng ?? 'Eksport do PNG';
    $_vebTitleHtml = $titleHtml ?? 'Eksport do HTML';
    $_vebTitlePrint = $titlePrint ?? 'Drukuj widok';
    $_vebDocLandscape = (bool) ($docLandscape ?? false);
    $_vebDocChartScale = (float) ($docChartScale ?? 1.0);
    if ($_vebDocChartScale <= 0) {
        $_vebDocChartScale = 1.0;
    }
    $_vebPrintFixCards = (bool) ($printFixCards ?? false);
    $_vebPrintAsImage = (bool) ($printAsImage ?? false);
@endphp

<div id="{{ $_vebId }}" class="d-inline-flex align-items-center odo-export-toolbar view-export-toolbar">
    <button type="button" class="btn btn-primary btn_table_status btn-outline-secondary js-view-export-btn" data-format="doc" data-toggle="tooltip" title="{{ $_vebTitleDoc }}">
        <i class="fas fa-file-word fa-lg"></i>
    </button>
    <button type="button" class="btn btn-danger btn_table_status btn-outline-secondary js-view-export-btn" data-format="pdf" data-toggle="tooltip" title="{{ $_vebTitlePdf }}">
        <i class="fas fa-file-pdf fa-lg"></i>
    </button>
    <button type="button" class="btn btn-success btn_table_status btn-outline-secondary js-view-export-btn" data-format="png" data-toggle="tooltip" title="{{ $_vebTitlePng }}">
        <i class="fas fa-file-image fa-lg"></i>
    </button>
    <button type="button" class="btn btn-info btn_table_status btn-outline-secondary js-view-export-btn" data-format="html" data-toggle="tooltip" title="{{ $_vebTitleHtml }}">
        <i class="fas fa-file-code fa-lg"></i>
    </button>
    <button type="button" class="btn btn-secondary btn_table_status btn-outline-secondary js-view-export-btn" data-format="print" data-toggle="tooltip" title="{{ $_vebTitlePrint }}">
        <i class="fas fa-print fa-lg"></i>
    </button>
</div>

<style>
    .view-export-toolbar .btn { margin-left: 4px; }
</style>

<script>
    (function () {
        var toolbarId = @json($_vebId);
        var targetSelector = @json($_vebTargetSelector);
        var filenamePrefix = @json($_vebFilenamePrefix);
        var docLandscape = @json($_vebDocLandscape);
        var docChartScale = @json($_vebDocChartScale);
        var printFixCards = @json($_vebPrintFixCards);
        var printAsImage = @json($_vebPrintAsImage);
        var scriptLoaded = window.__viewExportScriptsLoaded || {};
        window.__viewExportScriptsLoaded = scriptLoaded;

        function nowStamp() {
            var d = new Date();
            var pad = function (v) { return String(v).padStart(2, '0'); };
            return d.getFullYear() + '-' + pad(d.getMonth() + 1) + '-' + pad(d.getDate())
                + '_' + pad(d.getHours()) + '-' + pad(d.getMinutes()) + '-' + pad(d.getSeconds());
        }

        function safeFilename(ext) {
            return filenamePrefix + '_' + nowStamp() + '.' + ext;
        }

        function downloadBlob(blob, fileName) {
            var link = document.createElement('a');
            var url = URL.createObjectURL(blob);
            link.href = url;
            link.download = fileName;
            document.body.appendChild(link);
            link.click();
            setTimeout(function () {
                URL.revokeObjectURL(url);
                link.remove();
            }, 300);
        }

        function collectStyles() {
            var css = '';
            document.querySelectorAll('style').forEach(function (styleTag) {
                css += '\n' + (styleTag.textContent || '');
            });
            css += '\n.view-export-document { width: 100% !important; max-width: 100% !important; overflow: visible !important; }';
            css += '\n.view-export-document * { box-sizing: border-box; }';
            css += '\n.view-export-document .view-export-chart-image { display: block; width: 100% !important; max-width: 100% !important; height: auto !important; }';
            css += '\n.view-export-document .tableFixHead, .view-export-document .my_scrollbar_new, .view-export-document [id$="export-root"] { height: auto !important; max-height: none !important; overflow: visible !important; overflow-y: visible !important; }';
            css += '\nbody { background: #fff; margin: 0; padding: 16px; }';
            if (docLandscape) {
                css += '\n@page { size: landscape; margin: 12mm; }';
            }
            return css;
        }

        function collectStylesheetLinks() {
            var links = '';
            document.querySelectorAll('link[rel="stylesheet"]').forEach(function (linkTag) {
                var href = linkTag.getAttribute('href');
                if (!href) return;
                links += '<link rel="stylesheet" href="' + href + '">';
            });
            return links;
        }

        function cloneRoot() {
            var source = document.querySelector(targetSelector);
            if (!source) return null;
            var clone = source.cloneNode(true);

            // Usuwamy elementy techniczne, których nie chcemy w eksporcie.
            clone.querySelectorAll('.js-view-export-btn, .view-export-toolbar, .btn-close, .close').forEach(function (el) {
                el.remove();
            });

            // Neutralizacja kontenera ze scrollem (np. height: 75vh; overflow-y:auto),
            // aby eksport/druk obejmowal cały widok.
            clone.style.width = '100%';
            clone.style.maxWidth = '100%';
            clone.style.height = 'auto';
            clone.style.maxHeight = 'none';
            clone.style.overflow = 'visible';
            clone.style.overflowY = 'visible';

            // Klon canvas nie przenosi narysowanej zawartosci (np. Chart.js),
            // dlatego zamieniamy go na osadzony obraz PNG.
            var sourceCanvases = source.querySelectorAll('canvas');
            var cloneCanvases = clone.querySelectorAll('canvas');
            var canvasCount = Math.min(sourceCanvases.length, cloneCanvases.length);

            for (var i = 0; i < canvasCount; i++) {
                var sourceCanvas = sourceCanvases[i];
                var cloneCanvas = cloneCanvases[i];
                if (!sourceCanvas || !cloneCanvas) {
                    continue;
                }

                try {
                    var dataUrl = sourceCanvas.toDataURL('image/png');
                    if (!dataUrl || dataUrl.indexOf('data:image/') !== 0) {
                        continue;
                    }

                    var img = document.createElement('img');
                    img.src = dataUrl;
                    img.alt='Wykres';
                    img.className = ((sourceCanvas.className || '') + ' view-export-chart-image').trim();

                    var inlineStyle = sourceCanvas.getAttribute('style');
                    if (inlineStyle) {
                        img.setAttribute('style', inlineStyle);
                    } else {
                        var computed = window.getComputedStyle(sourceCanvas);
                        if (computed) {
                            img.style.width = computed.width;
                            img.style.height = computed.height;
                        }
                    }

                    img.style.display = 'block';
                    img.style.width = '100%';
                    img.style.maxWidth = '100%';
                    img.style.height = 'auto';
                    var sourceComputed = window.getComputedStyle(sourceCanvas);
                    var baseWidth = parseFloat(sourceComputed && sourceComputed.width ? sourceComputed.width : '') || sourceCanvas.width || 0;
                    if (baseWidth > 0) {
                        img.setAttribute('data-export-base-width', String(Math.round(baseWidth)));
                    }
                    cloneCanvas.parentNode.replaceChild(img, cloneCanvas);
                } catch (e) {
                    // Gdy canvas jest "tainted" pozostawiamy go bez podmiany.
                }
            }

            return clone;
        }

        function buildHtml(title, extraCss, mutateFn) {
            var clone = cloneRoot();
            if (!clone) return null;
            if (typeof mutateFn === 'function') {
                mutateFn(clone);
            }

            var wrapper = document.createElement('div');
            wrapper.className = 'view-export-document';
            wrapper.appendChild(clone);

            return '<!doctype html><html><head><meta charset="utf-8"><title>' + title + '</title>'
                + collectStylesheetLinks()
                + '<style>' + collectStyles() + '\n' + String(extraCss || '') + '</style>'
                + '</head><body>' + wrapper.innerHTML + '</body></html>';
        }

        function buildWordDocHtml(title, extraCss, mutateFn) {
            var clone = cloneRoot();
            if (!clone) return null;
            if (typeof mutateFn === 'function') {
                mutateFn(clone);
            }

            var wrapper = document.createElement('div');
            wrapper.className = 'view-export-document';
            wrapper.appendChild(clone);

            var officeXml = '<!--[if gte mso 9]><xml>'
                + '<w:WordDocument>'
                + '<w:View>Print</w:View>'
                + '<w:DisplayHorizontalDrawingGridEvery>0</w:DisplayHorizontalDrawingGridEvery>'
                + '<w:DisplayVerticalDrawingGridEvery>0</w:DisplayVerticalDrawingGridEvery>'
                + '<w:DoNotOptimizeForBrowser/>'
                + '</w:WordDocument>'
                + '</xml><![endif]-->';

            return '<!doctype html>'
                + '<html xmlns:o="urn:schemas-microsoft-com:office:office"'
                + ' xmlns:w="urn:schemas-microsoft-com:office:word"'
                + ' xmlns="http://www.w3.org/TR/REC-html40">'
                + '<head><meta charset="utf-8"><meta name="ProgId" content="Word.Document"><meta name="Generator" content="Microsoft Word 15"><title>' + title + '</title>'
                + officeXml
                + collectStylesheetLinks()
                + '<style>' + collectStyles() + '\n' + String(extraCss || '') + '</style>'
                + '</head>'
                + '<body><div class="Section1 WordSection1">' + wrapper.innerHTML + '</div></body></html>';
        }

        function buildDomHost(extraCss) {
            var clone = cloneRoot();
            if (!clone) {
                return null;
            }

            var host = document.createElement('div');
            host.style.position = 'fixed';
            host.style.left = '-100000px';
            host.style.top = '0';
            host.style.background = '#fff';
            host.style.padding = '16px';
            host.style.zIndex = '-1';
            host.style.width = docLandscape ? '1400px' : '1000px';

            var styleTag = document.createElement('style');
            styleTag.textContent = collectStyles() + '\n' + String(extraCss || '');

            var wrapper = document.createElement('div');
            wrapper.className = 'view-export-document';
            wrapper.appendChild(clone);

            host.appendChild(styleTag);
            host.appendChild(wrapper);
            document.body.appendChild(host);

            return host;
        }

        function ensureScript(url, checkFnName, key) {
            return new Promise(function (resolve, reject) {
                if (checkFnName()) {
                    resolve();
                    return;
                }
                if (scriptLoaded[key]) {
                    scriptLoaded[key].then(resolve).catch(reject);
                    return;
                }

                scriptLoaded[key] = new Promise(function (innerResolve, innerReject) {
                    var s = document.createElement('script');
                    s.src = url;
                    s.async = true;
                    s.onload = function () { innerResolve(); };
                    s.onerror = function () { innerReject(new Error('Nie udało się zaladowac biblioteki: ' + key)); };
                    document.head.appendChild(s);
                });

                scriptLoaded[key].then(resolve).catch(reject);
            });
        }

        function normalizeText(value) {
            return String(value || '')
                .replace(/\u00a0/g, ' ')
                .replace(/[ \t]+/g, ' ')
                .replace(/[ \t]+\n/g, '\n')
                .replace(/\n{3,}/g, '\n\n')
                .trim();
        }

        function extractPdfText(clone) {
            if (!clone) {
                return '';
            }

            var lines = [];
            var titleEl = clone.querySelector('.site_name, h1, h2, h3, h4, h5, h6');
            if (titleEl) {
                lines.push(normalizeText(titleEl.textContent));
                lines.push('');
            }

            var summaryLines = [];
            clone.querySelectorAll('strong').forEach(function (strongEl) {
                var value = normalizeText(strongEl.textContent);
                if (!value) {
                    return;
                }
                var labelEl = strongEl.parentElement ? strongEl.parentElement.querySelector('div') : null;
                var label = labelEl ? normalizeText(labelEl.textContent) : '';
                if (label) {
                    summaryLines.push(label + ': ' + value);
                }
            });

            summaryLines = summaryLines.filter(function (line, index, arr) {
                return line && arr.indexOf(line) === index;
            });

            if (summaryLines.length) {
                lines.push('Podsumowanie:');
                summaryLines.forEach(function (line) {
                    lines.push('- ' + line);
                });
                lines.push('');
            }

            var tables = clone.querySelectorAll('table');
            if (tables.length) {
                tables.forEach(function (table, tableIndex) {
                    lines.push('Tabela ' + (tableIndex + 1) + ':');

                    var headerCells = table.querySelectorAll('thead th');
                    if (headerCells.length) {
                        var header = Array.prototype.map.call(headerCells, function (cell) {
                            return normalizeText(cell.textContent);
                        }).join(' | ');
                        lines.push(header);
                        lines.push(Array(header.length + 1).join('-'));
                    }

                    var rowNodes = table.querySelectorAll('tbody tr, tfoot tr');
                    rowNodes.forEach(function (row) {
                        var cells = row.querySelectorAll('th, td');
                        var rowText = Array.prototype.map.call(cells, function (cell) {
                            return normalizeText(cell.textContent);
                        }).join(' | ');
                        if (rowText) {
                            lines.push(rowText);
                        }
                    });

                    lines.push('');
                });
            } else {
                var fallbackText = normalizeText(clone.innerText || clone.textContent || '');
                if (fallbackText) {
                    lines.push(fallbackText);
                }
            }

            return normalizeText(lines.join('\n'));
        }

        function renderCloneToCanvas(scaleOverride) {
            var clone = cloneRoot();
            if (!clone) {
                return Promise.reject(new Error('Nie znaleziono elementu do eksportu.'));
            }

            return ensureScript(
                'https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js',
                function () { return typeof window.html2canvas === 'function'; },
                'html2canvas'
            ).then(function () {
                var host = document.createElement('div');
                host.style.position = 'fixed';
                host.style.left = '-100000px';
                host.style.top = '0';
                host.style.background = '#fff';
                host.style.padding = '16px';
                host.style.zIndex = '-1';

                var styleTag = document.createElement('style');
                styleTag.textContent = collectStyles();
                host.appendChild(styleTag);
                host.appendChild(clone);
                document.body.appendChild(host);

                return window.html2canvas(host, {
                    backgroundColor: '#ffffff',
                    useCORS: true,
                    scale: (typeof scaleOverride === 'number' ? scaleOverride : 2)
                }).then(function (canvas) {
                    host.remove();
                    return canvas;
                }).catch(function (err) {
                    host.remove();
                    throw err;
                });
            });
        }

        function exportDoc() {
            var pageMaxWidth = docLandscape ? 1020 : 700;
            var chartMaxWidth = docLandscape ? 900 : 580;
            var pageCss = docLandscape
                ? '@page Section1 { size: 841.9pt 595.3pt; mso-page-orientation: landscape; margin: 28.35pt 28.35pt 28.35pt 28.35pt; }'
                : '@page Section1 { size: 595.3pt 841.9pt; mso-page-orientation: portrait; margin: 28.35pt 28.35pt 28.35pt 28.35pt; }';

            var html = buildWordDocHtml(filenamePrefix,
                pageCss
                + '\nbody { mso-page: Section1; }'
                + '\ndiv.Section1 { page: Section1; mso-page: Section1; }'
                + '\ndiv.WordSection1 { page: Section1; mso-page: Section1; }'
                + '\nhtml, body { width: ' + pageMaxWidth + 'px !important; max-width: ' + pageMaxWidth + 'px !important; }'
                + '\n.view-export-document { width: ' + pageMaxWidth + 'px !important; max-width: ' + pageMaxWidth + 'px !important; margin: 0 auto !important; }'
                + '\n.view-export-document .view-export-chart-image { width: ' + chartMaxWidth + 'px !important; max-width: ' + chartMaxWidth + 'px !important; height: auto !important; }'
                + '\n.view-export-document table { width: 100% !important; table-layout: fixed !important; }'
                + '\n.view-export-document img { max-width: 100% !important; height: auto !important; }',
                function (clone) {
                    clone.querySelectorAll('.view-export-chart-image').forEach(function (img) {
                        var baseWidth = parseFloat(img.getAttribute('data-export-base-width') || '') || chartMaxWidth;
                        var scaledWidth = Math.round(baseWidth * (Number(docChartScale) || 1));
                        var targetWidth = Math.max(120, Math.min(scaledWidth, chartMaxWidth));
                        img.style.width = targetWidth + 'px';
                        img.style.maxWidth = targetWidth + 'px';
                        img.style.height = 'auto';
                        img.setAttribute('width', String(targetWidth));
                        img.removeAttribute('height');
                    });
                }
            );
            if (!html) return;
            var blob = new Blob([html], { type: 'application/msword;charset=utf-8' });
            downloadBlob(blob, safeFilename('doc'));
        }

        function exportHtml() {
            var html = buildHtml(filenamePrefix);
            if (!html) return;
            var blob = new Blob([html], { type: 'text/html;charset=utf-8' });
            downloadBlob(blob, safeFilename('html'));
        }

        function exportPng() {
            renderCloneToCanvas().then(function (canvas) {
                canvas.toBlob(function (blob) {
                    if (!blob) return;
                    downloadBlob(blob, safeFilename('png'));
                }, 'image/png');
            }).catch(function (err) {
                console.error(err);
                alert('Nie udało się wygenerować PNG.');
            });
        }

        function exportPdf() {
            Promise.all([
                renderCloneToCanvas(1.25),
                ensureScript(
                    'https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js',
                    function () { return !!(window.jspdf && window.jspdf.jsPDF); },
                    'jspdf'
                )
            ]).then(function (results) {
                var canvas = results[0];
                var jsPDF = window.jspdf.jsPDF;

                var pdf = new jsPDF({
                    orientation: docLandscape ? 'landscape' : 'portrait',
                    unit: 'pt',
                    format: 'a4'
                });

                var pageWidth = pdf.internal.pageSize.getWidth();
                var pageHeight = pdf.internal.pageSize.getHeight();
                var margin = 20;
                var printableWidth = pageWidth - (margin * 2);
                var printableHeight = pageHeight - (margin * 2);

                var scale = printableWidth / canvas.width;
                var renderedHeight = canvas.height * scale;

                if (renderedHeight <= printableHeight) {
                    var imageDataSingle = canvas.toDataURL('image/png');
                    pdf.addImage(imageDataSingle, 'PNG', margin, margin, printableWidth, renderedHeight, undefined, 'FAST');
                } else {
                    var sourceY = 0;
                    var sliceHeightPx = Math.max(1, Math.floor(printableHeight / scale));
                    var tmpCanvas = document.createElement('canvas');
                    var tmpCtx = tmpCanvas.getContext('2d');

                    tmpCanvas.width = canvas.width;

                    var firstPage = true;
                    while (sourceY < canvas.height) {
                        var currentSliceHeight = Math.min(sliceHeightPx, canvas.height - sourceY);
                        tmpCanvas.height = currentSliceHeight;
                        tmpCtx.clearRect(0, 0, tmpCanvas.width, tmpCanvas.height);
                        tmpCtx.drawImage(
                            canvas,
                            0, sourceY, canvas.width, currentSliceHeight,
                            0, 0, canvas.width, currentSliceHeight
                        );

                        var imageData = tmpCanvas.toDataURL('image/png');
                        var pageSliceHeight = currentSliceHeight * scale;

                        if (!firstPage) {
                            pdf.addPage();
                        }
                        firstPage = false;

                        pdf.addImage(imageData, 'PNG', margin, margin, printableWidth, pageSliceHeight, undefined, 'FAST');
                        sourceY += currentSliceHeight;
                    }
                }

                pdf.save(safeFilename('pdf'));
            }).catch(function (err) {
                console.error(err);
                alert('Nie udało się wygenerować PDF.');
            });
        }

        function printCurrentView() {
            if (printAsImage) {
                renderCloneToCanvas(1.25).then(function (canvas) {
                    var imageData = canvas.toDataURL('image/png');
                    var htmlImage = '<!doctype html><html><head><meta charset="utf-8"><title>' + filenamePrefix + '</title>'
                        + '<style>@page{margin:8mm;}html,body{margin:0;padding:0;background:#fff;}img{display:block;width:100%;max-width:100%;height:auto;}</style>'
                        + '</head><body><img src="' + imageData + '" alt="Wydruk"></body></html>';
                    printHtmlInIframe(htmlImage);
                }).catch(function (err) {
                    console.error(err);
                    alert('Nie udało się przygotować obrazu do wydruku.');
                });
                return;
            }

            var printExtraCss = '';
            if (printFixCards) {
                printExtraCss = ''
                    + '.view-export-document .row { display: block !important; margin-left: 0 !important; margin-right: 0 !important; }'
                    + '\n.view-export-document [class*="col-"] { float: none !important; display: block !important; width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; }'
                    + '\n.view-export-document [style*="position:relative"] { overflow: visible !important; min-height: auto !important; }'
                    + '\n.view-export-document .view-export-chart-image { position: static !important; width: 42% !important; max-width: 42% !important; height: auto !important; max-height: 220px !important; object-fit: contain !important; margin-left: auto !important; margin-right: auto !important; }'
                    + '\n.view-export-document .export-print-card { page-break-inside: avoid !important; break-inside: avoid-page !important; margin-bottom: 10px !important; }'
                    + '\n.view-export-document .export-print-card + .export-print-card { page-break-before: always !important; break-before: page !important; }'
                    + '\n.view-export-document .div_new_table { page-break-before: always !important; break-before: page !important; margin-top: 10px !important; }'
                    + '\n.view-export-document .tableFixHead, .view-export-document .my_scrollbar_new { overflow: visible !important; height: auto !important; max-height: none !important; }';
            }
            var html = buildHtml(filenamePrefix, printExtraCss, function (clone) {
                if (!printFixCards) {
                    return;
                }
                var cardCols = clone.querySelectorAll('.col-xl-3.col-lg-4.col-md-6, .col-xl-3.col-lg-4.col-md-6.mb-3');
                cardCols.forEach(function (col) {
                    col.classList.add('export-print-card');
                });
            });
            if (!html) return;
            printHtmlInIframe(html);
        }

        function printHtmlInIframe(html) {
            var iframe = document.createElement('iframe');
            iframe.style.position = 'fixed';
            iframe.style.right = '0';
            iframe.style.bottom = '0';
            iframe.style.width = '0';
            iframe.style.height = '0';
            iframe.style.border = '0';
            iframe.style.visibility = 'hidden';
            document.body.appendChild(iframe);

            var cleanup = function () {
                setTimeout(function () {
                    iframe.remove();
                }, 500);
            };

            iframe.onload = function () {
                var frameWindow = iframe.contentWindow;
                if (!frameWindow) {
                    cleanup();
                    return;
                }

                var finished = false;
                var finish = function () {
                    if (finished) return;
                    finished = true;
                    cleanup();
                };

                frameWindow.addEventListener('afterprint', finish);
                setTimeout(function () {
                    frameWindow.focus();
                    frameWindow.print();
                    setTimeout(finish, 2000);
                }, 150);
            };

            var frameDoc = iframe.contentDocument || (iframe.contentWindow && iframe.contentWindow.document);
            if (!frameDoc) {
                cleanup();
                return;
            }

            frameDoc.open();
            frameDoc.write(html);
            frameDoc.close();
        }

        $(document).on('click', '#' + toolbarId + ' .js-view-export-btn', function () {
            var format = String($(this).data('format') || '').toLowerCase();
            if (!format) return;

            if (format === 'doc') { exportDoc(); return; }
            if (format === 'pdf') { exportPdf(); return; }
            if (format === 'png') { exportPng(); return; }
            if (format === 'html') { exportHtml(); return; }
            if (format === 'print') { printCurrentView(); return; }
        });
    })();
</script>