ReplyWidget: Document all methods

Change-Id: Iab509a7605c3b8e25bcc20fb7176fed23409aed4
This commit is contained in:
Ed Sanders 2021-12-20 15:58:01 +00:00
parent fe18f5ba22
commit 640638b1dc
3 changed files with 111 additions and 3 deletions

View file

@ -274,6 +274,14 @@ OO.inheritClass( ReplyWidget, OO.ui.Widget );
/* Methods */ /* Methods */
/**
* Create the widget for the reply body
*
* The body widget should implement #setReadOnly, #pushPending and #popPending
*
* @method
* @return {OO.ui.Widget}
*/
ReplyWidget.prototype.createReplyBodyWidget = null; ReplyWidget.prototype.createReplyBodyWidget = null;
/** /**
@ -285,10 +293,28 @@ ReplyWidget.prototype.createReplyBodyWidget = null;
*/ */
ReplyWidget.prototype.focus = null; ReplyWidget.prototype.focus = null;
/**
* Get value of reply body, HTML or wikitext
*
* @method
* @return {string}
*/
ReplyWidget.prototype.getValue = null; ReplyWidget.prototype.getValue = null;
/**
* Check if the reply widget is empy
*
* @method
* @return {boolean}
*/
ReplyWidget.prototype.isEmpty = null; ReplyWidget.prototype.isEmpty = null;
/**
* Get the current input mode of the reply widget, 'source' or 'visual'
*
* @method
* @return {string}
*/
ReplyWidget.prototype.getMode = null; ReplyWidget.prototype.getMode = null;
/** /**
@ -518,6 +544,9 @@ ReplyWidget.prototype.setup = function ( data ) {
return this; return this;
}; };
/**
* Perform additional actions once the widget has been setup as is ready for input
*/
ReplyWidget.prototype.afterSetup = function () { ReplyWidget.prototype.afterSetup = function () {
// Init preview and button state // Init preview and button state
this.onInputChange(); this.onInputChange();
@ -602,6 +631,12 @@ ReplyWidget.prototype.teardown = function ( abandoned ) {
return this; return this;
}; };
/**
* Handle changes to the watch state of the page
*
* @param {jQuery.Event} e Event
* @param {string} actionPerformed Watch action taken
*/
ReplyWidget.prototype.onWatchToggle = function ( e, actionPerformed ) { ReplyWidget.prototype.onWatchToggle = function ( e, actionPerformed ) {
var widget = this; var widget = this;
this.checkboxesPromise.then( function ( checkboxes ) { this.checkboxesPromise.then( function ( checkboxes ) {
@ -615,6 +650,13 @@ ReplyWidget.prototype.onWatchToggle = function ( e, actionPerformed ) {
} ); } );
}; };
/**
* Handle key down events anywhere in the reply widget
*
* @param {boolean} isMultiline The current input is multiline
* @param {jQuery.Event} e Key down event
* @return {boolean} Return false to prevent default event
*/
ReplyWidget.prototype.onKeyDown = function ( isMultiline, e ) { ReplyWidget.prototype.onKeyDown = function ( isMultiline, e ) {
if ( e.which === OO.ui.Keys.ESCAPE ) { if ( e.which === OO.ui.Keys.ESCAPE ) {
this.tryTeardown(); this.tryTeardown();
@ -629,6 +671,9 @@ ReplyWidget.prototype.onKeyDown = function ( isMultiline, e ) {
} }
}; };
/**
* Handle input change events anywhere in the reply widget
*/
ReplyWidget.prototype.onInputChange = function () { ReplyWidget.prototype.onInputChange = function () {
this.updateButtons(); this.updateButtons();
this.storage.set( this.storagePrefix + '/saveable', this.isEmpty() ? '' : '1' ); this.storage.set( this.storagePrefix + '/saveable', this.isEmpty() ? '' : '1' );
@ -715,11 +760,19 @@ ReplyWidget.prototype.preparePreview = function ( wikitext ) {
} ); } );
}; };
/**
* Update buttons when widget state has changed
*/
ReplyWidget.prototype.updateButtons = function () { ReplyWidget.prototype.updateButtons = function () {
this.replyButton.setDisabled( this.isEmpty() ); this.replyButton.setDisabled( this.isEmpty() );
}; };
ReplyWidget.prototype.onFirstTransaction = function () { /**
* Handle the first change in the reply widget
*
* Currently only the first change in the body, used for logging.
*/
ReplyWidget.prototype.onFirstChange = function () {
logger( { action: 'firstChange' } ); logger( { action: 'firstChange' } );
}; };
@ -771,6 +824,9 @@ ReplyWidget.prototype.onUnload = function () {
} ); } );
}; };
/**
* Handle clicks on the reply button
*/
ReplyWidget.prototype.onReplyClick = function () { ReplyWidget.prototype.onReplyClick = function () {
var widget = this; var widget = this;

View file

@ -55,6 +55,9 @@ OO.inheritClass( ReplyWidgetPlain, require( 'ext.discussionTools.ReplyWidget' )
/* Methods */ /* Methods */
/**
* @inheritdoc
*/
ReplyWidgetPlain.prototype.createReplyBodyWidget = function ( config ) { ReplyWidgetPlain.prototype.createReplyBodyWidget = function ( config ) {
var textInput = new OO.ui.MultilineTextInputWidget( $.extend( { var textInput = new OO.ui.MultilineTextInputWidget( $.extend( {
rows: 3, rows: 3,
@ -74,12 +77,18 @@ ReplyWidgetPlain.prototype.createReplyBodyWidget = function ( config ) {
return textInput; return textInput;
}; };
/**
* @inheritdoc
*/
ReplyWidgetPlain.prototype.focus = function () { ReplyWidgetPlain.prototype.focus = function () {
this.replyBodyWidget.focus(); this.replyBodyWidget.focus();
return this; return this;
}; };
/**
* @inheritdoc
*/
ReplyWidgetPlain.prototype.clear = function () { ReplyWidgetPlain.prototype.clear = function () {
this.replyBodyWidget.setValue( '' ); this.replyBodyWidget.setValue( '' );
@ -89,14 +98,23 @@ ReplyWidgetPlain.prototype.clear = function () {
ReplyWidgetPlain.super.prototype.clear.apply( this, arguments ); ReplyWidgetPlain.super.prototype.clear.apply( this, arguments );
}; };
/**
* @inheritdoc
*/
ReplyWidgetPlain.prototype.isEmpty = function () { ReplyWidgetPlain.prototype.isEmpty = function () {
return utils.htmlTrim( this.replyBodyWidget.getValue() ) === ''; return utils.htmlTrim( this.replyBodyWidget.getValue() ) === '';
}; };
/**
* @inheritdoc
*/
ReplyWidgetPlain.prototype.getMode = function () { ReplyWidgetPlain.prototype.getMode = function () {
return 'source'; return 'source';
}; };
/**
* @inheritdoc
*/
ReplyWidgetPlain.prototype.onInputChange = function () { ReplyWidgetPlain.prototype.onInputChange = function () {
// Parent method // Parent method
ReplyWidgetPlain.super.prototype.onInputChange.apply( this, arguments ); ReplyWidgetPlain.super.prototype.onInputChange.apply( this, arguments );
@ -105,6 +123,9 @@ ReplyWidgetPlain.prototype.onInputChange = function () {
this.storage.set( this.storagePrefix + '/body', wikitext ); this.storage.set( this.storagePrefix + '/body', wikitext );
}; };
/**
* @inheritdoc
*/
ReplyWidgetPlain.prototype.setup = function ( data ) { ReplyWidgetPlain.prototype.setup = function ( data ) {
var autosaveValue = this.storage.get( this.storagePrefix + '/body' ); var autosaveValue = this.storage.get( this.storagePrefix + '/body' );
@ -120,13 +141,16 @@ ReplyWidgetPlain.prototype.setup = function ( data ) {
this.replyBodyWidget.setValue( data.value || autosaveValue ); this.replyBodyWidget.setValue( data.value || autosaveValue );
// needs to bind after the initial setValue: // needs to bind after the initial setValue:
this.replyBodyWidget.once( 'change', this.onFirstTransaction.bind( this ) ); this.replyBodyWidget.once( 'change', this.onFirstChange.bind( this ) );
this.afterSetup(); this.afterSetup();
return this; return this;
}; };
/**
* @inheritdoc
*/
ReplyWidgetPlain.prototype.teardown = function () { ReplyWidgetPlain.prototype.teardown = function () {
this.replyBodyWidget.disconnect( this ); this.replyBodyWidget.disconnect( this );
this.replyBodyWidget.off( 'change' ); this.replyBodyWidget.off( 'change' );
@ -135,6 +159,9 @@ ReplyWidgetPlain.prototype.teardown = function () {
return ReplyWidgetPlain.super.prototype.teardown.call( this ); return ReplyWidgetPlain.super.prototype.teardown.call( this );
}; };
/**
* @inheritdoc
*/
ReplyWidgetPlain.prototype.getValue = function () { ReplyWidgetPlain.prototype.getValue = function () {
return this.replyBodyWidget.getValue(); return this.replyBodyWidget.getValue();
}; };

View file

@ -18,6 +18,7 @@ require( './dt-ve/dt.ce.PingNode.js' );
* @param {CommentItem} comment * @param {CommentItem} comment
* @param {CommentDetails} commentDetails * @param {CommentDetails} commentDetails
* @param {Object} [config] * @param {Object} [config]
* @param {string} [config.mode] Default edit mode, 'source' or 'visual'
*/ */
function ReplyWidgetVisual( commentController, comment, commentDetails, config ) { function ReplyWidgetVisual( commentController, comment, commentDetails, config ) {
this.defaultMode = config.mode; this.defaultMode = config.mode;
@ -35,12 +36,18 @@ OO.inheritClass( ReplyWidgetVisual, require( 'ext.discussionTools.ReplyWidget' )
/* Methods */ /* Methods */
/**
* @inheritdoc
*/
ReplyWidgetVisual.prototype.createReplyBodyWidget = function ( config ) { ReplyWidgetVisual.prototype.createReplyBodyWidget = function ( config ) {
return new CommentTargetWidget( this, $.extend( { return new CommentTargetWidget( this, $.extend( {
defaultMode: this.defaultMode defaultMode: this.defaultMode
}, config ) ); }, config ) );
}; };
/**
* @inheritdoc
*/
ReplyWidgetVisual.prototype.getValue = function () { ReplyWidgetVisual.prototype.getValue = function () {
if ( this.getMode() === 'source' ) { if ( this.getMode() === 'source' ) {
return this.replyBodyWidget.target.getSurface().getModel().getDom(); return this.replyBodyWidget.target.getSurface().getModel().getDom();
@ -49,6 +56,9 @@ ReplyWidgetVisual.prototype.getValue = function () {
} }
}; };
/**
* @inheritdoc
*/
ReplyWidgetVisual.prototype.clear = function () { ReplyWidgetVisual.prototype.clear = function () {
this.replyBodyWidget.clear(); this.replyBodyWidget.clear();
@ -58,17 +68,26 @@ ReplyWidgetVisual.prototype.clear = function () {
ReplyWidgetVisual.super.prototype.clear.apply( this, arguments ); ReplyWidgetVisual.super.prototype.clear.apply( this, arguments );
}; };
/**
* @inheritdoc
*/
ReplyWidgetVisual.prototype.isEmpty = function () { ReplyWidgetVisual.prototype.isEmpty = function () {
var surface = this.replyBodyWidget.target.getSurface(); var surface = this.replyBodyWidget.target.getSurface();
return !( surface && surface.getModel().getDocument().data.hasContent() ); return !( surface && surface.getModel().getDocument().data.hasContent() );
}; };
/**
* @inheritdoc
*/
ReplyWidgetVisual.prototype.getMode = function () { ReplyWidgetVisual.prototype.getMode = function () {
return this.replyBodyWidget.target.getSurface() ? return this.replyBodyWidget.target.getSurface() ?
this.replyBodyWidget.target.getSurface().getMode() : this.replyBodyWidget.target.getSurface().getMode() :
this.defaultMode; this.defaultMode;
}; };
/**
* @inheritdoc
*/
ReplyWidgetVisual.prototype.setup = function ( data ) { ReplyWidgetVisual.prototype.setup = function ( data ) {
var widget = this, var widget = this,
target = this.replyBodyWidget.target; target = this.replyBodyWidget.target;
@ -98,7 +117,7 @@ ReplyWidgetVisual.prototype.setup = function ( data ) {
widget.afterSetup(); widget.afterSetup();
// This needs to bind after surfaceReady so any initial population doesn't trigger it early: // This needs to bind after surfaceReady so any initial population doesn't trigger it early:
widget.replyBodyWidget.once( 'change', widget.onFirstTransaction.bind( widget ) ); widget.replyBodyWidget.once( 'change', widget.onFirstChange.bind( widget ) );
} ); } );
// Parent method // Parent method
@ -113,6 +132,9 @@ ReplyWidgetVisual.prototype.setup = function ( data ) {
return this; return this;
}; };
/**
* @inheritdoc
*/
ReplyWidgetVisual.prototype.teardown = function () { ReplyWidgetVisual.prototype.teardown = function () {
this.replyBodyWidget.disconnect( this ); this.replyBodyWidget.disconnect( this );
this.replyBodyWidget.off( 'change' ); this.replyBodyWidget.off( 'change' );
@ -121,6 +143,9 @@ ReplyWidgetVisual.prototype.teardown = function () {
return ReplyWidgetVisual.super.prototype.teardown.call( this ); return ReplyWidgetVisual.super.prototype.teardown.call( this );
}; };
/**
* @inheritdoc
*/
ReplyWidgetVisual.prototype.focus = function () { ReplyWidgetVisual.prototype.focus = function () {
var targetWidget = this.replyBodyWidget; var targetWidget = this.replyBodyWidget;
setTimeout( function () { setTimeout( function () {