mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/DiscussionTools
synced 2024-11-27 17:51:09 +00:00
Wrap up the plain textbox in a ReplyWidget
Depends-On: I765d657c172d96c3b2e2ae5998083e4926a31f15 Change-Id: I3c71fc014b723b0762e2c2be2e0295c57ecfb40d
This commit is contained in:
parent
cf32465832
commit
41676098fa
|
@ -60,6 +60,19 @@
|
|||
"dependencies": [
|
||||
"ext.discussionTools.parser"
|
||||
]
|
||||
},
|
||||
"ext.discussionTools.ReplyWidget": {
|
||||
"scripts": [
|
||||
"dt.ui.ReplyWidget.js"
|
||||
],
|
||||
"messages": [],
|
||||
"dependencies": [
|
||||
"ext.visualEditor.mwcore",
|
||||
"ext.visualEditor.mwwikitext",
|
||||
"ext.visualEditor.core.desktop",
|
||||
"ext.visualEditor.desktopTarget",
|
||||
"ext.visualEditor.mwextensions.desktop"
|
||||
]
|
||||
}
|
||||
},
|
||||
"QUnitTestModule": {
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
var pageComments, pageThreads, parsoidPromise, parsoidComments, parsoidDoc,
|
||||
widgetPromise = mw.loader.using( 'oojs-ui-core' );
|
||||
replyWidgetPromise = mw.loader.using( 'ext.discussionTools.ReplyWidget' );
|
||||
|
||||
/**
|
||||
* @class mw.discussionTools
|
||||
|
@ -22,6 +22,7 @@ function setupComment( comment ) {
|
|||
|
||||
$tsNode.after(
|
||||
' ',
|
||||
// TODO: i18n
|
||||
$( '<a>' ).text( 'Reply' ).on( 'click', function () {
|
||||
var newList, newListItem,
|
||||
$link = $( this );
|
||||
|
@ -30,43 +31,26 @@ function setupComment( comment ) {
|
|||
|
||||
newList = mw.dt.modifier.addListAtComment( comment );
|
||||
newListItem = mw.dt.modifier.addListItem( newList );
|
||||
// TODO: i18n
|
||||
$( newListItem ).text( 'Loading...' );
|
||||
|
||||
widgetPromise.then( function () {
|
||||
var replyWidget = new OO.ui.MultilineTextInputWidget( {
|
||||
value: 'Reply to ' + comment.author
|
||||
} ),
|
||||
replyButton = new OO.ui.ButtonWidget( {
|
||||
flags: [ 'primary', 'progressive' ],
|
||||
label: 'Reply'
|
||||
} );
|
||||
replyWidgetPromise.then( function () {
|
||||
var replyWidget = new mw.dt.ui.ReplyWidget(
|
||||
comment,
|
||||
parsoidDoc,
|
||||
{
|
||||
// TODO: Remove placeholder
|
||||
doc: '<p>Reply to ' + comment.author + '</p>',
|
||||
defaultMode: 'source'
|
||||
}
|
||||
);
|
||||
|
||||
replyButton.on( 'click', function () {
|
||||
comment.parsoidCommentPromise.then( function ( parsoidComment ) {
|
||||
var html,
|
||||
newParsoidList = mw.dt.modifier.addListAtComment( parsoidComment );
|
||||
|
||||
replyWidget.getValue().split( '\n' ).forEach( function ( line, i, arr ) {
|
||||
var lineItem = mw.dt.modifier.addListItem( newParsoidList );
|
||||
if ( i === arr.length - 1 && line.trim().slice( -4 ) !== '~~~~' ) {
|
||||
line += ' ~~~~';
|
||||
}
|
||||
lineItem.appendChild( mw.dt.modifier.createWikitextNode( line ) );
|
||||
} );
|
||||
|
||||
// TODO: We need an ArticleTargetSaver that is separate from
|
||||
// Target logic.
|
||||
html = ve.init.mw.Target.prototype.getHtml(
|
||||
parsoidComment.range.endContainer.ownerDocument
|
||||
);
|
||||
// eslint-disable-next-line
|
||||
console.log( html );
|
||||
} );
|
||||
replyWidget.on( 'cancel', function () {
|
||||
$link.show();
|
||||
replyWidget.$element.hide();
|
||||
} );
|
||||
|
||||
$( newListItem ).empty().append(
|
||||
replyWidget.$element, replyButton.$element
|
||||
);
|
||||
$( newListItem ).empty().append( replyWidget.$element );
|
||||
replyWidget.focus();
|
||||
} );
|
||||
} )
|
||||
|
@ -102,8 +86,9 @@ if ( new mw.Uri().query.dtdebug ) {
|
|||
oldId: mw.config.get( 'wgRevisionId' )
|
||||
}
|
||||
).then( function ( response ) {
|
||||
var data = response.visualeditor;
|
||||
// TODO: error handling
|
||||
parsoidDoc = ve.createDocumentFromHtml( response.visualeditor.content );
|
||||
parsoidDoc = ve.createDocumentFromHtml( data.content );
|
||||
parsoidComments = mw.dt.parser.getComments( parsoidDoc.body );
|
||||
|
||||
// getThreads build the tree structure, currently only
|
||||
|
|
83
modules/dt.ui.ReplyWidget.js
Normal file
83
modules/dt.ui.ReplyWidget.js
Normal file
|
@ -0,0 +1,83 @@
|
|||
/**
|
||||
* DiscussionTools ReplyWidget class
|
||||
*
|
||||
* @class
|
||||
* @extends OO.ui.Widget
|
||||
* @constructor
|
||||
* @param {Object} comment Parsed comment object
|
||||
* @param {HTMLDocument} parsoidDoc Parsoid document
|
||||
* @param {Object} [config] Configuration options
|
||||
*/
|
||||
mw.dt.ui.ReplyWidget = function ( comment, parsoidDoc, config ) {
|
||||
// Parent constructor
|
||||
mw.dt.ui.ReplyWidget.super.call( this, config );
|
||||
|
||||
this.comment = comment;
|
||||
this.parsoidDoc = parsoidDoc;
|
||||
|
||||
this.textWidget = new OO.ui.MultilineTextInputWidget( config );
|
||||
this.replyButton = new OO.ui.ButtonWidget( {
|
||||
flags: [ 'primary', 'progressive' ],
|
||||
label: 'Reply'
|
||||
} );
|
||||
this.cancelButton = new OO.ui.ButtonWidget( {
|
||||
flags: [ 'destructive' ],
|
||||
label: 'Cancel'
|
||||
} );
|
||||
|
||||
// Events
|
||||
this.replyButton.connect( this, { click: 'onReplyClick' } );
|
||||
this.cancelButton.connect( this, { click: [ 'emit', 'cancel' ] } );
|
||||
this.$element.on( 'keydown', this.onKeyDown.bind( this ) );
|
||||
|
||||
// Initialization
|
||||
this.$element.addClass( 'dt-ui-replyWidget' ).append(
|
||||
this.textWidget.$element,
|
||||
$( '<div>' ).addClass( 'dt-ui-replyWidget-actions' ).append(
|
||||
this.cancelButton.$element,
|
||||
this.replyButton.$element
|
||||
)
|
||||
);
|
||||
};
|
||||
|
||||
/* Inheritance */
|
||||
|
||||
OO.inheritClass( mw.dt.ui.ReplyWidget, OO.ui.Widget );
|
||||
|
||||
/* Methods */
|
||||
|
||||
mw.dt.ui.ReplyWidget.prototype.focus = function () {
|
||||
this.textWidget.focus();
|
||||
};
|
||||
|
||||
mw.dt.ui.ReplyWidget.prototype.onKeyDown = function ( e ) {
|
||||
if ( e.which === OO.ui.Keys.ESCAPE ) {
|
||||
this.emit( 'cancel' );
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
mw.dt.ui.ReplyWidget.prototype.onReplyClick = function () {
|
||||
var widget = this;
|
||||
|
||||
this.comment.parsoidCommentPromise.then( function ( parsoidComment ) {
|
||||
var html,
|
||||
newParsoidList = mw.dt.modifier.addListAtComment( parsoidComment );
|
||||
|
||||
widget.textWidget.getValue().split( '\n' ).forEach( function ( line, i, arr ) {
|
||||
var lineItem = mw.dt.modifier.addListItem( newParsoidList );
|
||||
if ( i === arr.length - 1 && line.trim().slice( -4 ) !== '~~~~' ) {
|
||||
line += ' ~~~~';
|
||||
}
|
||||
lineItem.appendChild( mw.dt.modifier.createWikitextNode( line ) );
|
||||
} );
|
||||
|
||||
// TODO: We need an ArticleTargetSaver that is separate from
|
||||
// Target logic.
|
||||
html = ve.init.mw.Target.prototype.getHtml(
|
||||
parsoidComment.range.endContainer.ownerDocument
|
||||
);
|
||||
// eslint-disable-next-line
|
||||
console.log( html );
|
||||
} );
|
||||
};
|
Loading…
Reference in a new issue