@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')}}">
    <script src="{{asset('js/ckeditor/ckeditor.js')}}"></script>
@endpush

@section('page_content')
    <div class="page-content container-fluid">
        <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>
                                Send Campaign Mail
                            </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></option>
                                            @foreach($mailingLists as $mailingList)
                                                <option value="{{ $mailingList->id }}" {{ old('user_mailing_list_id') == $mailingList->id ? 'selected' : '' }}>{{ $mailingList->name }}</option>
                                            @endforeach
                                        </select>
                                    </div>


                                    <div class="form-group col-md-6">
                                        <label for="template">Template <em class="text-danger">*</em></label>
                                        <select class="form-control" name="mail_template_id" id="template" required>
                                            <option></option>
                                            @foreach($templates as $template)
                                                <option value="{{ $template->id }}" {{ old('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')}}"
                                               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')}}"
                                               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')}}"
                                               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>
                                        <div class="body_image"></div>
                                        <div class="ck_message">
                                            <textarea id="inputAddress" rows="100" class="form-control"  name="message" id="message">{{old('message')}}</textarea>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="text-center">
                                    <button type="submit" id="" class="btn btn-sm" style="background-color: #8e0d0e ;color:white"><i class="fa fa-send-o" style="color: #fff"></i> Save Campaign</button>
                                    <input type="submit" id="" class="btn btn-sm" name="submit"  value="Save & Send" style="background-color: #8e0d0e ;color:white"><i class="fa fa-send-o" style="color: #fff"></i>
                                </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