2013-04-18 20:54:37 +00:00
|
|
|
/*!
|
|
|
|
* VisualEditor ContentEditable FocusableNode class.
|
|
|
|
*
|
|
|
|
* @copyright 2011-2013 VisualEditor Team and others; see AUTHORS.txt
|
|
|
|
* @license The MIT License (MIT); see LICENSE.txt
|
|
|
|
*/
|
|
|
|
|
|
|
|
/**
|
|
|
|
* ContentEditable resizable node.
|
|
|
|
*
|
2013-05-15 23:31:02 +00:00
|
|
|
* Focusable elements have a special treatment by ve.ce.Surface. When the user selects only a single
|
|
|
|
* node, if it is focusable, the surface will set the focusable node's focused state. Other systems,
|
|
|
|
* such as the context, may also use a focusable node's $focusable property as a hint of where the
|
|
|
|
* primary element in the node is. Typically, and by default, the primary element is the root
|
|
|
|
* element, but in some cases it may need to be configured to be a specific child element within the
|
|
|
|
* node's DOM rendering.
|
|
|
|
*
|
2013-04-18 20:54:37 +00:00
|
|
|
* @class
|
|
|
|
* @abstract
|
|
|
|
*
|
|
|
|
* @constructor
|
2013-05-15 23:31:02 +00:00
|
|
|
* @param {jQuery} [$focusable] Primary element user is focusing on
|
2013-04-18 20:54:37 +00:00
|
|
|
*/
|
2013-05-15 23:31:02 +00:00
|
|
|
ve.ce.FocusableNode = function VeCeFocusableNode( $focusable ) {
|
2013-04-18 20:54:37 +00:00
|
|
|
// Properties
|
|
|
|
this.focused = false;
|
2013-05-15 23:31:02 +00:00
|
|
|
this.$focusable = $focusable || this.$;
|
2013-04-18 20:54:37 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
/* Events */
|
|
|
|
|
|
|
|
/**
|
|
|
|
* @event focus
|
|
|
|
*/
|
|
|
|
|
|
|
|
/**
|
|
|
|
* @event blur
|
|
|
|
*/
|
|
|
|
|
|
|
|
/* Methods */
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Check if node is focused.
|
|
|
|
*
|
|
|
|
* @method
|
|
|
|
* @returns {boolean} Node is focused
|
|
|
|
*/
|
|
|
|
ve.ce.FocusableNode.prototype.isFocused = function () {
|
|
|
|
return this.focused;
|
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Set the selected state of the node.
|
|
|
|
*
|
|
|
|
* @method
|
|
|
|
* @param {boolean} value Node is focused
|
|
|
|
* @emits focus
|
|
|
|
* @emits blur
|
|
|
|
*/
|
|
|
|
ve.ce.FocusableNode.prototype.setFocused = function ( value ) {
|
|
|
|
value = !!value;
|
|
|
|
if ( this.focused !== value ) {
|
|
|
|
this.focused = value;
|
|
|
|
if ( this.focused ) {
|
|
|
|
this.emit( 'focus' );
|
|
|
|
this.$.addClass( 've-ce-node-focused' );
|
|
|
|
} else {
|
|
|
|
this.emit( 'blur' );
|
|
|
|
this.$.removeClass( 've-ce-node-focused' );
|
|
|
|
}
|
|
|
|
}
|
|
|
|
};
|