widget-position-ext.js revision 2683a70401c741ea323f348344c2dcac62699992
2b372d7f27a89b31208fc8c7db673a8d45b33747TrippYUI.add('widget-position-ext', function(Y) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp/**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Provides extended/advanced XY positioning support for Widgets, through an extension.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * It builds on top of the widget-position module, to provide alignmentment and centering support.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Future releases aim to add constrained and fixed positioning support.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @module widget-position-ext
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp var L = Y.Lang,
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp ALIGN = "align",
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp BINDUI = "bindUI",
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp SYNCUI = "syncUI",
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp OFFSET_WIDTH = "offsetWidth",
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp OFFSET_HEIGHT = "offsetHeight",
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp VIEWPORT_REGION = "viewportRegion",
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp REGION = "region",
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp AlignChange = "alignChange";
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Widget extension, which can be used to add extended XY positioning support to the base Widget class,
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * through the <a href="Base.html#method_build">Base.build</a> method.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @class WidgetPositionExt
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @param {Object} User configuration object
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp function PositionExt(config) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp Y.after(this._syncUIPosExtras, this, SYNCUI);
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp Y.after(this._bindUIPosExtras, this, BINDUI);
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp }
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Static property used to define the default attribute
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * configuration introduced by WidgetPositionExt.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @property WidgetPositionExt.ATTRS
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @type Object
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @static
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp PositionExt.ATTRS = {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @attribute align
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @type Object, with the following properties
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * <dl>
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * <dd>node</dd>
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * <dt>The node to which the Widget is to be aligned. If set to null, the Widget is aligned to the Viewport</dt>
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * <dd>points</dd>
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * <dt>The 2 points to align. Supported alignment points are defined
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * as static properties on WidgetPositionExt, e.g. <code>WidgetPositionExt.TR</code>.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * e.g. <code>[WidgetPositionExt.TR, WidgetPositionExt.TL]</code> aligns the Top Right of the Widget with the
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Top Left of the node/viewport, and <code>[WidgetPositionExt.CC, WidgetPositionExt.TC] aligns the center of the
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Widget with the Top Center of the node/viewport.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * </dt>
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * </dl>
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @default null
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @description Extended positioning support to align the Widget with a node on the page, or with the viewport
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp align: {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp value:null
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp },
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @attribute centered
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @type {boolean | node}
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @default false
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @description A convenience attribute, which can be used as a shortcut for the align attribute.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * If set to true, the Widget is centered in the viewport. If set to a node reference or valid selector string,
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * the Widget will be centered within the node. If set the false, no center positioning is applied.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp centered: {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp set: function(val) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp return this._setAlignCenter(val);
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp },
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp value:false
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp }
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp };
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Constant used to specify the top-left corner for alignment
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @property WidgetPositionExt.TL
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @type String
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @static
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @value "tl"
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp PositionExt.TL = "tl";
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Constant used to specify the top-right corner for alignment
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @property WidgetPositionExt.TR
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @type String
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @static
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @value "tr"
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp PositionExt.TR = "tr";
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Constant used to specify the bottom-left corner for alignment
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @property WidgetPositionExt.BL
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @type String
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @static
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @value "bl"
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp PositionExt.BL = "bl";
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Constant used to specify the bottom-right corner for alignment
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @property WidgetPositionExt.BR
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @type String
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @static
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @value "br"
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp PositionExt.BR = "br";
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Constant used to specify the top edge-center point for alignment
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @property WidgetPositionExt.TC
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @type String
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @static
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @value "tc"
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp PositionExt.TC = "tc";
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Constant used to specify the right edge, center point for alignment
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @property WidgetPositionExt.RC
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @type String
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @static
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @value "rc"
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp PositionExt.RC = "rc";
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Constant used to specify the bottom edge, center point for alignment
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @property WidgetPositionExt.BC
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @type String
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @static
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @value "bc"
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp PositionExt.BC = "bc";
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Constant used to specify the left edge, center point for alignment
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @property WidgetPositionExt.LC
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @type String
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @static
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @value "lc"
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp PositionExt.LC = "lc";
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Constant used to specify the center of widget/node/viewport for alignment
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @property WidgetPositionExt.CC
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @type String
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @static
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @value "cc"
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp PositionExt.CC = "cc";
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp PositionExt.prototype = {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Synchronizes the UI to match the Widgets extended positioning state.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * This method in invoked after syncUI is invoked for the Widget class
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * using YUI's aop infrastructure.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @method _syncUIPosExtras
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @protected
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp _syncUIPosExtras : function() {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp var align = this.get(ALIGN);
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp if (align) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp this._uiSetAlign(align.node, align.points);
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp }
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp },
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Binds event listeners responsible for updating the UI state in response to
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Widget extended positioning related state changes.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * <p>
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * This method is invoked after bindUI is invoked for the Widget class
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * using YUI's aop infrastructure.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * </p>
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @method _bindUIStack
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @protected
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp _bindUIPosExtras : function() {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp this.after(AlignChange, this._afterAlignChange);
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp },
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Default setter for center attribute changes. Sets up the appropriate value, and passes
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * it through the to the align attribute.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @method _setAlignCenter
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @protected
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @param {boolean | node} The attribute value being set.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @return {Number} The attribute value being set.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp _setAlignCenter : function(val) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp if (val) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp this.set(ALIGN, {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp node: val === true ? null : val,
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp points: [PositionExt.CC, PositionExt.CC]
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp });
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp }
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp return val;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp },
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Default attribute change listener for the align attribute, responsible
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * for updating the UI, in response to attribute changes.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @method _afterAlignChange
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @protected
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @param {Event.Facade} e The event facade for the attribute change
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp _afterAlignChange : function(e) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp if (e.newVal) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp this._uiSetAlign(e.newVal.node, e.newVal.points);
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp }
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp },
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Updates the UI to reflect the align value passed in (see the align attribute documentation, for the object stucture expected)
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @method _uiSetAlign
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @protected
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @param {Node | null} The node to align to, or null to indicate the viewport
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp _uiSetAlign: function (node, points) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp if (!L.isArray(points) || points.length != 2) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp Y.fail("align: Invalid Points Arguments");
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp return;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp }
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp var nodeRegion, widgetPoint, nodePoint, xy;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp if (!node) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp nodeRegion = this._posNode.get(VIEWPORT_REGION);
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp } else {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp node = Y.Node.get(node);
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp if (node) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp nodeRegion = node.get(REGION);
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp }
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp }
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp if (nodeRegion) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp // TODO: ViewportRegion doesn't have width/height - Workaround until normalized in Node/Dom
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp nodeRegion.width = nodeRegion.width || nodeRegion.right - nodeRegion.left;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp nodeRegion.height = nodeRegion.height || nodeRegion.bottom - nodeRegion.top;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp widgetPoint = points[0];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp nodePoint = points[1];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp // TODO: Optimize KWeight - Would lookup table help?
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp switch (nodePoint) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.TL:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [nodeRegion.left, nodeRegion.top];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.TR:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [nodeRegion.right, nodeRegion.top];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.BL:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [nodeRegion.left, nodeRegion.bottom];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.BR:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [nodeRegion.right, nodeRegion.bottom];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.TC:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [nodeRegion.left + Math.floor(nodeRegion.width/2), nodeRegion.top];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.BC:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [nodeRegion.left + Math.floor(nodeRegion.width/2), nodeRegion.bottom];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.LC:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [nodeRegion.left, nodeRegion.top + Math.floor(nodeRegion.height/2)];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.RC:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [nodeRegion.right, nodeRegion.top + Math.floor(nodeRegion.height/2), widgetPoint];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.CC:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [nodeRegion.left + Math.floor(nodeRegion.width/2), nodeRegion.top + Math.floor(nodeRegion.height/2), widgetPoint];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp default:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp }
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp if (xy) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp this._doAlign(widgetPoint, xy[0], xy[1]);
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp }
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp }
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp },
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Helper method, used to align the given point on the widget, with the XY page co-ordinates provided.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @method _doAlign
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @private
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @param {String} widgetPoint Supported point constant (e.g. WidgetPositionExt.TL)
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @param {Number} x X page co-ordinate to align to
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @param {Number} y Y page co-ordinate to align to
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp _doAlign : function(widgetPoint, x, y) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp var widgetNode = this._posNode,
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp switch (widgetPoint) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.TL:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [x, y];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.TR:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [x - widgetNode.get(OFFSET_WIDTH), y];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.BL:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [x, y - widgetNode.get(OFFSET_HEIGHT)];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.BR:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [x - widgetNode.get(OFFSET_WIDTH), y - widgetNode.get(OFFSET_HEIGHT)];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.TC:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [x - (widgetNode.get(OFFSET_WIDTH)/2), y];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.BC:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [x - (widgetNode.get(OFFSET_WIDTH)/2), y - widgetNode.get(OFFSET_HEIGHT)];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.LC:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [x, y - (widgetNode.get(OFFSET_HEIGHT)/2)];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.RC:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [(x - widgetNode.get(OFFSET_WIDTH)), y - (widgetNode.get(OFFSET_HEIGHT)/2)];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp case PositionExt.CC:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp xy = [x - (widgetNode.get(OFFSET_WIDTH)/2), y - (widgetNode.get(OFFSET_HEIGHT)/2)];
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp default:
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp break;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp }
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp if (xy) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp this.move(xy);
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp }
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp },
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Aligns the Widget to the provided node (or viewport) using the provided
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * points. The method can be invoked directly, however it will result in
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * the align attribute being out of sync with current position of the of Widget.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @method align
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @param {Node | String | null} node A reference (or selector string) for the Node which with the Widget is to be aligned.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * If null is passed in, the Widget will be aligned with the viewport.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @param {Array[2]} points A two element array, specifying the points on the Widget and node/viewport which need to be aligned.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * The first entry is the point on the Widget, and the second entry is the point on the node/viewport which need to align.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Valid point references are defined as static constants on the WidgetPositionExt class.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * e.g. [WidgetPositionExt.TL, WidgetPositionExt.TR] will align the top-left corner of the Widget with the top-right corner of the node/viewport.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp align: function (node, points) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp this.set(ALIGN, {node: node, points:points});
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp },
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp /**
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * Centers the container in the viewport, or if a node is passed in,
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * the node.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp *
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @method centered
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * @param {Node | String} node Optional. A node reference or selector string defining the node
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * inside which the Widget is to be centered. If not passed in, the Widget will be centered in the
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp * viewport.
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp */
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp centered: function (node) {
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp this.align(node, [PositionExt.CC, PositionExt.CC]);
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp }
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp };
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp Y.WidgetPositionExt = PositionExt;
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp}, '@VERSION@' ,{requires:['widget', 'widget-position']});
2b372d7f27a89b31208fc8c7db673a8d45b33747Tripp