<?php
include 'Services/Twilio/Capability.php';
include 'auth.php'
?>
<!DOCTYPE HTML>
<html>
	<head>
		<title>Phone</title>
		<script type="text/javascript" src="//static.twilio.com/libs/twiliojs/1.1/twilio.min.js"></script>
		<script type="text/javascript" src="jquery.min.js"></script>
		<script type="text/javascript">
		$(document).ready(function(){
			Twilio.Device.setup("<?php echo $token; ?>");
			$("#call").click(function() {Twilio.Device.connect();});
			$("#hangup").click(function() {Twilio.Device.disconnectAll();});
			Twilio.Device.ready(function (device) {$('#status').text('Ready to call');});
			Twilio.Device.offline(function (device) {$('#status').text('Offline');});
			Twilio.Device.error(function (error) {$('#status').text(error);});
			Twilio.Device.connect(function (conn) {$('#status').text("Successfully established call");toggleCallStatus();});
			Twilio.Device.disconnect(function (conn) {$('#status').text("Call ended");toggleCallStatus();});
			Twilio.Device.incoming(function (conn) {conn.accept();});
			function toggleCallStatus(){
				$('#call').toggle();
				$('#hangup').toggle();
			}
		});
		</script>
	</head>
	<body>
		<div align="center">
			<input type="button" id="call" value="Start Call"/>
			<input type="button" id="hangup" value="Disconnect Call" style="display:none;"/>
			<div id="status">
				Offline
			</div>
		</div>
	</body>
</html>