@extends('layouts/app')
@section('css')
    <style type="text/css" nonce="{{ csp_nonce() }}">
        .card-header {
            background-color: white !important;
            color: black !important;
        }

        .w-25 {
            max-width: 250px !important;
        }

        .tabdisplay {
            display: none;
        }
    </style>
@stop

@section('content')
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h4 class="card-title">POS Setting</h4>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item">Device Management</li>
                        <li class="breadcrumb-item"><a href="{{ route('device-management.posSetting') }}">POS Setting</a>
                        </li>
                    </ol>
                </div>
            </div>
        </div>
    </div>
    <div class="content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-12">
                    <div class="card card-secondary">
                        @if (Session::has('message'))
                            <div class="alert alert-success alert-dismissible">
                                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                                <h5><i class="icon fas fa-check"></i> Success!</h5>
                                {{ Session::get('message') }}
                                @php
                                    Session::forget('message');
                                @endphp
                            </div>
                        @endif
                        @if(Session::has('error'))
                        <div class="alert alert-danger">
                            <h5><i class="icon fas fa-x"></i> Errors!</h5>
                            @foreach(Session::get('error') as $err)
                            {{ $err }}<br>
                            @endforeach
                            @php
                            Session::forget('error');
                            @endphp
                        </div>
                        @endif        
                        <form name=f_a id="formPS" action="{{ route('device-management.getPosSettings') }}" method="get">
                            @csrf
                            @if (Auth::user()->userIsHQBranchs())
                                <div class="card-header">
                                    <div class="col-sm-6">
                                        <div class="form-group">
                                            <label for="branch">Branch</label>
                                            <select id="branch" class="form-control" name="branch">
                                                @foreach ($branches as $branch)
                                                    <option value="{{ $branch->id }}"
                                                        @if (in_array($branch->id, $branchIds)) selected="selected" @endif>
                                                        {{ $branch->code }}</option>
                                                @endforeach
                                            </select>
                                            @if ($errors->has('branch'))
                                                <span class="text-danger">{{ $errors->first('branch') }}</span>
                                            @endif
                                        </div>
                                    </div>
                                </div>
                            @endif
                            <div class="card-body">
                                <div class="form-group">
                                    <table class="table table-hover small">
                                        <tr>
                                            <td class="w-25"><b>Minimum Mobile POS/Kiosk Allowed Transaction Time</b></td>
                                            <td class="w-75">
                                                <select name=form[minimum_pos_start_hour]>
                                                    {{-- {section name=i loop=24}
                                                <option value="{$smarty.section.i.iteration-1}" {if $form.minimum_pos_start_hour == ($smarty.section.i.iteration-1)}selected{/if}>{$smarty.section.i.iteration-1}</option>
                                            {/section} --}}
                                                    @for ($i = 0; $i < 24; $i++)
                                                        <option value="{{ $i }}"
                                                            @if (isset($form['minimum_pos_start_hour']) && in_array($i, [$form['minimum_pos_start_hour']])) selected="selected" @endif>
                                                            {{ $i }}</option>
                                                    @endfor
                                                </select>
                                                <b>:</b>
                                                <select name=form[minimum_pos_start_minute]>
                                                    {{-- {section name=i loop=60}
                                                <option value="{$smarty.section.i.iteration-1}" {if $form.minimum_pos_start_minute == ($smarty.section.i.iteration-1)}selected{/if}>{$smarty.section.i.iteration-1|string_format:"%02d"}</option>
                                            {/section} --}}
                                                    @for ($i = 0; $i < 60; $i++)
                                                        <option value="{{ $i }}"
                                                            @if (isset($form['minimum_pos_start_minute']) && in_array($i, [$form['minimum_pos_start_minute']])) selected="selected" @endif>
                                                            {{ $i }}</option>
                                                    @endfor
                                                </select>
                                                {{-- <input type="checkbox" name="form[overwrite_pos_start_time_by_day]" value="1" @if (isset($form['overwrite_pos_start_time_by_day'])) checked @endif onclick="toggle_overwrite_pos_start_time_by_day(this);" /> Overwrite by Day --}}
                                                <input type="checkbox" name="form[overwrite_pos_start_time_by_day]"
                                                    value="1" @if (isset($form['overwrite_pos_start_time_by_day'])) checked @endif
                                                    id="toggle_overwrite_pos_start_time_by_day" /> Overwrite by Day

                                                <div id="div_pos_start_time_by_day"
                                                    @if (!isset($form['overwrite_pos_start_time_by_day'])) class="tabdisplay" @endif>
                                                    <table border="0">
                                                        <tr>
                                                            {{-- {foreach from=$day_list key=day_idx name=d item=day_desc}
                                                        {assign var=curr_val value=$day_desc|strtolower}
                                                        <th>
                                                            <input type="checkbox" name="form[pos_start_time_by_day][{$curr_val}]" value="1" {if $form.pos_start_time_by_day.$curr_val}checked{/if} onclick="toggle_pos_start_time_by_day('{$curr_val}', this);" /> {$day_desc}
                                                        </th>
                                                    {/foreach} --}}
                                                            {{-- @foreach ($day_list as $day_idx => $day_desc)
                                                                                                      <th>
                                                      <input type="checkbox" name="form[pos_start_time_by_day][{{ $curr_val }}]" value="1" @if (isset($form['pos_start_time_by_day'][$curr_val]) && $form['pos_start_time_by_day'][$curr_val] == 1) checked @endif onclick="toggle_pos_start_time_by_day('{{ $curr_val }}', this);"> {{ $day_desc }}
                                                    </th>
                                                    @endforeach --}}
                                                            @foreach ($day_list as $day_idx => $day_desc)
                                                                                                                                <th>
                                                                    <input type="checkbox"
                                                                        name="form[pos_start_time_by_day][{{ $curr_val }}]"
                                                                        value="1" data-day="{{ $curr_val }}"
                                                                        @if (isset($form['pos_start_time_by_day'][$curr_val]) && $form['pos_start_time_by_day'][$curr_val] == 1) checked @endif>
                                                                    {{ $day_desc }}
                                                                </th>
                                                            @endforeach
                                                        </tr>
                                                        <tr>
                                                            {{-- {foreach from=$day_list key=day_idx name=d item=day_desc}
                                                        {assign var=curr_val value=$day_desc|strtolower}
                                                        <td>
                                                            <select name="form[pos_start_hour_by_day][{$curr_val}]" {if !$form.pos_start_time_by_day.$curr_val}disabled{/if}>
                                                                {section name=i loop=24}
                                                                    <option value="{$smarty.section.i.iteration-1}" {if $form.pos_start_hour_by_day.$curr_val == ($smarty.section.i.iteration-1)}selected{/if}>{$smarty.section.i.iteration-1}</option>
                                                                {/section}
                                                            </select>
                                                            <b>:</b>
                                                            <select name="form[pos_start_minute_by_day][{$curr_val}]"{if !$form.pos_start_time_by_day.$curr_val}disabled{/if}>
                                                                {section name=i loop=60}
                                                                    <option value="{$smarty.section.i.iteration-1}" {if $form.pos_start_minute_by_day.$curr_val == ($smarty.section.i.iteration-1)}selected{/if}>{$smarty.section.i.iteration-1|string_format:"%02d"}</option>
                                                                {/section}
                                                            </select>
                                                        </td>
                                                    {/foreach} --}}
                                                            @foreach ($day_list as $day_idx => $day_desc)
                                                                                                                                <td>
                                                                    <select
                                                                        name="form[pos_start_hour_by_day][{{ $curr_val }}]"
                                                                        @if (!isset($form['pos_start_time_by_day'][$curr_val])) disabled @endif>
                                                                        @for ($i = 0; $i < 24; $i++)
                                                                            <option value="{{ $i }}"
                                                                                @if (isset($form['pos_start_hour_by_day'][$curr_val]) && in_array($i, [$form['pos_start_hour_by_day'][$curr_val]])) selected="selected" @endif>
                                                                                {{ $i }}</option>
                                                                        @endfor
                                                                    </select>
                                                                    <b>:</b>
                                                                    <select
                                                                        name="form[pos_start_minute_by_day][{{ $curr_val }}]"
                                                                        @if (!isset($form['pos_start_time_by_day'][$curr_val])) disabled @endif>
                                                                        @for ($i = 0; $i < 60; $i++)
                                                                            <option value="{{ $i }}"
                                                                                @if (isset($form['pos_start_minute_by_day'][$curr_val]) && in_array($i, [$form['pos_start_minute_by_day'][$curr_val]])) selected="selected" @endif>
                                                                                {{ $i }}</option>
                                                                        @endfor
                                                                    </select>
                                                                </td>
                                                            @endforeach
                                                        </tr>
                                                    </table>
                                                </div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td><b>Maximum Mobile POS/Kiosk Allowed Transaction Time</b></td>
                                            <td>
                                                <select name=form[mobile_allow_tranx_end_hour]>
                                                    {{-- {section name=i loop=24}
                                                <option value="{$smarty.section.i.iteration-1}" {if $form.mobile_allow_tranx_end_hour == ($smarty.section.i.iteration-1)}selected{/if}>{$smarty.section.i.iteration-1}</option>
                                            {/section} --}}
                                                    @for ($i = 0; $i < 24; $i++)
                                                        <option value="{{ $i }}"
                                                            @if (isset($form['mobile_allow_tranx_end_hour']) && in_array($i, [$form['mobile_allow_tranx_end_hour']])) selected="selected" @endif>
                                                            {{ $i }}</option>
                                                    @endfor
                                                </select>
                                                <b>:</b>
                                                <select name=form[mobile_allow_tranx_end_minute]>
                                                    {{-- {section name=i loop=60}
                                                <option value="{$smarty.section.i.iteration-1}" {if $form.mobile_allow_tranx_end_minute == ($smarty.section.i.iteration-1)}selected{/if}>{$smarty.section.i.iteration-1|string_format:"%02d"}</option>
                                            {/section} --}}
                                                    @for ($i = 0; $i < 60; $i++)
                                                        <option value="{{ $i }}"
                                                            @if (isset($form['mobile_allow_tranx_end_minute']) && in_array($i, [$form['mobile_allow_tranx_end_minute']])) selected="selected" @endif>
                                                            {{ $i }}</option>
                                                    @endfor
                                                </select>
                                                <input type="checkbox" name="form[overwrite_pos_end_time_by_day]"
                                                    value="1" @if (isset($form['overwrite_pos_end_time_by_day'])) checked @endif
                                                    id="toggle_overwrite_pos_end_time_by_day" /> Overwrite by Day
                                                <div id="div_pos_end_time_by_day"
                                                    @if (!isset($form['overwrite_pos_end_time_by_day'])) class="tabdisplay" @endif>
                                                    <table border="0">
                                                        <tr>
                                                            {{-- {foreach from=$day_list key=day_idx name=d item=day_desc}
                                                        {assign var=curr_val value=$day_desc|strtolower}
                                                        <th>
                                                            <input type="checkbox" name="form[pos_end_time_by_day][{$curr_val}]" value="1" {if $form.pos_end_time_by_day.$curr_val}checked{/if} onclick="toggle_pos_end_time_by_day('{$curr_val}', this);" /> {$day_desc}
                                                        </th>
                                                    {/foreach} --}}

                                                            {{-- @foreach ($day_list as $day_idx => $day_desc)
                                                                                                                                <th>
                                                                    <input type="checkbox"
                                                                        name="form[pos_end_time_by_day][{{ $curr_val }}]"
                                                                        value="1"
                                                                        @if (isset($form['pos_end_time_by_day'][$curr_val]) && $form['pos_end_time_by_day'][$curr_val] == 1) checked @endif
                                                                        onclick="toggle_pos_end_time_by_day('{{ $curr_val }}', this);">
                                                                    {{ $day_desc }}
                                                                </th>
                                                            @endforeach --}}
                                                            @foreach ($day_list as $day_idx => $day_desc)
                                                                                                                                <th>
                                                                    <input type="checkbox"
                                                                        name="form[pos_end_time_by_day][{{ $curr_val }}]"
                                                                        value="1" data-day="{{ $curr_val }}"
                                                                        @if (isset($form['pos_end_time_by_day'][$curr_val]) && $form['pos_end_time_by_day'][$curr_val] == 1) checked @endif>
                                                                    {{ $day_desc }}
                                                                </th>
                                                            @endforeach
                                                        </tr>
                                                        <tr>
                                                            {{-- {foreach from=$day_list key=day_idx name=d item=day_desc}
                                                        {assign var=curr_val value=$day_desc|strtolower}
                                                        <td>
                                                            <select name="form[pos_end_hour_by_day][{$curr_val}]" {if !$form.pos_end_time_by_day.$curr_val}disabled{/if}>
                                                                {section name=i loop=24}
                                                                    <option value="{$smarty.section.i.iteration-1}" {if $form.pos_end_hour_by_day.$curr_val == ($smarty.section.i.iteration-1)}selected{/if}>{$smarty.section.i.iteration-1}</option>
                                                                {/section}
                                                            </select>
                                                            <b>:</b>
                                                            <select name="form[pos_end_minute_by_day][{$curr_val}]" {if !$form.pos_end_time_by_day.$curr_val}disabled{/if}>
                                                                {section name=i loop=60}
                                                                    <option value="{$smarty.section.i.iteration-1}" {if $form.pos_end_minute_by_day.$curr_val == ($smarty.section.i.iteration-1)}selected{/if}>{$smarty.section.i.iteration-1|string_format:"%02d"}</option>
                                                                {/section}
                                                            </select>
                                                        </td>
                                                    {/foreach} --}}
                                                            @foreach ($day_list as $day_idx => $day_desc)
                                                                                                                                <td>
                                                                    <select
                                                                        name="form[pos_end_hour_by_day][{{ $curr_val }}]"
                                                                        @if (!isset($form['pos_end_time_by_day'][$curr_val])) disabled @endif>
                                                                        @for ($i = 0; $i < 24; $i++)
                                                                            <option value="{{ $i }}"
                                                                                @if (isset($form['pos_end_hour_by_day'][$curr_val]) && in_array($i, [$form['pos_end_hour_by_day'][$curr_val]])) selected="selected" @endif>
                                                                                {{ $i }}</option>
                                                                        @endfor
                                                                    </select>
                                                                    <b>:</b>
                                                                    <select
                                                                        name="form[pos_end_minute_by_day][{{ $curr_val }}]"
                                                                        @if (!isset($form['pos_end_time_by_day'][$curr_val])) disabled @endif>
                                                                        @for ($i = 0; $i < 60; $i++)
                                                                            <option value="{{ $i }}"
                                                                                @if (isset($form['pos_end_minute_by_day'][$curr_val]) && in_array($i, [$form['pos_end_minute_by_day'][$curr_val]])) selected="selected" @endif>
                                                                                {{ $i }}</option>
                                                                        @endfor
                                                                    </select>
                                                                </td>
                                                            @endforeach
                                                        </tr>
                                                    </table>
                                                </div>
                                            </td>
                                        </tr>
                                    </table>
                                </div>
                                <button id='formSubmit' type="button" class="btn btn-primary">Update</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </div>
@endsection
@section('js')
    <script nonce="{{ csp_nonce() }}">
        $('#formSubmit').click(function(e) {
            e.preventDefault();
            document.getElementById('formPS').method = 'POST';
            document.getElementById('formPS').action = "{{ route('device-management.updatePosSettings') }}";
            document.getElementById('formPS').submit();
        });

        $(document).ready(function() {
            $('#branch').change(function() {
                this.form.submit();
            });
        });

        document.addEventListener('DOMContentLoaded', function() {
            var toggleOverwritePosStartTimeByDay = document.getElementById(
                'toggle_overwrite_pos_start_time_by_day');
            if (toggleOverwritePosStartTimeByDay) {
                toggleOverwritePosStartTimeByDay.addEventListener('click', function() {
                    toggle_overwrite_pos_start_time_by_day(toggleOverwritePosStartTimeByDay);
                });
            }

            var toggleOverwritePosEndTimeByDay = document.getElementById('toggle_overwrite_pos_end_time_by_day');
            if (toggleOverwritePosEndTimeByDay) {
                toggleOverwritePosEndTimeByDay.addEventListener('click', function() {
                    toggle_overwrite_pos_end_time_by_day(toggleOverwritePosEndTimeByDay);
                });
            }

            var startCheckboxes = document.querySelectorAll('input[name^="form[pos_start_time_by_day]"]');
            startCheckboxes.forEach(function(checkbox) {
                checkbox.addEventListener('click', function() {
                    var day = checkbox.getAttribute('data-day');
                    toggle_pos_start_time_by_day(day, checkbox);
                });
            });

            var endCheckboxes = document.querySelectorAll('input[name^="form[pos_end_time_by_day]"]');
            endCheckboxes.forEach(function(checkbox) {
                checkbox.addEventListener('click', function() {
                    var day = checkbox.getAttribute('data-day');
                    toggle_pos_end_time_by_day(day, checkbox);
                });
            });
        });

        function toggle_overwrite_pos_start_time_by_day(obj) {
            if (obj.checked == true) {
                $('#div_pos_start_time_by_day').show();
            } else {
                $('#div_pos_start_time_by_day').hide();
            }
        }

        function toggle_overwrite_pos_end_time_by_day(obj) {
            if (obj.checked == true) {
                $('#div_pos_end_time_by_day').show();
            } else {
                $('#div_pos_end_time_by_day').hide();
            }
        }

        function toggle_pos_start_time_by_day(day, obj) {
            if (obj.checked == true) {
                document.f_a['form[pos_start_hour_by_day][' + day + ']'].disabled = false;
                document.f_a['form[pos_start_minute_by_day][' + day + ']'].disabled = false;
            } else {
                document.f_a['form[pos_start_hour_by_day][' + day + ']'].disabled = true;
                document.f_a['form[pos_start_minute_by_day][' + day + ']'].disabled = true;
            }
        }

        function toggle_pos_end_time_by_day(day, obj) {
            if (obj.checked == true) {
                document.f_a['form[pos_end_hour_by_day][' + day + ']'].disabled = false;
                document.f_a['form[pos_end_minute_by_day][' + day + ']'].disabled = false;
            } else {
                document.f_a['form[pos_end_hour_by_day][' + day + ']'].disabled = true;
                document.f_a['form[pos_end_minute_by_day][' + day + ']'].disabled = true;
            }
        }
    </script>
@stop