@extends('layouts.master')
@section('page_title', 'Mailbox Mining')
@section('content')
    <div class="container">
        {{ Form::page_header('Mailbox Mining', 'business') }}

        @if(isset($business_user_imap_setting))
            <div class="row grid-header" id="pause_account">
                @include('business.imap._optin_review_pause_account_button', array('pause_account' => $business_user_imap_setting->pause_account))
            </div>
        @endif
        <div class="row">
            <div class="col-md-12 grey-bg curve_container">
                <div class="row">
                    @if(Gate::allows(\App\Providers\AuthServiceProvider::GATE_BUSINESS_ADMIN, $business) || isset($is_reviewer))
                        <div class="col-md-4">
                            {{ Form::row_select_inline('business_user', 'Business User', $buid, $business_user_select, 5, 7, null, 'business_user_select_onchange()', 'Select User', null, 'mailbox_user_select') }}
                            <p class="select-user-error">Select A User</p>
                        </div>
                    @endif
                    <div class="col-md-7">
                        <div class="col-md-5 no-padding">
                            {{ Form::label_ex('Show me all new contacts since') }}
                        </div>
                        {{ Form::date_ex('since_date', $since_date, 4, 'since_date') }}
                    </div>
                </div>
            </div>
        </div>
		<div id="spinner_container">
			<div id="spinner_overlay">
				<div id="spinner_loading"><img src="/img/boomtime-animated-infinity.gif"/></div>
			</div>
    	</div>
        <div id="mailbox_buddy_grids_container">
            @if(isset($buid))
                @include('business.imap._mailbox_buddy_grids', compact('data_prospects', 'data_fuse_org_clients', 'columns', 'data_blocklist', 'already_taken', 'already_taken_columns', 'blocklisted_domains', 'ignored_email_count'))
            @endif
        </div>
    </div>
@endsection
@section('page_script')
    @include('shared_script._status_alert_notification_script')
    {{ Html::script('/js/moment.min.js') }}
    {{ Html::script('/js/daterangepicker.js') }}
    <script>
		var fadeSpeed = 300;

        $(document).ready(function () {
            init_daterangepicker('since_date', true);
            $('.select-user-error').hide();
            $('[data-toggle="tooltip"]').tooltip();
            center_grid_titles();
        });

        function center_grid_titles() {
            $('.mm-grid-title').parent().css('text-align', 'center');
        }

        function daterangepicker_onchange(since_date) {
            let mailbox_user_select = $('#mailbox_user_select');
			let mailbox_user_select_exists = mailbox_user_select.length;
			let mailbox_user_id = mailbox_user_select.val();
			if (!mailbox_user_id) {
				// if the mailbox user select is not on the view, it's a regular business user and we don't pass the buid
				change_mailbox_buddy_user(since_date);
			} else {
                change_mailbox_buddy_user(since_date, mailbox_user_id);
			}
        }

        function business_user_select_onchange() {
            let since_date = $('#since_date').val();
			let mailbox_user_select = $('#mailbox_user_select');
			let mailbox_user_select_exists = mailbox_user_select.length;
			let mailbox_user_id = mailbox_user_select.val();
			if (!mailbox_user_id) {
				// if the mailbox user select is not on the view, it's a regular business user and we don't pass the buid
				change_mailbox_buddy_user(since_date);
			} else {
                change_mailbox_buddy_user(since_date, mailbox_user_id);
			}
        }

        function select_user_error(show) {
            if (show) {
                $('#mailbox_user_select').css('border-color', '#cc0000');
                $('.select-user-error').show();
            } else {
                $('#mailbox_user_select').css('border-color', '#797979');
                $('.select-user-error').hide();
            }
        }

        function update_status(business_user, pause_account, button) {
            $(button).prop('disabled', true)
            $('div#toggle-pause_account').fadeOut(fadeSpeed, function () {
                $(this).remove();
            });
            $.ajax({
                type: "POST",
                url: '{{ action('ImapIntegrationController@update_status', compact('business')) }}',
                data: {business_user: business_user, pause_account: pause_account},
                success: function (result) {
                    $('div#pause_account').append(result.view).hide().fadeIn(fadeSpeed);
                }
            });
        }

        function update_follow_up(org_client, select_dropdown) {
            var follow_up_interest_id = $(select_dropdown).val();
            $.ajax({
                url: '{{ action('ImapIntegrationController@update_follow_up') }}',
                method: 'POST',
                data: {org_client: org_client, follow_up_interest_id: follow_up_interest_id},
                success: function() {
                    status_alert(true, 'Follow up saved.', 5000);
                },
                error: function() {
                    status_alert(false, 'Follow up failed to save.<br>Please refresh the page and try again.', 10000);
                }
            });
        }

        function enable_save_btn(select) {
            $(select).parent().siblings('td.save-follow-up').children().prop('disabled', false);
        }

        function optout_email_check(email, button, business_prospect, business_user) {
            var button_selector = '#optout_' + business_prospect;
            $(button).prop('id', 'optout_' + business_prospect);
            $.ajax({
                url: '{{ action('ImapIntegrationController@optout_email_check', compact('business')) }}',
                method: 'GET',
                data: {email: email},
                success: function (result) {
                    if (result.email_count > 0) {
                        var $onclick_text = "optout_accepted('" + button_selector + "', '" + business_prospect + "', '" + business_user + "')";
                        showYesNoModalAlert('Opt-Out', 'This person has received ' + result.email_count + ' emails. Are you sure you want to opt them out?', $onclick_text);
                        $('#modal_alert_save').attr('data-dismiss', 'modal');
                    } else {
                        optout_accepted(button, business_prospect, business_user);
                    }
                }
            });
        }

        @if (isset($buid))
        function do_manual_optin(button, business_prospect, business_user) {
            remove_button_row(button);
            var url = '{{ action('ImapIntegrationController@manual_optin', ['business' => $business,'business_prospect' => 'XXX', 'business_user' => 'YYY']) }}';
            url = url.replace('XXX', business_prospect);
            url = url.replace('YYY', business_user);
            $.ajax({
                url: url,
                method: 'POST',
                data: {},
                success: function (result) {
                    $('#opted_in_grid').find('tbody#grid_body').append(result.table_row);
                },
                error: function (result) {
                    show_error_message('opt-in-error', result.responseJSON.data.msg);
                }
            });
        }

        function optout_accepted(button, business_prospect, business_user) {
            remove_button_row(button);
            optout_accepted_ajax(business_prospect, business_user);
        }

        function optout_accepted_ajax(business_prospect, business_user) {
            var url = '{{ action('ImapIntegrationController@optout_accepted', ['business' => $business,'business_prospect' => 'XXX', 'business_user' => 'YYY']) }}';
            url = url.replace('XXX', business_prospect);
            url = url.replace('YYY', business_user);
            $.ajax({
                url: url,
                method: 'POST',
                data: {},
                success: function (result) {
                    $('#not_opted_in_grid').find('tbody#grid_body').append(result.table_row);
                }
            });
        }

        function optin_rejected(button, business_prospect, business_user, is_never_auto_optin = false) {
            remove_button_row(button);
            // if auto optin is set to 'never' do not send the contact to the zapier webhook using this function (the contact will be sent using the do_manual_optin function here and the do_manual function in the Controller)
            if (is_never_auto_optin == true)
            {
                optin_rejected_ajax(business_prospect, business_user, false);
            }
            // send the contact to zapier webhook using this function
            else
            {
                optin_rejected_ajax(business_prospect, business_user, true);
            }
        }

        function optin_rejected_ajax(business_prospect, business_user, send_contact_to_zapier_webhook) {
            var url = '{{ action('ImapIntegrationController@optin_rejected', ['business' => $business,'business_prospect' => 'XXX', 'business_user' => 'YYY']) }}';
            url = url.replace('XXX', business_prospect);
            url = url.replace('YYY', business_user);
            $.ajax({
                url: url,
                method: 'POST',
                data: {send_contact_to_zapier_webhook: send_contact_to_zapier_webhook},
                success: function (result) {
                    $('#opted_in_grid').find('tbody#grid_body').append(result.table_row);
                }
            });
        }

        function blocklist_accepted(button, business_prospect, business_user) {
            remove_button_row(button);
            blocklist_accepted_ajax(business_prospect, business_user);
        }

        function blocklist_accepted_ajax(business_prospect, business_user) {
            var url = '{{ action('ImapIntegrationController@blocklist_accepted', ['business' => $business,'business_prospect' => 'XXX', 'business_user' => 'YYY']) }}';
            url = url.replace('XXX', business_prospect);
            url = url.replace('YYY', business_user);
            $.ajax({
                url: url,
                method: 'POST',
                data: {},
                success: function (result) {
                    $('#blocklist_grid').find('tbody#grid_body').append(result.table_row);
                }
            });
        }

        function remove_blocklist(button, business_prospect, business_user, opt_in) {
            remove_button_row(button);
            remove_blocklist_ajax(business_prospect, business_user, opt_in);
        }

        function remove_blocklist_ajax(business_prospect, business_user, opt_in) {
            var url = '{{ action('ImapIntegrationController@remove_blocklist', ['business' => $business,'business_prospect' => 'XXX', 'business_user' => 'YYY']) }}';
            url = url.replace('XXX', business_prospect);
            url = url.replace('YYY', business_user);
            $.ajax({
                url: url,
                method: 'POST',
                data: {opt_in: opt_in},
                success: function (result) {
                    if (result.opt_in)
                        $('#opted_in_grid').find('tbody#grid_body').append(result.table_row);
                    else
                        $('#not_opted_in_grid').find('tbody#grid_body').append(result.table_row);
                }
            });
        }

        function remove_button_row(button) {
            var row = $(button).parents('tr:first');
            row.fadeOut(fadeSpeed, function () {
                $(this).remove();
            });
        }
        @endif

        function change_mailbox_buddy_user(since_date, buid) {
			$('#spinner_overlay').show();
            if (!buid)
                buid = '{{ $buid }}';
            $('div#mailbox_buddy_grids').fadeOut(fadeSpeed, function () {
                $(this).remove();
            });
            $.ajax({
                url: '{{ action('ImapIntegrationController@change_mailbox_buddy_user', compact('business')) }}',
                method: 'GET',
                data: {buid: buid, since_date: since_date},
                success: function (result) {
                    $('div#mailbox_buddy_grids_container').append(result.view).hide().fadeIn(fadeSpeed);
                    $('td.save-follow-up input.btn').prop('disabled', true);
                    $('[data-toggle="tooltip"]').tooltip();
                    center_grid_titles();
					$('#spinner_overlay').hide();
                },
				error: function (err) {
					$('#spinner_overlay').hide();
					console.log(err);
				}
            })
        }
    </script>
@endsection
@section('page_style')
    {!! HTML::style('/css/daterangepicker.css') !!}
    {!! HTML::style('/css/daterangepicker_custom.css') !!}
    <style>
        #get_results_btn {
            margin-left: 30px;
        }

        .select-user-error {
            display: block;
            color: #cc0000;
            font-size: 14px;
            text-align: center;
            padding: 0 0 0 40px;
            margin: 0;
        }

        .mm-grid-title {
            margin-bottom: 30px;
            margin-top: 20px;
        }

        #since_date_group {
            margin-left: 10px;
        }

        #spinner_overlay {
            position: fixed;
            display: none;
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: rgba(190, 190, 190, 0.7);
            z-index: 2;
            cursor: pointer;
        }

        #content {
            position: relative;
            display: block;
            height: 100%;
            border: 1px solid black;
            padding: 20px;
            margin: 10px;
        }

        #spinner_loading {
            position: absolute;
            top: 50%;
            left: 50%;
            font-size: 50px;
            color: white;
            width: 140px;
            transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
        }

        @media (max-width: 991px) {
            #get_results_btn {
                margin-left: 0;
            }

            .bt-date-block {
                padding-right: 15px !important;
            }
        }
    </style>
@endsection