<?php include('auth_guard.php'); ?>
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Universal Scanner | Hamna Shahzadi</title>
    <script src="https://unpkg.com/html5-qrcode"></script>
    <style>
        body { background: #1a1a1a; color: white; font-family: Arial; text-align: center; padding: 20px; }
        #reader { 
            width: 100%; 
            max-width: 500px; 
            margin: 20px auto; 
            border: 2px solid #0056b3; 
            border-radius: 10px;
            overflow: hidden;
        }
        #result-container {
            margin-top: 20px;
            padding: 20px;
            background: #262626;
            display: inline-block;
            border-radius: 8px;
            border: 1px solid #444;
        }
        #result-text { color: #00ff00; font-weight: bold; font-size: 1.2rem; word-break: break-all; }
        .btn-link { color: #007bff; text-decoration: none; display: block; margin-top: 10px; }
    </style>
</head>
<body>

    <h2>Universal QR & Barcode Scanner</h2>
    <p>Place your QR code or Barcode in front of the camera</p>

    <div id="reader"></div>

    <div id="result-container">
        <span>Scanned Result:</span>
        <div id="result-text">Waiting for scan...</div>
        <div id="action-button"></div>
    </div>

    <script>
        function onScanSuccess(decodedText, decodedResult) {
            // 1. Result dikhayen
            document.getElementById('result-text').innerText = decodedText;

            // 2. Agar result ek URL hai, to button dikhayen ke us par click kiya ja sake
            let actionBox = document.getElementById('action-button');
            if (decodedText.startsWith('http')) {
                actionBox.innerHTML = `<a href="${decodedText}" target="_blank" class="btn-link">Open This Link</a>`;
            } else {
                actionBox.innerHTML = "";
            }
            
            // Optional: Scan hone par vibrate kare (agar mobile hai)
            if (navigator.vibrate) navigator.vibrate(100);
        }

        function onScanFailure(error) {
            // Ye function tab chalta hai jab camera ko kuch nazar nahi aata
            // Isse khali chor dena behtar hai taake console barha na ho
        }

        let html5QrcodeScanner = new Html5QrcodeScanner(
            "reader", 
            { 
                fps: 15,      // Frames per second (jitna zyada, utna smooth scan)
                qrbox: { width: 250, height: 250 }, // Scanner ka focus box
                aspectRatio: 1.0 
            }
        );
        
        html5QrcodeScanner.render(onScanSuccess, onScanFailure);
    </script>
</body>
</html>