[%
USE Mysql;
USE DataURI;
USE HTMLOptions;
USE JSON;
USE NVData;

SET spinner_url = '/images/report-spinner.gif';
IF CPANEL.ua_is_ie && CPANEL.ua_is_ie < 8;
    SET spinner_url = MagicRevision(spinner_url);
    "<img src='$spinner_url' style='display:none'>";
ELSE;
    SET spinner_url = DataURI.datauri(spinner_url, 'image/gif');
END;

SET nvdata = NVData.get_page_nvdata();

SET stats_db_status = execute('Email','stats_db_status');

SET upcp_running = (stats_db_status.data == 'upcp') && locale.maketext('An update of [asis,cPanel amp() WHM] on this system is in progress. Email statistics are not available.');
-%]

<script type="text/javascript">
    var setShowAllFilter = function(showAll) {
        var advancedForm = DOM.get("advanced-form");

        // if there is no recipient email clear the trace
        if( !DOM.get("freeform").value.trim() ) {
            DOM.setStyle( "outer_trace_container", "display", "none" );
        }

        // set filter states
        if( showAll ) {
            advancedForm.success.checked = 1;
            advancedForm.failure.checked = 1;
            advancedForm.defer.checked = 1;
            advancedForm.inprogress.checked = 1;
        } else {
            advancedForm.success.checked  = 0;
            advancedForm.failure.checked  = 1;
            advancedForm.defer.checked  = 0;
            advancedForm.inprogress.checked  = 0;
        }
        check_filter();
    }

    var runReport = function() {
        setSpinner();
        doTrace();
        doupdate();
    }

    var setSpinner = function() {
        return function () {
            var run_buttons = DOM.getElementsByClassName('search-button');
            for(var i = 0 ; i < run_buttons.length ; i++){
                run_buttons[i].disabled = true;
                DOM.setStyle(run_buttons[i].getElementsByClassName('search-button-spinner-text')[0], 'opacity', 0.2);
            }
        }
    }();

    var hide_spinner = function () {
        return function () {
            var run_buttons = DOM.getElementsByClassName('search-button');
            for(var i = 0 ; i < run_buttons.length ; i++){
                run_buttons[i].disabled = false;
                DOM.setStyle(run_buttons[i].getElementsByClassName('search-button-spinner-text')[0], 'opacity', 1);
            }
        }
    }();

</script>


<script type="text/plain" id="actions_template">
    <div class="icon_holder">
        <a id="lnkViewDetails" href="javascript:void(0)" onclick="show_details(this)" title="[% locale.maketext('View Details') %]">
            <span class="fas fa-info-circle" title="[% locale.maketext('View Details') %]"></span>
        </a>
    </div>
</script>

[% INCLUDE _assets/_calendar.html.tt %]
<div class="body-content">

    [% IF stats_db_status.status && !upcp_running %]
        <p id="descTrackDelivery" class="description">
    [% locale.maketext("Review an email’s delivery route. This can be useful if you need to locate problems with email delivery. For more information, read the [output,url,_1,documentation,target,_2,id,_3].", "//go.cpanel.net/TrackDelivery", "_blank", "lnkTrackDeliveryDocumentation") %]
        </p>

        [% IF stats_db_status.data == 'importing' -%]
            <div class="alert alert-info">
                <span class="glyphicon glyphicon-remove-sign"></span>
                <div class="alert-message">
                    [% locale.maketext('[output,strong,Note]: A rebuild of this database is in progress. Search results may be incomplete.') %]
                </div>
            </div>
        [% END -%]

        [% SET retention = CPANEL.CPCONF().exim_retention_days || 10 %]
        <div class="sample"></div>
        <div class="section">
            <form action="javascript:void(0)" name='search-fields' id='search-fields' onsubmit="runReport()">
                <input id="type-select" type="hidden" name="mainkey" value="recipient" />
                <input id="hidSearchmatch" type="hidden" name="searchmatch" value="eq" />
                <input id="deliverytype_all" type="hidden" name="deliverytype" value="all" />
                <input id="startdate" name="startdate" type="hidden" />
                <input id="enddate" name="endddate" type="hidden" />
                <input id="endtime" name="endtime" type="hidden" />
                <input id="starttime" name="starttime" type="hidden" />
                <div class="form-group">
                    <label id="lblRecipientEmail" for="freeform">[% locale.maketext('Recipient Email (optional)') %]</label>
                    <div class="row">
                        <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6">
                            <div class="input-group">
                                <input type="text" class="form-control" id="freeform" name="freeform" placeholder="[% locale.maketext("Optional") %]" />
                                <span class="input-group-btn">
                                    <button class="btn btn-primary" type="submit">[% locale.maketext("Run Report") %]</button>
                                </span>
                            </div>
                        </div>
                        <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6">
                            <div id="freeform_error"></div>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <button type="button" class="btn btn-default search-button" id='show-all-run-button' onclick="setShowAllFilter(true)">
                        <span class='search-button-spinner-text'>[% locale.maketext("Show All") %]</span>
                    </button>
                    <button type="button" class="btn btn-default search-button" id='show-fails-run-button' onclick="setShowAllFilter(false)">
                        <span class='search-button-spinner-text'>[% locale.maketext("Show Blocked [output,amp] Failed") %]</span>
                    </button>
                </div>
            </form>
        </div>

        <div id="cjt_pagenotice_container"></div>

        <a id="report"></a>
        <div class="section">
        <div id='table_container'>
            <div id='page-control' class="clearfix">
                <h2>[% locale.maketext("Delivery Report") %]</h2>
                <div class="results-output">
                    <div class="results-header"></div>
                    <div class="total-items">
                        <div id="results-header"></div>
                    </div>
                </div>
                <div id="floater">
                    <div id="top-page-nav"></div>
                </div>
            </div>
            <div id="option_header" style="display:none;">
                <div class="table-box">
                    <div class="table-top group">
                        <div style='float: right' id='toggle_col_options'>
                            <a href='javascript:void(0)' onclick='toggle_options()'>
                                <img border=0 src="[% MagicRevision('../images/edit-list.png') %]" alt="[% locale.maketext("Table Options") %]" title="[% locale.maketext("Table Options") %]" />
                            </a>
                        </div>
                        <br style="clear:both" />

                        <div id='filterItems'>
                            <div class="top-filterItems">
                                <div class="filterItems-Arrow"></div>
                            </div>
                            <form class="advanced-section" id="advanced-form" action="javascript:void(0)">
                                <span class="inputs">
                                    <label>
                                        <input type="checkbox" name="success" value="1" [% IF nvdata && nvdata.show_success %]checked[% END %] onclick='return check_filter()' />
                                        [% locale.maketext("Show Successes") %]
                                    </label>
                                </span>

                                <span class="inputs">
                                    <label>
                                        <input type="checkbox" name="defer" value="1" [% IF nvdata && nvdata.show_defer %]checked[% END %] onclick='return check_filter()' />
                                        [% locale.maketext("Show Deferred") %]
                                    </label>
                                </span>
                                <span class="inputs">
                                    <label>
                                        <input type="checkbox" name="failure" value="1" [% IF !nvdata || nvdata.show_failure || !nvdata.defined('show_failure') %]checked[% END %] onclick='return check_filter()' />
                                        [% locale.maketext("Show Failures") %]
                                    </label>
                                </span>
                                <span class="inputs">
                                    <label>
                                        <input type="checkbox" name="inprogress" value="1" [% IF nvdata && nvdata.show_inprogress %]checked[% END %] onclick='return check_filter()' />
                                        [% locale.maketext("Show In-Progress") %]
                                    </label>
                                </span>
                                <div class="inputs mxresults">
                                    <label>[% locale.maketext('Max Results/Type:') %]
                                        <select name="max_results_by_type">
                                        [% HTMLOptions.options_as_html( [
                                            { v => 250, t => 250 },
                                            { v => 500, t => 500 },
                                            { v => 1000, t => 1000 },
                                            { v => 2500, t => 2500 },
                                            { v => 5000, t => 5000 },
                                            { v => 0, t => locale.maketext('Unlimited') },
                                        ], {
                                            value => 'v',
                                            text => 't',
                                            selected => nvdata.max_results_by_type || 250,
                                        } ) -%]
                                        </select>
                                    </label>
                                </div>
                            </form>
                        </div><!-- filteritems -->
                    </div><!-- table-top group -->
                    <div id="deliveryreport" class="deliveryreport"></div>
                    <div class="data-retained">
                        [% locale.maketext('Data is retained for [quant,_1,day,days].',retention) %]
                    </div>
                </div><!-- table-box -->
            </div><!-- option_header -->
            <div id='bottom-nav'>
                <div id='floater-bottom' style="float:right; padding:0px; margin:0px">
                    <div id="bottom-page-nav"></div>
                </div>
                <br style="clear: both" />
            </div>
            <br style="clear: both" />

            <div id="outer_trace_container" style="display:none">
                <h2>[% locale.maketext("Email Address Trace") %]</h2>
                <div id="trace_container" class="trace-container">
                    <div id="trace_message" class="email-trace"></div>
                </div>
            </div><!-- outer_trace_container -->
        </div><!-- table_container -->
        </div>
       <div id="col_options">
            <div class="options-top group"></div>
            <div class="hd"></div>
            <div class="options-bd">
                <div class="tb-options">
                    [% locale.maketext("Table Options") %]
                    <div class="closeit"><a href='#' onclick='header_panel.hide(); return false'>X</a></div>
                </div>
                <div class="info-blurb">[% locale.maketext("Select the columns you wish to display in the table.") %]</div>
                <div id="option_area"></div>
            </div>
        </div>

        <div id="startcal">
            <div class="bd">
                <div id="cal1Container"></div>
            </div>
        </div>

        <div id="emailreport"></div>

        <div style="width: 1px; height: 1px; position:absolute; top:-999999px; left:-999999px;" id="printpanel"></div>

        <div id="dateSelect" style="display:none"></div>

    [% ELSE %]
        <div id="main_content">
            <p class="description">
                [% SET alert_type = upcp_running ? 'info' : 'danger' -%]

                <div class="alert alert-[% alert_type %]">
                    <span class="glyphicon glyphicon-remove-sign"></span>
                    <div class="alert-message">
                        [% upcp_running || stats_db_status.errors_as_string() %]
                    </div>
                </div>
            </p>
        </div>
    [% END %]

    [% INCLUDE _assets/return_link.html.tt return_location='../index.html' return_link_text=locale.maketext('Go Back') %]
</div><!-- end body-content -->

<script type="text/javascript">
    /* load initial page */
    YAHOO.util.Event.onDOMReady(function(){
        var tt2 = new YAHOO.widget.Tooltip("tt2", {
                context:"Search_TT",
                text: [% locale.maketext('This search persists until you clear it. Because searching updates the report, new data may appear after you click [output,class,Go,_1].','ui-term-reference').json() %],
                autodismissdelay: 100000, xyoffset: [5,10]
        });
        setSpinner();
        doTrace();
        doupdate();
    });
</script>

<style type="text/css">
/* ----- Counteract Bootstrap: */
.email-trace dl {
    margin-bottom: 0;
}
.email-trace code {
    color: inherit;
    background-color: rgba(0, 0, 0, 0.05);
}

.email-trace dt,
.email-trace dl {
    line-height: 1.6;
}
/* ----- */

:not([dir=rtl]) .email-trace dd {
    margin-left: 1em;
}

[dir=rtl] .email-trace dd {
    margin-right: 1em;
}

/* Padding between each route destination: */
.email-trace dl.route-list > dd:not(:last-of-type) {
    margin-bottom: 1em;
}

:not([dir=rtl]) .email-trace .icon-wrapper {
    margin-right: 0.25em;
}

[dir=rtl] .email-trace .icon-wrapper {
    margin-left: 0.25em;
}

.email-trace .icon-wrapper {
    font-size: larger;
    vertical-align: middle;
}
</style>

<!-- start trace logic -->
<script src="/sharedjs/email_trace_tree.js"></script>
<script>
    var traceDiv = DOM.get("trace_message");
    window.doTrace = function(email) {
        email = email || DOM.get("freeform").value.trim();

        if (email) {
            CPANEL.api( {
                version: 3,
                module: "Email",
                func: "trace_delivery",
                data: { recipient: email },
                callback: {
                    success: function(o) {
                        traceDiv.innerHTML = CPANEL.emailTraceTree(o.cpanel_data);
                        DOM.get("outer_trace_container").style.display = "";
                    },
                    failure: function(o) {
                        var msgHtml = o.cpanel_messages.filter(
                            function(m) { return m.level === "error" }
                        ).map(
                            function(m) { return m.content.html_encode(); }
                        ).join(" ");

                        msgHtml = "[% locale.maketext('The system failed to trace delivery to “[_1]” because of an error: [_2]','%dest%', '%err') %]".replace(/%dest%/, email.html_encode()).replace(/%err/, msgHtml);

                        CPANEL.ajax.show_api_error(msgHtml,"cjt_pagenotice_container");
                    },
                },
            } );
        }
    };
</script>
<!-- end trace logic -->