{% if not is_needed_tool %}
    <div style="text-align: center;">
		<h3>{{lang.admin_page.desc.no_ansible}} Ansible</h3>.
		<img src="{{ url_for('static', filename='images/no_servers.png')}}" alt="There is no server">
		<h4>
			{{lang.words.read|title()}} <a href="https://roxy-wi.org/installation#ansible" title="{{lang.words.install|title()}} Ansible" target="_blank">{{lang.words.here}}</a> {{lang.phrases.how_to_install}} Ansible.
		</h4>
	</div>
{% else %}
<div id="backup_tabs">
	<ul>
		<li><a href="#git_tab" title="{{lang.words.admin_area|title()}}: {{lang.words.upload|title()}} {{lang.words.in}} Git - Roxy-WI" id="backup-git-li">Git</a></li>
		<li><a href="#backup_tab" title="{{lang.words.admin_area|title()}}: {{lang.words.manage|title()}} {{lang.words.backup|title()}} - Roxy-WI" id="backup-backup-li">{{lang.words.backup|title()}}</a></li>
	</ul>

	<div id="git_tab">
		{% if user_status == 0 or user_plan != 'support' %}
			{% include 'include/no_sub.html' %}
		{% else %}
		<table class="overview" id="ajax-git-table">
			<thead>
				<tr class="overviewHead">
					<th class="padding10 first-collumn">{{lang.words.servers|title()}}</th>
					<th>{{lang.words.service|title()}}</th>
					<th>{{lang.words.period|title()}}</th>
					<th>{{lang.words.repo|title()}}</th>
					<th>{{lang.words.branch|title()}}</th>
					<td>{{lang.words.creds|title()}}</td>
					<th>{{lang.words.desc|title()}}</th>
					<th></th>
				</tr>
			</thead>
			<tbody>
				{% include 'ajax/new_git.html' %}
			</tbody>
		</table>
		<br /><span class="add-button" title="{{lang.words.add|title()}} {{lang.words.w_a}} {{lang.words.new}} git {{lang.words.job}}" id="add-git-button">+ {{lang.words.add|title()}} git {{lang.words.job}}</span>
		<br /><br />
		<div class="add-note alert addName alert-info" style="width: inherit; margin-right: 15px;">
			{{lang.phrases.read_about_parameters}} <a href="https://roxy-wi.org/howto/git" title="How to work with Git" target="_blank">{{lang.words.here}}</a>
		</div>
		{% endif %}
	</div>
	<div id="backup_tab">
		{% if user_status == 0 or user_plan == 'user' %}
			{% include 'include/no_sub.html' %}
		{% else %}
		<table class="overview" id="ajax-backup-table">
			<caption><h3>Remote server</h3></caption>
			<tr class="overviewHead">
				<td class="padding10 first-collumn">{{lang.words.servers|title()}}</td>
				<td style="width: 10%">{{lang.words.remote|title()}} {{lang.words.server}}</td>
				<td style="width: 10%">{{lang.words.remote|title()}} {{lang.words.folder2}}</td>
				<td style="width: 15%">{{lang.words.backup|title()}} {{lang.words.type}}</td>
				<td style="width: 15%">{{lang.words.period|title()}}</td>
				<td style="width: 15%">{{lang.words.creds|title()}}</td>
				<td style="width: 100%">{{lang.words.desc|title()}}</td>
				<td style="margin-left: 5px;"></td>
				<td></td>
			</tr>
			{% for b in backups %}
			{% for s in servers %}
			{% if b.server in s.2 %}
				<tr id="backup-table-{{b.id}}">
						<td class="padding10 first-collumn">
							{% set id = 'backup-server-' + b.id|string() %}
							{{ copy_to_clipboard(id=id, value=b.server) }}
						</td>
						<td>
							{{ input('backup-rserver-'+b.id|string(), value=b.rhost, size='14') }}
						</td>
						<td>
							{{ input('backup-rpath-'+b.id|string(), value=b.rpath) }}
						</td>
						<td>
							{% set values = {'backup':'backup','synchronization':'synchronization'} %}
							{{ select('backup-type-'+b.id|string(), values=values, selected=b.backup_type, required='required', class='force_close') }}
						</td>
						<td>
							{% set values = {'hourly':'hourly','daily':'daily','weekly':'weekly', 'monthly':'monthly'} %}
							{{ select('backup-time-'+b.id|string(), values=values, selected=b.time, required='required', class='force_close') }}
						</td>
						<td>
							<select id="backup-credentials-{{b.id}}" required>
								<option disabled selected>------</option>
								{% for ssh in sshs %}
									{% if ssh.enable == 1 %}
										{% if ssh.id == b.cred %}
											<option value="{{ssh.id}}" selected="selected">{{ssh.name}}</option>
										{% else %}
											<option value="{{ssh.id}}">{{ssh.name}}</option>
										{% endif %}
									{% endif %}
								{% endfor %}
							</select>
						</td>
						<td>
							{% if b.description is not none %}
								{{ input('backup-description-'+b.id|string(), value=b.description) }}
							{% else %}
								{{ input('backup-description-'+b.id|string()) }}
							{% endif %}
						</td>
						<td>
						<a class="add" onclick="cloneBackup({{b.id}})" id="clone-backup{{b.id}}" title="{{lang.words.clone|title()}} {{b.server}}" style="cursor: pointer;"></a>
					</td>
					<td>
						<a class="delete" onclick="confirmDeleteBackup({{b.id}})" title="{{lang.words.delete|title()}} {{lang.words.backup}} {{b.server}}" style="cursor: pointer;"></a>
					</td>
			</tr>
			{% endif %}
			{% endfor %}
			{% endfor %}
		</table>
		<br /><span class="add-button" title="{{lang.words.add|title()}} {{lang.words.w_a}} {{lang.words.new}} {{lang.words.backup}} {{lang.words.job}}" id="add-backup-button">+ {{lang.words.add|title()}} {{lang.words.backup}}</span>
		<br /><br />
		<table class="overview" id="ajax-backup-s3-table">
			<thead>
			<caption><h3>S3</h3></caption>
			<tr class="overviewHead">
				<td class="padding10 first-collumn">{{lang.words.servers|title()}}</td>
				<td style="width: 10%">S3 {{lang.words.server}}</td>
				<td style="width: 10%">Bucket</td>
				<td style="width: 15%">{{lang.words.period|title()}}</td>
				<td style="width: 100%">{{lang.words.desc|title()}}</td>
				<td style="margin-left: 5px;"></td>
<!--				<td></td>-->
			</tr>
			</thead>
			<tbody id="tbody-s3">
			{% for b in s3_backups %}
			{% for s in servers %}
			{% if b.server in s.2 %}
				<tr id="s3-backup-table-{{b.id}}">
					<td class="padding10 first-collumn">
						<span id="backup-s3-server-{{b.id}}" style="display: none">{{ b.server }}</span>
						{{s.1}}
					</td>
					<td>
						<span id="s3-server-{{b.id}}">{{b.s3_server}}</span>
					</td>
					<td>
						<span id="bucket-{{b.id}}">{{b.bucket}}</span>
					</td>
					<td>
						<span id="s3-backup-time-{{b.id}}">{{b.time}}</span>
					</td>
					<td>
						{% if b.description != 'None' %}
						<span id="s3-backup-description-{{b.id}}">{{b.description}}</span>
						{% else %}
						<span id="s3-backup-description-{{b.id}}"></span>
						{% endif %}
					</td>
<!--					<td>-->
<!--						<a class="add" onclick="cloneS3Backup({{b.id}})" id="clone-s3-backup{{b.id}}" title="Clone S3 {{b.server}}" style="cursor: pointer;"></a>-->
<!--					</td>-->
					<td>
						<a class="delete" onclick="confirmDeleteS3Backup({{b.id}})" title="Delete S3 backup {{b.server}}" style="cursor: pointer;"></a>
					</td>
				</tr>
			{% endif %}
			{% endfor %}
			{% endfor %}
			</tbody>
		</table>
		<br /><span class="add-button" title="{{lang.words.add|title()}} {{lang.words.w_a}} {{lang.words.new}} S3 {{lang.words.backup}} {{lang.words.job}}" id="add-backup-s3-button">+ {{lang.words.add|title()}} {{lang.words.backup}}</span>
		<br /><br />
		<div id="ajax-backup"></div>
		<div class="add-note alert addName alert-info" style="width: inherit; margin-right: 15px;">
			{{lang.phrases.read_about_parameters}} <a href="https://roxy-wi.org/description/backup" title="{{lang.words.backup|title()}} {{lang.words.desc}}" target="_blank">{{lang.words.here}}</a>
		</div>
		{% endif %}
	</div>
</div>
{% endif %}
