src/cm/media/js/lib/yui/yui_3.10.3/docs/event/synths.html
author Yves-Marie Haussonne <ymh.work+github@gmail.com>
Fri, 09 May 2014 18:35:26 +0200
changeset 656 a84519031134
parent 525 89ef5ed3c48b
permissions -rw-r--r--
add link to "privacy policy" in the header test
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
525
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
     1
<!DOCTYPE html>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
     2
<html lang="en">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
     3
<head>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
     4
    <meta charset="utf-8">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
     5
    <title>Creating Synthetic Events</title>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
     6
    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic,700italic">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
     7
    <link rel="stylesheet" href="../../build/cssgrids/cssgrids-min.css">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
     8
    <link rel="stylesheet" href="../assets/css/main.css">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
     9
    <link rel="stylesheet" href="../assets/vendor/prettify/prettify-min.css">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    10
    <link rel="shortcut icon" type="image/png" href="../assets/favicon.png">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    11
    <script src="../../build/yui/yui-min.js"></script>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    12
    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    13
</head>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    14
<body>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    15
<!--
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    16
<a href="https://github.com/yui/yui3"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub"></a>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    17
-->
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    18
<div id="doc">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    19
    <div id="hd">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    20
        <h1><img src="http://yuilibrary.com/img/yui-logo.png"></h1>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    21
    </div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    22
    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    23
        <a href="#toc" class="jump">Jump to Table of Contents</a>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    24
    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    25
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    26
            <h1>Creating Synthetic Events</h1>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    27
    <div class="yui3-g">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    28
        <div class="yui3-u-3-4">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    29
            <div id="main">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    30
                <div class="content"><div class="intro">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    31
    <p>Synthetic events are usually named abstractions that bind to existing
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    32
    DOM events to monitor user actions for specific patterns.  However, at 
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    33
    heart they are no more than a set of callbacks executed in response to
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    34
    various triggering methods in the DOM event system.</p>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    35
    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    36
    <p>You can do all sorts of things with synthetic events, including:</p>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    37
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    38
    <ul>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    39
        <li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    40
            redefine native DOM events that behave inconsistently across
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    41
            browsers (e.g. <a href="focus.html"><code>focus</code> and <code>blur</code></a>)
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    42
        </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    43
        <li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    44
            provide abstract events that attach to different DOM events based on
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    45
            the environment (e.g. <a href="touch.html#move"><code>gesturemovestart</code>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    46
            and family</a>)
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    47
        </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    48
        <li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    49
            create events with different subscription signatures (e.g.
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    50
            <a href="hover.html"><code>hover</code></a>)
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    51
        </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    52
        <li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    53
            create configurable events that only execute subscribers when
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    54
            criteria passed during subscription are met (e.g.
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    55
            <a href="touch.html#flick"><code>flick</code></a> or
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    56
            <a href="key.html"><code>key</code></a>)
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    57
        </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    58
        <li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    59
            create events that encapsulate common UX patterns (e.g.
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    60
            <a href="outside.html"><code>clickoutside</code></a>)
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    61
        </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    62
        <li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    63
            create fun little easter eggs (e.g. <a
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    64
            href="http://yuilibrary.com/gallery/show/event-konami"><code>konami</code></a>)
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    65
        </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    66
        <li>and more...</li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    67
    </ul>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    68
</div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    69
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    70
<h2 id="the-hooks">The hooks</h2>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    71
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    72
<p>Synthetic events hook into the subscription binding and unbinding methods.  Specifically:</p>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    73
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    74
<ol>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    75
    <li><code>node.on(&quot;eventName&quot;, ...)</code>, <code>Y.on(&quot;eventName&quot;, ...)</code>, <a href="index.html#one-time-subscriptions">and family</a></li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    76
    <li><code>node.delegate(&quot;eventName&quot;, ...)</code> or <code>Y.delegate(&quot;eventName&quot;, ...)</code></li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    77
    <li><code>node.detach(...)</code> or <code>subscription.detach()</code></li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    78
</ol>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    79
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    80
<p>With the exception of a separate <code>detachDelegate()</code> method, the names used when defining synthetic events are the same as these basic methods.</p>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    81
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    82
<pre class="code prettyprint">Y.Event.define(&quot;tripleclick&quot;, {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    83
    on: function (node, subscription, notifier) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    84
        &#x2F;&#x2F; called in response to individual subscriptions
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    85
    },
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    86
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    87
    delegate: function (node, subscription, notifier, filter) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    88
        &#x2F;&#x2F; called in response to delegate subscriptions
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    89
    },
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    90
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    91
    detach: function (node, subscription, notifier) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    92
        &#x2F;&#x2F; called when individual subscriptions are detached in any way
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    93
    },
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    94
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    95
    detachDelegate: function (node, subscription, notifier) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    96
        &#x2F;&#x2F; called when delegate subscriptions are detached in any way
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    97
    }
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    98
});</pre>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
    99
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   100
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   101
<h2 id="subscriptions-and-notifiers">Subscriptions and Notifiers</h2>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   102
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   103
<p>In addition to the subscribing Node, each method receives a
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   104
<em>subscription</em> and a <em>notifier</em>.  Use the <em>subscription</em>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   105
to store event handles or other data that may be needed by another method.  Use
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   106
<em><code>notifier.fire(e)</code></em> to dispatch the event to the callbacks that were
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   107
bound to it.</p>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   108
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   109
<pre class="code prettyprint">Y.Event.define(&quot;tripleclick&quot;, {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   110
    on: function (node, subscription, notifier) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   111
        var count = 0;
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   112
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   113
        subscription._handle = node.on(&quot;click&quot;, function (e) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   114
            if (++count === 3) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   115
                &#x2F;&#x2F; Call notifier.fire(e) to execute subscribers.
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   116
                &#x2F;&#x2F; Pass the triggering event facade to fire()
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   117
                notifier.fire(e);
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   118
            } else {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   119
                ...
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   120
            }
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   121
        });
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   122
    },
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   123
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   124
    detach: function (node, subscription, notifier) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   125
        subscription._handle.detach();
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   126
    },
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   127
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   128
    delegate: function (node, subscription, notifier, filter) { ... },
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   129
    detachDelegate: function (node, subscription, notifier) { ... }
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   130
});</pre>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   131
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   132
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   133
<p>Subscribers to the synthetic event should receive a <code>DOMEventFacade</code>.  The
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   134
easiest way to provide one is to pass the triggering DOM event's facade to
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   135
<code>notifier.fire(e)</code>.  The facade's <code>e.type</code> will be updated to the name of the
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   136
synth.  You will also have the opportunity to add extra data to the event
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   137
before dispatching to the subscription callbacks.</p>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   138
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   139
<pre class="code prettyprint">Y.Event.define(&#x27;multiclick&#x27;, {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   140
    on: function (node, sub, notifier) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   141
        var count = 0,
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   142
            timer;
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   143
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   144
        sub._handle = node.on(&#x27;click&#x27;, function (e) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   145
            count++;
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   146
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   147
            if (timer) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   148
                timer.cancel();
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   149
            }
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   150
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   151
            timer = Y.later(200, null, function () {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   152
                e.clicks = count;
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   153
                count = 0;
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   154
                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   155
                &#x2F;&#x2F; subscribers will get e with e.type == &#x27;multiclick&#x27;
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   156
                &#x2F;&#x2F; and extra property e.clicks
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   157
                notifier.fire(e);
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   158
            });
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   159
        });
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   160
    },
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   161
    ...
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   162
});</pre>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   163
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   164
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   165
<h2 id="delegation-support">Delegation support</h2>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   166
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   167
<p>The <code>delegate</code> function implementation takes an extra argument, the <code>filter</code> that was passed <code>node.delegate(type, callback, <em>HERE</em>)</code>.  It's your responsibility to make sense of this filter for your event.</p>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   168
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   169
<p>Typically, it is just passed along to a <code>node.delegate(...)</code> call against another event, deferring the filtration to the core <code>delegate()</code> method.</p>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   170
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   171
<pre class="code prettyprint">Y.Event.define(&quot;tripleclick&quot;, {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   172
    on: function (node, subscription, notifier) { ...  },
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   173
    detach: function (node, subscription, notifier) { ...  },
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   174
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   175
    delegate: function (node, subscription, notifier, filter) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   176
        var activeNode = null,
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   177
            count = 0,
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   178
            timer;
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   179
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   180
        subscription._handle = node.delegate(&quot;click&quot;, function (e) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   181
            if (timer) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   182
                timer.cancel();
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   183
            }
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   184
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   185
            if (this !== activeNode) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   186
                activeNode = this;
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   187
                count = 0;
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   188
            }
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   189
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   190
            if (++count === 3) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   191
                &#x2F;&#x2F; Call notifier.fire(e) just as with &#x60;on&#x60;
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   192
                notifier.fire(e);
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   193
            } else {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   194
                timer = Y.later(300, null, function () {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   195
                    count = 0;
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   196
                });
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   197
            }
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   198
        }, filter); &#x2F;&#x2F; filter is passed on to the underlying &#x60;delegate()&#x60; call
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   199
    },
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   200
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   201
    detachDelegate: function (node, subscription, notifier) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   202
        subscription._handle.detach();
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   203
    }
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   204
});</pre>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   205
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   206
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   207
<h2 id="extra-arguments">Extra Arguments</h2>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   208
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   209
<p>Supply a <code>processArgs</code> method in the event definition to support a custom
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   210
subscription signature.  The method receives two arguments:</p>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   211
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   212
<ol>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   213
    <li>an array of the subscription arguments for analysis</li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   214
    <li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   215
        a boolean <code>true</code> if the subscription is being made through
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   216
        <code>delegate(...)</code>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   217
    </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   218
</ol>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   219
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   220
<p>If this method is supplied, it</p>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   221
<ul>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   222
    <li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   223
        <strong>MUST</strong> remove the extra arguments from the arg array
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   224
        that is passed in, and
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   225
    </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   226
    <li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   227
        <strong>SHOULD</strong> return the extra data relevant to the
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   228
        subscription.
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   229
    </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   230
</ul>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   231
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   232
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   233
<p>The same <code>processArgs</code> method is used by both <code>on</code> and <code>delegate</code>, but there
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   234
are various signatures to account for.  The easiest way to accept extra
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   235
arguments is to require them from index 3 in the argument list.  It's also best
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   236
to limit the number of extra arguments to one and require an object literal to
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   237
allow for future changes.</p>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   238
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   239
<pre class="code prettyprint">&#x2F;&#x2F; for an event that takes one extra param
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   240
processArgs: function (args, isDelegate) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   241
    var extra = args[3];
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   242
    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   243
    &#x2F;&#x2F; remove the extra arguments from the array
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   244
    args.splice(3,1);
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   245
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   246
    return extra;
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   247
}
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   248
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   249
&#x2F;&#x2F; for an event that takes three extra args
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   250
processArgs: function (args, isDelegate) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   251
    return args.splice(3,3);
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   252
}</pre>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   253
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   254
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   255
<p>Requiring extra params start at index 3 of the <code>args</code> array results in the
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   256
following subscription signatures:</p>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   257
<pre class="code prettyprint">var extraConfig = { ... };
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   258
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   259
&#x2F;&#x2F; Third argument for node.on() and node.delegate
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   260
node.on(&#x27;extraArgEvent&#x27;, callback, extraConfig, thisOverride, arg...);
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   261
node.delegate(&#x27;extraArgEvent&#x27;, callback, extraConfig, filter, thisOverride, arg...);
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   262
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   263
&#x2F;&#x2F; Fourth argument for Y.on() and Y.delegate
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   264
Y.on(&#x27;extraArgEvent&#x27;, callback, targetSelector, extraConfig, thisOverride, arg...);
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   265
Y.delegate(&#x27;extraArgEvent&#x27;, callback, parentSelector, extraConfig, filter, thisOverride, arg...);</pre>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   266
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   267
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   268
<p>For some custom signatures, the placement of the extra argument for
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   269
implementers using <code>Y.on()</code> or <code>Y.delegate()</code> may look awkward.  Sometimes you
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   270
can support extras at other indexes if you can reliably tell that the argument
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   271
is not part of
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   272
<a href="index.html#binding-this-and-additional-callback-arguments">the extended
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   273
signature for <code>on(...)</code> or <code>delegate(...)</code></a>. See the <a
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   274
href="http://yuilibrary.com/yui/docs/api/files/event_js_hover.js.html">source for the "hover"
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   275
event</a> for an example of supporting multiple signatures.</p>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   276
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   277
<p>The return value of <code>processArgs</code> is assigned to <code>subscription._extras</code> for the <code>on</code> and <code>delegate</code> definition methods.</p>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   278
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   279
<pre class="code prettyprint">Y.Event.define(&#x27;multiclick&#x27;, {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   280
    processArgs: function (args, isDelegate) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   281
        &#x2F;&#x2F; The args list will look like this coming in:
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   282
        &#x2F;&#x2F; [ type, callback, node, (extras...), [filter,] thisObj, arg0...argN ]
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   283
        return args.splice(3,1)[1] || {};
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   284
    },
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   285
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   286
    &#x2F;&#x2F; Custom subscription signatures don&#x27;t change the params of on&#x2F;delegate
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   287
    on: function (node, sub, notifier) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   288
        var clicks = 0,
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   289
            &#x2F;&#x2F; data returned from processArgs is available at sub._extras
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   290
            min = sub._extras.minClicks || 3,
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   291
            max = sub._extras.maxClicks || 10,
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   292
            timer;
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   293
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   294
        sub._handle = node.on(&#x27;click&#x27;, function (e) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   295
            if (timer) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   296
                timer.cancel();
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   297
            }
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   298
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   299
            if (++clicks === max) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   300
                e.clicks = clicks;
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   301
                notifier.fire(e);
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   302
            } else {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   303
                timer = Y.later(200, null, function () {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   304
                    if (clicks &gt; min) {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   305
                        e.clicks = count;
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   306
                        notifier.fire(e);
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   307
                    }
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   308
                    count = 0;
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   309
                });
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   310
            }
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   311
        });
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   312
    },
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   313
    ...
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   314
});</pre>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   315
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   316
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   317
<p>Usage of this synthetic event then expects a third argument as a
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   318
configuration object with <code>minClicks</code> and <code>maxClicks</code> properties.</p>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   319
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   320
<pre class="code prettyprint">node.on(&#x27;multiclick&#x27;, obj.method, {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   321
    minClicks: 5,
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   322
    maxClicks: 8
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   323
}, obj);
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   324
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   325
&#x2F;&#x2F; extra args are supplied before the delegate filter
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   326
container.delegate(&#x27;multiclick&#x27;, doSomething, {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   327
    minClicks: 3,
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   328
    maxClicks: 55
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   329
}, &#x27;.clickable&#x27;);</pre>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   330
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   331
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   332
<h2 id="a-tip-to-make-your-synth-definition-smaller">A Tip to Make Your Synth Definition Smaller</h2>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   333
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   334
<p>If the only difference between your <code>on</code> and <code>delegate</code> definitions is which method is used to bind to the supporting events, then you can propably get away with defining <code>delegate</code> and aliasing it to <code>on</code> (and so with <code>detach</code> and <code>detachDelegate</code>).  See the
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   335
<a href="http://yuilibrary.com/yui/docs/api/files/event_js_hover.js.html">source for the "hover"
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   336
event</a> for an example of this approach.</p>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   337
</div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   338
            </div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   339
        </div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   340
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   341
        <div class="yui3-u-1-4">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   342
            <div class="sidebar">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   343
                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   344
                    <div id="toc" class="sidebox">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   345
                        <div class="hd">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   346
                            <h2 class="no-toc">Table of Contents</h2>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   347
                        </div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   348
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   349
                        <div class="bd">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   350
                            <ul class="toc">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   351
<li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   352
<a href="#the-hooks">The hooks</a>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   353
</li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   354
<li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   355
<a href="#subscriptions-and-notifiers">Subscriptions and Notifiers</a>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   356
</li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   357
<li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   358
<a href="#delegation-support">Delegation support</a>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   359
</li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   360
<li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   361
<a href="#extra-arguments">Extra Arguments</a>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   362
</li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   363
<li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   364
<a href="#a-tip-to-make-your-synth-definition-smaller">A Tip to Make Your Synth Definition Smaller</a>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   365
</li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   366
</ul>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   367
                        </div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   368
                    </div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   369
                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   370
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   371
                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   372
                    <div class="sidebox">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   373
                        <div class="hd">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   374
                            <h2 class="no-toc">Examples</h2>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   375
                        </div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   376
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   377
                        <div class="bd">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   378
                            <ul class="examples">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   379
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   380
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   381
                                        <li data-description="Use the Event Utility to attach simple DOM event handlers.">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   382
                                            <a href="basic-example.html">Simple DOM Events</a>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   383
                                        </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   384
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   385
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   386
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   387
                                        <li data-description="Using the synthetic event API to create a DOM event that fires in response to arrow keys being pressed.">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   388
                                            <a href="synth-example.html">Creating an Arrow Event for DOM Subscription</a>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   389
                                        </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   390
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   391
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   392
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   393
                                        <li data-description="Supporting cross-device swipe gestures, using the event-move gesture events">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   394
                                            <a href="swipe-example.html">Supporting A Swipe Left Gesture</a>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   395
                                        </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   396
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   397
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   398
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   399
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   400
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   401
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   402
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   403
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   404
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   405
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   406
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   407
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   408
                            </ul>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   409
                        </div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   410
                    </div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   411
                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   412
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   413
                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   414
                    <div class="sidebox">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   415
                        <div class="hd">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   416
                            <h2 class="no-toc">Examples That Use This Component</h2>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   417
                        </div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   418
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   419
                        <div class="bd">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   420
                            <ul class="examples">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   421
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   422
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   423
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   424
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   425
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   426
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   427
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   428
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   429
                                        <li data-description="Creating an accessible menu button using the Focus Manager Node Plugin, Event&#x27;s delegation support and mouseenter event, along with the Overlay widget and Node&#x27;s support for the WAI-ARIA Roles and States.">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   430
                                            <a href="../node-focusmanager/node-focusmanager-button.html">Accessible Menu Button</a>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   431
                                        </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   432
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   433
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   434
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   435
                                        <li data-description="Shows how to extend the base widget class, to create your own Widgets.">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   436
                                            <a href="../widget/widget-extend.html">Extending the Base Widget Class</a>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   437
                                        </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   438
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   439
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   440
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   441
                                        <li data-description="Example Photo Browser application.">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   442
                                            <a href="../dd/photo-browser.html">Photo Browser</a>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   443
                                        </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   444
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   445
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   446
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   447
                                        <li data-description="Portal style example using Drag &amp; Drop Event Bubbling and Animation.">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   448
                                            <a href="../dd/portal-drag.html">Portal Style Example</a>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   449
                                        </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   450
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   451
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   452
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   453
                                        <li data-description="Use IO to request data over HTTP.">
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   454
                                            <a href="../io/get.html">HTTP GET to request data</a>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   455
                                        </li>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   456
                                    
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   457
                                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   458
                            </ul>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   459
                        </div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   460
                    </div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   461
                
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   462
            </div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   463
        </div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   464
    </div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   465
</div>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   466
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   467
<script src="../assets/vendor/prettify/prettify-min.js"></script>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   468
<script>prettyPrint();</script>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   469
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   470
<script>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   471
YUI.Env.Tests = {
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   472
    examples: [],
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   473
    project: '../assets',
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   474
    assets: '../assets/event',
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   475
    name: 'event',
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   476
    title: 'Creating Synthetic Events',
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   477
    newWindow: '',
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   478
    auto:  false 
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   479
};
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   480
YUI.Env.Tests.examples.push('basic-example');
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   481
YUI.Env.Tests.examples.push('synth-example');
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   482
YUI.Env.Tests.examples.push('swipe-example');
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   483
YUI.Env.Tests.examples.push('node-focusmanager-button');
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   484
YUI.Env.Tests.examples.push('widget-extend');
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   485
YUI.Env.Tests.examples.push('photo-browser');
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   486
YUI.Env.Tests.examples.push('portal-drag');
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   487
YUI.Env.Tests.examples.push('get');
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   488
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   489
</script>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   490
<script src="../assets/yui/test-runner.js"></script>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   491
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   492
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   493
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   494
</body>
89ef5ed3c48b Upgrades to yui 3.10.3
gibus
parents:
diff changeset
   495
</html>