<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>CAMP can capture canals</title>
<link rel="stylesheet" href="/static/sg/css/smoothness/jquery-ui-1.8.16.custom.css" type="text/css"/>
<style>
</style>
</head>
<body>
<script src="/static/sg/lib/jquery-1.7.min.js"></script>
<script src="/static/sg/lib/jquery-ui-1.8.16.custom.min.js"></script>
<script src="/static/sg/lib/jquery.event.drag-2.2.js"></script>
<script src="/static/sg/lib/jquery.event.drop-2.2.js"></script>
<script src="/static/sg/slick.core.js"></script>
<script src="/static/sg/plugins/slick.cellrangedecorator.js"></script>
<script src="/static/sg/plugins/slick.cellrangeselector.js"></script>
<script src="/static/sg/plugins/slick.cellselectionmodel.js"></script>
<script src="/static/sg/plugins/slick.rowmovemanager.js"></script>
<script src="/static/sg/slick.formatters.js"></script>
<script src="/static/sg/slick.editors.js"></script>
<script src="/static/sg/slick.grid.js"></script>
<script src="/static/js/cccc.js"></script>
<div id="ptz" style="width: 280px;text-align: center;">
<div>
<div>
<button data-direction="LEFT_UP">↖</button>
<button data-direction="UP" title="up">↑</button>
<button data-direction="RIGHT_UP">↗</button>
</div>
<div>
<button data-direction="LEFT" title="left">←</button>
<div style="width: 64px;display: inline-block;"></div>
<button data-direction="RIGHT" title="right">→</button>
</div>
<div>
<button data-direction="LEFT_DOWN">↙</button>
<button data-direction="DOWN" title="down">↓</button>
<button data-direction="RIGHT_DOWN">↘</button>
</div>
</div>
<button data-direction="IN">zoom in</button>
<button data-direction="OUT">zoom out</button>
<br>
Speed: <input name="speed" value="1" style="width:30px"></input>
Duration: <input name="duration" value="4" style="width:30px"></input>
<br>
<br>
<button class="wipe">wipe</button>
</div>
<script>
$(function () {
init_ptz()
document.querySelector('button.wipe').addEventListener('click', () => {
api('wipe', {
}, function(response) {
console.log(response)
})
})
})
</script>
</body>
</html>