mediawiki-extensions-Visual.../modules/ve/ui/widgets/ve.ui.TextInputMenuWidget.js
Moriel Schottlender 12372b41c9 RTL Fix for Category & Suggestion Popups
Flipped the generated positions of the MWCategoryPopupWidget and the
suggestion popup in the TextInputMenuWidget. The RTL position within
TextInputMenuWidget is only adjusted if the popup appears inside another
frame. This fix also corrects the suggestion popup positions in general
when inside another frame.

Bug: 51490
Bug: 51828

Change-Id: I83436d50a4a0596fdae9526c3fc2804cf880a530
2013-07-23 15:43:06 -07:00

111 lines
2.6 KiB
JavaScript

/*!
* VisualEditor UserInterface TextInputMenuWidget class.
*
* @copyright 2011-2013 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
/**
* Creates an ve.ui.TextInputMenuWidget object.
*
* @class
* @extends ve.ui.MenuWidget
*
* @constructor
* @param {ve.ui.TextInputWidget} input Text input widget to provide menu for
* @param {Object} [config] Config options
* @cfg {jQuery} [$container=input.$] Element to render menu under
*/
ve.ui.TextInputMenuWidget = function VeUiTextInputMenuWidget( input, config ) {
// Parent constructor
ve.ui.MenuWidget.call( this, config );
// Properties
this.input = input;
this.$container = config.$container || this.input.$;
this.onWindowResizeHandler = ve.bind( this.onWindowResize, this );
// Initialization
this.$.addClass( 've-ui-textInputMenuWidget' );
};
/* Inheritance */
ve.inheritClass( ve.ui.TextInputMenuWidget, ve.ui.MenuWidget );
/* Methods */
/**
* Handle window resize event.
*
* @method
* @param {jQuery.Event} e Window resize event
*/
ve.ui.TextInputMenuWidget.prototype.onWindowResize = function () {
this.position();
};
/**
* Shows the menu.
*
* @method
* @chainable
*/
ve.ui.TextInputMenuWidget.prototype.show = function () {
// Parent method
ve.ui.MenuWidget.prototype.show.call( this );
this.position();
$( this.getElementWindow() ).on( 'resize', this.onWindowResizeHandler );
return this;
};
/**
* Hides the menu.
*
* @method
* @chainable
*/
ve.ui.TextInputMenuWidget.prototype.hide = function () {
// Parent method
ve.ui.MenuWidget.prototype.hide.call( this );
$( this.getElementWindow() ).off( 'resize', this.onWindowResizeHandler );
return this;
};
/**
* Positions the menu.
*
* @method
* @chainable
*/
ve.ui.TextInputMenuWidget.prototype.position = function () {
var frameOffset,
$container = this.$container,
dimensions = $container.offset();
// Position under input
dimensions.top += $container.height();
dimensions.width = $container.width();
// Compensate for frame position if in a differnt frame
if ( this.input.$$.frame && this.input.$$.context !== this.$[0].ownerDocument ) {
frameOffset = ve.Element.getRelativePosition(
this.input.$$.frame.$, this.$.closest( '.ve-ui-surface' )
);
dimensions.left += frameOffset.left;
dimensions.top += frameOffset.top;
} else {
// Fix for RTL (for some reason, no need to fix if the frameoffset is set)
if ( this.$.css( 'direction' ) === 'rtl' ) {
dimensions.right = this.$.parent().position().left - dimensions.width - dimensions.left;
// Erase the value for 'left':
delete dimensions.left;
}
}
this.$.css( dimensions );
return this;
};