[%
    USE Whostmgr;
    USE JSON;

    SET on_switch_text = "ON";
    SET off_switch_text = "OFF";
    IF (locale.get_language_tag() != "en");
        # These characters should not be translated.
        on_switch_text = "I";
        off_switch_text = "O";
    END;

    WRAPPER 'master_templates/master.tmpl'
        header = locale.maketext('cPHulk Brute Force Protection'),
        breadcrumburl = '/scripts7/cphulk',
        base = '/scripts7/cphulk/',
        stylesheets = [
            Whostmgr.find_file_url('/templates/hulkd/index.css'),
            Whostmgr.find_file_url('/templates/hulkd/angular-toggle-switch-bootstrap.min.css'),
            Whostmgr.find_file_url('/templates/hulkd/angular-toggle-switch.min.css')
        ],
        theme='bootstrap',
        CJT2_EXCLUSIVE = 1,
        app_key='cphulk_brute_force_protection';
%]
<div id="content"
    ng-controller="BaseController"
    class="ng-cloak"
    ng-cloak>
    <p>[% locale.maketext("[asis,cPHulk] provides protection from brute force attacks against your web services.") %]</p>
    <div ng-controller="hulkdEnableController">
        <div id="enable_disable_control">
            <div class="enable_disable_row">
                <div class="enable_disable_cell">
                    <div role="checkbox"
                        id="hulkd_status_toggle"
                        class="toggle-switch"
                        tabindex="0"
                        aria-checked="{{ hulkdEnabled }}"
                        aria-label="[% locale.maketext("Enable [asis,cPHulk]") %]"
                        ng-click="toggle_status()"
                        ng-keyup="handle_keyup($event)"
                        ng-keydown="handle_keydown($event)"
                        ng-class="{disabled: changing_status}">
                        <div class="toggle-switch-animate" ng-class="{'switch-off': !hulkdEnabled, 'switch-on': hulkdEnabled}">
                            <span class="switch-left">
                                [% on_switch_text %]
                            </span>
                            <span class="knob">{{knobLabel}}</span>
                            <span class="switch-right">
                                [% off_switch_text %]
                            </span>
                        </div>
                    </div>
                </div>
                <div class="enable_disable_cell" ng-hide="hulkdEnabled || changing_status">
                    <div class="led led-red"></div>
                </div>
                <div class="enable_disable_cell" ng-hide="!hulkdEnabled || changing_status">
                    <div class="led led-green"></div>
                </div>
                <div class="enable_disable_cell" ng-hide="!changing_status">
                    <span class="fas fa-spinner fa-spin"></span>
                </div>
                <div class="enable_disable_cell" ng-hide="changing_status">
                    <span class="hulkd_status_message" ng-hide="!hulkdEnabled">[% locale.maketext('[asis,cPHulk] is [output,strong,Enabled]') %]</span>
                    <span class="hulkd_status_message" ng-hide="hulkdEnabled">[% locale.maketext('[asis,cPHulk] is [output,strong,Disabled]') %]</span>
                </div>
            </div>
        </div>
        <div id="tabContainer" ng-show="hulkdEnabled">
            <ul class="nav nav-tabs">
                <li ng-class="{active: currentRoute === '/config'}"><a href="config">[% locale.maketext('Configuration Settings') %]</a></li>
                <li ng-class="{active: currentRoute === '/whitelist'}"><a href="whitelist">[% locale.maketext('Whitelist Management') %]</a></li>
                <li ng-class="{active: currentRoute === '/blacklist'}"><a href="blacklist">[% locale.maketext('Blacklist Management') %]</a></li>
                <li ng-class="{active: currentRoute === '/countries'}"><a href="countries">[% locale.maketext('Countries Management') %]</a></li>
                <li ng-class="{active: currentRoute === '/history'}"><a href="history">[% locale.maketext('History Reports') %]</a></li>
            </ul>
            <div class="loading" ng-show="loading">
                <p class="alert alert-info col-xs-12">
                    <span><i class="fas fa-spinner fa-spin"></i> [% locale.maketext('Loading …') %]</span>
                </p>
            </div>
            <div class="tab-content" ng-view ng-class="{'view-disabled':loading}"></div>
        </div>
        <script type="text/ng-template" id="ip-examples-tooltip.html">
            <strong>[% locale.maketext("Examples:") %]</strong><br>
            169.254.1.1<br>
            169.254.1.10-169.254.1.10<br>
            169.254.0.0/16<br>
            2001:db8::<br>
            2001:db8::-2001:db8:ffff:ffff:ffff:ffff:ffff:ffff<br>
            2001:db8::/32
        </script>
    </div>
    <div growl></div>
</div>

<script type="text/javascript">
    var PAGE = PAGE || {};

    PAGE.config_values = [% data.config.json() %];
    PAGE.security_token = [% cp_security_token.json() %];
    PAGE.hulkd_status = [% data.status.json() %];
    PAGE.ipToAdd = [% CPANEL.FORM.ip.defined() ? CPANEL.FORM.ip.json() : "null" %];
</script>

<script type="text/ng-template" id="confirm_whitelist_deletion.html">
    <div class="modal-header">
        <h4><span class="glyphicon glyphicon-check"></span><span class="confirm_message">[% locale.maketext('Confirm Deletion') %]</span></h4>
    </div>
    <div class="modal-body">
        {{delete_confirmation_message()}}
    </div>
    <div class="modal-footer">
        <button class="btn btn-primary btn-sm" ng-click="delete_whitelist_ips(is_single_deletion)">[% locale.maketext('Continue') %]</button>
        <button class="btn btn-link btn-sm" ng-click="cancel_deletion()">[% locale.maketext('Cancel') %]</button>
    </div>
</script>
<script type="text/ng-template" id="confirm_blacklist_deletion.html">
    <div class="modal-header">
        <h4><span class="glyphicon glyphicon-check"></span><span class="confirm_message">[% locale.maketext('Confirm Deletion') %]</span></h4>
    </div>
    <div class="modal-body">
        {{delete_confirmation_message()}}
    </div>
    <div class="modal-footer">
        <button class="btn btn-primary btn-sm" ng-click="delete_blacklist_ips(is_single_deletion)">[% locale.maketext('Continue') %]</button>
        <button class="btn btn-link btn-sm" ng-click="cancel_deletion()">[% locale.maketext('Cancel') %]</button>
    </div>
</script>
<script type="text/ng-template" id="confirm_blacklist_delete_all.html">
    <div class="modal-header">
        <h4><span class="glyphicon glyphicon-check"></span><span class="confirm_message">[% locale.maketext('Confirm Deletion') %]</span></h4>
    </div>
    <div class="modal-body">
        [% locale.maketext("Do you want to permanently delete all records from the blacklist?") %]
    </div>
    <div class="modal-footer">
        <button class="btn btn-primary btn-sm" ng-click="delete_all()">[% locale.maketext('Continue') %]</button>
        <button class="btn btn-link btn-sm" ng-click="cancel_delete_all()">[% locale.maketext('Cancel') %]</button>
    </div>
</script>
<script type="text/ng-template" id="confirm_whitelist_delete_all.html">
    <div class="modal-header">
        <h4><span class="glyphicon glyphicon-check"></span><span class="confirm_message">[% locale.maketext('Confirm Deletion') %]</span></h4>
    </div>
    <div class="modal-body">
        [% locale.maketext("Do you want to permanently delete all records from the whitelist?") %]
    </div>
    <div class="modal-footer">
        <button class="btn btn-primary btn-sm" ng-click="delete_all()">[% locale.maketext('Continue') %]</button>
        <button class="btn btn-link btn-sm" ng-click="cancel_delete_all()">[% locale.maketext('Cancel') %]</button>
    </div>
</script>
<script type="text/ng-template" id="confirm_country_blacklisting.html">
    <div class="modal-header">
        <h4><span class="glyphicon glyphicon-check"></span><span class="confirm_message">[% locale.maketext('Confirm Blacklisting') %]</span></h4>
    </div>
    <div class="modal-body">
        [% locale.maketext("Please exercise caution when blacklisting IP addresses by country. If your IP address is not whitelisted and matches with a country you are blacklisting, you will be locked out of WHM.") %]
    </div>

    <div class="modal-footer">
        <button class="btn btn-primary btn-sm" ng-click="continue_country_blacklisting(selectedItems)">[% locale.maketext('Continue') %]</button>
        <button class="btn btn-link btn-sm" ng-click="cancel_country_blacklisting()">[% locale.maketext('Cancel') %]</button>
    </div>
</script>


<script type="text/ng-template" id="directives/countryCodesTable.ptt">
[% PROCESS 'hulkd/directives/countryCodesTable.ptt' %]
</script>

[% PROCESS 'master_templates/cjt2_header_include.tt' %]

[% END %]