jenkins-bot has submitted this change and it was merged. ( https://gerrit.wikimedia.org/r/358022 )
Change subject: Show visual diffs on DiffPage ...................................................................... Show visual diffs on DiffPage Only shown if VisualEditorEnableDiffPage is set, or query string param 'visualdiff' is present. Currently: * All VE javascript is loaded (could be cut down to just DM code) * The entire Parsoid HTML of both revisions being compared is loaded * Both Parsoid HTML docs are parsed into VE DM trees and diffed Bug: T167508 Change-Id: I151fc9bab3d3032f50c8d11be6b54e45a06fcc34 --- M VisualEditor.hooks.php M extension.json A modules/ve-mw/init/styles/ve.init.mw.DiffPage.less A modules/ve-mw/init/ve.init.mw.DiffPage.init.js 4 files changed, 193 insertions(+), 0 deletions(-) Approvals: Tchanders: Looks good to me, approved jenkins-bot: Verified Jforrester: Looks good to me, but someone else must approve diff --git a/VisualEditor.hooks.php b/VisualEditor.hooks.php index 68b7622..ebea7ca 100644 --- a/VisualEditor.hooks.php +++ b/VisualEditor.hooks.php @@ -77,6 +77,51 @@ return true; } + public static function onDiffViewHeader( + DifferenceEngine $diff, + Revision $oldRev, + Revision $newRev + ) { + $config = ConfigFactory::getDefaultInstance()->makeConfig( 'visualeditor' ); + $output = RequestContext::getMain()->getOutput(); + + if ( + !$config->get( 'VisualEditorEnableDiffPage' ) && + $output->getRequest()->getVal( 'visualdiff' ) === null + ) { + return; + } + + $output->addModuleStyles( [ + 'ext.visualEditor.diffPage.init.styles', + 'oojs-ui.styles.icons-alerts', + 'oojs-ui.styles.icons-editing-advanced' + ] ); + $output->addModules( 'ext.visualEditor.diffPage.init' ); + $output->enableOOUI(); + $output->addHtml( + '<div class="ve-init-mw-diffPage-diffMode">' . + // Will be replaced by a ButtonSelectWidget in JS + new OOUI\ButtonGroupWidget( [ + 'items' => [ + new \OOUI\ButtonWidget( [ + 'data' => 'visual', + 'icon' => 'eye', + 'disabled' => true, + 'label' => $output->msg( 'visualeditor-savedialog-review-visual' )->plain() + ] ), + new \OOUI\ButtonWidget( [ + 'data' => 'source', + 'icon' => 'wikiText', + 'active' => true, + 'label' => $output->msg( 'visualeditor-savedialog-review-wikitext' )->plain() + ] ) + ] + ] ) . + '</div>' + ); + } + /** * Detect incompatibile browsers which we can't expect to load VE * diff --git a/extension.json b/extension.json index 54e303f..129c657 100644 --- a/extension.json +++ b/extension.json @@ -47,6 +47,7 @@ }, "VisualEditorUseChangeTagging": true, "VisualEditorEnableWikitext": false, + "VisualEditorEnableDiffPage": false, "VisualEditorUseSingleEditTab": false, "VisualEditorSingleEditTabSwitchTime": 20160101000000, "VisualEditorTabPosition": "before", @@ -124,6 +125,9 @@ ], "SkinEditSectionLinks": [ "VisualEditorHooks::onSkinEditSectionLinks" + ], + "DiffViewHeader": [ + "VisualEditorHooks::onDiffViewHeader" ], "GetBetaFeaturePreferences": [ "VisualEditorHooks::onGetBetaPreferences" @@ -1852,6 +1856,25 @@ "mobile" ] }, + "ext.visualEditor.diffPage.init.styles": { + "styles": [ + "modules/ve-mw/init/styles/ve.init.mw.DiffPage.less" + ] + }, + "ext.visualEditor.diffPage.init": { + "scripts": [ + "modules/ve-mw/init/ve.init.mw.DiffPage.init.js" + ], + "dependencies": [ + "oojs-ui", + "oojs-ui.styles.icons-alerts", + "oojs-ui.styles.icons-editing-advanced" + ], + "messages": [ + "visualeditor-savedialog-review-visual", + "visualeditor-savedialog-review-wikitext" + ] + }, "ext.visualEditor.language": { "scripts": [ "lib/ve/src/dm/annotations/ve.dm.LanguageAnnotation.js", diff --git a/modules/ve-mw/init/styles/ve.init.mw.DiffPage.less b/modules/ve-mw/init/styles/ve.init.mw.DiffPage.less new file mode 100644 index 0000000..b70284b --- /dev/null +++ b/modules/ve-mw/init/styles/ve.init.mw.DiffPage.less @@ -0,0 +1,33 @@ +/*! + * VisualEditor MediaWiki Initialization DiffPage styles. + * + * @copyright 2011-2017 VisualEditor Team and others; see AUTHORS.txt + * @license The MIT License (MIT); see LICENSE.txt + */ + +.ve-init-mw-diffPage-diffMode { + font-size: 12.8/14em; + text-align: right; + margin: 1em 0; +} + +.ve-init-mw-diffPage-loading { + clear: both; + margin: 4em auto; +} + +.ve-init-mw-diffPage-revSlider-visual { + .mw-revslider-pointer-line { + display: none !important; /* stylelint-disable-line declaration-no-important */ + } + + .mw-revslider-revision-old { + border-color: darken( #e88e89, 20% ); + background-color: #e88e89; + } + + .mw-revslider-revision-new { + border-color: darken( #7fd7c4, 20% ); + background-color: #7fd7c4; + } +} diff --git a/modules/ve-mw/init/ve.init.mw.DiffPage.init.js b/modules/ve-mw/init/ve.init.mw.DiffPage.init.js new file mode 100644 index 0000000..90a307d --- /dev/null +++ b/modules/ve-mw/init/ve.init.mw.DiffPage.init.js @@ -0,0 +1,92 @@ +/*! + * VisualEditor MediaWiki DiffPage init. + * + * @copyright 2011-2017 VisualEditor Team and others; see AUTHORS.txt + * @license The MIT License (MIT); see LICENSE.txt + */ + +( function () { + var $visualDiff, + reviewModeButtonSelect, + revCache = {}, + pageName = mw.config.get( 'wgRelevantPageName' ), + mode = 'source', + conf = mw.config.get( 'wgVisualEditorConfig' ), + pluginModules = conf.pluginModules.filter( mw.loader.getState ); + + function getModelFromResponse( response ) { + var doc, + targetClass = ve.init.mw.DesktopArticleTarget, + data = response ? ( response.visualeditor || response.visualeditoredit ) : null; + if ( data && typeof data.content === 'string' ) { + doc = targetClass.static.parseDocument( data.content, 'visual' ); + return targetClass.static.createModelFromDom( doc, 'visual' ); + } + return null; + } + + function fetchRevision( revId ) { + if ( !revCache[ revId ] ) { + revCache[ revId ] = mw.libs.ve.targetLoader.requestParsoidData( pageName, revId, 'diff' ); + } + return revCache[ revId ]; + } + + function onReviewModeButtonSelectSelect( item ) { + var oldRevPromise, newRevPromise, modulePromise, progress, + $revSlider = $( '.mw-revslider-container' ), + $wikitextDiff = $( 'table.diff[data-mw="interface"]' ), + oldId = +( new mw.Uri() ).query.oldid, + newId = mw.config.get( 'wgRevisionId' ); + + mode = item.getData(); + + if ( mode === 'visual' ) { + progress = new OO.ui.ProgressBarWidget( { classes: [ 've-init-mw-diffPage-loading' ] } ); + $wikitextDiff.addClass( 'oo-ui-element-hidden' ); + $wikitextDiff.before( progress.$element ); + oldRevPromise = fetchRevision( oldId ); + newRevPromise = fetchRevision( newId ); + // TODO: Load a smaller subset of VE for computing the visual diff + modulePromise = mw.loader.using( [ 'ext.visualEditor.desktopArticleTarget' ].concat( pluginModules ) ); + $.when( oldRevPromise, newRevPromise, modulePromise ).then( function ( oldResponse, newResponse ) { + var visualDiff, diffElement, + oldDoc = getModelFromResponse( oldResponse ), + newDoc = getModelFromResponse( newResponse ); + + // TODO: Differ expects newDoc to be derived from oldDoc and contain all its store data. + // We may want to remove that assumption from the differ? + newDoc.getStore().merge( oldDoc.getStore() ); + visualDiff = new ve.dm.VisualDiff( oldDoc, newDoc ); + diffElement = new ve.ui.DiffElement( visualDiff, { classes: [ 've-init-mw-diffPage-diff' ] } ); + + progress.$element.remove(); + $wikitextDiff.before( diffElement.$element ); + $visualDiff = diffElement.$element; + $revSlider.addClass( 've-init-mw-diffPage-revSlider-visual' ); + + diffElement.positionDescriptions(); + } ); + } else { + if ( $visualDiff ) { + $visualDiff.addClass( 'oo-ui-element-hidden' ); + } + $wikitextDiff.removeClass( 'oo-ui-element-hidden' ); + $revSlider.removeClass( 've-init-mw-diffPage-revSlider-visual' ); + } + } + + mw.hook( 'wikipage.diff' ).add( function () { + // The PHP widget was a ButtonGroupWidget, so replace with a + // ButtonSelectWidget instead of infusing. + reviewModeButtonSelect = new OO.ui.ButtonSelectWidget( { + items: [ + new OO.ui.ButtonOptionWidget( { data: 'visual', icon: 'eye', label: mw.msg( 'visualeditor-savedialog-review-visual' ) } ), + new OO.ui.ButtonOptionWidget( { data: 'source', icon: 'wikiText', label: mw.msg( 'visualeditor-savedialog-review-wikitext' ) } ) + ] + } ); + reviewModeButtonSelect.on( 'select', onReviewModeButtonSelectSelect ); + $( '.ve-init-mw-diffPage-diffMode' ).empty().append( reviewModeButtonSelect.$element ); + reviewModeButtonSelect.selectItemByData( mode ); + } ); +}() ); -- To view, visit https://gerrit.wikimedia.org/r/358022 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: merged Gerrit-Change-Id: I151fc9bab3d3032f50c8d11be6b54e45a06fcc34 Gerrit-PatchSet: 5 Gerrit-Project: mediawiki/extensions/VisualEditor Gerrit-Branch: master Gerrit-Owner: Esanders <esand...@wikimedia.org> Gerrit-Reviewer: DLynch <dly...@wikimedia.org> Gerrit-Reviewer: Deskana <dga...@wikimedia.org> Gerrit-Reviewer: Jforrester <jforres...@wikimedia.org> Gerrit-Reviewer: Tchanders <thalia.e.c...@googlemail.com> Gerrit-Reviewer: jenkins-bot <> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits