@extends('app')

@section('page_title')
    Send Campaign Mail
@endsection


@push('styles')
    <link rel="stylesheet" href="{{asset('assets/examples/css/pages/profile.min3f0d.css?v2.2.0')}}">
    <link rel="stylesheet" type="text/css" href="{{asset('css/DateTimePicker.min.css')}}"/>
    <link rel="stylesheet" type="text/css" href="{{asset('css/DateTimePicker-ltie9.min.css')}}"/>
    <script type="text/javascript" src="{{asset('js/DateTimePicker-ltie9.min.js')}}"></script>

    <script src="{{asset('js/ckeditor/ckeditor.js')}}"></script>
@endpush

@section('page_content')
    <div class="page-content container-fluid" style="margin-top: 5em">
        <div class="row">
            @include('includes.side_profile')

            <div class="col-md-9">
                <!-- Panel Wizard Form -->
                <div class="panel">
                    <div class="panel-body nav-tabs-animate nav-tabs-horizontal">
                        <form method="post" enctype="multipart/form-data" class="registration lato">
                            @if(count($errors)>0)
                                <div class="alert alert-danger">
                                    <ul>
                                        @foreach($errors->all() as $error)
                                            <li>
                                                {{$error}}
                                            </li>
                                        @endforeach
                                    </ul>
                                </div>
                            @endif

                            @if(session('success'))
                                <div class="alert alert-success">
                                    <ul>
                                        <li>{{ session('success') }}</li>
                                    </ul>
                                </div>
                            @endif

                                @if(session('error'))
                                    <div class="alert alert-danger">
                                            <p>{{ session('error') }}</p>
                                    </div>
                                @endif

                            @csrf
                            <h3>
                                Edit Campaign
                            </h3>
                            <hr>
                            <div class="row">
                                <div class="form-row">
                                    <div class="form-group col-md-6">
                                        <label for="language">Recipients list <em class="text-danger">*</em></label>
                                        <select class="form-control" name="user_mailing_list_id" id="language" required>
                                            <option disabled value="">Select Recipient</option>
                                            @foreach($mailingLists as $mailingList)
                                                <option value="{{ $mailingList->id }}" {{ $emailCampaign->user_mailing_list_id == $mailingList->id ? 'selected' : '' }}>{{ $mailingList->name }}</option>
                                            @endforeach
                                        </select>
                                    </div>


                                    <div class="form-group col-md-6">
                                        <label for="language">Template<em class="text-danger">*</em></label>
                                        <select class="form-control" name="mail_template_id" id="language" required>
                                            <option value="">Select Template </option>
                                            @foreach($templates as $template)
                                                <option value="{{ $template->id }}" {{$emailCampaign->mail_template_id == $template->id ? 'selected' : '' }}
                                                data-body_image="{{$template->body_image}}"
                                                        data-toggle="{{$template->type}}">
                                                    {{ $template->template_name }}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>

                                    <div class="form-group col-md-6">
                                        <label for="inputAddress">Subject <em class="text-danger"></em></label>
                                        <input type="text" class="form-control" value="{{old('subject', $emailCampaign->subject)}}"
                                               name="subject" placeholder="Subject" required>
                                    </div>
                                    <div class="form-group col-md-6">
                                        <label for="inputEmail4">From Name <em class="text-danger">*</em></label>
                                        <input type="text" class="form-control" value="{{old('from_name',$emailCampaign->from_name)}}"
                                               name="from_name" placeholder="Name" required>
                                    </div>

                                    <div class="form-group col-md-6">
                                        <label for="inputEmail4">Reply To <em class="text-danger">*</em></label>
                                        <input type="email" class="form-control" value="{{old('reply_to',$emailCampaign->reply_to)}}"
                                               name="reply_to" placeholder="replay@mail.com" required>
                                    </div>

                                    <div class="form-group col-md-12">
                                        <label for="inputAddress">Message <em class="text-danger"></em></label>
                                        <textarea id="inputAddress" rows="100" class="form-control"  name="message" id="message" required>{{old('message',$emailCampaign->message)}}</textarea>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="text-center">
                                    <button type="submit" id="" class="btn btn-block btn-primary" style="background-color: #8e0d0e"><i
                                            class="fa fa-send-o" style="color:#fff"></i> Save Campaign
                                    </button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>

        </div>
    </div>
@endsection


@push('scripts')
    <script>
        $(document).ready(function()
        {

            CKEDITOR.config.height = 500;
            CKEDITOR.replace('message');

            $('#template').on('change',function () {
                const value = $(this).val(),
                    type = $('option:selected', this).data('toggle'),
                    file_name =  $('option:selected', this).data('body_image'),
                    tmp_path = "{{asset('/storage/template/file_name')}}",
                    path =  tmp_path.replace('file_name',file_name);
                console.log(value,type,path);

                if(type === 'image')
                {

                    $('.ck_message').hide();
                    $('.body_image').show();
                    $('.body_image').html('<img src="'+path+'" alt=""  width="100%"/>');
                }
                else
                {
                    $('.body_image').hide();
                    $('.ck_message').show();
                }
            })
        });

    </script>

@endpush