@extends('layouts.app')
@section('title', trans('menu.profile_title'))

@section('plugin-styles')
    @php $u = request()->user();@endphp
    @if($u->can('update', $user))
        <link rel="stylesheet" href="{{asset('vendors/x-editable/bootstrap-editable.css')}}">
    @endif
@stop

@section('content')
    @php $fieldSources = [];@endphp
    <div class="content">

        @include('layouts.partials.single-page-header', [
            'userData' => $user,
            'noRightSection' => true,
        ])

        {!! form_start($form) !!}

            <div class="tw-card">
                <div class="p-6">
                    @foreach ($pdform->types as $key => $type)
                        @php $id = str_replace(" ","-", str_replace("& ", "", strtolower($type->name))); @endphp

                        <div class="{{$loop->first ? "active" : ""}} show" id="{{$id}}" role="tab-panel">

                            <h1 class="text-[18px] font-semibold leading-[28px] text-custom-grey-900">
                                {{trans('menu.language_and_security_title')}}
                            </h1>

                            <div class="w-full">

                                <div class="w-full flex flex-col gap-4">

                                    <hr class="mt-5" />

                                    @foreach ( $type->fields as $fkey => $field )

                                        @if($user->id == request()->user()->id)
                                            @continue( !$user->can('view '.$field->name) )
                                        @endif

                                        @php

                                            $inputclass="w-full form-input text-md-regular text-custom-grey-500";
                                            $format="";
                                            $visibility = "";
                                            $dependID = "";
                                            $dependValue = "";

                                            if($field->dependent) {
                                                $visibility = 'hidden conditional';
                                                $dependID = $field->dependOn->name;
                                                $dependValue = $field->on;

                                                if($field->dependOn->fieldType->name == "select") {
                                                    $visibility = ($user->profile[$field->dependOn->name] == $field->on) ? "conditional" : $visibility;
                                                } else {
                                                    $visibility = ($user->profile[$field->dependOn->name]) ? "conditional" : $visibility;
                                                }
                                            }

                                            if($field->fieldType->name == "date" || $field->fieldType->name == "datetime-local" ) {
                                                $inputclass = "w-full form-input text-md-regular text-custom-grey-500 datepicker";
                                                $format = getDateFormat();
                                            } elseif($field->fieldType->name == "entity" || $field->fieldType->name == "select" ||
                                                $field->fieldType->name == "checkbox" || $field->fieldType->name == "radio" ) {
                                                $inputclass = "w-full form-input form-input-select text-custom-grey-500 pd-dropdown w-200";
                                            }

                                            if(!$field->core){
                                                $meta = $user->metas->where('form_field_id', $field->id)->first();
                                                $meta = ($meta) ? $meta->value : '';
                                            }
                                        @endphp

                                        @if($field->fieldType->name == "entity")
                                            @php
                                                $items = "";
                                                $model_column = json_decode($field->model_column, true);
                                                $name = $field->name;
                                                $relation = $user->$name;
                                                $fieldSources[$name] = ['type' => $field->model_type, 'column' => $model_column];
                                            @endphp
                                            @include('users.profile.entity')

                                        @elseif($field->fieldType->name == "checkbox" || $field->fieldType->name == "radio")

                                            @include('users.profile.choice')

                                        @else

                                            @include('users.profile.default')

                                            @if($field->fieldType->name == "select")
                                                @php
                                                    $choices = json_decode($field->choices, true);
                                                    $resultedChoices = [];
                                                    foreach ($choices as $index => $choice) {
                                                        $resultedChoices[] = ['value' => $index, 'text' => $choice];
                                                    }
                                                @endphp

                                                @if($field->core)
                                                    @php $fieldSources["profile[".$field->name."]"] = $resultedChoices; @endphp
                                                @else
                                                    @php $fieldSources["metas[".$field->id."]"] = $resultedChoices; @endphp
                                                @endif
                                            @endif

                                        @endif

                                        <hr />
                                    @endforeach

                                    @if($setting->isPushNotificationEnable() && $setting->isPushNotificationConfigurable())

                                        <div class="form_group w-full lg:w-[60%] flex flex-col lg:flex-row gap-2 lg:gap-0 justify-between items-start">
                                            <label for="push_notification_configured" class="form-label text-sm-semibold w-full lg:w-1/2">
                                                <h1 class="text-[18px] font-semibold leading-[28px] text-custom-grey-900">
                                                    {{ __('label.push_notification')}}
                                                </h1>
                                            </label>
                                            <div class="w-full relative lg:w-1/2">
                                                <div class="flex justify-start items-center gap-2">
                                                    <input type="hidden" name="profile[push_notification_configured]" value="0">
                                                    <input id="profile-push_notification_configured" type="checkbox" name="profile[push_notification_configured]" value="1" {{$user->profile['push_notification_configured'] ? "checked" : ''}}/>
                                                    <label for="profile-push_notification_configured" class="m-0">{{trans('label.push_notification_configured')}}</label>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="{{ $user->profile['push_notification_configured'] ? 'visible': 'hidden' }}" id="notificationSettings">
                                            <div class="flex flex-col gap-4">
                                                <hr/>
                                                <div class="time-settings">
                                                    <div class="accordion-title cursor-pointer flex justify-between items-center">
                                                        <h1 class="text-[18px] font-semibold leading-[28px] text-custom-grey-900">
                                                            {{ __('label.push_notification_configured_times')}}
                                                        </h1>
                                                        <x-svg-icon class="accordion-icon float-right rotate-180" icon="icon-chevron-up" width="24" height="24" />
                                                    </div>
                                                    
                                                    <div class="accordion-content mt-5 hidden">
                                                        <hr class="mb-3" />
                                                        @php
                                                            $savedSettings = $user->profile->getPushNotificationConfiguredTimes();
                                                        @endphp
                                                        @foreach(['mon', 'tue', 'wed', 'thu', 'fri', 'sat', 'sun'] as $day)
                                                        @php
                                                            $daySettings = $savedSettings[$day] ?? [];
                                                            $isEnabled = isset($savedSettings[$day]);
                                                            $fromTime = $daySettings['from'] ?? '';
                                                            $toTime = $daySettings['to'] ?? '';
                                                        @endphp
                                                        <div class="form_group w-full lg:w-[80%] flex flex-col lg:flex-row gap-2 lg:gap-0 justify-between items-start">
                                                            <div class="w-full relative lg:w-[37.5%]">
                                                                <div class="flex justify-start items-center gap-2">
                                                                    <input id="profile-push_notification_settings-{{ $day }}-enabled" type="checkbox" name="profile[push_notification_settings][{{ $day }}][enabled]" value="1" {{ $isEnabled ? 'checked' : '' }}>
                                                                    <label for="profile-push_notification_settings-{{ $day }}-enabled" class="m-0">{{ __('forms.'.$day) }}</label>
                                                                </div>
                                                            </div>

                                                            <div class="w-full lg:w-[62.5%]">
                                                                <div class="day-settings flex flex-row flex-wrap items-center gap-5 w-full mb-6">

                                                                    <select class="form-input form-input-select min-w-16 w-max search-inpurt bg-white" name="profile[push_notification_settings][{{ $day }}][from]" id="{{ $day }}_start_hour">
                                                                        <option></option>
                                                                        @for ($i = 1; $i <= 12; $i++)
                                                                            <option value="{{ $i }}" {{ $fromTime && strpos($fromTime, "$i ") === 0 ? 'selected' : '' }}>{{ $i }}</option>
                                                                        @endfor
                                                                    </select>

                                                                    <select class="form-input form-input-select min-w-16 w-max search-inpurt bg-white" name="profile[push_notification_settings][{{ $day }}][from_period]" id="{{ $day }}_start_period">
                                                                        <option value="am" {{ $fromTime && strpos($fromTime, 'am') !== false ? 'selected' : '' }}>AM</option>
                                                                        <option value="pm" {{ $fromTime && strpos($fromTime, 'pm') !== false ? 'selected' : '' }}>PM</option>
                                                                    </select>

                                                                    <label for="{{ $day }}_end_hour">To:</label>
                                                                    <select class="form-input form-input-select min-w-16 w-max search-inpurt bg-white" name="profile[push_notification_settings][{{ $day }}][to]" id="{{ $day }}_end_hour">
                                                                        <option></option>
                                                                        @for ($i = 1; $i <= 12; $i++)
                                                                            <option value="{{ $i }}" {{ $toTime && strpos($toTime, "$i ") === 0 ? 'selected' : '' }}>{{ $i }}</option>
                                                                        @endfor
                                                                    </select>

                                                                    <select class="form-input form-input-select min-w-16 w-max search-inpurt bg-white" name="profile[push_notification_settings][{{ $day }}][to_period]" id="{{ $day }}_end_period">
                                                                        <option value="am" {{ $toTime && strpos($toTime, 'am') !== false ? 'selected' : '' }}>AM</option>
                                                                        <option value="pm" {{ $toTime && strpos($toTime, 'pm') !== false ? 'selected' : '' }}>PM</option>
                                                                    </select>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        @endforeach
                                                    </div>
                                                </div>
                                                <hr/>
                                                <div class="module-settings">
                                                    <div class="accordion-title cursor-pointer flex justify-between items-center">
                                                        <h1 class="text-[18px] font-semibold leading-[28px] text-custom-grey-900">
                                                            {{ __('label.push_notification_configured_modules')}}
                                                        </h1>
                                                        <x-svg-icon class="accordion-icon float-right rotate-180" icon="icon-chevron-up" width="24" height="24" />
                                                    </div>
                                                    <div class="accordion-content mt-5 hidden">
                                                        <hr class="mb-3" />
                                                        @php
                                                            $moduleSettings = $user->profile->getPushNotificationConfiguredModules();
                                                        @endphp
                                                        <div class="form_group w-full grid grid-cols-2 lg:grid-cols-4 gap-2">
                                                            @foreach ($notificationEventTypes as $event)
                                                                @php
                                                                    // Treat missing values as enabled by default (backward compatibility or default behavior)
                                                                    $isEnabled = ($moduleSettings[$event->name] ?? 1) == 1;
                                                                @endphp
                                                                <div class="custom-control custom-switch custom-switch-sm">
                                                                    <input class="custom-control-input"
                                                                        id="notification-event-{{ $event->value }}"
                                                                        name="profile[push_notification_modules][{{ $event->name }}]"
                                                                        type="checkbox"
                                                                        value="1"
                                                                        {{ $isEnabled ? 'checked' : '' }}
                                                                    />
                                                                    <label class="custom-control-label flex flex-col !pb-0 before:top-0 after:!top-0.5" for="notification-event-{{ $event->value }}">
                                                                        {{ __('label.'.strtolower($event->name))}}
                                                                    </label>
                                                                </div>
                                                            @endforeach
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <hr />
                                    @endif
                                    <div class="form_group w-full lg:w-[80%] flex flex-col lg:flex-row gap-2 lg:gap-0 justify-between items-start">
                                        <label for="terms" class="form-label text-sm-semibold w-full lg:w-[37.5%]">&nbsp;</label>
                                        <div class="w-full lg:w-[62.5%] relative">
                                            <div class="w-full lg:w-auto lg:flex-1 overflow-x-scroll no-scrollbar bg-custom-blue-25 border border-custom-blue-100 rounded-lg">
                                                <div class="p-5">
                                                    <h1 class="mt-3 mb-3 text-[.6rem]">{{trans('title.settings_rule_title')}}</h1>

                                                    <p class="mb-3 text-[.6rem]">{{trans('title.settings_rule_des_1')}}</p>

                                                    <p class="mb-3 text-[.6rem]">{{trans('title.settings_rule_des_2')}}</p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <hr/>

                                    <div class="w-full flex justify-center lg:justify-end">
                                        <button type="button" class="btn-primary-base btn-save">{{__('forms.lbl_save')}}</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>
            </div>

        {!! form_end($form, false) !!}

    </div>

    @include('users.profile.logo')
@stop

@section('footer-script')
    <!-- plugin js for this page -->
    @if($u->can('update', $user))
        <script src="{{asset('vendors/x-editable/bootstrap-editable.min.js')}}"></script>
        <script src="{{asset('js/x-editable.js')}}"></script>
    @endif
    <script type="text/javascript">
        var fieldSources = {!! json_encode($fieldSources) !!}, user_id={{$user->id}};


        $(".btn-save").on("click", function(event) {
            event.preventDefault();
            data = $(".user-form").serialize();
            let formData =  $('form.user-form').serializeFiles();

            PDRequest({
                type    : "POST",
                url     : $(".user-form").prop("action"),
                data    : formData,
                //data    : data,
                event   : event
            }).then((response) => {
                if(response.redirect) {
                    window.location.href = "{{ route('dashboard.index') }}";
                }
            }).catch((error) => {
                $('.error').removeClass('error');
                $('input[required], select[required]').each(function() {
                    if (!$(this).val()) {
                        $(this).addClass('error');
                    }
                });
            });
        });

        $("input[type='file']").on('change', function(){
            $(".btn-upload").removeClass("hidden");
        });

        $(".btn-upload").on('click', function(event) {
            const fileInput = document.querySelector( '#photograph' );
            const formData = new FormData();
            formData.append( 'logo', fileInput.files[0] );
            PDRequest({
                type    : "POST",
                url     : "{{url('users/'.$user->id.'/logo/upload')}}",
                data    : formData,
                event   : event,
                media   : true
            }).then(function(response){
                if(response.status == "success"){
                    $("#profile-avator").find("img").prop("src", response.src);
                    $(".btn-upload").addClass("hidden");
                    $("#modal-dialog").modal('hide');
                }
            });
        });

        $('input[name="profile[push_notification_configured]"]').change(function() {
            toggleNotificationSettings();
        });
        function toggleNotificationSettings() {
            if ($('input[name="profile[push_notification_configured]"]').is(':checked')) {
                $('#notificationSettings').show();
            } else {
                $('#notificationSettings').hide();
            }
        }
        $('select[name^="profile[push_notification_settings]"][name*="[from]"]').change(function() {
            var day = $(this).attr('name').match(/\[(mon|tue|wed|thu|fri|sat|sun)\]/)[1];
            validateTimeFields(day);
        });
        function validateTimeFields(day) {
            var fromHour = $('#' + day + '_start_hour').val();
            var toHour = $('#' + day + '_end_hour').val();
            var toField = $('#' + day + '_end_hour');

            if (fromHour !== "" && toHour === "") {
                toField.prop('required', true);
                toField.addClass('required');
            } else {
                toField.prop('required', false);
                toField.removeClass('required');
            }
        }

        drEvent.on('dropify.beforeClear', function(event, element) {
            $el = event.target;
            if(confirm("{{trans('forms.do_you_really_want_delete')}}")) {
                return PDRequest({
                    type    : "POST",
                    url     : "{{url("users/".$user->id."/remove/logo")}}",
                    data    : {name : $($el).attr('name')}
                }).then(function(response){
                    if(response.status == "success"){
                        if($($el).attr('name') == "signature") {
                            $(".btn-upload").addClass("hidden");
                        } else {
                            $("#profile-avator").find("img").prop("src", "");
                            $(".btn-upload").addClass("hidden");
                            $("#modal-dialog").modal('hide');
                        }

                    }
                });
            } else {
                return false;
            }
        });

    </script>
    <!-- End custom js for this page-->

@stop