@extends('admin.base')

@section('title', 'Marketing Emails Management')

@section('account_content')

    <div class="ui grid">
        <div class="fourteen wide column">
            <div class ="content">
                <div class="ui center aligned basic segment">
                    <div class="ui left icon action input">
                        <div class="ui horizontal divider"><h3>{{ __('Marketing Emails Management') }}</h3>
                        </div>
                    </div>
                </div>
                <div class="content_top">
                    <div class="ui form">

                        <div class="ui horizontal divider"><h3>{{ __('Email Lists') }}</h3>
                        </div>
                        <div class="fields">
                            <button class="ui button with7Margin" onclick="showAddEmailListModal()">{{ __('Add New Email List') }}</button>
                        </div>
                        <div class="table" id="emailListTableContainer">
                            <table class="ui celled table" id="table">
                                <thead>
                                <tr>
                                    <th>{{ __('No.') }}</th>
                                    <th>{{ __('List Name') }}</th>
                                    <th>{{ __('Member Count') }}</th>
                                    <th>{{ __('Operations') }}</th>
                                </tr>
                                </thead>
                                <tbody>
                                @foreach($emailLists as $key=>$list)
                                    <tr>
                                        <td>{{$key+1}}</td>
                                        <td>{{$list['name']}}</td>
                                        <td>{{$list['stats']['member_count']}}</td>
                                        <td>
                                            <button class="mini ui button" onclick="confirmEmailListDelete('{{$list['id']}}')"> Delete </button>
                                            <button class="mini ui button" onclick="showPopulateEmailListModal('{{$list['id']}}')"> Populate </button>
                                            @if((int) $list['stats']['member_count'] >0)
                                                <button class="mini ui button" onclick="location.href='{{route('exportMailchimpListMembers',['ID'=>$list['id']])}}'"> CSV Export </button>
                                            @endif
                                        </td>
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                        </div>

                        <div class="ui horizontal divider"><h3>{{ __('Campaigns') }}</h3>
                        </div>
                        <div class="fields">
                            <button class="ui button with7Margin" onclick="showCampaignModal('add')">{{ __('Add New Campaign') }}</button>
                        </div>
                        <div class="table" id="campaignsTableContainer">
                            <table class="ui celled table" id="table">
                                <thead>
                                <tr>
                                    <th>{{ __('No.') }}</th>
                                    <th>{{ __('Campaign Name') }}</th>
                                    <th>{{ __('Email List') }}</th>
                                    <th>{{ __('Status') }}</th>
                                    <th>{{ __('Operations') }}</th>
                                </tr>
                                </thead>
                                <tbody>
                                @foreach($campaigns as $key=>$campaign)
                                    <tr>
                                        <td>{{$key+1}}</td>
                                        <td>{{$campaign['settings']['title']}}</td>
                                        <td>
                                            @if($campaign['recipients']['list_name'])
                                                {{$campaign['recipients']['list_name']}}
                                            @else
                                                not mapped to a list
                                            @endif
                                        </td>
                                        <td> {{$campaign['status']}} </td>
                                        <td>
                                            <button class="mini ui button" onclick="confirmCampaignDelete('{{$campaign['id']}}')"> Delete </button>
                                            <button class="mini ui button" onclick="previewCampaignEmail('{{$campaign['id']}}')"> Preview </button>
                                            @if($campaign['status']=='save')
                                                <button class="mini ui button" onclick="showCampaignModal('edit','{{$campaign['id']}}','{{$campaign['settings']['title']}}','{{$campaign['recipients']['list_id']}}')"> Edit </button>
                                                <button class="mini ui button" onclick="location.href='{{route('sendTestMailchimpCampaign')}}/{{$campaign['id']}}'"> Test Send </button>
                                                <button class="mini ui button" onclick="confirmCampaignSend('{{$campaign['id']}}')">Confirmed Send</button>
                                            @else
                                                <button class="mini ui button" onclick="location.href='{{route('replicateMailchimpCampaign')}}/{{$campaign['id']}}'"> Replicate </button>
                                            @endif
                                        </td>
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- Start Confirm Modal --}}
    <div class="ui tiny modal" id="submit_confirmation_modal">
        <div class="header">
            {{ __('Confirm Change') }}
        </div>
        <div class="actions">
            <div class="ui grey deny button" onclick="cancelAction()">
                {{ __('Cancel') }}
            </div>
            <button type="submit" class="ui yellow submit button" id="confirmSubmit"> {{ __('Confirm') }}</button>
        </div>
    </div>

    {{-- Start Preview Modal --}}
    <div class="ui modal" id="emailPreviewerModal">
        <div class="header">Marketing Email Preview</div>
        <div class="content">
            <object id="emailPreviewerContainer" type="text/html" data="" width="800px" height="600px">
            </object>
        </div>
    </div>

    {{-- Start Add List Modal --}}
    <div class="ui tiny modal" id="addEmailListModal">
        <div class="header">
            {{ __('Add New Email List') }}
        </div>
        <div class="content">
            @include('mailchimpmanagement::add_email_list')
        </div>
        <div class="actions">
            <div class="ui grey deny button" onclick="cancelAction()">
                {{ __('Cancel') }}
            </div>
            <button type="submit" class="ui yellow submit button" form="emailListForm"> {{ __('Confirm') }}</button>
        </div>
    </div>

    {{-- Start Add Campaign Modal --}}
    <div class="ui tiny modal" id="addCampaignModal">
        <div class="header">
            {{ __('Add New Email List') }}
        </div>
        <div class="content">
            @include('mailchimpmanagement::add_campaign')
        </div>
        <div class="actions">
            <div class="ui grey deny button" onclick="cancelAction()">
                {{ __('Cancel') }}
            </div>
            <button type="submit" class="ui yellow submit button" form="campaignForm"> {{ __('Confirm') }}</button>
        </div>
    </div>

    {{-- Start Populate Email List Modal --}}
    <div class="ui tiny modal" id="populateEmailListModal">
        <div class="header">
            {{ __('Add New Email List') }}
        </div>
        <div class="content">
            @include('mailchimpmanagement::populate_email_list')
        </div>
        <div class="actions">
            <div class="ui grey deny button" onclick="cancelAction()">
                {{ __('Cancel') }}
            </div>
            <button type="submit" class="ui yellow submit button" form="populateEmailListForm"> {{ __('Confirm') }}</button>
        </div>
    </div>


    {{-- Start auth Modal --}}
    <div class="ui tiny modal" id="authModal">
        <div class="header">
            {{ __('Enter Your Account Password') }}
        </div>
        <div class="content">
            @include('mailchimpmanagement::auth')
        </div>
        <div class="actions">
            <div class="ui grey deny button" onclick="cancelAction()">
                {{ __('Cancel') }}
            </div>
            <button type="submit" class="ui yellow submit button" id="authConfirmBtn"> {{ __('Confirm') }}</button>
        </div>
    </div>



    <script>
        $('#mailchimpManagementContainer').addClass('active');

        $(function(){
            $('.ui.dropdown').dropdown({
                on: 'click',
                showOnFocus: false
            });
        });
        function cancelAction(){
            window.location.reload();
        }

        function showAddEmailListModal(){
            $('#addEmailListModal').modal('show');
        }
        function showPopulateEmailListModal(emailListID){
            $('#ToPopulateEmailListID').val(emailListID);
            $('#populateEmailListModal').modal('show');
        }
        function showCampaignModal(action,ID,title,emailListID){
           if(action == 'add'){
               $('#campaignID').val('');
               $('#title').val('');
               $('#emailListID').dropdown('set selected','');
           }else{
               $('#campaignID').val(ID);
               $('#title').val(title);
               $('#emailListID').dropdown('set selected',emailListID);
           }
            $('#addCampaignModal').modal('show');
        }

        function confirmEmailListDelete(ID){
            $('#confirmSubmit').attr('onclick', 'location.href=\'{{route('deleteEmailList')}}/'+ID+' \'');
            $('#submit_confirmation_modal').modal('show');
        }

        function confirmCampaignDelete(ID){
            $('#confirmSubmit').attr('onclick', 'location.href=\'{{route('deleteMailchimpCampaign')}}/'+ID+' \'');
            $('#submit_confirmation_modal').modal('show');
        }

        function confirmCampaignSend(ID){
            $('#authConfirmBtn').attr('onclick', 'authMailchimpCampaignSend("'+ID+'")');
            $('#authModal').modal('show');
        }

        function previewCampaignEmail(ID){
            $('#emailPreviewerContainer').attr('data', '{{route('previewMailchimpCampaign')}}/'+ID);
            $('#emailPreviewerModal').modal('show');
        }

        function sendTestMarketingEmail(index) {
            var data = {
                '_token':"{{ csrf_token() }}"
            };
            data['index'] = index;
            $.ajax({
                type: 'GET',
                url: "{{route('sendTestMarketingEmail')}}",
                data: data,
                success: function (data) {
                    if(data.status === 'SUCCESS'){
                        alert('check the inbox for the email:'+data.email);
                    }
                    else{
                        alert('failed to send email, try again' +data.email);
                    }
                }
            });
        }

        @if (session('status'))
            @if(session('status')=='SUCCESS')
                alert('action is successfully executed');
            @else
                alert('failed to execute action');
            @endif
        @endif

        function authMailchimpCampaignSend(ID){

            var data = {
                    '_token':"{{ csrf_token() }}"
                };
            data['auth'] = $('#auth').val();
            data['toSendCampaignID'] = ID;

                $.ajax({
                    type: 'GET',
                    url: "{{route('mailchimpCampaignSendAuth')}}",
                    data: data,
                    success: function (data) {
                        window.location.reload();
                        // if(data === 'SUCCESS'){
                        // }
                        // else{
                        // }
                    }
                });
            }
    </script>
@endsection

@section('breadcrumbs')
    <a href="{{route('admin-landing')}}">Backend Management</a><i class="right angle icon divider"></i><span>Mailchimp Management</span>
@endsection