David Frassi
45 lines
1.6 KiB
HTML
45 lines
1.6 KiB
HTML
<ion-header class="ion-no-border">
|
|
<ion-toolbar class="bg-gradient">
|
|
<ion-title class="outfit-font">Scansiona QR</ion-title>
|
|
<ion-buttons slot="end">
|
|
<ion-button (click)="cancel()" color="secondary" class="outfit-font">Chiudi</ion-button>
|
|
</ion-buttons>
|
|
</ion-toolbar>
|
|
</ion-header>
|
|
|
|
<ion-content class="ion-no-padding">
|
|
<div class="scanner-container">
|
|
<zxing-scanner
|
|
[formats]="allowedFormats"
|
|
[device]="currentDevice"
|
|
[autostart]="true"
|
|
[tryHarder]="false"
|
|
(camerasFound)="onCamerasFound($event)"
|
|
(scanSuccess)="onCodeResult($event)"
|
|
(scanError)="onScanError($event)"
|
|
(scanFailure)="onScanFailure($event)">
|
|
</zxing-scanner>
|
|
|
|
<div class="scan-overlay">
|
|
<div class="scan-frame"></div>
|
|
<p class="scan-text">Inquadra il QR Code della tua parrocchia</p>
|
|
</div>
|
|
|
|
<!-- Pulsante premium per cambiare fotocamera -->
|
|
<div class="camera-toggle-container" *ngIf="availableDevices.length > 1">
|
|
<button (click)="toggleCamera()" class="camera-toggle-btn">
|
|
<ion-icon name="camera-reverse-outline"></ion-icon>
|
|
<span>Cambia fotocamera</span>
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Messaggio di aiuto per utenti iPad in modalità desktop -->
|
|
<div class="ipad-warning-container" *ngIf="showIpadWarning">
|
|
<ion-icon name="information-circle-outline"></ion-icon>
|
|
<p>
|
|
Su iPad, se non vedi lo switch fotocamera, tocca l'icona <strong>"aA"</strong> in alto nella barra di Safari e seleziona <strong>"Richiedi sito mobile"</strong>.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</ion-content>
|