Add events for dragging

This commit is contained in:
Jess Telford 2016-09-28 17:44:08 +10:00
parent fb3f512fe6
commit 07383417de
3 changed files with 59 additions and 3 deletions

View file

@ -0,0 +1,30 @@
<html>
<head>
<title>A-Frame Click & Drag Component - Events</title>
<script src="../build.js"></script>
</head>
<body>
<a-scene>
<a-sphere
click-drag
position="0 1.25 -1"
radius="1.25"
color="#EF2D5E"
event-set__1="_event: dragstart; material.opacity: 0.2"
event-set__1="_event: dragend; material.opacity: 1"
>
<a-animation attribute="material.opacity" begin="dragstart" from="1.0" to="0.2" dur="200"></a-animation>
<a-animation attribute="material.opacity" begin="dragend" from="0.2" to="1.0" dur="200"></a-animation>
</a-sphere>
<a-plane rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane>
<a-sky color="#ECECEC"></a-sky>
<a-entity position="0 0 3.8">
<a-camera look-controls-enabled="false"></a-camera>
</a-entity>
</a-scene>
</body>
</html>

View file

@ -21,9 +21,13 @@
</head>
<body>
<h1>A-Frame Click & Drag Component</h1>
<a href="basic/">Demo</a>
<a href="basic/">Basic Demo</a>
<p>Click + Drag entities on the screen. Note the plane cannot be dragged (it does not have the "click-drag" attribute).</p>
<p>Try the WASD keys to move around while dragging an entity!</p>
<hr />
<a href="events/">Events Demo</a>
<p>Events are fired for beginning to drag, ending a drag, and for each drag event in etween.</p>
<p>This example shows how those events can be used to "ghost" a dragged entity</p>
<!-- GitHub Corner. -->
<a href="https://github.com/jesstelford/aframe-click-drag-component" class="github-corner">