Merge "Resize focus highlights on generated content update"

This commit is contained in:
jenkins-bot 2013-06-23 05:48:45 +00:00 committed by Gerrit Code Review
commit d22053c017
2 changed files with 50 additions and 9 deletions

View file

@ -25,12 +25,29 @@ ve.ce.GeneratedContentNode = function VeCeGeneratedContentNode() {
this.onUpdate(); this.onUpdate();
}; };
/* Events */
/**
* @event setup
*/
/**
* @event teardown
*/
/**
* @event rerender
*/
/* Methods */ /* Methods */
/** /**
* Handle update events. * Handle update events.
* *
* @method * @method
* @emits setup
* @emits teardown
* @emits rerender
*/ */
ve.ce.GeneratedContentNode.prototype.onUpdate = function () { ve.ce.GeneratedContentNode.prototype.onUpdate = function () {
var doc = this.getElementDocument(), var doc = this.getElementDocument(),
@ -45,6 +62,7 @@ ve.ce.GeneratedContentNode.prototype.onUpdate = function () {
); );
if ( this.live ) { if ( this.live ) {
this.emit( 'setup' ); this.emit( 'setup' );
this.emit( 'rerender' );
} }
} else { } else {
this.startGenerating(); this.startGenerating();

View file

@ -16,7 +16,7 @@
* node's DOM rendering. * node's DOM rendering.
* *
* If your focusable node changes size and the highlight must be redrawn, call redrawHighlight(). * If your focusable node changes size and the highlight must be redrawn, call redrawHighlight().
* ResizableNode 'resize' event is already bound. * 'resize' and 'rerender' are already bound to call this.
* *
* @class * @class
* @abstract * @abstract
@ -34,7 +34,8 @@ ve.ce.FocusableNode = function VeCeFocusableNode( $focusable ) {
// Events // Events
this.connect( this, { this.connect( this, {
'setup': 'onFocusableSetup', 'setup': 'onFocusableSetup',
'resize': 'redrawHighlight' 'resize': 'onFocusableResize',
'rerender': 'onFocusableRerender'
} ); } );
}; };
@ -60,13 +61,25 @@ ve.ce.FocusableNode.prototype.onFocusableSetup = function () {
}; };
/** /**
* Notification of dimension change * Handle resize event.
* *
* @method * @method
*/ */
ve.ce.FocusableNode.prototype.redrawHighlight = function () { ve.ce.FocusableNode.prototype.onFocusableResize = function () {
this.clearHighlight(); if ( this.isFocused() ) {
this.createHighlight(); this.redrawHighlight();
}
};
/**
* Handle rerender event.
*
* @method
*/
ve.ce.FocusableNode.prototype.onFocusableRerender = function () {
if ( this.isFocused() ) {
this.redrawHighlight();
}
}; };
/** /**
@ -104,7 +117,7 @@ ve.ce.FocusableNode.prototype.setFocused = function ( value ) {
}; };
/** /**
* Creates highlight * Creates highlight.
* *
* @method * @method
*/ */
@ -113,7 +126,7 @@ ve.ce.FocusableNode.prototype.createHighlight = function () {
this.$.find( '*' ).add( this.$ ).each( this.$.find( '*' ).add( this.$ ).each(
ve.bind( function( i, element ) { ve.bind( function( i, element ) {
elementOffset = $(element).offset(); elementOffset = $( element ).offset();
this.$highlights = this.$highlights.add( this.$highlights = this.$highlights.add(
$( '<div>' ) $( '<div>' )
.css( { .css( {
@ -131,7 +144,7 @@ ve.ce.FocusableNode.prototype.createHighlight = function () {
}; };
/** /**
* Clears highlight * Clears highlight.
* *
* @method * @method
*/ */
@ -139,3 +152,13 @@ ve.ce.FocusableNode.prototype.clearHighlight = function () {
this.$highlights = $( [] ); this.$highlights = $( [] );
this.surface.replaceHighlight( null ); this.surface.replaceHighlight( null );
}; };
/**
* Redraws highlight.
*
* @method
*/
ve.ce.FocusableNode.prototype.redrawHighlight = function () {
this.clearHighlight();
this.createHighlight();
};