{% extends "baseTemplate/index.html" %}
{% load i18n %}
{% block title %}{% trans "Transfer Websites from Remote Server - 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 "Remote Backups" %} - <a  target="_blank" href="http://go.cyberpanel.net/remote-transfer" style="height: 23px;line-height: 21px;" class="btn btn-border btn-alt border-red btn-link font-red" title=""><span>{% trans "Remote Transfer" %}</span></a></h2>
   <p>{% trans "This feature can import website(s) from remote server" %}</p>
</div>

<div ng-controller="remoteBackupControl" class="panel">
    <div class="panel-body">
        <h3 class="title-hero">
            {% trans "Remote Backups" %} <img ng-hide="backupLoading" src="{% static 'images/loading.gif' %}">
        </h3>
        <div  class="example-box-wrapper">

            <p ng-bind="transferStatus"></p>
            <form  action="/" class="form-horizontal bordered-row">

                <div class="form-group">
                    <label class="col-sm-3 control-label">{% trans "IP Address" %}</label>
                    <div class="col-sm-6">
                        <input  type="text" class="form-control" ng-model="IPAddress" required>
                    </div>
                </div>


                <div class="form-group">
                    <label class="col-sm-3 control-label">{% trans "Password" %}</label>
                    <div class="col-sm-6">
                        <input ng-change="passwordEnter()" type="password" class="form-control" ng-model="password" required>
                    </div>
                </div>

                <div ng-hide="backupButton" class="form-group">
                    <label class="col-sm-3 control-label"></label>
                    <div class="col-sm-4">
                         <button type="button" ng-disabled="fetchAccountsBtn" ng-click="fetchAccountsFromRemoteServer()" class="btn btn-primary btn-lg btn-block">{% trans "Fetch Accounts" %}</button>
                    </div>
                </div>


                <div ng-hide="transferBoxBtn" class="form-group">

                    <label class="col-sm-1 control-label"></label>
                    <div class="col-sm-4">
                         <button type="button" ng-disabled="startTransferbtn" ng-click="startTransfer()" class="btn btn-primary btn-lg btn-block">{% trans "Start Transfer" %}</button>
                    </div>

                    <div class="col-sm-4">
                         <button type="button" ng-disabled="stopTransferbtn" ng-click="cancelRemoteBackup()" class="btn btn-primary btn-lg btn-block">{% trans "Cancel" %}</button>
                    </div>

                </div>


                <div ng-hide="notificationsBox" class="form-group">
                    <label class="col-sm-3 control-label"></label>
                    <div class="col-sm-4">
                        <div ng-hide="errorMessage" class="alert alert-danger">
                            <p>{$ error_message $}</p>
                        </div>
                        <div ng-hide="couldNotConnect" class="alert alert-danger">
                            <p>{% trans "Could not connect, please refresh this page." %}</p>
                        </div>

                        <div ng-hide="accountsFetched" class="alert alert-success">
                            <p>{% trans "Accounts Successfully Fetched from remote server." %}</p>
                        </div>

                        <div ng-hide="backupProcessStarted" class="alert alert-success">
                            <p>{% trans "Backup Process successfully started." %}</p>
                        </div>

                        <div ng-hide="backupCancelled" class="alert alert-success">
                            <p>{% trans "Backup successfully cancelled." %}</p>
                        </div>

                    </div>
                </div>


                <!------ List of Accounts in remote server --------------->

                <div ng-hide="accountsInRemoteServerTable" class="form-group">

                    <div class="col-sm-12">
                        <input type="text" ng-model="accountsSearch" placeholder="{% trans 'Search Accounts..' %}" class="form-control autocomplete-input">
                    </div>
                 </div>

                <div ng-hide="accountsInRemoteServerTable" class="form-group">

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

                        <table class="table">
                            <thead>
                            <tr>
                                <th>{% trans "Website" %}</th>
                                <th>{% trans "PHP" %}</th>
                                <th>{% trans "Package" %}</th>
                                <th>{% trans "Email" %}</th>
                                <th><input ng-model="webSiteStatus" ng-change="allChecked(webSiteStatus)" type="checkbox" value=""></th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr ng-repeat="record in records | filter:accountsSearch">
                                <td ng-bind="record.website"></td>
                                <td ng-bind="record.php"></td>
                                <td ng-bind="record.package"></td>
                                <td ng-bind="record.email"></td>
                                <td ng-click=""><input ng-model="webSiteStatus" ng-change="addRemoveWebsite(record.website,webSiteStatus)" type="checkbox" value=""></td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>

            <!------ List of Accounts in remote server --------------->

            </form>



            <div ng-hide="backupStatus" class="form-group">
                <div class="col-sm-6">
                    <textarea ng-model="requestData" rows="15" class="form-control"></textarea>
                </div>
                <div class="col-sm-6">
                    <textarea ng-model="restoreData" rows="15" class="form-control"></textarea>
                </div>
            </div>



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


</div>


{% endblock %}