@extends('layouts.main')

@section('title', 'Okis 3.0 | Auftrag finden')

@section('content')

	<article class="container">
		@includeIf('layouts.components.container_header', [
			'title_primary' 	=> 'Auftrag finden',
			'btn_back'			=> route('home'),
			'btn_title_attr'	=> 'zum Dashboard',
		])

		<section class="row">
			<div class="col-xl-9 d-xl-flex justify-content-center p-0 w-xl-76 pb-mobile">
				@includeIf('flash_message', ['alert_type' => 'orders'])

				<section class="col-xl-8 p-0 card card-light">
					<div class="card-body mb-2">
						<div class="row mt-3 px-0 mx-auto">
							@includeIf('layouts.components.file_upload', [ 
								'input_id' 		=> 'order_id_scan',
								'input_name' 	=> 'order_id_scan',
								'input_class' 	=> '',
								'accept_format' => 'qr',
								'label'			=> 'Qr Code scennen2',
								'title'			=> 'Qr Code scennen',
								'multiple'		=> false,
								'required'		=> true,
								'dont_auto_show_scanner' => true,
							])
						</div>
					</div>
				</section>

				<script src="https://unpkg.com/html5-qrcode" type="text/javascript"></script>
				<script>
					const html5QrcodeScanner = new Html5Qrcode("order_id_scan");
					const config = { fps: 10, qrbox: { width: 250, height: 250 } };

					function onScanSuccess(decodedText, decodedResult) {
						// Handle on success condition with the decoded text or result.
						// console.log(`Scan result: ${decodedText}`, decodedResult);

						// console.log($(this))
						// alert(decodedText);
						// ...

						var jsParam = decodedText; // set the JavaScript parameter here
						var url 	= "{{ route('orders.edit', ':jsParam') }}"; // replace 'route-name' with the name of your Laravel route
						url 		= url.replace(':jsParam', jsParam);

						// if (Route.has(url)) {
						    window.location.href = url; // redirect to the route if it exists
						// } else {
						//     console.warn('Route does not exist'); // display an error message if the route does not exist
						// }

						// window.location.href = url;
					}
					function onScanFailure(error) {
					  // handle scan failure, usually better to ignore and keep scanning.
					  // for example:
					//   console.warn(`Code scan error = ${error}`);
					}

					html5QrcodeScanner.start({ facingMode: "environment" }, config, onScanSuccess, onScanFailure);
				</script>

			</div>
		</section>
	</article>
	
@endsection