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 <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
