~bac/juju-gui/trunkcopy

« back to all changes in this revision

Viewing changes to lib/yui/tests/event/tests/manual/test.html

  • Committer: kapil.foss at gmail
  • Date: 2012-07-13 18:45:59 UTC
  • Revision ID: kapil.foss@gmail.com-20120713184559-2xl7be17egsrz0c9
reshape

Show diffs side-by-side

added added

removed removed

Lines of Context:
1
 
<!doctype html>
2
 
<html>
3
 
<head>
4
 
    <title>Test Page</title>
5
 
    <style type="text/css">
6
 
        div {
7
 
            margin: 1em 0;
8
 
        }
9
 
    </style>
10
 
</head>
11
 
<body class="yui-skin-sam">
12
 
<div id="outer">
13
 
    <div id="inner">
14
 
        <button type="button" class="go">Button 1</button>
15
 
        <button type="button" class="go">Button 2</button>
16
 
        <button type="button" class="go">Button 3</button>
17
 
    </div>
18
 
</div>
19
 
<div>
20
 
    <button type="button" id="attach">attach</button>
21
 
    <button type="button" id="attach_handle">attach + handle</button>
22
 
    <button type="button" id="attach_cat">attach + category</button>
23
 
    <button type="button" id="detach">detach by signature</button>
24
 
    <button type="button" id="detach_handle">detach by handle</button>
25
 
    <button type="button" id="detach_cat">detach by category</button>
26
 
    <button type="button" id="detach_nofn">detach without fn</button>
27
 
    <button type="button" id="remove">remove buttons</button>
28
 
</div>
29
 
<ul id="output"></ul>
30
 
 
31
 
<script src="../../../../build/yui/yui.js"></script>
32
 
<!--script src="js/synthetic.js"></script-->
33
 
<!--script src="../../../build/event/event-synthetic.js"></script-->
34
 
<script>
35
 
YUI({
36
 
    useBrowserConsole: false,
37
 
    lazyEventFacade: true,
38
 
    filter: 'raw'
39
 
}).use('event-synthetic', 'event-custom', 'node', function (Y) {
40
 
 
41
 
Y.on('yui:log', function (e) {
42
 
    Y.one("#output").append("<li>" + e.msg + "</li>");
43
 
});
44
 
 
45
 
Y.Event.define('test', {
46
 
    //allowDups: true,
47
 
 
48
 
    //publishConfig: { emitFacade: false },
49
 
 
50
 
    on: function (node, sub, notifier) {
51
 
        Y.log("on " + this.type + ": " + node.get('text'));
52
 
        sub.testHandle = node.on('click', function (e) {
53
 
            //notifier.fire(e);
54
 
            notifier.fire();
55
 
        });
56
 
    },
57
 
 
58
 
    detach: function (node, sub, notifier) {
59
 
        Y.log("detach " + this.type + ": " + node.get('text'));
60
 
        sub.testHandle.detach();
61
 
    },
62
 
 
63
 
    delegate: function (container, sub, notifier, filter) {
64
 
        Y.log("delegate " + this.type);
65
 
        sub.delegateHandle = container.delegate('click', function (e) {
66
 
            notifier.fire(e);
67
 
            //notifier.fire();
68
 
            //notifier.fire({ currentTarget: e.currentTarget });
69
 
        }, filter);
70
 
    },
71
 
 
72
 
    detachDelegate: function (container, sub, notifier, filter) {
73
 
        Y.log("detachDelegate " + this.type);
74
 
        sub.delegateHandle.detach();
75
 
    }
76
 
});
77
 
 
78
 
var outer = Y.one('#outer'),
79
 
    inner = Y.one('#inner'),
80
 
    mode  = 4,
81
 
    //obj   = null,
82
 
    obj   = { get: function () { return 'Context set OK'; } },
83
 
    handle;
84
 
 
85
 
function notify(e, extra) {
86
 
    var thisText = this.get('text'),
87
 
        ctText, message;
88
 
 
89
 
    if (typeof e === 'object') {
90
 
        ctText  = e.currentTarget.get('text');
91
 
        message = 'fired ' + e.type + ' from ' + ctText + ' (' + thisText + ')';
92
 
 
93
 
        if (extra) {
94
 
            message += ' + ' + extra;
95
 
        }
96
 
    } else {
97
 
        message = "fired from " + thisText + " with args (" +
98
 
                  Y.Array(arguments,0,true).join() + ")";
99
 
    }
100
 
 
101
 
    Y.log(message);
102
 
}
103
 
 
104
 
Y.one('#attach').on('click', function (e) {
105
 
    switch (mode) {
106
 
        case 1: Y.one('.go').on('test', notify); break;
107
 
        //case 1: Y.one('.go').on('test', notify, obj, 1); break;
108
 
        case 2: Y.all('.go').on('test', notify); break;
109
 
        //case 2: Y.all('.go').on('test', notify, obj, 1); break;
110
 
        case 3: Y.on('test', notify, '.go'); break;
111
 
        //case 3: Y.on('test', notify, '.go', obj, 1); break;
112
 
        case 4: Y.delegate('test', notify, '#outer', '.go'); break;
113
 
        //case 4: Y.delegate('test', notify, '#outer', '.go', obj, 1); break;
114
 
    }
115
 
});
116
 
 
117
 
Y.one('#attach_handle').on('click', function (e) {
118
 
    switch(mode) {
119
 
        case 1: handle = Y.one('.go').on('test', notify); break;
120
 
        //case 1: handle = Y.one('.go').on('test', notify, obj, 1); break;
121
 
        case 2: handle = Y.all('.go').on('test', notify); break;
122
 
        //case 2: handle = Y.all('.go').on('test', notify, obj, 1); break;
123
 
        case 3: handle = Y.on('test', notify, '.go'); break;
124
 
        //case 3: handle = Y.on('test', notify, '.go', obj, 1); break;
125
 
        case 4: handle = Y.delegate('test', notify, '#outer', '.go'); break;
126
 
        //case 4: handle = Y.delegate('test', notify, '#outer', '.go', obj, 1); break;
127
 
    }
128
 
});
129
 
 
130
 
Y.one('#attach_cat').on('click', function (e) {
131
 
    switch (mode) {
132
 
        case 1: Y.one('.go').on('foo|test', notify); break;
133
 
        //case 1: Y.one('.go').on('foo|test', notify, obj, 1); break;
134
 
        case 2: Y.all('.go').on('foo|test', notify); break;
135
 
        //case 2: Y.all('.go').on('foo|test', notify, obj, 1); break;
136
 
        case 3: Y.on('foo|test', notify, '.go'); break;
137
 
        //case 3: Y.on('foo|test', notify, '.go', obj, 1); break;
138
 
        case 4: Y.delegate('foo|test', notify, '#outer', '.go'); break;
139
 
        //case 4: Y.delegate('foo|test', notify, '#outer', '.go', obj, 1); break;
140
 
    }
141
 
});
142
 
 
143
 
Y.one('#detach').on('click', function (e) {
144
 
    switch (mode) {
145
 
        case 1: Y.one('.go').detach('test', notify); break;
146
 
        case 2: Y.all('.go').detach('test', notify); break;
147
 
        case 3: Y.detach('test', notify, '.go'); break;
148
 
        case 4: Y.detach('test', notify, '#outer', '.go'); break;
149
 
    }
150
 
});
151
 
 
152
 
Y.one('#detach_handle').on('click', function (e) {
153
 
    handle.detach();
154
 
});
155
 
 
156
 
Y.one('#detach_cat').on('click', function (e) {
157
 
    switch (mode) {
158
 
        case 1: Y.one('.go').detach('foo|test'); break;
159
 
        case 2: Y.all('.go').detach('foo|test'); break;
160
 
        case 3: Y.detach('foo|test'); break;
161
 
        case 4: Y.one('#outer').detach('foo|test'); break;
162
 
    }
163
 
});
164
 
 
165
 
Y.one('#detach_nofn').on('click', function (e) {
166
 
    switch (mode) {
167
 
        case 1: Y.one('.go').detach('test'); break;
168
 
        case 2: Y.all('.go').detach('test'); break;
169
 
        case 3: Y.detach('foo|*'); break;
170
 
        case 4: Y.one('#outer').detach('test'); break;
171
 
    }
172
 
});
173
 
 
174
 
Y.one('#remove').on('click', function (e) {
175
 
    outer.remove(true);
176
 
    Y.log('Detached');
177
 
});
178
 
 
179
 
});
180
 
</script>
181
 
</body>
182
 
</html>