From 478caa076f75fde935c66eb9334410d868c30818 Mon Sep 17 00:00:00 2001 From: Kunal Mehta Date: Mon, 21 Aug 2017 16:56:33 -0700 Subject: [PATCH] EditPage: Remove legacy non-OOUI render mode Mostly remove it at least. Some things from the transition are still left around: * EditPage::isOouiEnabled() will now always return true and is soft deprecated as some extensions are using it to detect whether in OOUI mode. * EditPage::getCheckboxes() is left around since getCheckboxesOOUI() calls it. Someone else will need to disentangle that. * The "mw-editform-ooui" class is kept as some on-wiki JavaScript uses it to detect whether running in the OOUI mode. * CSS is still using the .mw-editform-ooui class. It should be transitioned to use .mw-editform in a follow-up. Other cleanup: * mediawiki.action.edit now directly depends upon oojs-ui-core instead of transitively via mediawiki.widgets.visibleByteLimit. As a result, the mw.loader.using call was removed from the JavaScript file. Bug: T172315 Change-Id: I2b468c8b846db015b5a1e3d2500abb8ea252c442 --- RELEASE-NOTES-1.30 | 3 + includes/DefaultSettings.php | 8 - includes/EditPage.php | 222 +++++------------- resources/Resources.php | 2 +- .../mediawiki.action/mediawiki.action.edit.js | 20 +- .../mediawiki.action.edit.preview.js | 16 +- .../mediawiki.action.edit.styles.css | 52 +--- 7 files changed, 78 insertions(+), 245 deletions(-) diff --git a/RELEASE-NOTES-1.30 b/RELEASE-NOTES-1.30 index ae16779c59..473ac84866 100644 --- a/RELEASE-NOTES-1.30 +++ b/RELEASE-NOTES-1.30 @@ -37,6 +37,8 @@ section). This PHP extension was deprecated in PHP 5.5 and removed in PHP 7.0. MediaWiki auto-selects the 'mysqli' driver since MediaWiki 1.22, except if explicitly requested through the configuration parameter $wgDBservers. +* $wgOOUIEditPage was removed, as it is now the default. This was documented as a + temporary variable during the migration period. === New features in 1.30 === * (T37247) Output from Parser::parse() will now be wrapped in a div with @@ -183,6 +185,7 @@ changes to languages because of Phabricator reports. RunningStat\RunningStat should be used instead. * MWMemcached and MemCachedClientforWiki classes (deprecated in 1.27) were removed. The MemcachedClient class should be used instead. +* EditPage::isOouiEnabled() is deprecated and will always return true. == Compatibility == MediaWiki 1.30 requires PHP 5.5.9 or later. There is experimental support for diff --git a/includes/DefaultSettings.php b/includes/DefaultSettings.php index 26138892b5..d07136baca 100644 --- a/includes/DefaultSettings.php +++ b/includes/DefaultSettings.php @@ -3235,14 +3235,6 @@ $wgHTMLFormAllowTableFormat = true; */ $wgUseMediaWikiUIEverywhere = false; -/** - * Temporary variable that determines whether the EditPage class should use OOjs UI or not. - * This will be removed later and OOjs UI will become the only option. - * - * @since 1.29 - */ -$wgOOUIEditPage = true; - /** * Whether to label the store-to-database-and-show-to-others button in the editor * as "Save page"/"Save changes" if false (the default) or, if true, instead as diff --git a/includes/EditPage.php b/includes/EditPage.php index 914e7aa6a9..0e1438f8f7 100644 --- a/includes/EditPage.php +++ b/includes/EditPage.php @@ -413,11 +413,6 @@ class EditPage { */ private $isOldRev = false; - /** - * @var bool Whether OOUI should be enabled here - */ - private $oouiEnabled = false; - /** * @param Article $article */ @@ -431,8 +426,6 @@ class EditPage { $handler = ContentHandler::getForModelID( $this->contentModel ); $this->contentFormat = $handler->getDefaultFormat(); - - $this->oouiEnabled = $this->context->getConfig()->get( 'OOUIEditPage' ); } /** @@ -485,10 +478,11 @@ class EditPage { /** * Check if the edit page is using OOUI controls - * @return bool + * @return bool Always true + * @deprecated since 1.30 */ public function isOouiEnabled() { - return $this->oouiEnabled; + return true; } /** @@ -858,9 +852,6 @@ class EditPage { public function importFormData( &$request ) { global $wgContLang, $wgUser; - # Allow users to change the mode for testing - $this->oouiEnabled = $request->getFuzzyBool( 'ooui', $this->oouiEnabled ); - # Section edit can come from either the form or a link $this->section = $request->getVal( 'wpSection', $request->getVal( 'section' ) ); @@ -2667,7 +2658,8 @@ class EditPage { $wgOut->addHTML( Html::openElement( 'form', [ - 'class' => $this->oouiEnabled ? 'mw-editform-ooui' : 'mw-editform-legacy', + // Keep mw-editform-ooui class for backwards-compatibility temporarily + 'class' => 'mw-editform mw-editform-ooui', 'id' => self::EDITFORM_ID, 'name' => self::EDITFORM_ID, 'method' => 'post', @@ -2767,13 +2759,7 @@ class EditPage { $wgOut->addHTML( Html::hidden( 'format', $this->contentFormat ) ); $wgOut->addHTML( Html::hidden( 'model', $this->contentModel ) ); - // Preserve &ooui=1 / &ooui=0 from URL parameters after submitting the page for preview - $wgOut->addHTML( Html::hidden( 'ooui', $this->oouiEnabled ? '1' : '0' ) ); - - // following functions will need OOUI, enable it only once; here. - if ( $this->oouiEnabled ) { - $wgOut->enableOOUI(); - } + $wgOut->enableOOUI(); if ( $this->section == 'new' ) { $this->showSummaryInput( true, $this->summary ); @@ -3080,47 +3066,6 @@ class EditPage { } /** - * Standard summary input and label (wgSummary), abstracted so EditPage - * subclasses may reorganize the form. - * Note that you do not need to worry about the label's for=, it will be - * inferred by the id given to the input. You can remove them both by - * passing [ 'id' => false ] to $userInputAttrs. - * - * @param string $summary The value of the summary input - * @param string $labelText The html to place inside the label - * @param array $inputAttrs Array of attrs to use on the input - * @param array $spanLabelAttrs Array of attrs to use on the span inside the label - * - * @return array An array in the format [ $label, $input ] - */ - public function getSummaryInput( $summary = "", $labelText = null, - $inputAttrs = null, $spanLabelAttrs = null - ) { - $inputAttrs = $this->getSummaryInputAttributes( $inputAttrs ); - $inputAttrs += Linker::tooltipAndAccesskeyAttribs( 'summary' ); - - $spanLabelAttrs = ( is_array( $spanLabelAttrs ) ? $spanLabelAttrs : [] ) + [ - 'class' => $this->missingSummary ? 'mw-summarymissed' : 'mw-summary', - 'id' => "wpSummaryLabel" - ]; - - $label = null; - if ( $labelText ) { - $label = Xml::tags( - 'label', - $inputAttrs['id'] ? [ 'for' => $inputAttrs['id'] ] : null, - $labelText - ); - $label = Xml::tags( 'span', $spanLabelAttrs, $label ); - } - - $input = Html::input( 'wpSummary', $summary, 'text', $inputAttrs ); - - return [ $label, $input ]; - } - - /** - * Same as self::getSummaryInput, but uses OOUI, instead of plain HTML. * Builds a standard summary input with a label. * * @param string $summary The value of the summary input @@ -3178,20 +3123,11 @@ class EditPage { } $labelText = $this->context->msg( $isSubjectPreview ? 'subject' : 'summary' )->parse(); - if ( $this->oouiEnabled ) { - $wgOut->addHTML( $this->getSummaryInputOOUI( + $wgOut->addHTML( $this->getSummaryInputOOUI( $summary, $labelText, [ 'class' => $summaryClass ] ) ); - } else { - list( $label, $input ) = $this->getSummaryInput( - $summary, - $labelText, - [ 'class' => $summaryClass ] - ); - $wgOut->addHTML( "{$label} {$input}" ); - } } /** @@ -3602,19 +3538,11 @@ class EditPage { $wgOut->addHTML( $this->getSummaryPreview( false, $this->summary ) ); } - if ( $this->oouiEnabled ) { - $checkboxes = $this->getCheckboxesOOUI( - $tabindex, - [ 'minor' => $this->minoredit, 'watch' => $this->watchthis ] - ); - $checkboxesHTML = new OOUI\HorizontalLayout( [ 'items' => $checkboxes ] ); - } else { - $checkboxes = $this->getCheckboxes( - $tabindex, - [ 'minor' => $this->minoredit, 'watch' => $this->watchthis ] - ); - $checkboxesHTML = implode( $checkboxes, "\n" ); - } + $checkboxes = $this->getCheckboxesOOUI( + $tabindex, + [ 'minor' => $this->minoredit, 'watch' => $this->watchthis ] + ); + $checkboxesHTML = new OOUI\HorizontalLayout( [ 'items' => $checkboxes ] ); $wgOut->addHTML( "
" . $checkboxesHTML . "
\n" ); @@ -3704,23 +3632,15 @@ class EditPage { } elseif ( $this->getContextTitle()->isRedirect() ) { $cancelParams['redirect'] = 'no'; } - if ( $this->oouiEnabled ) { - return new OOUI\ButtonWidget( [ - 'id' => 'mw-editform-cancel', - 'href' => $this->getContextTitle()->getLinkUrl( $cancelParams ), - 'label' => new OOUI\HtmlSnippet( $this->context->msg( 'cancel' )->parse() ), - 'framed' => false, - 'infusable' => true, - 'flags' => 'destructive', - ] ); - } else { - return MediaWikiServices::getInstance()->getLinkRenderer()->makeKnownLink( - $this->getContextTitle(), - new HtmlArmor( $this->context->msg( 'cancel' )->parse() ), - Html::buttonAttributes( [ 'id' => 'mw-editform-cancel' ], [ 'mw-ui-quiet' ] ), - $cancelParams - ); - } + + return new OOUI\ButtonWidget( [ + 'id' => 'mw-editform-cancel', + 'href' => $this->getContextTitle()->getLinkUrl( $cancelParams ), + 'label' => new OOUI\HtmlSnippet( $this->context->msg( 'cancel' )->parse() ), + 'framed' => false, + 'infusable' => true, + 'flags' => 'destructive', + ] ); } /** @@ -4358,74 +4278,56 @@ class EditPage { 'name' => 'wpSave', 'tabindex' => ++$tabindex, ]; - if ( $this->oouiEnabled ) { - $saveConfig = OOUI\Element::configFromHtmlAttributes( $attribs ); - $buttons['save'] = new OOUI\ButtonInputWidget( [ - 'id' => 'wpSaveWidget', - 'inputId' => 'wpSave', - // Support: IE 6 – Use , otherwise it can't distinguish which button was clicked - 'useInputTag' => true, - 'flags' => [ 'constructive', 'primary' ], - 'label' => $buttonLabel, - 'infusable' => true, - 'type' => 'submit', - 'title' => Linker::titleAttrib( 'save' ), - 'accessKey' => Linker::accesskey( 'save' ), - ] + $saveConfig ); - } else { - $buttons['save'] = Html::submitButton( - $buttonLabel, - $attribs + Linker::tooltipAndAccesskeyAttribs( 'save' ) + [ 'id' => 'wpSave' ], - [ 'mw-ui-progressive' ] - ); - } + + $saveConfig = OOUI\Element::configFromHtmlAttributes( $attribs ); + $buttons['save'] = new OOUI\ButtonInputWidget( [ + 'id' => 'wpSaveWidget', + 'inputId' => 'wpSave', + // Support: IE 6 – Use , otherwise it can't distinguish which button was clicked + 'useInputTag' => true, + 'flags' => [ 'constructive', 'primary' ], + 'label' => $buttonLabel, + 'infusable' => true, + 'type' => 'submit', + 'title' => Linker::titleAttrib( 'save' ), + 'accessKey' => Linker::accesskey( 'save' ), + ] + $saveConfig ); $attribs = [ 'name' => 'wpPreview', 'tabindex' => ++$tabindex, ]; - if ( $this->oouiEnabled ) { - $previewConfig = OOUI\Element::configFromHtmlAttributes( $attribs ); - $buttons['preview'] = new OOUI\ButtonInputWidget( [ - 'id' => 'wpPreviewWidget', - 'inputId' => 'wpPreview', - // Support: IE 6 – Use , otherwise it can't distinguish which button was clicked - 'useInputTag' => true, - 'label' => $this->context->msg( 'showpreview' )->text(), - 'infusable' => true, - 'type' => 'submit', - 'title' => Linker::titleAttrib( 'preview' ), - 'accessKey' => Linker::accesskey( 'preview' ), - ] + $previewConfig ); - } else { - $buttons['preview'] = Html::submitButton( - $this->context->msg( 'showpreview' )->text(), - $attribs + Linker::tooltipAndAccesskeyAttribs( 'preview' ) + [ 'id' => 'wpPreview' ] - ); - } + + $previewConfig = OOUI\Element::configFromHtmlAttributes( $attribs ); + $buttons['preview'] = new OOUI\ButtonInputWidget( [ + 'id' => 'wpPreviewWidget', + 'inputId' => 'wpPreview', + // Support: IE 6 – Use , otherwise it can't distinguish which button was clicked + 'useInputTag' => true, + 'label' => $this->context->msg( 'showpreview' )->text(), + 'infusable' => true, + 'type' => 'submit', + 'title' => Linker::titleAttrib( 'preview' ), + 'accessKey' => Linker::accesskey( 'preview' ), + ] + $previewConfig ); + $attribs = [ 'name' => 'wpDiff', 'tabindex' => ++$tabindex, ]; - if ( $this->oouiEnabled ) { - $diffConfig = OOUI\Element::configFromHtmlAttributes( $attribs ); - $buttons['diff'] = new OOUI\ButtonInputWidget( [ - 'id' => 'wpDiffWidget', - 'inputId' => 'wpDiff', - // Support: IE 6 – Use , otherwise it can't distinguish which button was clicked - 'useInputTag' => true, - 'label' => $this->context->msg( 'showdiff' )->text(), - 'infusable' => true, - 'type' => 'submit', - 'title' => Linker::titleAttrib( 'diff' ), - 'accessKey' => Linker::accesskey( 'diff' ), - ] + $diffConfig ); - } else { - $buttons['diff'] = Html::submitButton( - $this->context->msg( 'showdiff' )->text(), - $attribs + Linker::tooltipAndAccesskeyAttribs( 'diff' ) + [ 'id' => 'wpDiff' ] - ); - } + + $diffConfig = OOUI\Element::configFromHtmlAttributes( $attribs ); + $buttons['diff'] = new OOUI\ButtonInputWidget( [ + 'id' => 'wpDiffWidget', + 'inputId' => 'wpDiff', + // Support: IE 6 – Use , otherwise it can't distinguish which button was clicked + 'useInputTag' => true, + 'label' => $this->context->msg( 'showdiff' )->text(), + 'infusable' => true, + 'type' => 'submit', + 'title' => Linker::titleAttrib( 'diff' ), + 'accessKey' => Linker::accesskey( 'diff' ), + ] + $diffConfig ); // Avoid PHP 7.1 warning of passing $this by reference $editPage = $this; diff --git a/resources/Resources.php b/resources/Resources.php index 89eab943ee..0e98c86369 100644 --- a/resources/Resources.php +++ b/resources/Resources.php @@ -1421,7 +1421,7 @@ return [ 'dependencies' => [ 'mediawiki.action.edit.styles', 'jquery.textSelection', - 'jquery.byteLimit', + 'oojs-ui-core', 'mediawiki.widgets.visibleByteLimit', 'mediawiki.api', ], diff --git a/resources/src/mediawiki.action/mediawiki.action.edit.js b/resources/src/mediawiki.action/mediawiki.action.edit.js index 68d6cbb3d0..087c5bce5d 100644 --- a/resources/src/mediawiki.action/mediawiki.action.edit.js +++ b/resources/src/mediawiki.action/mediawiki.action.edit.js @@ -19,21 +19,13 @@ $( function () { var editBox, scrollTop, $editForm, // TODO T6714: Once this can be adjusted, read this from config. - summaryByteLimit = 255; + summaryByteLimit = 255, + wpSummary = OO.ui.infuse( $( '#wpSummaryWidget' ) ); - if ( $( '#editform' ).hasClass( 'mw-editform-ooui' ) ) { - mw.loader.using( 'oojs-ui-core' ).then( function () { - var wpSummary = OO.ui.infuse( $( '#wpSummaryWidget' ) ); - - // Show a byte-counter to users with how many bytes are left for their edit summary. - // TODO: This looks a bit weird, as there is no unit in the UI, just numbers; showing - // 'bytes' confused users in testing, and showing 'chars' would be a lie. See T42035. - mw.widgets.visibleByteLimit( wpSummary, summaryByteLimit ); - } ); - } else { - // Make sure edit summary does not exceed byte limit - $( '#wpSummary' ).byteLimit( summaryByteLimit ); - } + // Show a byte-counter to users with how many bytes are left for their edit summary. + // TODO: This looks a bit weird, as there is no unit in the UI, just numbers; showing + // 'bytes' confused users in testing, and showing 'chars' would be a lie. See T42035. + mw.widgets.visibleByteLimit( wpSummary, summaryByteLimit ); // Restore the edit box scroll state following a preview operation, // and set up a form submission handler to remember this state. diff --git a/resources/src/mediawiki.action/mediawiki.action.edit.preview.js b/resources/src/mediawiki.action/mediawiki.action.edit.preview.js index c26d9153a2..7602dae4d8 100644 --- a/resources/src/mediawiki.action/mediawiki.action.edit.preview.js +++ b/resources/src/mediawiki.action/mediawiki.action.edit.preview.js @@ -3,15 +3,13 @@ */ ( function ( mw, $ ) { - var oojsuieditform; - /** * @ignore * @param {jQuery.Event} e */ function doLivePreview( e ) { var isDiff, api, parseRequest, diffRequest, postData, copySelectors, section, summary, - $wikiPreview, $wikiDiff, $editform, $textbox, $summary, $copyElements, $spinner, $errorBox; + $wikiPreview, $wikiDiff, $editform, $textbox, $copyElements, $spinner, $errorBox; isDiff = ( e.target.name === 'wpDiff' ); $wikiPreview = $( '#wikiPreview' ); @@ -19,11 +17,7 @@ $editform = $( '#editform' ); $textbox = $editform.find( '#wpTextbox1' ); - if ( oojsuieditform ) { - summary = OO.ui.infuse( $( '#wpSummaryWidget' ) ); - } else { - $summary = $editform.find( '#wpSummary' ); - } + summary = OO.ui.infuse( $( '#wpSummaryWidget' ) ); $spinner = $( '.mw-spinner-preview' ); $errorBox = $( '.errorbox' ); @@ -86,7 +80,7 @@ formatversion: 2, action: 'parse', title: mw.config.get( 'wgPageName' ), - summary: oojsuieditform ? summary.getValue() : $summary.val(), + summary: summary.getValue(), prop: '' }; @@ -289,8 +283,6 @@ } $( function () { - oojsuieditform = $( '#editform' ).hasClass( 'mw-editform-ooui' ); - // Do not enable on user .js/.css pages, as there's no sane way of "previewing" // the scripts or styles without reloading the page. if ( $( '#mw-userjsyoucanpreview' ).length || $( '#mw-usercssyoucanpreview' ).length ) { @@ -317,7 +309,7 @@ } if ( !$( '.mw-summary-preview' ).length ) { - $( oojsuieditform ? '#wpSummaryWidget' : '#wpSummary' ).after( + $( '#wpSummaryWidget' ).after( $( '
' ).addClass( 'mw-summary-preview' ) ); } diff --git a/resources/src/mediawiki.action/mediawiki.action.edit.styles.css b/resources/src/mediawiki.action/mediawiki.action.edit.styles.css index 36b3751cbd..7b6aaa8e2c 100644 --- a/resources/src/mediawiki.action/mediawiki.action.edit.styles.css +++ b/resources/src/mediawiki.action/mediawiki.action.edit.styles.css @@ -25,64 +25,16 @@ font-size: 0.9em; } -.mw-editform-ooui #wpSummaryWidget, -.mw-editform-legacy #wpSummary { +.mw-editform-ooui #wpSummaryWidget { display: block; margin-bottom: 1em; + max-width: none; } -/* Adjustments to edit form elements (only when $wgOOUIEditPage is false) */ -.mw-editform-legacy .editCheckboxes { - margin-bottom: 1em; -} - -.mw-editform-legacy .editCheckboxes input:first-child { - margin-left: 0; -} - -.mw-editform-legacy .cancelLink { - margin-left: 0.5em; -} - -.mw-editform-legacy #wpSummary { - width: 80%; -} - -.mw-editform-legacy input#wpSummary { - background-color: #fff; - color: #000; - margin-top: 0; - padding: 0.625em 0.546875em 0.546875em; - border: 1px solid #a2a9b1; - border-radius: 2px; - box-shadow: inset 0 0 0 1px #fff; - font-family: inherit; - font-size: inherit; - -webkit-transition: border-color 200ms cubic-bezier( 0.39, 0.575, 0.565, 1 ), box-shadow 200ms cubic-bezier( 0.39, 0.575, 0.565, 1 ); - -moz-transition: border-color 200ms cubic-bezier( 0.39, 0.575, 0.565, 1 ), box-shadow 200ms cubic-bezier( 0.39, 0.575, 0.565, 1 ); - transition: border-color 200ms cubic-bezier( 0.39, 0.575, 0.565, 1 ), box-shadow 200ms cubic-bezier( 0.39, 0.575, 0.565, 1 ); -} - -.mw-editform-legacy input#wpSummary:focus, -.mw-editform-legacy input#wpSummary:active { - outline: 0; - border-color: #36c; - box-shadow: inset 0 0 0 1px #36c; -} - -.mw-editform-legacy .editButtons input:first-child { - margin-left: 0.1em; -} - -/* Adjustments to edit form elements (only when $wgOOUIEditPage is true) */ .mw-editform-ooui #editpage-copywarn { line-height: 1.26; } -.mw-editform-ooui #wpSummaryWidget { - max-width: none; -} - .mw-editform-ooui #wpSummaryLabel { margin: 0; } -- 2.20.1