A Demo Card with onclick
Lorem ipsum dolor sit amet, consetetur sadipscing elitr.
Cards implement a central UI metaphor for multiuser applications. They allow users to explore information spaces independently from each other. Most of the time a card lives within a scatter and can be moved, rotated, and scaled. The scatter and it's interaction mapper are also responsible to detect and distinguish tap events form other interactions. But in preview programs and editors this is not necessary. Therefore we provide a central CardWrapper class that turns any DOM node into a card.
The wrapper's main task is to handle tap events and trigger the corresponding actions. There are three main ways to define these actions.
<a onclick="alert(1)">link<a>
wrapper.onTap(node, event => {})
wrapper.onTap('.link', event => {})
Note that the objects can also be actived by clicking nearby and not directly on the DOM node. This solves a major problem on large tabletops with a parallaxis in the display.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr.
Lorem ipsum dolor sit amet, consetetur sadipscing elitr.
Cards can be used within scatters. Since the CardWrapper
implements the ITapDelegate
protocol they can simply
be attached to a DOMScatter object. See the Scatter Doctest.