widget-autohide-debug.js revision c3db5f41661b8fee6566b38dbffeabe56e4dce12
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo MitraYUI.add('widget-autohide', function(Y) {
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra/**
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra * A widget-level extension that provides ability to hide widget when
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra * certain events occur.
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra *
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra * @module widget-modality
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra * @author eferraiuolo, tilomitra
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra * @since 3.4.0
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra */
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitravar WIDGET_AUTOHIDE = 'widgetAutohide',
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra AUTOHIDE = 'autohide',
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra CLICK_OUTSIDE = 'clickoutside',
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra FOCUS_OUTSIDE = 'focusoutside',
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra DOCUMENT = 'doc',
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra KEY = 'key',
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra PRESS_ESCAPE = 'esc',
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra BIND_UI = 'bindUI',
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra SYNC_UI = "syncUI",
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra RENDERED = "rendered",
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra BOUNDING_BOX = "boundingBox",
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra VISIBLE = "visible",
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra CHANGE = 'Change',
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra getCN = Y.ClassNameManager.getClassName;
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra/**
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * Widget extension, which can be used to autohide the widget.
c714ee41455a161bf18197074d7e205b9d03b377Tilo Mitra *
c714ee41455a161bf18197074d7e205b9d03b377Tilo Mitra * @class WidgetAutohide
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra * @param {Object} config User configuration object
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra */
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitrafunction WidgetAutohide(config) {
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra Y.after(this._bindUIAutohide, this, BIND_UI);
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra Y.after(this._syncUIAutohide, this, SYNC_UI);
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra if (this.get(RENDERED)) {
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra this._bindUIAutohide();
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra this._syncUIAutohide();
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra }
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra}
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra/**
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra* Static property used to define the default attribute
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra* configuration introduced by WidgetAutohide.
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra*
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra* @property WidgetAutohide.ATTRS
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra* @static
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra* @type Object
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra*/
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo MitraWidgetAutohide.ATTRS = {
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra /**
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * @attribute hideOn
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * @type array
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra *
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * @description An array of objects corresponding to the nodes, events, and keycodes to hide the widget on.
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * The implementer can supply an array of objects, with each object having the following properties:
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * eventName: (string, required): The eventName to listen to.
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * node: (Y.Node, optional): The Y.Node that will fire the event (defaults to the boundingBox of the widget)
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * keyCode: (string, optional): If listening for key events, specify the keyCode
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * By default, this attribute consists of one object which will cause the widget to hide if the
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * escape key is pressed.
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra */
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra hideOn: {
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra value: [
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra {
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra node: Y.one(DOCUMENT),
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra eventName: KEY,
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra keyCode: PRESS_ESCAPE
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra }
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra ],
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra validator: Y.Lang.isArray
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra }
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra};
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo MitraWidgetAutohide.prototype = {
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra // *** Instance Members *** //
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra _uiHandlesAutohide : null,
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra // *** Lifecycle Methods *** //
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra destructor : function () {
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra this._detachUIHandlesAutohide();
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra },
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra /**
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * Binds event listeners to the widget.
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * <p>
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * This method in invoked after bindUI is invoked for the Widget class
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * using YUI's aop infrastructure.
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * </p>
c714ee41455a161bf18197074d7e205b9d03b377Tilo Mitra * @method _bindUIAutohide
c714ee41455a161bf18197074d7e205b9d03b377Tilo Mitra * @protected
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra */
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra _bindUIAutohide : function () {
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra this.after(VISIBLE+CHANGE, this._afterHostVisibleChangeAutohide);
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra this.after("hideOnChange", this._afterHideOnChange);
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra },
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra /**
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra * Syncs up the widget based on its current state. In particular, removes event listeners if
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra * widget is not visible, and attaches them otherwise.
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra * <p>
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra * This method in invoked after syncUI is invoked for the Widget class
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra * using YUI's aop infrastructure.
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra * </p>
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra * @method _syncUIAutohide
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra * @protected
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra */
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra _syncUIAutohide : function () {
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra this._uiSetHostVisibleAutohide(this.get(VISIBLE));
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra },
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra // *** Private Methods *** //
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra /**
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra * Removes event listeners if widget is not visible, and attaches them otherwise.
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra *
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra * @method _uiSetHostVisibleAutohide
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra * @protected
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra */
c714ee41455a161bf18197074d7e205b9d03b377Tilo Mitra _uiSetHostVisibleAutohide : function (visible) {
c714ee41455a161bf18197074d7e205b9d03b377Tilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra if (visible) {
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra //this._attachUIHandlesAutohide();
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra Y.later(1, this, '_attachUIHandlesAutohide');
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra } else {
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra this._detachUIHandlesAutohide();
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra }
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra },
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra /**
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * Iterates through all objects in the hideOn attribute and creates event listeners.
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra *
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * @method _attachUIHandlesAutohide
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * @protected
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra */
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra _attachUIHandlesAutohide : function () {
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra if (this._uiHandlesAutohide) { return; }
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra var bb = this.get(BOUNDING_BOX),
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra hide = Y.bind(this.hide,this),
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra uiHandles = [],
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra self = this,
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra hideOn = this.get('hideOn'),
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra i = 0,
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra o = {node: undefined, ev: undefined, keyCode: undefined};
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra //push all events on which the widget should be hidden
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra for (; i < hideOn.length; i++) {
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra o.node = hideOn[i].node;
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra o.ev = hideOn[i].eventName;
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra o.keyCode = hideOn[i].keyCode;
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra //no keycode or node defined
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra if (!o.node && !o.keyCode && o.ev) {
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra uiHandles.push(bb.on(o.ev, hide));
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra }
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra //node defined, no keycode (not a keypress)
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra else if (o.node && !o.keyCode && o.ev) {
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra uiHandles.push(o.node.on(o.ev, hide));
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra }
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra //node defined, keycode defined, event defined (its a key press)
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra else if (o.node && o.keyCode && o.ev) {
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra uiHandles.push(o.node.on(o.ev, hide, o.keyCode));
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra }
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra else {
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra Y.log('The event with name "'+o.ev+'" could not be attached.');
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra }
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra }
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra this._uiHandlesAutohide = uiHandles;
897547688bb5907542df4114fc4a55979ad7ec12Tilo Mitra },
c714ee41455a161bf18197074d7e205b9d03b377Tilo Mitra
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra /**
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * Detaches all event listeners created by this extension
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra *
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * @method _detachUIHandlesAutohide
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra * @protected
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra */
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra _detachUIHandlesAutohide : function () {
853244a9af0549d584b80ac65d4fcb92de7c58bcTilo Mitra
4f4ba013cd866a655a896f39f944674d19ad1387Tilo Mitra Y.each(this._uiHandlesAutohide, function(h){
h.detach();
});
this._uiHandlesAutohide = null;
},
/**
* Default function called when the visibility of the widget changes. Determines
* whether to attach or detach event listeners based on the visibility of the widget.
*
* @method _afterHostVisibleChangeAutohide
* @protected
*/
_afterHostVisibleChangeAutohide : function (e) {
this._uiSetHostVisibleAutohide(e.newVal);
},
/**
* Default function called when hideOn Attribute is changed. Remove existing listeners and create new listeners.
*
* @method _afterHideOnChange
*/
_afterHideOnChange : function(e) {
this._detachUIHandlesAutohide();
if (this.get(VISIBLE)) {
this._attachUIHandlesAutohide();
}
}
}
Y.WidgetAutohide = WidgetAutohide;
}, '@VERSION@' ,{requires:['base-build','widget','event-outside','event-key']});