{% extends "baseTemplate/index.html" %}
{% load i18n %}
{% block title %}{% trans "Secure SSH - CyberPanel" %}{% endblock %}
{% block content %}

    {% load static %}
    {% get_current_language as LANGUAGE_CODE %}
    <!-- Current language: {{ LANGUAGE_CODE }} -->


    <div class="container">
        <div id="page-title">
            <h2>{% trans "Secure SSH" %} - <a target="_blank" href="http://go.cyberpanel.net/ssh-docs"
                                              style="height: 23px;line-height: 21px;"
                                              class="btn btn-border btn-alt border-red btn-link font-red"
                                              title=""><span>{% trans "SSH Docs" %}</span></a></h2>
            <p>{% trans "Secure or harden SSH Configurations." %}</p>
        </div>

        <div ng-controller="secureSSHCTRL" class="panel">
            <div class="panel-body">
                <h3 class="content-box-header">
                    {% trans "Secure SSH" %} <img ng-hide="secureSSHLoading" src="{% static 'images/loading.gif' %}">
                </h3>
                <div class="example-box-wrapper">
                    <ul class="nav nav-tabs">

                        <li class="col-md-2 nav-item active">
                            <a href="#tab-example-1" data-toggle="tab" class="nav-link tab-mod h4">
                                <i class="fa fa-cog btn-icon mr-10"></i>&nbsp;
                                <span>{% trans "Basic" %}</span>
                            </a>
                        </li>
                        <li class="col-md-2 nav-item">
                            <a href="#tab-example-3" data-toggle="tab" class="nav-link tab-mod h4">
                                <i class="fa fa-cogs btn-icon mr-10"></i>&nbsp;
                                <span>{% trans "SSH Keys" %}</span>
                            </a>
                        </li>
                    </ul>
                    <div class="tab-content">
                        <div class="tab-pane fade active in" id="tab-example-1">
                            <div class="example-box-wrapper">


                                <form action="/" class="form-horizontal bordered-row">


                                    <div ng-hide="emailDetails" class="form-group">
                                        <label class="col-sm-3 control-label">{% trans "SSH Port" %}</label>
                                        <div class="col-sm-6">
                                            <input type="text" class="form-control" ng-model="sshPort" required>
                                        </div>

                                    </div>


                                    <div class="form-group">
                                        <label class="col-sm-3 control-label">{% trans "Permit Root Login" %}</label>
                                        <div class="col-md-8 text-white">
                                            <input type="checkbox" id="rootLogin" data-toggle="toggle"
                                                   data-on="Enabled">
                                            <div style="margin-top: 2%;margin-bottom: -2%" class="alert alert-warning">
                                                <p>{% trans "Before disabling root login, make sure you have another account with sudo priviliges on server." %}</p>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label class="col-sm-3 control-label"></label>
                                        <div class="col-sm-4">
                                            <button type="button" ng-click="saveChanges()"
                                                    class="btn btn-primary btn-lg">{% trans "Save Changes" %}</button>

                                        </div>
                                    </div>


                                    <div class="form-group">
                                        <label class="col-sm-3 control-label"></label>
                                        <div class="col-sm-4">
                                            <div ng-hide="couldNotSave" class="alert alert-danger">
                                                <p>{% trans "Error message: " %}{$ errorMessage $}</p>
                                            </div>

                                            <div ng-hide="detailsSaved" class="alert alert-success">
                                                <p>{% trans "SSH Configurations Saved." %}</p>
                                            </div>


                                            <div ng-hide="couldNotConnect" class="alert alert-danger">
                                                <p>{% trans "Could not connect. Please refresh this page." %}</p>
                                            </div>
                                        </div>


                                    </div>


                                </form>


                            </div>
                        </div>


                        <div class="tab-pane fade" id="tab-example-3">

                            <form action="/" class="form-horizontal bordered-row">

                                <!------ List of records --------------->

                                <div class="form-group">

                                    <div class="col-sm-12">

                                        <table class="table">
                                            <thead>
                                            <tr>
                                                <th>{% trans "User Name" %}</th>
                                                <th>{% trans "Key" %}</th>
                                                <th>{% trans "Delete" %}</th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            <tr ng-repeat="record in records track by $index">
                                                <td ng-bind="record.userName">root</td>
                                                <td ng-bind="record.key"></td>
                                                <td ng-click="deleteKey(record.key)">
                                                    <div class="h4 text-danger text-bold">X</div>
                                                </td>
                                            </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>


                                <!------ List of records --------------->

                                <div ng-hide="keyBox" class="form-group">
                                    <div class="col-sm-12">
                                        <textarea placeholder="Paste your public key here..." ng-model="keyData"
                                                  rows="6" class="form-control">{{ logs }}</textarea>
                                    </div>
                                </div>


                                <div ng-hide="showKeyBox" class="form-group">
                                    <label class="col-sm-3 control-label"></label>
                                    <div class="col-sm-4">
                                        <button type="button" ng-click="addKey()"
                                                class="btn btn-primary btn-lg">{% trans "Add Key" %}</button>

                                    </div>
                                </div>

                                <div ng-hide="saveKeyBtn" class="form-group">
                                    <label class="col-sm-3 control-label"></label>
                                    <div class="col-sm-4">
                                        <button type="button" ng-click="saveKey()"
                                                class="btn btn-primary btn-lg">{% trans "Save" %}</button>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-3 control-label"></label>
                                    <div class="col-sm-4">

                                        <div ng-hide="keyDeleted" class="alert alert-success">
                                            <p>{% trans "SSH Key Deleted" %}</p>
                                        </div>


                                        <div ng-hide="couldNotConnect" class="alert alert-danger">
                                            <p>{% trans "Could not connect. Please refresh this page." %}</p>
                                        </div>
                                    </div>
                                </div>


                            </form>


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


    </div>


{% endblock %}