AutorÃa | Ultima modificación | Ver Log |
YUI.add('widget-anim', function (Y, NAME) {/*** Provides a plugin which can be used to animate widget visibility changes.** @module widget-anim*/var BOUNDING_BOX = "boundingBox",HOST = "host",NODE = "node",OPACITY = "opacity",EMPTY_STR = "",VISIBLE = "visible",DESTROY = "destroy",HIDDEN = "hidden",RENDERED = "rendered",START = "start",END = "end",DURATION = "duration",ANIM_SHOW = "animShow",ANIM_HIDE = "animHide",_UI_SET_VISIBLE = "_uiSetVisible",ANIM_SHOW_CHANGE = "animShowChange",ANIM_HIDE_CHANGE = "animHideChange";/*** A plugin class which can be used to animate widget visibility changes.** @class WidgetAnim* @extends Plugin.Base* @namespace Plugin*/function WidgetAnim(config) {WidgetAnim.superclass.constructor.apply(this, arguments);}/*** The namespace for the plugin. This will be the property on the widget, which will* reference the plugin instance, when it's plugged in.** @property NS* @static* @type String* @default "anim"*/WidgetAnim.NS = "anim";/*** The NAME of the WidgetAnim class. Used to prefix events generated* by the plugin class.** @property NAME* @static* @type String* @default "pluginWidgetAnim"*/WidgetAnim.NAME = "pluginWidgetAnim";/*** Pre-Packaged Animation implementations, which can be used for animShow and animHide attribute* values.** @property ANIMATIONS* @static* @type Object* @default "pluginWidgetAnim"*/WidgetAnim.ANIMATIONS = {fadeIn : function() {var widget = this.get(HOST),boundingBox = widget.get(BOUNDING_BOX),anim = new Y.Anim({node: boundingBox,to: { opacity: 1 },duration: this.get(DURATION)});// Set initial opacity, to avoid initial flickerif (!widget.get(VISIBLE)) {boundingBox.setStyle(OPACITY, 0);}// Clean up, on destroy. Where supported, remove// opacity set using style. Else make 100% opaqueanim.on(DESTROY, function() {this.get(NODE).setStyle(OPACITY, (Y.UA.ie) ? 1 : EMPTY_STR);});return anim;},fadeOut : function() {return new Y.Anim({node: this.get(HOST).get(BOUNDING_BOX),to: { opacity: 0 },duration: this.get(DURATION)});}};/*** Static property used to define the default attribute* configuration for the plugin.** @property ATTRS* @type Object* @static*/WidgetAnim.ATTRS = {/*** Default duration in seconds. Used as the default duration for the default animation implementations** @attribute duration* @type Number* @default 0.2 (seconds*/duration : {value: 0.2},/*** Default animation instance used for showing the widget (opacity fade-in)** @attribute animShow* @type Anim* @default WidgetAnim.ANIMATIONS.fadeIn*/animShow : {valueFn: WidgetAnim.ANIMATIONS.fadeIn},/*** Default animation instance used for hiding the widget (opacity fade-out)** @attribute animHide* @type Anim* @default WidgetAnim.ANIMATIONS.fadeOut*/animHide : {valueFn: WidgetAnim.ANIMATIONS.fadeOut}};Y.extend(WidgetAnim, Y.Plugin.Base, {/*** The initializer lifecycle implementation. Modifies the host widget's* visibililty implementation to add animation.** @method initializer* @param {Object} config The user configuration for the plugin*/initializer : function(config) {this._bindAnimShow();this._bindAnimHide();this.after(ANIM_SHOW_CHANGE, this._bindAnimShow);this.after(ANIM_HIDE_CHANGE, this._bindAnimHide);// Override default _uiSetVisible method, with custom animated methodthis.beforeHostMethod(_UI_SET_VISIBLE, this._uiAnimSetVisible);},/*** The initializer destructor implementation. Responsible for destroying the configured* animation instances.** @method destructor*/destructor : function() {this.get(ANIM_SHOW).destroy();this.get(ANIM_HIDE).destroy();},/*** The injected method used to override the host widget's _uiSetVisible implementation with* an animated version of the same.** <p>This method replaces the default _uiSetVisible handler* Widget provides, by injecting itself before _uiSetVisible,* and preventing the default behavior. </p>** @method _uiAnimSetVisible* @protected* @param {boolean} val true, if making the widget visible. false, if hiding it.*/_uiAnimSetVisible : function(val) {if (this.get(HOST).get(RENDERED)) {if (val) {this.get(ANIM_HIDE).stop();this.get(ANIM_SHOW).run();} else {this.get(ANIM_SHOW).stop();this.get(ANIM_HIDE).run();}return new Y.Do.Prevent();}},/*** The original Widget _uiSetVisible implementation. This currently needs to be replicated,* so it can be invoked before or after the animation starts or stops, since the original* methods is not available to the AOP implementation.** @method _uiSetVisible* @param {boolean} val true, if making the widget visible. false, if hiding it.* @private*/_uiSetVisible : function(val) {var host = this.get(HOST),hiddenClass = host.getClassName(HIDDEN);host.get(BOUNDING_BOX).toggleClass(hiddenClass, !val);},/*** Binds a listener to invoke the original visibility handling when the animShow animation is started** @method _bindAnimShow* @private*/_bindAnimShow : function() {// Setup original visibility handling (for show) before starting to animatethis.get(ANIM_SHOW).on(START,Y.bind(function() {this._uiSetVisible(true);}, this));},/*** Binds a listener to invoke the original visibility handling when the animHide animation is complete** @method _bindAnimHide* @private*/_bindAnimHide : function() {// Setup original visibility handling (for hide) after completing animationthis.get(ANIM_HIDE).after(END,Y.bind(function() {this._uiSetVisible(false);}, this));}});Y.namespace("Plugin").WidgetAnim = WidgetAnim;}, '3.18.1', {"requires": ["anim-base", "plugin", "widget"]});