<?php include('casa/setup.casa.php');
$titulo = 'Buscar por QR';
include('inc_head.php');
$codigo_venta = $_SESSION['codigo_venta'];
?>
<style>
html{
    font-family: Arial, Helvetica, sans-serif;
}
.busq{
	margin:14px 0;
  text-align:center;
  padding:7px;
  background:green;
  color: aliceblue;
}
button{
    background: green;
    border:none;
    border-radius: 7px;
    padding: 7px 14px;
    color: aliceblue;
    font-weight: bold;
}    
</style> 
<script src="<?php echo PATH_HOME.'qr/'; ?>html5-qrcode.min.js"></script>
</head>
<body>
	<div class="wrapper">
	
	<?php include('inc_menu2.php');?>
		<div class="main-panel">
			<div class="content">
				
			<div class="page-inner">
					
					<div class="row">						
						<div class="col-md-12">
							<div class="card">
								<div class="card-header">
									<div class="d-flex align-items-center">
										<h3 class="card-title"><?php echo $titulo;?></h3>																																									
									</div>
								</div>
								
								<div class="card-body">		
									<div class="table-responsive">
									
									<div id="qr-reader" style="width:100%"></div>
									<div id="qr-reader-results" align="center">Resultados de lectura QR</div>
										                                       
                                	</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				
			</div>
			<?php include('inc_pie.php');?>
			<div id='res'></div>
		</div>
		
		
	</div>
</body>
<script>
var html5QrcodeScanner = new Html5QrcodeScanner(
   "qr-reader", { fps: 10, qrbox: 200 });

function onScanSuccess(decodedText, decodedResult) {
    //console.log(`RESULTADO: ${decodedText}`, decodedResult);
    var resultContainer = document.getElementById('qr-reader-results');
    resultContainer.innerHTML = "<div class='busq' onclick=Android.BuscarItemQRTiendas('"+decodedText+"')>Item: "+decodedText+"</div>";
//    html5QrcodeScanner.clear();
}

html5QrcodeScanner.render(onScanSuccess);   

setInterval(() => {
    const selectElement = document.getElementById('html5-qrcode-select-camera');
    if (selectElement) {
        document.querySelectorAll("#html5-qrcode-select-camera option").forEach(option => {
            if (option.textContent.includes("front")) {
                option.remove();
            }
        });
        selectElement.selectedIndex = 0; 
        clearInterval(this);
    }
}, 1000);
</script>
</html>