fui template demo

HTML

<script src="https://raw.github.com/DamonOehlman/fui/master/fui.js"></script>
<script src="https://raw.github.com/DamonOehlman/fui/master/templates/doodle.js"></script>
<p>
    This demo uses a <a href="https://github.com/DamonOehlman/fui/blob/master/templates/doodle.js">template defined separately</a> from the event capture.  The pipe function tells an event chain to pipe across to another event chain for processing.
</p>

<canvas width="100px" height="100px"></canvas>
<canvas width="100px" height="100px" class="doodle"></canvas>
<canvas width="100px" height="100px"></canvas>

CSS

body {
    font-family: Helvetica, Arial;
}

p {
    margin-bottom: 10px;
}

canvas {
    background: #f8f8f8;
}

JavaScript

fui().filter('.doodle').pipe(fui.templates.doodle)