[Summary view] [Print] [Text view]

   1  /*
   2  YUI 3.17.2 (build 9c3c78e)
   3  Copyright 2014 Yahoo! Inc. All rights reserved.
   4  Licensed under the BSD License.
   5  http://yuilibrary.com/license/
   6  */
   7  
   8  YUI.add('node-event-simulate', function (Y, NAME) {
   9  
  10  /**
  11   * Adds functionality to simulate events.
  12   * @module node
  13   * @submodule node-event-simulate
  14   */
  15  
  16  /**
  17   * Simulates an event on the node.
  18   * @param {String} type The type of event (i.e., "click").
  19   * @param {Object} options (Optional) Extra options to copy onto the event object.
  20   * @for Node
  21   * @method simulate
  22   */
  23  Y.Node.prototype.simulate = function (type, options) {
  24  
  25      Y.Event.simulate(Y.Node.getDOMNode(this), type, options);
  26  };
  27  
  28  /**
  29   * Simulates the higher user level gesture of the given name on this node.
  30   * This method generates a set of low level touch events(Apple specific gesture
  31   * events as well for the iOS platforms) asynchronously. Note that gesture
  32   * simulation is relying on `Y.Event.simulate()` method to generate
  33   * the touch events under the hood. The `Y.Event.simulate()` method
  34   * itself is a synchronous method.
  35   *
  36   * Supported gestures are `tap`, `doubletap`, `press`, `move`, `flick`, `pinch`
  37   * and `rotate`.
  38   *
  39   * The `pinch` gesture is used to simulate the pinching and spreading of two
  40   * fingers. During a pinch simulation, rotation is also possible. Essentially
  41   * `pinch` and `rotate` simulations share the same base implementation to allow
  42   * both pinching and rotation at the same time. The only difference is `pinch`
  43   * requires `start` and `end` option properties while `rotate` requires `rotation`
  44   * option property.
  45   *
  46   * The `pinch` and `rotate` gestures can be described as placing 2 fingers along a
  47   * circle. Pinching and spreading can be described by start and end circles while
  48   * rotation occurs on a single circle. If the radius of the start circle is greater
  49   * than the end circle, the gesture becomes a pinch, otherwise it is a spread spread.
  50   *
  51   * @example
  52   *
  53   *     var node = Y.one("#target");
  54   *
  55   *     // double tap example
  56   *     node.simulateGesture("doubletap", function() {
  57   *         // my callback function
  58   *     });
  59   *
  60   *     // flick example from the center of the node, move 50 pixels down for 50ms)
  61   *     node.simulateGesture("flick", {
  62   *         axis: y,
  63   *         distance: -100
  64   *         duration: 50
  65   *     }, function() {
  66   *         // my callback function
  67   *     });
  68   *
  69   *     // simulate rotating a node 75 degrees counter-clockwise
  70   *     node.simulateGesture("rotate", {
  71   *         rotation: -75
  72   *     });
  73   *
  74   *     // simulate a pinch and a rotation at the same time.
  75   *     // fingers start on a circle of radius 100 px, placed at top/bottom
  76   *     // fingers end on a circle of radius 50px, placed at right/left
  77   *     node.simulateGesture("pinch", {
  78   *         r1: 100,
  79   *         r2: 50,
  80   *         start: 0
  81   *         rotation: 90
  82   *     });
  83   *
  84   * @method simulateGesture
  85   * @param {String} name The name of the supported gesture to simulate. The
  86   *      supported gesture name is one of "tap", "doubletap", "press", "move",
  87   *      "flick", "pinch" and "rotate".
  88   * @param {Object} [options] Extra options used to define the gesture behavior:
  89   *
  90   *      Valid options properties for the `tap` gesture:
  91   *
  92   *      @param {Array} [options.point] (Optional) Indicates the [x,y] coordinates
  93   *        where the tap should be simulated. Default is the center of the node
  94   *        element.
  95   *      @param {Number} [options.hold=10] (Optional) The hold time in milliseconds.
  96   *        This is the time between `touchstart` and `touchend` event generation.
  97   *      @param {Number} [options.times=1] (Optional) Indicates the number of taps.
  98   *      @param {Number} [options.delay=10] (Optional) The number of milliseconds
  99   *        before the next tap simulation happens. This is valid only when `times`
 100   *        is more than 1.
 101   *
 102   *      Valid options properties for the `doubletap` gesture:
 103   *
 104   *      @param {Array} [options.point] (Optional) Indicates the [x,y] coordinates
 105   *        where the doubletap should be simulated. Default is the center of the
 106   *        node element.
 107   *
 108   *      Valid options properties for the `press` gesture:
 109   *
 110   *      @param {Array} [options.point] (Optional) Indicates the [x,y] coordinates
 111   *        where the press should be simulated. Default is the center of the node
 112   *        element.
 113   *      @param {Number} [options.hold=3000] (Optional) The hold time in milliseconds.
 114   *        This is the time between `touchstart` and `touchend` event generation.
 115   *        Default is 3000ms (3 seconds).
 116   *
 117   *      Valid options properties for the `move` gesture:
 118   *
 119   *      @param {Object} [options.path] (Optional) Indicates the path of the finger
 120   *        movement. It's an object with three optional properties: `point`,
 121   *        `xdist` and  `ydist`.
 122   *        @param {Array} [options.path.point] A starting point of the gesture.
 123   *          Default is the center of the node element.
 124   *        @param {Number} [options.path.xdist=200] A distance to move in pixels
 125   *          along the X axis. A negative distance value indicates moving left.
 126   *        @param {Number} [options.path.ydist=0] A distance to move in pixels
 127   *          along the Y axis. A negative distance value indicates moving up.
 128   *      @param {Number} [options.duration=1000] (Optional) The duration of the
 129   *        gesture in milliseconds.
 130   *
 131   *      Valid options properties for the `flick` gesture:
 132   *
 133   *      @param {Array} [options.point] (Optional) Indicates the [x, y] coordinates
 134   *        where the flick should be simulated. Default is the center of the
 135   *        node element.
 136   *      @param {String} [options.axis='x'] (Optional) Valid values are either
 137   *        "x" or "y". Indicates axis to move along. The flick can move to one of
 138   *        4 directions(left, right, up and down).
 139   *      @param {Number} [options.distance=200] (Optional) Distance to move in pixels
 140   *      @param {Number} [options.duration=1000] (Optional) The duration of the
 141   *        gesture in milliseconds. User given value could be automatically
 142   *        adjusted by the framework if it is below the minimum velocity to be
 143   *        a flick gesture.
 144   *
 145   *      Valid options properties for the `pinch` gesture:
 146   *
 147   *      @param {Array} [options.center] (Optional) The center of the circle where
 148   *        two fingers are placed. Default is the center of the node element.
 149   *      @param {Number} [options.r1] (Required) Pixel radius of the start circle
 150   *        where 2 fingers will be on when the gesture starts. The circles are
 151   *        centered at the center of the element.
 152   *      @param {Number} [options.r2] (Required) Pixel radius of the end circle
 153   *        when this gesture ends.
 154   *      @param {Number} [options.duration=1000] (Optional) The duration of the
 155   *        gesture in milliseconds.
 156   *      @param {Number} [options.start=0] (Optional) Starting degree of the first
 157   *        finger. The value is relative to the path of the north. Default is 0
 158   *        (i.e., 12:00 on a clock).
 159   *      @param {Number} [options.rotation=0] (Optional) Degrees to rotate from
 160   *        the starting degree. A negative value means rotation to the
 161   *        counter-clockwise direction.
 162   *
 163   *      Valid options properties for the `rotate` gesture:
 164   *
 165   *      @param {Array} [options.center] (Optional) The center of the circle where
 166   *        two fingers are placed. Default is the center of the node element.
 167   *      @param {Number} [options.r1] (Optional) Pixel radius of the start circle
 168   *        where 2 fingers will be on when the gesture starts. The circles are
 169   *        centered at the center of the element. Default is a fourth of the node
 170   *        element width or height, whichever is smaller.
 171   *      @param {Number} [options.r2] (Optional) Pixel radius of the end circle
 172   *        when this gesture ends. Default is a fourth of the node element width or
 173   *        height, whichever is smaller.
 174   *      @param {Number} [options.duration=1000] (Optional) The duration of the
 175   *        gesture in milliseconds.
 176   *      @param {Number} [options.start=0] (Optional) Starting degree of the first
 177   *        finger. The value is relative to the path of the north. Default is 0
 178   *        (i.e., 12:00 on a clock).
 179   *      @param {Number} [options.rotation] (Required) Degrees to rotate from
 180   *        the starting degree. A negative value means rotation to the
 181   *        counter-clockwise direction.
 182   *
 183   * @param {Function} [cb] The callback to execute when the asynchronouse gesture
 184   *      simulation is completed.
 185   *      @param {Error} cb.err An error object if the simulation is failed.
 186   * @for Node
 187   */
 188  Y.Node.prototype.simulateGesture = function (name, options, cb) {
 189  
 190      Y.Event.simulateGesture(this, name, options, cb);
 191  };
 192  
 193  
 194  }, '3.17.2', {"requires": ["node-base", "event-simulate", "gesture-simulate"]});