@extends('layouts.app')
@section('title', $page_title)

@section('styles')
<style>
/* Email input group styling */
.input-group > .select2-container {
  flex: 1 1 auto;
  width: auto !important;
}
#from_email_part1 {
  height: 100%;
}
</style>
@endsection

@push('scripts')
<script src="{{asset('assets/js/split_test.js')}}"></script>
<script>
$(document).ready(function() {
  // Initialize Select2 for email domain dropdown
  $('#sending-domains').select2({
    placeholder: '{{__("app.select_domain")}}',
    allowClear: false,
    width: '100%'
  });
});
</script>
@endpush

@php
$attributes = json_decode($split_test->attributes); 
$sending_speed = json_decode($split_test->sending_speed); 
@endphp
@section('content')
<div class="row">
  <div class="col-12">
<div class="card custom-card">
   <div class="card-body">
        <form method="POST" action="{{ route('split_tests.update', $split_test->id) }}" class="needs-validation" novalidate>
         @csrf       
         @method('PUT')
          
          <!-- General Information Fields -->
          <div class="row mb-3">
         <div class="col-md-6">
              <div class="form-group">
                <label class="form-label fw-semibold">{{__('app.active')}}</label>
                <select name="is_active" class="form-select" required>
               <option value="1" {{ $split_test->is_active ? 'selected' : '' }}>{{ __('app.yes') }}</option>
               <option value="0" {{ $split_test->is_active ? '' : 'selected' }}>{{ __('app.no')}}</option>
            </select>
                <div class="invalid-feedback">{{__('app.active_required')}}</div>
              </div>
            </div>
            
            <div class="col-md-6">
              <div class="form-group">
                <label class="form-label fw-semibold">{{__('app.name')}}</label>
                <input type="text" class="form-control" placeholder="{{__('app.name')}}" value="{{ $split_test->name }}" name="name" required>
                <div class="invalid-feedback">{{__('app.name_required')}}</div>
              </div>
            </div>
          </div>
          <!-- Scheduling Section -->
          <div class="row mb-3">            
            <div class="col-md-6">
              <div class="form-group">
                <label class="form-label fw-semibold">{{ __('app.send') }}
                  <a tabindex="-1" role="button" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="right" 
                     title="{{__('app.send')}}" data-bs-content="{{__('app.split_test_speed_help')}}" 
                     data-bs-custom-class="header-primary" class="text-primary ms-1">
                    <i class="bi bi-question-circle"></i>
                  </a>
                </label>
                <select name="send" id="send" class="form-select" disabled>
             <option value="now" {{ $split_test->send == 'now' ? 'selected' : '' }}>{{ __('app.now') }}</option>
             <option value="later" {{ $split_test->send == 'later' ? 'selected' : '' }}>{{ __('app.later') }}</option>
           </select>
                <div class="invalid-feedback">{{__('app.send_required')}}</div>
              </div>
         </div>
            
            <div class="col-md-6" id="send_datetime_div" style="{{ $split_test->send == 'later' ? '' : 'display: none;' }}">
           <div class="form-group">
                <label class="form-label fw-semibold">{{ __('app.sending_datetime') }}</label>
             <div class="input-group">
                  <div class="input-group-text"><i class="ri-calendar-line"></i></div>
               <input type="text" name="send_datetime" class="form-control" id="send_datetime" placeholder="{{ __('app.choose_date_time') }}" value="{{ !empty($split_test->send_datetime) ? \App\Http\Helper\Helper::datetimeDisplay($split_test->send_datetime) : ''}}" disabled>
               <input type="hidden" name="db_send_datetime" id="db_send_datetime" value="">
                  <input type="hidden" name="timezone" id="timezone" value="{{ \Auth::user()->timezone }}">
                </div>
                <div class="invalid-feedback">{{__('app.sending_datetime_required')}}</div>
             </div>
           </div>
         </div>
          <!-- Content Selection Section -->
          <div class="row">
            <div class="col-12">
              <div class="d-flex align-items-center">
                <div class="me-3">
                  <span class="avatar avatar-xs avatar-rounded bg-info svg-white">
                    <i class="bi bi-collection"></i>
                  </span>
                </div>
                <h6 class="mb-0 text-info fw-semibold fs-14">{{__('app.content_selection')}}</h6>
              </div>
            </div>
            
            <div class="col-md-6">
              <div class="form-group">
                <label class="form-label fw-semibold mt-2">{{__('app.lists')}}
                  <a href="{{route('lists.create')}}" class="text-primary ms-1">
                    <i class="bi bi-plus-circle"></i>
                  </a>
                  <a tabindex="-1" role="button" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="right" 
                     title="{{__('app.lists')}}" data-bs-content="{{__('app.split_test_lists')}}" 
                     data-bs-custom-class="header-primary" class="text-primary ms-1">
                    <i class="bi bi-question-circle"></i>
             </a>
           </label>
           @php $list_ids = json_decode($split_test->list_ids, true);  @endphp
           @include('includes.dropdown_lists', ['popup' => 0, 'multiple' => 1, 'required' => 1, 'client_package_lists' => 1, 'disabled' => 1])
                <div class="invalid-feedback">{{__('app.lists_required')}}</div>
              </div>
         </div>
            
            <div class="col-md-6">
              <div class="form-group">
                <label class="form-label fw-semibold mt-2">{{__('app.campaigns')}}
                  <a href="{{route('broadcasts.create')}}" class="text-primary ms-1">
                    <i class="bi bi-plus-circle"></i>
                  </a>
                  <a tabindex="-1" role="button" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="right" 
                     title="{{__('app.campaigns')}}" data-bs-content="{{__('app.split_test_campaigns')}}" 
                     data-bs-custom-class="header-primary" class="text-primary ms-1">
                    <i class="bi bi-question-circle"></i>
             </a>
           </label>
           @php $broadcast_ids = json_decode($split_test->broadcast_ids, true);  @endphp
           @include('includes.dropdown_broadcasts', ['popup' => 0, 'multiple' => 1, 'required' => 1, 'disabled' => 1])
                <div class="invalid-feedback">{{__('app.campaigns_required')}}</div>
              </div>
            </div>
          </div> 
          <!-- Split Test Configuration Section -->
          <div class="row mb-3">
            <div class="col-12">
              <div class="d-flex align-items-center">
                <div class="me-3">
                  <span class="avatar avatar-xs avatar-rounded bg-info svg-white">
                    <i class="bi bi-graph-up"></i>
                  </span>
                </div>
                <h6 class="mb-0 text-info fw-semibold fs-14">{{__('app.split_test_configuration')}}</h6>
              </div>
         </div> 
            
            <div class="col-md-4">
              <div class="form-group">
                <label class="form-label fw-semibold mt-2">{{ __('app.winning_criteria') }}
                  <a tabindex="-1" role="button" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="right" 
                     title="{{__('app.winning_criteria')}}" data-bs-content="{{__('app.split_test_winning_criteria_help')}}" 
                     data-bs-custom-class="header-primary" class="text-primary ms-1">
                    <i class="bi bi-question-circle"></i>
                  </a>
                </label>
                <select name="winning_criteria" class="form-select" disabled>
             <option value="open" {{ $split_test->winning_criteria == 'open' ? 'selected' : '' }}>{{ __('app.split_test_winning_criteria_open') }}</option>
             <option value="click" {{ $split_test->winning_criteria == 'click' ? 'selected' : '' }}>{{ __('app.split_test_winning_criteria_click') }}</option>
           </select>
                <div class="invalid-feedback">{{__('app.winning_criteria_required')}}</div>
              </div>
         </div>
            
            <div class="col-md-4">
              <div class="form-group">
                <label class="form-label fw-semibold mt-2">{{ __('app.decision_percentage') }}
                  <a tabindex="-1" role="button" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="right" 
                     title="{{__('app.decision_percentage')}}" data-bs-content="{{__('app.split_test_decision_percentage_help')}}" 
                     data-bs-custom-class="header-primary" class="text-primary ms-1">
                    <i class="bi bi-question-circle"></i>
                  </a>
                </label>
                <select name="decision_percentage" class="form-select" disabled>
             @for($i=5; $i<=100; $i+=5)
                <option value="{{$i}}" {{ $split_test->decision_percentage == $i ? 'selected' : '' }}>{{$i}} %</option>
              @endfor
           </select>
                <div class="invalid-feedback">{{__('app.decision_percentage_required')}}</div>
              </div>
         </div>
            
            <div class="col-md-4">
              <div class="form-group">
                <label class="form-label fw-semibold mt-2">{{ __('app.action') }}
                  <a tabindex="-1" role="button" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="right" 
                     title="{{__('app.action')}}" data-bs-content="{{__('app.split_test_action_help')}}" 
                     data-bs-custom-class="header-primary" class="text-primary ms-1">
                    <i class="bi bi-question-circle"></i>
                  </a>
                </label>
                <select name="action" class="form-select" disabled>
             <option value="send_remaining" {{ $split_test->action == 'send_remaining' ? 'selected' : '' }}>{{ __('app.send_remaining') }}</option>
             <option value="show_results" {{ $split_test->action == 'show_results' ? 'selected' : '' }}>{{ __('app.show_results') }}</option>
           </select>
                <div class="invalid-feedback">{{__('app.action_required')}}</div>
              </div>
         </div>
            
            <div class="col-md-4">
              <div class="form-group">
                <label class="form-label fw-semibold mt-2">{{ __('app.split_test_after') }}
                  <a tabindex="-1" role="button" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="right" 
                     title="{{__('app.split_test_after')}}" data-bs-content="{{__('app.split_test_after_help')}}" 
                     data-bs-custom-class="header-primary" class="text-primary ms-1">
                    <i class="bi bi-question-circle"></i>
             </a>
           </label>
           <input type="number" class="form-control" name="send_remaining_after" value="{{ $attributes->send_remaining_after ?? 30 }}" min="1" placeholder="30" disabled>
                <div class="invalid-feedback">{{__('app.split_test_after_required')}}</div>
              </div>
         </div>
            
            <div class="col-md-4">
              <div class="form-group">
                <label class="form-label fw-semibold mt-2">{{__('app.duration')}}</label>
                <select name="send_remaining_after_duration" class="form-select" disabled>
              <option value="minutes" {{!empty($attributes->send_remaining_after_duration) && $attributes->send_remaining_after_duration == 'minutes' ? 'selected' : ''}}>{{ __('app.minutes') }}</option>
              <option value="hours" {{!empty($attributes->send_remaining_after_duration) && $attributes->send_remaining_after_duration == 'hours' ? 'selected' : ''}}>{{ __('app.hours') }}</option>
              <option value="days" {{!empty($attributes->send_remaining_after_duration) && $attributes->send_remaining_after_duration == 'days' ? 'selected' : ''}}>{{ __('app.days') }}</option>
           </select>
                <div class="invalid-feedback">{{__('app.duration_required')}}</div>
              </div>
            </div>
          </div>
          <!-- Sending Configuration Section -->
          <div class="row">
            <div class="col-12">
              <div class="d-flex align-items-center">
                <div class="me-3">
                  <span class="avatar avatar-xs avatar-rounded bg-info svg-white">
                    <i class="bi bi-send"></i>
                  </span>
                </div>
                <h6 class="mb-0 text-info fw-semibold fs-14">{{__('app.sending_configuration')}}</h6>
              </div>
         </div>
            
            <div class="col-md-12">
              <div class="form-group">
                <label class="form-label fw-semibold mt-2">{{__('app.sending_server')}}
                  <a href="{{route('sending_servers.create')}}" class="text-primary ms-1">
                    <i class="bi bi-plus-circle"></i>
                  </a>
                  <a tabindex="-1" role="button" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="right" 
                     title="{{__('app.delivery_servers')}}" data-bs-content="{{__('app.split_test_sending_servers')}}" 
                     data-bs-custom-class="header-primary" class="text-primary ms-1">
                    <i class="bi bi-question-circle"></i>
             </a>
           </label>
           @php $sending_server_ids = json_decode($split_test->sending_server_ids, true);  @endphp
           @include('includes.dropdown_sending_server', ['popup' => 0, 'multiple' => 1, 'required' => 1, 'client_package_lists' => 1, 'disabled' => 1])
                <div class="invalid-feedback">{{__('app.sending_server_required')}}</div>
              </div>
         </div>
          </div>
            <div class="col-12">
              <div class="form-group">
                <label class="form-label fw-semibold">{{__('app.from_detail')}}
                  <a tabindex="-1" role="button" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="right" 
                     title="{{__('app.from_detail')}}" data-bs-content="{{__('app.from_detail_help')}}" 
                     data-bs-custom-class="header-primary" class="text-primary ms-1">
                    <i class="bi bi-question-circle"></i>
                  </a>
                </label>
                <div class="form-check-group">
                  <div class="form-check form-check-inline">
                    <input name="from_detail" class="form-check-input" type="radio" id="from_sending_server" value="sending_server" {{ $attributes->from_detail == 'sending_server' ? 'checked' : '' }}>
                    <label class="form-check-label" for="from_sending_server">{{__('app.as_defined_for_sending_server')}}</label>
                  </div>
                  <div class="form-check form-check-inline">
                    <input name="from_detail" class="form-check-input" type="radio" id="from_list" value="list" {{ $attributes->from_detail == 'list' ? 'checked' : '' }}>
                    <label class="form-check-label" for="from_list">{{__('app.as_defined_for_list')}}</label>
                  </div>
                  <div class="form-check form-check-inline">
                    <input name="from_detail" class="form-check-input" type="radio" id="from_custom" value="custom" {{ $attributes->from_detail == 'custom' ? 'checked' : '' }}>
                    <label class="form-check-label" for="from_custom">{{__('app.custom')}}</label>
                  </div>
                </div>
              </div>
          </div>
          <div class="row mt-3" id="custom_email_data" style="{{ $attributes->from_detail == 'custom' ? '' : 'display: none;' }}">
              @php
              if($attributes->from_detail == 'custom') {
                $form_detail_custom = json_decode($attributes->from_detail_custom);
                $from_email_domain = explode('@', $form_detail_custom->from_email)[1];
              }
              @endphp
              <div class="col-md-3">
                 <input type="text" class="form-control" placeholder="{{__('app.from_name')}}" value="{{$form_detail_custom->from_name ?? ''}}" name="from_name">
              </div>
              <div class="col-md-5">
                 <div class="input-group">
                    <div style="width: 35%;">
                      <input type="text" name="from_email_part1" value="{{($attributes->from_detail == 'custom') ? strstr($form_detail_custom->from_email, '@', true) : ''}}" class="form-control" placeholder="{{__('app.from_email_example')}}">
                    </div>
                    <span class="input-group-text">@</span>
                    <select name="from_email_part2" id="sending-domains" class="single-select form-select">
                      <option value="">{{__('app.select_domain')}}</option>
                      @include('includes.dropdown_sending_domains')
                    </select>
                  </div>
              </div>
              <div class="col-md-4">
                 <input type="email" class="form-control" placeholder="{{__('app.reply_email')}}" value="{{$form_detail_custom->reply_email ?? ''}}" name="reply_email">
              </div>
          </div>
          <!-- Speed Configuration Section -->
          <div class="row mb-3 mt-3">            
         <div class="col-md-12">
              <div class="form-group">
                <label class="form-label fw-semibold mt-2">{{ __('app.sending_speed') }}
                  <a tabindex="-1" role="button" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="right" 
                     title="{{__('app.sending_speed')}}" data-bs-content="{{__('app.sending_speed_help')}}" 
                     data-bs-custom-class="header-primary" class="text-primary ms-1">
                    <i class="bi bi-question-circle"></i>
              </a>
            </label>
                <select class="form-select" name="sending_speed" id="speed" disabled>
               <option value="unlimited" {{!empty($sending_speed->speed) && $sending_speed->speed == 'unlimited' ? 'selected' : ''}}>{{ __('app.unlimited') }}</option>
               <option value="limited" {{!empty($sending_speed->speed) && $sending_speed->speed == 'limited' ? 'selected' : ''}}>{{ __('app.limited') }}</option>
            </select>
                <div class="invalid-feedback">{{__('app.sending_speed_required')}}</div>
              </div>
            </div>
            
         </div>
         <div class="col-md-12" id="speed-attributes" style="display: {{!empty($sending_speed->speed) && $sending_speed->speed == 'unlimited' ? 'none;' : ''}}">
         <div class="row">
            <div class="col-md-6 mt-3" >
                <input type="number" class="form-control" name="limit" id="limit" value="{{$sending_speed->limit ?? ''}}" min="1" placeholder="1000" disabled>
            </div>
            <div class="col-md-6 mt-3" >
                <select name="duration" id="duration" class="form-select form-select-lg" disabled>
                  <option value="hour">{{ __('app.hourly') }}</option>
                </select>
            </div>
          </div>

          <div class="row">
            <div class="col-md-6 mt-3" >
                <label class="form-label">{{ __('app.pause_after_send') }}
                <a tabindex="-1" role="button"
            data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="right" title="{{__('app.pause_after_send')}}"
            data-bs-content="{{__('app.pause_after_send_help')}}" data-bs-custom-class="header-primary"><i class="bi bi-question-square text-primary"></i>
            </a></label>
                <input type="number" class="form-control" name="pause_limit" value="{{ json_decode($split_test->sending_speed)->pause_limit ?? '0' }}" min="0" placeholder="0">
            </div>
            <div class="col-md-6 mt-3" >
              <label class="form-label">&nbsp;</label>
                <select name="pause_duration" class="form-control" >
                  <option value="minutes" {{ !empty(json_decode($split_test->sending_speed)->pause_duration) && json_decode($split_test->sending_speed)->pause_duration == 'minutes' ? 'selected="selected"' : '' }}>{{ __('app.minutes') }}</option>
                </select>
            </div>
          </div>
         </div>

          <!-- Action Buttons -->
          <div class="row mt-2">
         <div class="col-12">
              <div class="d-flex gap-2 justify-content-start">
                <button type="submit" class="btn btn-primary">
                  <i class="bi bi-save me-1"></i>{{__('app.update')}}
                </button>
                <a href="{{route('split_tests.index')}}" class="btn btn-light">
                  <i class="bi bi-arrow-left me-1"></i>{{__('app.cancel')}}
                </a>
              </div>
            </div>
         </div>
      </form>
   </div>
</div>
  </div>
</div>
@include('includes.modal')
@endsection