{% extends "layout.html" %}
{% block container %}
          <div class="card" id="data-el-4">
            <div class="card-body ov-auto">
	      <h5 class="card-title">Available TGM clone's</h5>
	      {% for tgm_clone_name, tgm_clone_ip in sg_status['tgm_clone'].items() %}
	      <div id="del_{{tgm_clone_name}}" class="row" style="margin-top: 2px; margin-left: 15px">
	        <input name="tgm_clone_name" class="chkbox" type="checkbox" value="{{tgm_clone_name}}">
	        <span class="tgr-col" style="margin-left: 5px; width: 200px;"> {{tgm_clone_name}}</span>
	        <span class="tgr-col">{{tgm_clone_ip}} (<span id="{{tgm_clone_name}}_status">Checking...</span>)</span>
              </div>
	      {% endfor %}
	      {% if sg_status['tgm_clone'].items() %}
              <form id="upload_form" action="/tgm/delete_clone" method="post">
              <div class="row" style="margin-top: 25px">
                <div class="col"><input id='tgm_clone-did' class="form-control" type="text" placeholder="Data Admin-ID" id="did" name="did"></div>
                <div class="col"><input id='tgm_clone-dmk' class="form-control" type="password" placeholder="DMK" id="dmk" name="dmk"></div>
              </div>
              <div class="input-group" style="margin-top: 10px">
		<div id="tgm_clone_list_status" class="form-control scroll-x"></div>
                <div class="input-group-append">
                  <input id="delete" type="button" class="btn btn-dark text-white" value="Delete">
                </div>
              </div>
	      </form>
	      {% else %}
	      	No TGM clone's Are Available.<br>
		<a href="/tgm/clone">Clone TGM</a>
	      {% endif %}
	    </div>
          </div>
<script>
$(function(){
	var auth = {};
	$('input:checkbox[name="tgm_clone_name"]').each(function() {
		check_status($(this).val());
	});

	function check_dmk() {
		auth = { did: $('#tgm_clone-did').val(), dmk: $('#tgm_clone-dmk').val() };
		$('#tgm_clone-did').val('');
		$('#tgm_clone-dmk').val('');
		var res = {};
		$.ajax({
			url: "/tgr/check_dmk",
			type: "POST",
			data: JSON.stringify(auth),
			contentType: "application/json",
			success: function(result) {
				res = result;
			},
			async: false
		});
		return res;
	}

	function manage_vault(tgm_clone_name, command, force=false) {
		data = {
			did: auth['did'],
			dmk: auth['dmk'],
	       		tgm_clone_name: tgm_clone_name,
			command: command,
			force: force
		};
		if (command == 'delete') {
			url = '/tgm/delete_clone';
		} else {
			url = '/tgr/manage_vault';
		}
		$.ajax({
			url: url,
			type: "POST",
			data: JSON.stringify(data),
			contentType: "application/json",
			success: function(data) {
				if (command == 'delete' && data['result'] == 'OK') {
					$('#del_' + tgm_clone_name).remove();
					$('#tgm_clone_list_status').text(data['message']);
					return;
				} else {
					$('#' + tgm_clone_name + '_status').html(data['message']);
				}
			}
		});
	}

	function check_status(tgm_clone_name) {
		$('#' + tgm_clone_name + '_status').text('Checking...');
		$.getJSON('/tgm/clone_status?name=' + tgm_clone_name, function(data) {
			$('#' + tgm_clone_name + '_status').html(data['status_html']);
			if (data['status'] == 'open') {
			} else {
			}
		});
	}
	$('#delete').click(function(){
		var checkedCount = $('input:checkbox[name="tgm_clone_name"]:checked').length;
		if (checkedCount == 0) {
			alert('Please select at least one TGM clone to delete.');
			return;
		}

		bootbox.prompt({
		    title: "Are you sure?",
		    value: [],
		    inputType: 'checkbox',
		    inputOptions: [{
			text: 'Select this option to delete \'unreachable\' TGM clone\'s',
			value: true,
		    }],
		    callback: async function (result) {
			if (result == null) return; // Cancel

			await showWaitingScreen();
			if (result[0] == 'true') {
				force = true;
			} else {
				force = false;
			}
			$('#tgm_clone_list_status').text('Authentication...');
			res = check_dmk();
			$('#tgm_clone_list_status').text(res['message']);
			if (res['result'] == 'OK') {
				$('#tgm_clone_list_status').text('Authentication...Done.');
				data = { did: auth['did'], dmk: auth['dmk'] };
				count = 0;
				$('input:checkbox[name="tgm_clone_name"]:checked').each(function() {
					tgm_clone_name = $(this).val();
					$('#' + tgm_clone_name + '_status').text('Deleting...');
					data['tgm_clone_name'] = tgm_clone_name;
					manage_vault(tgm_clone_name, 'delete', force);
					count = count + 1;
				});
				if (count == 0) {
					$('#tgm_clone_list_status').text('No TGM clone(s) selected!');
				} else {
					$('#tgm_clone_list_status').text('Deleting ' + count + ' TGM clone(s)');
				}
			} else {
				$('#tgm_clone_list_status').text('Authentication...Failed.');
			}
		        hideWaitingScreen();
		    }
		});
	});
});
</script>
{% endblock %}