<ion-content>
	<ion-progress-bar *ngIf="(scanning | async)" type="indeterminate"></ion-progress-bar>
	<ion-grid class="center-form">
		<ion-row>
			<ion-col>
				<tap-connect-socket (onError)="onError($event)" (onProtocolSelected)="onProtocolSelected($event)"></tap-connect-socket>
			</ion-col>
		</ion-row>
        <% if (hasProtocol('wifi')) { %>
		<ion-row>
			<ion-col>
				<ion-refresher (ionRefresh)="refreshScan($event)" pullmin="120" slot="fixed">
					<ion-refresher-content></ion-refresher-content>
                </ion-refresher>
                <app-feedback-error [error]="error"></app-feedback-error>
				<tap-scanner-wifi-item (onItemClicked)="onItemClicked($event)" [devices]="devicesSnapshot"></tap-scanner-wifi-item>
                <div *ngIf="(!devicesSnapshot || devicesSnapshot.length === 0) && !(scanning | async)" class="no-tap-found">
                    <ion-icon name="list-outline"></ion-icon>
                    <p>
                        Run scanner to find Tap.
                    </p>
                </div>
			</ion-col>
		</ion-row>
        <% } %>
    </ion-grid>
    <% if (hasProtocol('wifi')) { %>
    <ion-fab horizontal="end" slot="fixed" vertical="bottom">
        <ion-fab-button id="BtnStartScan" (click)="startScan()" *ngIf="!(scanning | async)">
            <ion-icon name="search"></ion-icon>
        </ion-fab-button>
        <ion-fab-button id="BtnStopScan" (click)="stopScan()" *ngIf="(scanning | async)">
            <ion-icon name="pause"></ion-icon>
        </ion-fab-button>
    </ion-fab>
    <% } %>
</ion-content>