<?xml version="1.0" encoding="UTF-8"?>
<templates xml:space="preserve">
    <t t-name="hr_attendance.public_kiosk_greetings">
        <t t-if="this.attendance">
            <t t-call="hr_attendance.EmployeeBadge">
                <t t-set="employeeAvatar" t-value="this.employeeAvatar"/>
            </t>
            <div t-if="attendance.check_out" class="flex-grow-1">
                <h1 class="mt-5">Goodbye <t t-esc="this.employeeName"/>!</h1>
                <div class="alert alert-info fs-2 mx-3" role="status">
                    Checked out at <b><t t-esc="this.check_out_time"/></b>
                </div>
                <div class="alert alert-info fs-2 mx-3" role="status">
                    <b>Hours Today : <t t-esc="this.hoursToday"/></b>
                    <t t-if="this.overtimeToday">
                        <br/>
                        <b>
                            Extra hours today: <span t-esc="this.overtimeToday"/>
                        </b>
                    </t>
                </div>
                <t t-if="this.totalOvertime">
                    <div class="alert alert-info h3 mx-3" role="status">
                        Total extra hours: <span t-esc="this.totalOvertime"/>
                    </div>
                </t>
            </div>
            <div t-else="" class="flex-grow-1">
                <h1 class="mt-5 mb0">Welcome <t t-esc="this.employeeName"/>!</h1>
                <div class="alert alert-info fs-2 mx-3" role="status">
                    Checked in at <b><t t-esc="this.check_in_time"/></b>
                </div>
                <t t-if="this.hoursToday">
                    <div class="alert alert-info fs-2 mx-3" role="status">
                        <b>
                            Hours Previously Today: <span t-esc="this.hoursToday"/>
                        </b>
                    </div>
                </t>
            </div>
            <div class="flex-grow-1">
                <button class="o_hr_attendance_button_dismiss align-self-center btn btn-primary btn-lg px-5 py-3" t-on-click="this.props.kioskReturn">
                    <span class="fs-2" t-if="attendance.check_out">Goodbye</span>
                    <span class="fs-2" t-else="">OK</span>
                </button>
            </div>
        </t>
        <t t-else="">
            <div class="flex-grow-1">
                <div class="alert alert-warning mt-5 mx-3" role="alert">
                    <h4 class="alert-heading">Invalid request</h4>
                    <p>Please return to the main menu.</p>
                </div>
            </div>
            <div class="flex-grow-1">
                <button class="o_hr_attendance_button_dismiss btn btn-primary btn-lg fs-2 px-5 py-3" t-on-click="this.props.kioskReturn">
                    <i class="oi oi-chevron-left me-2"/>
                    <span class="fs-2">Go back</span>
                </button>
            </div>
        </t>
    </t>
</templates>
