Krinkle has uploaded a new change for review. ( https://gerrit.wikimedia.org/r/395158 )
Change subject: ImagePage: Make metadata table's initial collapse CSS-only ...................................................................... ImagePage: Make metadata table's initial collapse CSS-only Make the initial collapse of the metadata table not depend on JavaScript. This eliminates the FOUC, and will also reduce JS footprint once compat can be removed. * Move the 'display: none;' styles from metadata.css to filepage.css so that they are part of the base styles for file pages (metadata.css is only for supporting metadata.js, which is loaded dynamically). * Apply "collapsed" class from the PHP side immediately, instead of calling "addClass" in JavaScript. * Restrict hide-styles to only apply under .client-js to make sure the rows remain visible in no-js mode. * Declare dependency between metadata.js and filepage.css. This is just for documentation purposes, as they are both already separately loaded on all file pages. Change-Id: If22bf7acb47b59151dc3b0843a62507c100e548b --- M includes/page/ImagePage.php M resources/Resources.php M resources/src/mediawiki.action/mediawiki.action.view.filepage.css M resources/src/mediawiki.action/mediawiki.action.view.metadata.css M resources/src/mediawiki.action/mediawiki.action.view.metadata.js 5 files changed, 15 insertions(+), 10 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/mediawiki/core refs/changes/58/395158/1 diff --git a/includes/page/ImagePage.php b/includes/page/ImagePage.php index c774eb5..1dcdc65 100644 --- a/includes/page/ImagePage.php +++ b/includes/page/ImagePage.php @@ -251,12 +251,13 @@ protected function makeMetadataTable( $metadata ) { $r = "<div class=\"mw-imagepage-section-metadata\">"; $r .= $this->getContext()->msg( 'metadata-help' )->plain(); - $r .= "<table id=\"mw_metadata\" class=\"mw_metadata\">\n"; + // Intial state is collapsed + // see filepage.css and mediawiki.action.view.metadata module. + $r .= "<table id=\"mw_metadata\" class=\"mw_metadata collapsed\">\n"; foreach ( $metadata as $type => $stuff ) { foreach ( $stuff as $v ) { $class = str_replace( ' ', '_', $v['id'] ); if ( $type == 'collapsed' ) { - // Handled by mediawiki.action.view.metadata module. $class .= ' mw-metadata-collapsible'; } $r .= Html::rawElement( 'tr', diff --git a/resources/Resources.php b/resources/Resources.php index 0e6939b..7d89f1c 100644 --- a/resources/Resources.php +++ b/resources/Resources.php @@ -1498,6 +1498,7 @@ 'metadata-expand', 'metadata-collapse', ], + 'dependencies' => 'mediawiki.action.view.filepage', ], 'mediawiki.action.view.categoryPage.styles' => [ 'styles' => 'resources/src/mediawiki.action/mediawiki.action.view.categoryPage.less', diff --git a/resources/src/mediawiki.action/mediawiki.action.view.filepage.css b/resources/src/mediawiki.action/mediawiki.action.view.filepage.css index d466216..b643d76 100644 --- a/resources/src/mediawiki.action/mediawiki.action.view.filepage.css +++ b/resources/src/mediawiki.action/mediawiki.action.view.filepage.css @@ -111,3 +111,9 @@ padding-left: 5px; margin: 0; } + +.client-js .mw_metadata.collapsed .mw-metadata-collapsible, +/* Keep tr.collapsible for back-compat with cached HTML */ +.client-js .mw_metadata.collapsed tr.collapsable { + display: none; +} diff --git a/resources/src/mediawiki.action/mediawiki.action.view.metadata.css b/resources/src/mediawiki.action/mediawiki.action.view.metadata.css index 35b0623..f21b111 100644 --- a/resources/src/mediawiki.action/mediawiki.action.view.metadata.css +++ b/resources/src/mediawiki.action/mediawiki.action.view.metadata.css @@ -1,11 +1,6 @@ /*! - * Hide collapsable rows in a collapsed table. + * Styles for metadata.js. */ - - .mw_metadata.collapsed .mw-metadata-collapsible, - .mw_metadata.collapsed tr.collapsable { - display: none; -} /* * Exclude user interface elements from selection. diff --git a/resources/src/mediawiki.action/mediawiki.action.view.metadata.js b/resources/src/mediawiki.action/mediawiki.action.view.metadata.js index bae248b..ac927ae 100644 --- a/resources/src/mediawiki.action/mediawiki.action.view.metadata.js +++ b/resources/src/mediawiki.action/mediawiki.action.view.metadata.js @@ -14,7 +14,7 @@ return; } $tables.each( function () { - var $row, $col, $link, + var $link, expandText = mw.msg( 'metadata-expand' ), collapseText = mw.msg( 'metadata-collapse' ), $table = $( this ); @@ -48,7 +48,9 @@ ); } ); - // And collapse! + // Initial collapsed state + // (For back-compat with cached HTML from before ImagePage.php + // did this by default) $table.addClass( 'collapsed' ); } ); -- To view, visit https://gerrit.wikimedia.org/r/395158 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: If22bf7acb47b59151dc3b0843a62507c100e548b Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/core Gerrit-Branch: master Gerrit-Owner: Krinkle <krinklem...@gmail.com> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits