<!DOCTYPE html>
<html>
	<head>
		<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.bundle.min.js" integrity="sha384-feJI7QwhOS+hwpX2zkaeJQjeiwlhOP+SdQDqhgvvo1DsjtiSQByFdThsxO669S2D" crossorigin="anonymous"></script>
	</head>
	<script type='text/javascript'>
		$(document).ready(function() {

			function rpc(url, args) {
				var dfd = $.Deferred();
				$.get(url, args).done(function(result) {
					dfd.resolve(result);
				}).fail(function() {
					console.log('failed ' + url);
				});
				return dfd.promise();
			}

			$("#simulate_number>button").click(function() {
				var number = $("#simulate_number>input").val();
				alert(number) 
			});
			$("#blocked_state>button#set_away").click(function() {
				var number = $("#blocked_state>input").val();
				rpc("simulate_set_blocked", {extension: number, blocked: '1'});
			});
			$("#blocked_state>button#set_present").click(function() {
				var number = $("#blocked_state>input").val();
				rpc("simulate_set_blocked", {extension: number, blocked: '0'});
			});
			$("#status>button").click(function() {
				$("#status>pre").text("loading...");
				rpc("get_state").done(function(state) {
					$("#status>pre").text(JSON.stringify(state, null, 2));
				});
			});

		});
	</script>
	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
	<body>
		<h1>Asterisk Connector</h1>
		<h2>Simulate</h2>
		<ul>
			<li id="simulate_number">
				Simulate Incoming Call, Number: <input type='text' value="89416148872"/>
				<button id="simulate_number">OK</button>
			</li>
			<li id="blocked_state">
				Extension: <input type='text' value="80"/>
				<button id="set_away">Set Away</button>
				<button id="set_present">Set Present</button>
			</li>
			<li id="status">
				<button>Update</button>
				<pre>
				</pre>
			</li>
		</ul>
		

	</body>
</html>


