@qooxdoo/framework
Version:
The JS Framework for Coders
110 lines (98 loc) • 3.24 kB
HTML
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="../helper.js"></script>
<link href="data/logger.css" rel="stylesheet" type="text/css">
<style type="text/css">
#pointer {
height: 180px;
width: 600;
background-color: orange;
border: 1px inset;
padding: 2px;
}
#innerPointer1, #innerPointer2 {
border: 1px solid black;
margin: 2px;
padding: 2px;
}
#frame {
border: 1px solid red;
width: 200px;
margin-left: 150px;
padding: 2px;
}
#form {
position: absolute;
top: 300px;
left: 700px;
width: 200px;
}
</style>
</head>
<body id="body">
<h1>qooxood pointer events</h1>
<p>
This logger prints the pointer events as they are fired by the qooxdoo
event layer.
</p>
<div id="pointer">
Tap here (mouse / touch / pen)
<div id="frame">
(frame)
<div id="innerPointer1">(innerPointer1)</div>
<div id="innerPointer2">(innerPointer2)</div>
</div>
</div>
<div id="logger">
</div>
<div id="form">
<input type="button" id="btnClear" value="clear">
<table>
<tr>
<td><input type="checkbox" id="check_pointerdown" checked="checked"></td>
<td><label for="check_pointerdown">pointerdown</label></td>
</tr><tr>
<td><input type="checkbox" id="check_pointerup" checked="checked"></td>
<td><label for="check_pointerup">pointerup</label></td>
</tr><tr>
<td><input type="checkbox" id="check_tap" checked="checked"></td>
<td><label for="check_tap">tap</label></td>
</tr><tr>
<td><input type="checkbox" id="check_dbltap" checked="checked"></td>
<td><label for="check_dbltap">dbltap</label></td>
</tr><tr>
<td><input type="checkbox" id="check_longtap" checked="checked"></td>
<td><label for="check_longtap">longtap</label></td>
</tr><tr>
<td><input type="checkbox" id="check_swipe" checked="checked"></td>
<td><label for="check_swipe">swipe</label></td>
</tr><tr>
<td><input type="checkbox" id="check_track" checked="checked"></td>
<td><label for="check_track">track</label></td>
</tr><tr>
<td><input type="checkbox" id="check_pinch" checked="checked"></td>
<td><label for="check_pinch">pinch</label></td>
</tr><tr>
<td><input type="checkbox" id="check_rotate" checked="checked"></td>
<td><label for="check_rotate">rotate</label></td>
</tr><tr>
<td><input type="checkbox" id="check_pointermove"></td>
<td><label for="check_pointermove">pointermove</label></td>
</tr><tr>
<td><input type="checkbox" id="check_pointerover"></td>
<td><label for="check_pointerover">pointerover</label></td>
</tr><tr>
<td><input type="checkbox" id="check_pointerout"></td>
<td><label for="check_pointerout">pointerout</label></td>
</tr><tr>
<td colspan="2"><hr /></td>
</tr><tr>
<td><input type="checkbox" id="capture"></td>
<td><label for="capture">enable event capturing for #pointer</label></td>
</tr>
</table>
</div>
</body>
</html>