forked from honeinc/emit-bindings
-
Notifications
You must be signed in to change notification settings - Fork 0
/
example.html
97 lines (80 loc) · 3.42 KB
/
example.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="build/emit-bindings-1.0.2.js"></script>
</head>
<body>
<a data-emit='foo' href="">Emit 'foo'</a>
<p/>
<a data-emit='bar' href="">Emit 'bar'</a>
<p/>
<div data-emit='baz.wrapper'>
<a data-emit='baz' href="" data-emit-options="allowpropagate">Emit 'baz' and 'baz.wrapper'.</a>
</div>
<p/>
<a data-emit='yak' href="#yak" data-emit-options="allowdefault">Emit 'yak' and allow default nav to #yak.</a>
<p/>
<a data-emit='gloop' href="#gloop">Emit 'gloop' but don't allow navigation to #gloop.</a>
<p/>
<div style="border: 1px solid black; padding: 30px; text-align: center;" data-emit="">
<a href="" data-emit='floog'>Emit 'floog' but clicking elsewhere in this div should *not* produce an 'unhandled' event.</a>
</div>
<div style="border: 1px solid black; padding: 30px; text-align: center;">
<form data-emit="submitted">
<input type="text" data-emit="changed" />
<input type="checkbox" data-emit="checked">This is a checkbox.</input>
<input type="radio" data-emit="selected">This is a radio button.</input>
<select data-emit="dropdown.selected">
<option value="1" selected>1</option>
<option value="2">2</option>
</select>
<input type="submit" value="Submit" data-emit="submit.clicked" data-emit-options="allowdefault" /> <!-- allowdefault will let the form submission event fire -->
</form>
</div>
<script type="text/javascript">
/* testing */
Emit.on( 'foo', function( event ) {
console.log( 'foo' );
} );
Emit.on( 'bar', function( event ) {
console.log( 'bar' );
} );
Emit.on( 'baz', function( event ) {
console.log( 'baz' );
} );
Emit.on( 'baz.wrapper', function( event ) {
console.log( 'baz.wrapper' );
} );
Emit.on( 'yak', function( event ) {
console.log( 'yak' );
} );
Emit.on( 'gloop', function( event ) {
console.log( 'gloop' );
} );
Emit.on( 'floog', function( event ) {
console.log( 'floog' );
} );
Emit.on( 'changed', function( event ) {
console.log( 'input changed' );
} );
Emit.on( 'checked', function( event ) {
console.log( 'checkbox checked' );
} );
Emit.on( 'selected', function( event ) {
console.log( 'radio button selected' );
} );
Emit.on( 'dropdown.selected', function( event ) {
console.log( 'dropdown changed' );
} );
Emit.on( 'submit.clicked', function( event ) {
console.log( 'submit.clicked' );
} );
Emit.on( 'submitted', function( event ) {
console.log( 'form submitted' );
} );
Emit.on( 'unhandled', function( event ) {
console.log( 'unhandled' );
} );
</script>
</body>
</html>