[Summary view] [Print] [Text view]

   1  YUI.add('yui2-animation', function(Y) {
   2      var YAHOO    = Y.YUI2;
   3      /*
   4  Copyright (c) 2011, Yahoo! Inc. All rights reserved.
   5  Code licensed under the BSD License:
   6  http://developer.yahoo.com/yui/license.html
   7  version: 2.9.0
   8  */
   9  (function() {
  10  
  11  var Y = YAHOO.util;
  12  
  13  /*
  14  Copyright (c) 2006, Yahoo! Inc. All rights reserved.
  15  Code licensed under the BSD License:
  16  http://developer.yahoo.net/yui/license.txt
  17  */
  18  
  19  /**
  20   * The animation module provides allows effects to be added to HTMLElements.
  21   * @module animation
  22   * @requires yahoo, event, dom
  23   */
  24  
  25  /**
  26   *
  27   * Base animation class that provides the interface for building animated effects.
  28   * <p>Usage: var myAnim = new YAHOO.util.Anim(el, { width: { from: 10, to: 100 } }, 1, YAHOO.util.Easing.easeOut);</p>
  29   * @class Anim
  30   * @namespace YAHOO.util
  31   * @requires YAHOO.util.AnimMgr
  32   * @requires YAHOO.util.Easing
  33   * @requires YAHOO.util.Dom
  34   * @requires YAHOO.util.Event
  35   * @requires YAHOO.util.CustomEvent
  36   * @constructor
  37   * @param {String | HTMLElement} el Reference to the element that will be animated
  38   * @param {Object} attributes The attribute(s) to be animated.  
  39   * Each attribute is an object with at minimum a "to" or "by" member defined.  
  40   * Additional optional members are "from" (defaults to current value), "units" (defaults to "px").  
  41   * All attribute names use camelCase.
  42   * @param {Number} duration (optional, defaults to 1 second) Length of animation (frames or seconds), defaults to time-based
  43   * @param {Function} method (optional, defaults to YAHOO.util.Easing.easeNone) Computes the values that are applied to the attributes per frame (generally a YAHOO.util.Easing method)
  44   */
  45  
  46  var Anim = function(el, attributes, duration, method) {
  47      if (!el) {
  48          YAHOO.log('element required to create Anim instance', 'error', 'Anim');
  49      }
  50      this.init(el, attributes, duration, method); 
  51  };
  52  
  53  Anim.NAME = 'Anim';
  54  
  55  Anim.prototype = {
  56      /**
  57       * Provides a readable name for the Anim instance.
  58       * @method toString
  59       * @return {String}
  60       */
  61      toString: function() {
  62          var el = this.getEl() || {};
  63          var id = el.id || el.tagName;
  64          return (this.constructor.NAME + ': ' + id);
  65      },
  66      
  67      patterns: { // cached for performance
  68          noNegatives:        /width|height|opacity|padding/i, // keep at zero or above
  69          offsetAttribute:  /^((width|height)|(top|left))$/, // use offsetValue as default
  70          defaultUnit:        /width|height|top$|bottom$|left$|right$/i, // use 'px' by default
  71          offsetUnit:         /\d+(em|%|en|ex|pt|in|cm|mm|pc)$/i // IE may return these, so convert these to offset
  72      },
  73      
  74      /**
  75       * Returns the value computed by the animation's "method".
  76       * @method doMethod
  77       * @param {String} attr The name of the attribute.
  78       * @param {Number} start The value this attribute should start from for this animation.
  79       * @param {Number} end  The value this attribute should end at for this animation.
  80       * @return {Number} The Value to be applied to the attribute.
  81       */
  82      doMethod: function(attr, start, end) {
  83          return this.method(this.currentFrame, start, end - start, this.totalFrames);
  84      },
  85      
  86      /**
  87       * Applies a value to an attribute.
  88       * @method setAttribute
  89       * @param {String} attr The name of the attribute.
  90       * @param {Number} val The value to be applied to the attribute.
  91       * @param {String} unit The unit ('px', '%', etc.) of the value.
  92       */
  93      setAttribute: function(attr, val, unit) {
  94          var el = this.getEl();
  95          if ( this.patterns.noNegatives.test(attr) ) {
  96              val = (val > 0) ? val : 0;
  97          }
  98  
  99          if (attr in el && !('style' in el && attr in el.style)) {
 100              el[attr] = val;
 101          } else {
 102              Y.Dom.setStyle(el, attr, val + unit);
 103          }
 104      },                        
 105      
 106      /**
 107       * Returns current value of the attribute.
 108       * @method getAttribute
 109       * @param {String} attr The name of the attribute.
 110       * @return {Number} val The current value of the attribute.
 111       */
 112      getAttribute: function(attr) {
 113          var el = this.getEl();
 114          var val = Y.Dom.getStyle(el, attr);
 115  
 116          if (val !== 'auto' && !this.patterns.offsetUnit.test(val)) {
 117              return parseFloat(val);
 118          }
 119          
 120          var a = this.patterns.offsetAttribute.exec(attr) || [];
 121          var pos = !!( a[3] ); // top or left
 122          var box = !!( a[2] ); // width or height
 123          
 124          if ('style' in el) {
 125              // use offsets for width/height and abs pos top/left
 126              if ( box || (Y.Dom.getStyle(el, 'position') == 'absolute' && pos) ) {
 127                  val = el['offset' + a[0].charAt(0).toUpperCase() + a[0].substr(1)];
 128              } else { // default to zero for other 'auto'
 129                  val = 0;
 130              }
 131          } else if (attr in el) {
 132              val = el[attr];
 133          }
 134  
 135          return val;
 136      },
 137      
 138      /**
 139       * Returns the unit to use when none is supplied.
 140       * @method getDefaultUnit
 141       * @param {attr} attr The name of the attribute.
 142       * @return {String} The default unit to be used.
 143       */
 144      getDefaultUnit: function(attr) {
 145           if ( this.patterns.defaultUnit.test(attr) ) {
 146              return 'px';
 147           }
 148           
 149           return '';
 150      },
 151          
 152      /**
 153       * Sets the actual values to be used during the animation.  Should only be needed for subclass use.
 154       * @method setRuntimeAttribute
 155       * @param {Object} attr The attribute object
 156       * @private 
 157       */
 158      setRuntimeAttribute: function(attr) {
 159          var start;
 160          var end;
 161          var attributes = this.attributes;
 162  
 163          this.runtimeAttributes[attr] = {};
 164          
 165          var isset = function(prop) {
 166              return (typeof prop !== 'undefined');
 167          };
 168          
 169          if ( !isset(attributes[attr]['to']) && !isset(attributes[attr]['by']) ) {
 170              return false; // note return; nothing to animate to
 171          }
 172          
 173          start = ( isset(attributes[attr]['from']) ) ? attributes[attr]['from'] : this.getAttribute(attr);
 174  
 175          // To beats by, per SMIL 2.1 spec
 176          if ( isset(attributes[attr]['to']) ) {
 177              end = attributes[attr]['to'];
 178          } else if ( isset(attributes[attr]['by']) ) {
 179              if (start.constructor == Array) {
 180                  end = [];
 181                  for (var i = 0, len = start.length; i < len; ++i) {
 182                      end[i] = start[i] + attributes[attr]['by'][i] * 1; // times 1 to cast "by" 
 183                  }
 184              } else {
 185                  end = start + attributes[attr]['by'] * 1;
 186              }
 187          }
 188          
 189          this.runtimeAttributes[attr].start = start;
 190          this.runtimeAttributes[attr].end = end;
 191  
 192          // set units if needed
 193          this.runtimeAttributes[attr].unit = ( isset(attributes[attr].unit) ) ?
 194                  attributes[attr]['unit'] : this.getDefaultUnit(attr);
 195          return true;
 196      },
 197  
 198      /**
 199       * Constructor for Anim instance.
 200       * @method init
 201       * @param {String | HTMLElement} el Reference to the element that will be animated
 202       * @param {Object} attributes The attribute(s) to be animated.  
 203       * Each attribute is an object with at minimum a "to" or "by" member defined.  
 204       * Additional optional members are "from" (defaults to current value), "units" (defaults to "px").  
 205       * All attribute names use camelCase.
 206       * @param {Number} duration (optional, defaults to 1 second) Length of animation (frames or seconds), defaults to time-based
 207       * @param {Function} method (optional, defaults to YAHOO.util.Easing.easeNone) Computes the values that are applied to the attributes per frame (generally a YAHOO.util.Easing method)
 208       */ 
 209      init: function(el, attributes, duration, method) {
 210          /**
 211           * Whether or not the animation is running.
 212           * @property isAnimated
 213           * @private
 214           * @type Boolean
 215           */
 216          var isAnimated = false;
 217          
 218          /**
 219           * A Date object that is created when the animation begins.
 220           * @property startTime
 221           * @private
 222           * @type Date
 223           */
 224          var startTime = null;
 225          
 226          /**
 227           * The number of frames this animation was able to execute.
 228           * @property actualFrames
 229           * @private
 230           * @type Int
 231           */
 232          var actualFrames = 0; 
 233  
 234          /**
 235           * The element to be animated.
 236           * @property el
 237           * @private
 238           * @type HTMLElement
 239           */
 240          el = Y.Dom.get(el);
 241          
 242          /**
 243           * The collection of attributes to be animated.  
 244           * Each attribute must have at least a "to" or "by" defined in order to animate.  
 245           * If "to" is supplied, the animation will end with the attribute at that value.  
 246           * If "by" is supplied, the animation will end at that value plus its starting value. 
 247           * If both are supplied, "to" is used, and "by" is ignored. 
 248           * Optional additional member include "from" (the value the attribute should start animating from, defaults to current value), and "unit" (the units to apply to the values).
 249           * @property attributes
 250           * @type Object
 251           */
 252          this.attributes = attributes || {};
 253          
 254          /**
 255           * The length of the animation.  Defaults to "1" (second).
 256           * @property duration
 257           * @type Number
 258           */
 259          this.duration = !YAHOO.lang.isUndefined(duration) ? duration : 1;
 260          
 261          /**
 262           * The method that will provide values to the attribute(s) during the animation. 
 263           * Defaults to "YAHOO.util.Easing.easeNone".
 264           * @property method
 265           * @type Function
 266           */
 267          this.method = method || Y.Easing.easeNone;
 268  
 269          /**
 270           * Whether or not the duration should be treated as seconds.
 271           * Defaults to true.
 272           * @property useSeconds
 273           * @type Boolean
 274           */
 275          this.useSeconds = true; // default to seconds
 276          
 277          /**
 278           * The location of the current animation on the timeline.
 279           * In time-based animations, this is used by AnimMgr to ensure the animation finishes on time.
 280           * @property currentFrame
 281           * @type Int
 282           */
 283          this.currentFrame = 0;
 284          
 285          /**
 286           * The total number of frames to be executed.
 287           * In time-based animations, this is used by AnimMgr to ensure the animation finishes on time.
 288           * @property totalFrames
 289           * @type Int
 290           */
 291          this.totalFrames = Y.AnimMgr.fps;
 292          
 293          /**
 294           * Changes the animated element
 295           * @method setEl
 296           */
 297          this.setEl = function(element) {
 298              el = Y.Dom.get(element);
 299          };
 300          
 301          /**
 302           * Returns a reference to the animated element.
 303           * @method getEl
 304           * @return {HTMLElement}
 305           */
 306          this.getEl = function() { return el; };
 307          
 308          /**
 309           * Checks whether the element is currently animated.
 310           * @method isAnimated
 311           * @return {Boolean} current value of isAnimated.     
 312           */
 313          this.isAnimated = function() {
 314              return isAnimated;
 315          };
 316          
 317          /**
 318           * Returns the animation start time.
 319           * @method getStartTime
 320           * @return {Date} current value of startTime.      
 321           */
 322          this.getStartTime = function() {
 323              return startTime;
 324          };        
 325          
 326          this.runtimeAttributes = {};
 327          
 328          var logger = {};
 329          logger.log = function() {YAHOO.log.apply(window, arguments)};
 330          
 331          logger.log('creating new instance of ' + this);
 332          
 333          /**
 334           * Starts the animation by registering it with the animation manager. 
 335           * @method animate  
 336           */
 337          this.animate = function() {
 338              if ( this.isAnimated() ) {
 339                  return false;
 340              }
 341              
 342              this.currentFrame = 0;
 343              
 344              this.totalFrames = ( this.useSeconds ) ? Math.ceil(Y.AnimMgr.fps * this.duration) : this.duration;
 345      
 346              if (this.duration === 0 && this.useSeconds) { // jump to last frame if zero second duration 
 347                  this.totalFrames = 1; 
 348              }
 349              Y.AnimMgr.registerElement(this);
 350              return true;
 351          };
 352            
 353          /**
 354           * Stops the animation.  Normally called by AnimMgr when animation completes.
 355           * @method stop
 356           * @param {Boolean} finish (optional) If true, animation will jump to final frame.
 357           */ 
 358          this.stop = function(finish) {
 359              if (!this.isAnimated()) { // nothing to stop
 360                  return false;
 361              }
 362  
 363              if (finish) {
 364                   this.currentFrame = this.totalFrames;
 365                   this._onTween.fire();
 366              }
 367              Y.AnimMgr.stop(this);
 368          };
 369          
 370          this._handleStart = function() {            
 371              this.onStart.fire();
 372              
 373              this.runtimeAttributes = {};
 374              for (var attr in this.attributes) {
 375                  if (this.attributes.hasOwnProperty(attr)) {
 376                      this.setRuntimeAttribute(attr);
 377                  }
 378              }
 379              
 380              isAnimated = true;
 381              actualFrames = 0;
 382              startTime = new Date(); 
 383          };
 384          
 385          /**
 386           * Feeds the starting and ending values for each animated attribute to doMethod once per frame, then applies the resulting value to the attribute(s).
 387           * @private
 388           */
 389           
 390          this._handleTween = function() {
 391              var data = {
 392                  duration: new Date() - this.getStartTime(),
 393                  currentFrame: this.currentFrame
 394              };
 395              
 396              data.toString = function() {
 397                  return (
 398                      'duration: ' + data.duration +
 399                      ', currentFrame: ' + data.currentFrame
 400                  );
 401              };
 402              
 403              this.onTween.fire(data);
 404              
 405              var runtimeAttributes = this.runtimeAttributes;
 406              
 407              for (var attr in runtimeAttributes) {
 408                  if (runtimeAttributes.hasOwnProperty(attr)) {
 409                      this.setAttribute(attr, this.doMethod(attr, runtimeAttributes[attr].start, runtimeAttributes[attr].end), runtimeAttributes[attr].unit); 
 410                  }
 411              }
 412              
 413              this.afterTween.fire(data);
 414              
 415              actualFrames += 1;
 416          };
 417          
 418          this._handleComplete = function() {
 419              var actual_duration = (new Date() - startTime) / 1000 ;
 420              
 421              var data = {
 422                  duration: actual_duration,
 423                  frames: actualFrames,
 424                  fps: actualFrames / actual_duration
 425              };
 426              
 427              data.toString = function() {
 428                  return (
 429                      'duration: ' + data.duration +
 430                      ', frames: ' + data.frames +
 431                      ', fps: ' + data.fps
 432                  );
 433              };
 434              
 435              isAnimated = false;
 436              actualFrames = 0;
 437              this.onComplete.fire(data);
 438          };
 439          
 440          /**
 441           * Custom event that fires after onStart, useful in subclassing
 442           * @private
 443           */    
 444          this._onStart = new Y.CustomEvent('_start', this, true);
 445  
 446          /**
 447           * Custom event that fires when animation begins
 448           * Listen via subscribe method (e.g. myAnim.onStart.subscribe(someFunction)
 449           * @event onStart
 450           */    
 451          this.onStart = new Y.CustomEvent('start', this);
 452          
 453          /**
 454           * Custom event that fires between each frame
 455           * Listen via subscribe method (e.g. myAnim.onTween.subscribe(someFunction)
 456           * @event onTween
 457           */
 458          this.onTween = new Y.CustomEvent('tween', this);
 459          
 460          /**
 461           * Custom event that fires between each frame
 462           * Listen via subscribe method (e.g. myAnim.afterTween.subscribe(someFunction)
 463           * @event afterTween
 464           */
 465          this.afterTween = new Y.CustomEvent('afterTween', this);
 466          
 467          /**
 468           * Custom event that fires after onTween
 469           * @private
 470           */
 471          this._onTween = new Y.CustomEvent('_tween', this, true);
 472          
 473          /**
 474           * Custom event that fires when animation ends
 475           * Listen via subscribe method (e.g. myAnim.onComplete.subscribe(someFunction)
 476           * @event onComplete
 477           */
 478          this.onComplete = new Y.CustomEvent('complete', this);
 479          /**
 480           * Custom event that fires after onComplete
 481           * @private
 482           */
 483          this._onComplete = new Y.CustomEvent('_complete', this, true);
 484  
 485          this._onStart.subscribe(this._handleStart);
 486          this._onTween.subscribe(this._handleTween);
 487          this._onComplete.subscribe(this._handleComplete);
 488      }
 489  };
 490  
 491      Y.Anim = Anim;
 492  })();
 493  /**
 494   * Handles animation queueing and threading.
 495   * Used by Anim and subclasses.
 496   * @class AnimMgr
 497   * @namespace YAHOO.util
 498   */
 499  YAHOO.util.AnimMgr = new function() {
 500      /** 
 501       * Reference to the animation Interval.
 502       * @property thread
 503       * @private
 504       * @type Int
 505       */
 506      var thread = null;
 507      
 508      /** 
 509       * The current queue of registered animation objects.
 510       * @property queue
 511       * @private
 512       * @type Array
 513       */    
 514      var queue = [];
 515  
 516      /** 
 517       * The number of active animations.
 518       * @property tweenCount
 519       * @private
 520       * @type Int
 521       */        
 522      var tweenCount = 0;
 523  
 524      /** 
 525       * Base frame rate (frames per second). 
 526       * Arbitrarily high for better x-browser calibration (slower browsers drop more frames).
 527       * @property fps
 528       * @type Int
 529       * 
 530       */
 531      this.fps = 1000;
 532  
 533      /** 
 534       * Interval delay in milliseconds, defaults to fastest possible.
 535       * @property delay
 536       * @type Int
 537       * 
 538       */
 539      this.delay = 20;
 540  
 541      /**
 542       * Adds an animation instance to the animation queue.
 543       * All animation instances must be registered in order to animate.
 544       * @method registerElement
 545       * @param {object} tween The Anim instance to be be registered
 546       */
 547      this.registerElement = function(tween) {
 548          queue[queue.length] = tween;
 549          tweenCount += 1;
 550          tween._onStart.fire();
 551          this.start();
 552      };
 553      
 554      var _unregisterQueue = [];
 555      var _unregistering = false;
 556  
 557      var doUnregister = function() {
 558          var next_args = _unregisterQueue.shift();
 559          unRegister.apply(YAHOO.util.AnimMgr,next_args);
 560          if (_unregisterQueue.length) {
 561              arguments.callee();
 562          }
 563      };
 564  
 565      var unRegister = function(tween, index) {
 566          index = index || getIndex(tween);
 567          if (!tween.isAnimated() || index === -1) {
 568              return false;
 569          }
 570          
 571          tween._onComplete.fire();
 572          queue.splice(index, 1);
 573  
 574          tweenCount -= 1;
 575          if (tweenCount <= 0) {
 576              this.stop();
 577          }
 578  
 579          return true;
 580      };
 581  
 582      /**
 583       * removes an animation instance from the animation queue.
 584       * All animation instances must be registered in order to animate.
 585       * @method unRegister
 586       * @param {object} tween The Anim instance to be be registered
 587       * @param {Int} index The index of the Anim instance
 588       * @private
 589       */
 590      this.unRegister = function() {
 591          _unregisterQueue.push(arguments);
 592          if (!_unregistering) {
 593              _unregistering = true;
 594              doUnregister();
 595              _unregistering = false;
 596          }
 597      }
 598  
 599      /**
 600       * Starts the animation thread.
 601      * Only one thread can run at a time.
 602       * @method start
 603       */    
 604      this.start = function() {
 605          if (thread === null) {
 606              thread = setInterval(this.run, this.delay);
 607          }
 608      };
 609  
 610      /**
 611       * Stops the animation thread or a specific animation instance.
 612       * @method stop
 613       * @param {object} tween A specific Anim instance to stop (optional)
 614       * If no instance given, Manager stops thread and all animations.
 615       */    
 616      this.stop = function(tween) {
 617          if (!tween) {
 618              clearInterval(thread);
 619              
 620              for (var i = 0, len = queue.length; i < len; ++i) {
 621                  this.unRegister(queue[0], 0);  
 622              }
 623  
 624              queue = [];
 625              thread = null;
 626              tweenCount = 0;
 627          }
 628          else {
 629              this.unRegister(tween);
 630          }
 631      };
 632      
 633      /**
 634       * Called per Interval to handle each animation frame.
 635       * @method run
 636       */    
 637      this.run = function() {
 638          for (var i = 0, len = queue.length; i < len; ++i) {
 639              var tween = queue[i];
 640              if ( !tween || !tween.isAnimated() ) { continue; }
 641  
 642              if (tween.currentFrame < tween.totalFrames || tween.totalFrames === null)
 643              {
 644                  tween.currentFrame += 1;
 645                  
 646                  if (tween.useSeconds) {
 647                      correctFrame(tween);
 648                  }
 649                  tween._onTween.fire();          
 650              }
 651              else { YAHOO.util.AnimMgr.stop(tween, i); }
 652          }
 653      };
 654      
 655      var getIndex = function(anim) {
 656          for (var i = 0, len = queue.length; i < len; ++i) {
 657              if (queue[i] === anim) {
 658                  return i; // note return;
 659              }
 660          }
 661          return -1;
 662      };
 663      
 664      /**
 665       * On the fly frame correction to keep animation on time.
 666       * @method correctFrame
 667       * @private
 668       * @param {Object} tween The Anim instance being corrected.
 669       */
 670      var correctFrame = function(tween) {
 671          var frames = tween.totalFrames;
 672          var frame = tween.currentFrame;
 673          var expected = (tween.currentFrame * tween.duration * 1000 / tween.totalFrames);
 674          var elapsed = (new Date() - tween.getStartTime());
 675          var tweak = 0;
 676          
 677          if (elapsed < tween.duration * 1000) { // check if falling behind
 678              tweak = Math.round((elapsed / expected - 1) * tween.currentFrame);
 679          } else { // went over duration, so jump to end
 680              tweak = frames - (frame + 1); 
 681          }
 682          if (tweak > 0 && isFinite(tweak)) { // adjust if needed
 683              if (tween.currentFrame + tweak >= frames) {// dont go past last frame
 684                  tweak = frames - (frame + 1);
 685              }
 686              
 687              tween.currentFrame += tweak;      
 688          }
 689      };
 690      this._queue = queue;
 691      this._getIndex = getIndex;
 692  };
 693  /**
 694   * Used to calculate Bezier splines for any number of control points.
 695   * @class Bezier
 696   * @namespace YAHOO.util
 697   *
 698   */
 699  YAHOO.util.Bezier = new function() {
 700      /**
 701       * Get the current position of the animated element based on t.
 702       * Each point is an array of "x" and "y" values (0 = x, 1 = y)
 703       * At least 2 points are required (start and end).
 704       * First point is start. Last point is end.
 705       * Additional control points are optional.     
 706       * @method getPosition
 707       * @param {Array} points An array containing Bezier points
 708       * @param {Number} t A number between 0 and 1 which is the basis for determining current position
 709       * @return {Array} An array containing int x and y member data
 710       */
 711      this.getPosition = function(points, t) {  
 712          var n = points.length;
 713          var tmp = [];
 714  
 715          for (var i = 0; i < n; ++i){
 716              tmp[i] = [points[i][0], points[i][1]]; // save input
 717          }
 718          
 719          for (var j = 1; j < n; ++j) {
 720              for (i = 0; i < n - j; ++i) {
 721                  tmp[i][0] = (1 - t) * tmp[i][0] + t * tmp[parseInt(i + 1, 10)][0];
 722                  tmp[i][1] = (1 - t) * tmp[i][1] + t * tmp[parseInt(i + 1, 10)][1]; 
 723              }
 724          }
 725      
 726          return [ tmp[0][0], tmp[0][1] ]; 
 727      
 728      };
 729  };
 730  (function() {
 731  /**
 732   * Anim subclass for color transitions.
 733   * <p>Usage: <code>var myAnim = new Y.ColorAnim(el, { backgroundColor: { from: '#FF0000', to: '#FFFFFF' } }, 1, Y.Easing.easeOut);</code> Color values can be specified with either 112233, #112233, 
 734   * [255,255,255], or rgb(255,255,255)</p>
 735   * @class ColorAnim
 736   * @namespace YAHOO.util
 737   * @requires YAHOO.util.Anim
 738   * @requires YAHOO.util.AnimMgr
 739   * @requires YAHOO.util.Easing
 740   * @requires YAHOO.util.Bezier
 741   * @requires YAHOO.util.Dom
 742   * @requires YAHOO.util.Event
 743   * @constructor
 744   * @extends YAHOO.util.Anim
 745   * @param {HTMLElement | String} el Reference to the element that will be animated
 746   * @param {Object} attributes The attribute(s) to be animated.
 747   * Each attribute is an object with at minimum a "to" or "by" member defined.
 748   * Additional optional members are "from" (defaults to current value), "units" (defaults to "px").
 749   * All attribute names use camelCase.
 750   * @param {Number} duration (optional, defaults to 1 second) Length of animation (frames or seconds), defaults to time-based
 751   * @param {Function} method (optional, defaults to YAHOO.util.Easing.easeNone) Computes the values that are applied to the attributes per frame (generally a YAHOO.util.Easing method)
 752   */
 753      var ColorAnim = function(el, attributes, duration,  method) {
 754          ColorAnim.superclass.constructor.call(this, el, attributes, duration, method);
 755      };
 756      
 757      ColorAnim.NAME = 'ColorAnim';
 758  
 759      ColorAnim.DEFAULT_BGCOLOR = '#fff';
 760      // shorthand
 761      var Y = YAHOO.util;
 762      YAHOO.extend(ColorAnim, Y.Anim);
 763  
 764      var superclass = ColorAnim.superclass;
 765      var proto = ColorAnim.prototype;
 766      
 767      proto.patterns.color = /color$/i;
 768      proto.patterns.rgb            = /^rgb\(([0-9]+)\s*,\s*([0-9]+)\s*,\s*([0-9]+)\)$/i;
 769      proto.patterns.hex            = /^#?([0-9A-F]{2})([0-9A-F]{2})([0-9A-F]{2})$/i;
 770      proto.patterns.hex3          = /^#?([0-9A-F]{1})([0-9A-F]{1})([0-9A-F]{1})$/i;
 771      proto.patterns.transparent = /^transparent|rgba\(0, 0, 0, 0\)$/; // need rgba for safari
 772      
 773      /**
 774       * Attempts to parse the given string and return a 3-tuple.
 775       * @method parseColor
 776       * @param {String} s The string to parse.
 777       * @return {Array} The 3-tuple of rgb values.
 778       */
 779      proto.parseColor = function(s) {
 780          if (s.length == 3) { return s; }
 781      
 782          var c = this.patterns.hex.exec(s);
 783          if (c && c.length == 4) {
 784              return [ parseInt(c[1], 16), parseInt(c[2], 16), parseInt(c[3], 16) ];
 785          }
 786      
 787          c = this.patterns.rgb.exec(s);
 788          if (c && c.length == 4) {
 789              return [ parseInt(c[1], 10), parseInt(c[2], 10), parseInt(c[3], 10) ];
 790          }
 791      
 792          c = this.patterns.hex3.exec(s);
 793          if (c && c.length == 4) {
 794              return [ parseInt(c[1] + c[1], 16), parseInt(c[2] + c[2], 16), parseInt(c[3] + c[3], 16) ];
 795          }
 796          
 797          return null;
 798      };
 799  
 800      proto.getAttribute = function(attr) {
 801          var el = this.getEl();
 802          if (this.patterns.color.test(attr) ) {
 803              var val = YAHOO.util.Dom.getStyle(el, attr);
 804              
 805              var that = this;
 806              if (this.patterns.transparent.test(val)) { // bgcolor default
 807                  var parent = YAHOO.util.Dom.getAncestorBy(el, function(node) {
 808                      return !that.patterns.transparent.test(val);
 809                  });
 810  
 811                  if (parent) {
 812                      val = Y.Dom.getStyle(parent, attr);
 813                  } else {
 814                      val = ColorAnim.DEFAULT_BGCOLOR;
 815                  }
 816              }
 817          } else {
 818              val = superclass.getAttribute.call(this, attr);
 819          }
 820  
 821          return val;
 822      };
 823      
 824      proto.doMethod = function(attr, start, end) {
 825          var val;
 826      
 827          if ( this.patterns.color.test(attr) ) {
 828              val = [];
 829              for (var i = 0, len = start.length; i < len; ++i) {
 830                  val[i] = superclass.doMethod.call(this, attr, start[i], end[i]);
 831              }
 832              
 833              val = 'rgb('+Math.floor(val[0])+','+Math.floor(val[1])+','+Math.floor(val[2])+')';
 834          }
 835          else {
 836              val = superclass.doMethod.call(this, attr, start, end);
 837          }
 838  
 839          return val;
 840      };
 841  
 842      proto.setRuntimeAttribute = function(attr) {
 843          superclass.setRuntimeAttribute.call(this, attr);
 844          
 845          if ( this.patterns.color.test(attr) ) {
 846              var attributes = this.attributes;
 847              var start = this.parseColor(this.runtimeAttributes[attr].start);
 848              var end = this.parseColor(this.runtimeAttributes[attr].end);
 849              // fix colors if going "by"
 850              if ( typeof attributes[attr]['to'] === 'undefined' && typeof attributes[attr]['by'] !== 'undefined' ) {
 851                  end = this.parseColor(attributes[attr].by);
 852              
 853                  for (var i = 0, len = start.length; i < len; ++i) {
 854                      end[i] = start[i] + end[i];
 855                  }
 856              }
 857              
 858              this.runtimeAttributes[attr].start = start;
 859              this.runtimeAttributes[attr].end = end;
 860          }
 861      };
 862  
 863      Y.ColorAnim = ColorAnim;
 864  })();
 865  /*!
 866  TERMS OF USE - EASING EQUATIONS
 867  Open source under the BSD License.
 868  Copyright 2001 Robert Penner All rights reserved.
 869  
 870  Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
 871  
 872   * Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
 873   * Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
 874   * Neither the name of the author nor the names of contributors may be used to endorse or promote products derived from this software without specific prior written permission.
 875  
 876  THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 877  */
 878  
 879  /**
 880   * Singleton that determines how an animation proceeds from start to end.
 881   * @class Easing
 882   * @namespace YAHOO.util
 883  */
 884  
 885  YAHOO.util.Easing = {
 886  
 887      /**
 888       * Uniform speed between points.
 889       * @method easeNone
 890       * @param {Number} t Time value used to compute current value
 891       * @param {Number} b Starting value
 892       * @param {Number} c Delta between start and end values
 893       * @param {Number} d Total length of animation
 894       * @return {Number} The computed value for the current animation frame
 895       */
 896      easeNone: function (t, b, c, d) {
 897          return c*t/d + b;
 898      },
 899      
 900      /**
 901       * Begins slowly and accelerates towards end.
 902       * @method easeIn
 903       * @param {Number} t Time value used to compute current value
 904       * @param {Number} b Starting value
 905       * @param {Number} c Delta between start and end values
 906       * @param {Number} d Total length of animation
 907       * @return {Number} The computed value for the current animation frame
 908       */
 909      easeIn: function (t, b, c, d) {
 910          return c*(t/=d)*t + b;
 911      },
 912  
 913      /**
 914       * Begins quickly and decelerates towards end.
 915       * @method easeOut
 916       * @param {Number} t Time value used to compute current value
 917       * @param {Number} b Starting value
 918       * @param {Number} c Delta between start and end values
 919       * @param {Number} d Total length of animation
 920       * @return {Number} The computed value for the current animation frame
 921       */
 922      easeOut: function (t, b, c, d) {
 923          return -c *(t/=d)*(t-2) + b;
 924      },
 925      
 926      /**
 927       * Begins slowly and decelerates towards end.
 928       * @method easeBoth
 929       * @param {Number} t Time value used to compute current value
 930       * @param {Number} b Starting value
 931       * @param {Number} c Delta between start and end values
 932       * @param {Number} d Total length of animation
 933       * @return {Number} The computed value for the current animation frame
 934       */
 935      easeBoth: function (t, b, c, d) {
 936          if ((t/=d/2) < 1) {
 937              return c/2*t*t + b;
 938          }
 939          
 940          return -c/2 * ((--t)*(t-2) - 1) + b;
 941      },
 942      
 943      /**
 944       * Begins slowly and accelerates towards end.
 945       * @method easeInStrong
 946       * @param {Number} t Time value used to compute current value
 947       * @param {Number} b Starting value
 948       * @param {Number} c Delta between start and end values
 949       * @param {Number} d Total length of animation
 950       * @return {Number} The computed value for the current animation frame
 951       */
 952      easeInStrong: function (t, b, c, d) {
 953          return c*(t/=d)*t*t*t + b;
 954      },
 955      
 956      /**
 957       * Begins quickly and decelerates towards end.
 958       * @method easeOutStrong
 959       * @param {Number} t Time value used to compute current value
 960       * @param {Number} b Starting value
 961       * @param {Number} c Delta between start and end values
 962       * @param {Number} d Total length of animation
 963       * @return {Number} The computed value for the current animation frame
 964       */
 965      easeOutStrong: function (t, b, c, d) {
 966          return -c * ((t=t/d-1)*t*t*t - 1) + b;
 967      },
 968      
 969      /**
 970       * Begins slowly and decelerates towards end.
 971       * @method easeBothStrong
 972       * @param {Number} t Time value used to compute current value
 973       * @param {Number} b Starting value
 974       * @param {Number} c Delta between start and end values
 975       * @param {Number} d Total length of animation
 976       * @return {Number} The computed value for the current animation frame
 977       */
 978      easeBothStrong: function (t, b, c, d) {
 979          if ((t/=d/2) < 1) {
 980              return c/2*t*t*t*t + b;
 981          }
 982          
 983          return -c/2 * ((t-=2)*t*t*t - 2) + b;
 984      },
 985  
 986      /**
 987       * Snap in elastic effect.
 988       * @method elasticIn
 989       * @param {Number} t Time value used to compute current value
 990       * @param {Number} b Starting value
 991       * @param {Number} c Delta between start and end values
 992       * @param {Number} d Total length of animation
 993       * @param {Number} a Amplitude (optional)
 994       * @param {Number} p Period (optional)
 995       * @return {Number} The computed value for the current animation frame
 996       */
 997  
 998      elasticIn: function (t, b, c, d, a, p) {
 999          if (t == 0) {
1000              return b;
1001          }
1002          if ( (t /= d) == 1 ) {
1003              return b+c;
1004          }
1005          if (!p) {
1006              p=d*.3;
1007          }
1008          
1009          if (!a || a < Math.abs(c)) {
1010              a = c; 
1011              var s = p/4;
1012          }
1013          else {
1014              var s = p/(2*Math.PI) * Math.asin (c/a);
1015          }
1016          
1017          return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
1018      },
1019  
1020      /**
1021       * Snap out elastic effect.
1022       * @method elasticOut
1023       * @param {Number} t Time value used to compute current value
1024       * @param {Number} b Starting value
1025       * @param {Number} c Delta between start and end values
1026       * @param {Number} d Total length of animation
1027       * @param {Number} a Amplitude (optional)
1028       * @param {Number} p Period (optional)
1029       * @return {Number} The computed value for the current animation frame
1030       */
1031      elasticOut: function (t, b, c, d, a, p) {
1032          if (t == 0) {
1033              return b;
1034          }
1035          if ( (t /= d) == 1 ) {
1036              return b+c;
1037          }
1038          if (!p) {
1039              p=d*.3;
1040          }
1041          
1042          if (!a || a < Math.abs(c)) {
1043              a = c;
1044              var s = p / 4;
1045          }
1046          else {
1047              var s = p/(2*Math.PI) * Math.asin (c/a);
1048          }
1049          
1050          return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
1051      },
1052      
1053      /**
1054       * Snap both elastic effect.
1055       * @method elasticBoth
1056       * @param {Number} t Time value used to compute current value
1057       * @param {Number} b Starting value
1058       * @param {Number} c Delta between start and end values
1059       * @param {Number} d Total length of animation
1060       * @param {Number} a Amplitude (optional)
1061       * @param {Number} p Period (optional)
1062       * @return {Number} The computed value for the current animation frame
1063       */
1064      elasticBoth: function (t, b, c, d, a, p) {
1065          if (t == 0) {
1066              return b;
1067          }
1068          
1069          if ( (t /= d/2) == 2 ) {
1070              return b+c;
1071          }
1072          
1073          if (!p) {
1074              p = d*(.3*1.5);
1075          }
1076          
1077          if ( !a || a < Math.abs(c) ) {
1078              a = c; 
1079              var s = p/4;
1080          }
1081          else {
1082              var s = p/(2*Math.PI) * Math.asin (c/a);
1083          }
1084          
1085          if (t < 1) {
1086              return -.5*(a*Math.pow(2,10*(t-=1)) * 
1087                      Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
1088          }
1089          return a*Math.pow(2,-10*(t-=1)) * 
1090                  Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b;
1091      },
1092  
1093  
1094      /**
1095       * Backtracks slightly, then reverses direction and moves to end.
1096       * @method backIn
1097       * @param {Number} t Time value used to compute current value
1098       * @param {Number} b Starting value
1099       * @param {Number} c Delta between start and end values
1100       * @param {Number} d Total length of animation
1101       * @param {Number} s Overshoot (optional)
1102       * @return {Number} The computed value for the current animation frame
1103       */
1104      backIn: function (t, b, c, d, s) {
1105          if (typeof s == 'undefined') {
1106              s = 1.70158;
1107          }
1108          return c*(t/=d)*t*((s+1)*t - s) + b;
1109      },
1110  
1111      /**
1112       * Overshoots end, then reverses and comes back to end.
1113       * @method backOut
1114       * @param {Number} t Time value used to compute current value
1115       * @param {Number} b Starting value
1116       * @param {Number} c Delta between start and end values
1117       * @param {Number} d Total length of animation
1118       * @param {Number} s Overshoot (optional)
1119       * @return {Number} The computed value for the current animation frame
1120       */
1121      backOut: function (t, b, c, d, s) {
1122          if (typeof s == 'undefined') {
1123              s = 1.70158;
1124          }
1125          return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
1126      },
1127      
1128      /**
1129       * Backtracks slightly, then reverses direction, overshoots end, 
1130       * then reverses and comes back to end.
1131       * @method backBoth
1132       * @param {Number} t Time value used to compute current value
1133       * @param {Number} b Starting value
1134       * @param {Number} c Delta between start and end values
1135       * @param {Number} d Total length of animation
1136       * @param {Number} s Overshoot (optional)
1137       * @return {Number} The computed value for the current animation frame
1138       */
1139      backBoth: function (t, b, c, d, s) {
1140          if (typeof s == 'undefined') {
1141              s = 1.70158; 
1142          }
1143          
1144          if ((t /= d/2 ) < 1) {
1145              return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b;
1146          }
1147          return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;
1148      },
1149  
1150      /**
1151       * Bounce off of start.
1152       * @method bounceIn
1153       * @param {Number} t Time value used to compute current value
1154       * @param {Number} b Starting value
1155       * @param {Number} c Delta between start and end values
1156       * @param {Number} d Total length of animation
1157       * @return {Number} The computed value for the current animation frame
1158       */
1159      bounceIn: function (t, b, c, d) {
1160          return c - YAHOO.util.Easing.bounceOut(d-t, 0, c, d) + b;
1161      },
1162      
1163      /**
1164       * Bounces off end.
1165       * @method bounceOut
1166       * @param {Number} t Time value used to compute current value
1167       * @param {Number} b Starting value
1168       * @param {Number} c Delta between start and end values
1169       * @param {Number} d Total length of animation
1170       * @return {Number} The computed value for the current animation frame
1171       */
1172      bounceOut: function (t, b, c, d) {
1173          if ((t/=d) < (1/2.75)) {
1174              return c*(7.5625*t*t) + b;
1175          } else if (t < (2/2.75)) {
1176              return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;
1177          } else if (t < (2.5/2.75)) {
1178              return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;
1179          }
1180          return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;
1181      },
1182      
1183      /**
1184       * Bounces off start and end.
1185       * @method bounceBoth
1186       * @param {Number} t Time value used to compute current value
1187       * @param {Number} b Starting value
1188       * @param {Number} c Delta between start and end values
1189       * @param {Number} d Total length of animation
1190       * @return {Number} The computed value for the current animation frame
1191       */
1192      bounceBoth: function (t, b, c, d) {
1193          if (t < d/2) {
1194              return YAHOO.util.Easing.bounceIn(t*2, 0, c, d) * .5 + b;
1195          }
1196          return YAHOO.util.Easing.bounceOut(t*2-d, 0, c, d) * .5 + c*.5 + b;
1197      }
1198  };
1199  
1200  (function() {
1201  /**
1202   * Anim subclass for moving elements along a path defined by the "points" 
1203   * member of "attributes".  All "points" are arrays with x, y coordinates.
1204   * <p>Usage: <code>var myAnim = new YAHOO.util.Motion(el, { points: { to: [800, 800] } }, 1, YAHOO.util.Easing.easeOut);</code></p>
1205   * @class Motion
1206   * @namespace YAHOO.util
1207   * @requires YAHOO.util.Anim
1208   * @requires YAHOO.util.AnimMgr
1209   * @requires YAHOO.util.Easing
1210   * @requires YAHOO.util.Bezier
1211   * @requires YAHOO.util.Dom
1212   * @requires YAHOO.util.Event
1213   * @requires YAHOO.util.CustomEvent 
1214   * @constructor
1215   * @extends YAHOO.util.ColorAnim
1216   * @param {String | HTMLElement} el Reference to the element that will be animated
1217   * @param {Object} attributes The attribute(s) to be animated.  
1218   * Each attribute is an object with at minimum a "to" or "by" member defined.  
1219   * Additional optional members are "from" (defaults to current value), "units" (defaults to "px").  
1220   * All attribute names use camelCase.
1221   * @param {Number} duration (optional, defaults to 1 second) Length of animation (frames or seconds), defaults to time-based
1222   * @param {Function} method (optional, defaults to YAHOO.util.Easing.easeNone) Computes the values that are applied to the attributes per frame (generally a YAHOO.util.Easing method)
1223   */
1224      var Motion = function(el, attributes, duration,  method) {
1225          if (el) { // dont break existing subclasses not using YAHOO.extend
1226              Motion.superclass.constructor.call(this, el, attributes, duration, method);
1227          }
1228      };
1229  
1230  
1231      Motion.NAME = 'Motion';
1232  
1233      // shorthand
1234      var Y = YAHOO.util;
1235      YAHOO.extend(Motion, Y.ColorAnim);
1236      
1237      var superclass = Motion.superclass;
1238      var proto = Motion.prototype;
1239  
1240      proto.patterns.points = /^points$/i;
1241      
1242      proto.setAttribute = function(attr, val, unit) {
1243          if (  this.patterns.points.test(attr) ) {
1244              unit = unit || 'px';
1245              superclass.setAttribute.call(this, 'left', val[0], unit);
1246              superclass.setAttribute.call(this, 'top', val[1], unit);
1247          } else {
1248              superclass.setAttribute.call(this, attr, val, unit);
1249          }
1250      };
1251  
1252      proto.getAttribute = function(attr) {
1253          if (  this.patterns.points.test(attr) ) {
1254              var val = [
1255                  superclass.getAttribute.call(this, 'left'),
1256                  superclass.getAttribute.call(this, 'top')
1257              ];
1258          } else {
1259              val = superclass.getAttribute.call(this, attr);
1260          }
1261  
1262          return val;
1263      };
1264  
1265      proto.doMethod = function(attr, start, end) {
1266          var val = null;
1267  
1268          if ( this.patterns.points.test(attr) ) {
1269              var t = this.method(this.currentFrame, 0, 100, this.totalFrames) / 100;                
1270              val = Y.Bezier.getPosition(this.runtimeAttributes[attr], t);
1271          } else {
1272              val = superclass.doMethod.call(this, attr, start, end);
1273          }
1274          return val;
1275      };
1276  
1277      proto.setRuntimeAttribute = function(attr) {
1278          if ( this.patterns.points.test(attr) ) {
1279              var el = this.getEl();
1280              var attributes = this.attributes;
1281              var start;
1282              var control = attributes['points']['control'] || [];
1283              var end;
1284              var i, len;
1285              
1286              if (control.length > 0 && !(control[0] instanceof Array) ) { // could be single point or array of points
1287                  control = [control];
1288              } else { // break reference to attributes.points.control
1289                  var tmp = []; 
1290                  for (i = 0, len = control.length; i< len; ++i) {
1291                      tmp[i] = control[i];
1292                  }
1293                  control = tmp;
1294              }
1295  
1296              if (Y.Dom.getStyle(el, 'position') == 'static') { // default to relative
1297                  Y.Dom.setStyle(el, 'position', 'relative');
1298              }
1299      
1300              if ( isset(attributes['points']['from']) ) {
1301                  Y.Dom.setXY(el, attributes['points']['from']); // set position to from point
1302              } 
1303              else { Y.Dom.setXY( el, Y.Dom.getXY(el) ); } // set it to current position
1304              
1305              start = this.getAttribute('points'); // get actual top & left
1306              
1307              // TO beats BY, per SMIL 2.1 spec
1308              if ( isset(attributes['points']['to']) ) {
1309                  end = translateValues.call(this, attributes['points']['to'], start);
1310                  
1311                  var pageXY = Y.Dom.getXY(this.getEl());
1312                  for (i = 0, len = control.length; i < len; ++i) {
1313                      control[i] = translateValues.call(this, control[i], start);
1314                  }
1315  
1316                  
1317              } else if ( isset(attributes['points']['by']) ) {
1318                  end = [ start[0] + attributes['points']['by'][0], start[1] + attributes['points']['by'][1] ];
1319                  
1320                  for (i = 0, len = control.length; i < len; ++i) {
1321                      control[i] = [ start[0] + control[i][0], start[1] + control[i][1] ];
1322                  }
1323              }
1324  
1325              this.runtimeAttributes[attr] = [start];
1326              
1327              if (control.length > 0) {
1328                  this.runtimeAttributes[attr] = this.runtimeAttributes[attr].concat(control); 
1329              }
1330  
1331              this.runtimeAttributes[attr][this.runtimeAttributes[attr].length] = end;
1332          }
1333          else {
1334              superclass.setRuntimeAttribute.call(this, attr);
1335          }
1336      };
1337      
1338      var translateValues = function(val, start) {
1339          var pageXY = Y.Dom.getXY(this.getEl());
1340          val = [ val[0] - pageXY[0] + start[0], val[1] - pageXY[1] + start[1] ];
1341  
1342          return val; 
1343      };
1344      
1345      var isset = function(prop) {
1346          return (typeof prop !== 'undefined');
1347      };
1348  
1349      Y.Motion = Motion;
1350  })();
1351  (function() {
1352  /**
1353   * Anim subclass for scrolling elements to a position defined by the "scroll"
1354   * member of "attributes".  All "scroll" members are arrays with x, y scroll positions.
1355   * <p>Usage: <code>var myAnim = new YAHOO.util.Scroll(el, { scroll: { to: [0, 800] } }, 1, YAHOO.util.Easing.easeOut);</code></p>
1356   * @class Scroll
1357   * @namespace YAHOO.util
1358   * @requires YAHOO.util.Anim
1359   * @requires YAHOO.util.AnimMgr
1360   * @requires YAHOO.util.Easing
1361   * @requires YAHOO.util.Bezier
1362   * @requires YAHOO.util.Dom
1363   * @requires YAHOO.util.Event
1364   * @requires YAHOO.util.CustomEvent 
1365   * @extends YAHOO.util.ColorAnim
1366   * @constructor
1367   * @param {String or HTMLElement} el Reference to the element that will be animated
1368   * @param {Object} attributes The attribute(s) to be animated.  
1369   * Each attribute is an object with at minimum a "to" or "by" member defined.  
1370   * Additional optional members are "from" (defaults to current value), "units" (defaults to "px").  
1371   * All attribute names use camelCase.
1372   * @param {Number} duration (optional, defaults to 1 second) Length of animation (frames or seconds), defaults to time-based
1373   * @param {Function} method (optional, defaults to YAHOO.util.Easing.easeNone) Computes the values that are applied to the attributes per frame (generally a YAHOO.util.Easing method)
1374   */
1375      var Scroll = function(el, attributes, duration,  method) {
1376          if (el) { // dont break existing subclasses not using YAHOO.extend
1377              Scroll.superclass.constructor.call(this, el, attributes, duration, method);
1378          }
1379      };
1380  
1381      Scroll.NAME = 'Scroll';
1382  
1383      // shorthand
1384      var Y = YAHOO.util;
1385      YAHOO.extend(Scroll, Y.ColorAnim);
1386      
1387      var superclass = Scroll.superclass;
1388      var proto = Scroll.prototype;
1389  
1390      proto.doMethod = function(attr, start, end) {
1391          var val = null;
1392      
1393          if (attr == 'scroll') {
1394              val = [
1395                  this.method(this.currentFrame, start[0], end[0] - start[0], this.totalFrames),
1396                  this.method(this.currentFrame, start[1], end[1] - start[1], this.totalFrames)
1397              ];
1398              
1399          } else {
1400              val = superclass.doMethod.call(this, attr, start, end);
1401          }
1402          return val;
1403      };
1404  
1405      proto.getAttribute = function(attr) {
1406          var val = null;
1407          var el = this.getEl();
1408          
1409          if (attr == 'scroll') {
1410              val = [ el.scrollLeft, el.scrollTop ];
1411          } else {
1412              val = superclass.getAttribute.call(this, attr);
1413          }
1414          
1415          return val;
1416      };
1417  
1418      proto.setAttribute = function(attr, val, unit) {
1419          var el = this.getEl();
1420          
1421          if (attr == 'scroll') {
1422              el.scrollLeft = val[0];
1423              el.scrollTop = val[1];
1424          } else {
1425              superclass.setAttribute.call(this, attr, val, unit);
1426          }
1427      };
1428  
1429      Y.Scroll = Scroll;
1430  })();
1431  YAHOO.register("animation", YAHOO.util.Anim, {version: "2.9.0", build: "2800"});
1432  
1433  }, '2.9.0' ,{"requires": ["yui2-yahoo", "yui2-dom", "yui2-event"]});