jenkins-bot has submitted this change and it was merged.
Change subject: Improve TMH styling
......................................................................
Improve TMH styling
* Add a new RL module for styling media containers when there is no
JS. This makes sure that media inside category pages are correctly
align for instance.
* Remove some overly specific CSS for play-btn-large
Change-Id: I44b7443c48193c16f725ff9d9364b0b76c902fef
---
M MwEmbedModules/EmbedPlayer/resources/skins/mw.PlayerControlBuilder.js
M TimedMediaHandler.hooks.php
M TimedMediaHandler_body.php
M TimedMediaTransformOutput.php
M resources/PopUpThumbVideo.css
A resources/ext.tmh.thumbnail.css
6 files changed, 17 insertions(+), 11 deletions(-)
Approvals:
Brion VIBBER: Looks good to me, approved
jenkins-bot: Verified
diff --git
a/MwEmbedModules/EmbedPlayer/resources/skins/mw.PlayerControlBuilder.js
b/MwEmbedModules/EmbedPlayer/resources/skins/mw.PlayerControlBuilder.js
index 5ef54d4..60a82c6 100644
--- a/MwEmbedModules/EmbedPlayer/resources/skins/mw.PlayerControlBuilder.js
+++ b/MwEmbedModules/EmbedPlayer/resources/skins/mw.PlayerControlBuilder.js
@@ -370,7 +370,6 @@
getPlayButtonPosition: function() {
var _this = this;
return {
- 'position' : 'absolute',
'left' : '50%',
'top' : '50%',
'margin-left' : - .5 * this.getComponentWidth(
'playButtonLarge' ),
diff --git a/TimedMediaHandler.hooks.php b/TimedMediaHandler.hooks.php
index f345ba9..c3cef5f 100644
--- a/TimedMediaHandler.hooks.php
+++ b/TimedMediaHandler.hooks.php
@@ -68,6 +68,10 @@
// Add the PopUpMediaTransform module ( specific to timedMedia
handler ( no support in mwEmbed modules )
$wgResourceModules+= array(
+ 'ext.tmh.thumbnail.styles' => $baseExtensionResource +
array(
+ 'styles' => 'resources/ext.tmh.thumbnail.css',
+ 'position' => 'top',
+ ),
'mw.PopUpMediaTransform' => $baseExtensionResource +
array(
'scripts' => 'resources/mw.PopUpThumbVideo.js',
'dependencies' => array( 'mw.MwEmbedSupport',
'mediawiki.Title', 'mw.PopUpMediaTransform.styles' ),
@@ -217,6 +221,7 @@
public static function onImageOpenShowImageInlineBefore( $imagePage,
$out ) {
$handler = $imagePage->getDisplayedFile()->getHandler();
if ( $handler !== false && $handler instanceof
TimedMediaHandler ) {
+ $out->addModuleStyles( 'ext.tmh.thumbnail.styles' );
$out->addModules( array(
'mw.MediaWikiPlayer.loader',
'mw.PopUpMediaTransform',
@@ -471,6 +476,7 @@
}
if ( $addModules ) {
+ $out->addModuleStyles( 'ext.tmh.thumbnail.styles' );
$out->addModules( array(
'mw.MediaWikiPlayer.loader',
'mw.PopUpMediaTransform',
diff --git a/TimedMediaHandler_body.php b/TimedMediaHandler_body.php
index 00ef07e..95dc567 100644
--- a/TimedMediaHandler_body.php
+++ b/TimedMediaHandler_body.php
@@ -201,6 +201,7 @@
return ;
}
$parserOutput->hasTimedMediaTransform = true;
+ $parserOutput->addModuleStyles( 'ext.tmh.thumbnail.styles' );
$parserOutput->addModules( array(
'mw.MediaWikiPlayer.loader',
'mw.PopUpMediaTransform',
diff --git a/TimedMediaTransformOutput.php b/TimedMediaTransformOutput.php
index 3653209..e743aa1 100644
--- a/TimedMediaTransformOutput.php
+++ b/TimedMediaTransformOutput.php
@@ -321,7 +321,7 @@
// Build the video tag output:
$s = Xml::tags( 'div' , array(
'class' => 'mediaContainer',
- 'style' =>
'position:relative;display:block;width:'. $width
+ 'style' => 'width:'. $width
),
Html::rawElement( $this->getTagName(),
$this->getMediaAttr( $sizeOverride, $autoPlay ),
// The set of media sources:
diff --git a/resources/PopUpThumbVideo.css b/resources/PopUpThumbVideo.css
index c55bb06..5f97d7f 100644
--- a/resources/PopUpThumbVideo.css
+++ b/resources/PopUpThumbVideo.css
@@ -1,5 +1,4 @@
.PopUpMediaTransform a .play-btn-large {
- position : absolute;
top: 50%;
left : 50%;
width: 70px;
@@ -13,17 +12,9 @@
/* @embed */
background-image:url('player_big_play_button_hover.png');
}
-.PopUpMediaTransform {
- position : relative;
- display: inline-block;
-}
/* Should hopefully be only visible to screen readers */
.mw-tmh-playtext {
display: block;
height: 0;
overflow: hidden;
-}
-
-li.gallerybox div.thumb div.PopUpMediaTransform {
- margin: 0 auto;
}
diff --git a/resources/ext.tmh.thumbnail.css b/resources/ext.tmh.thumbnail.css
new file mode 100644
index 0000000..9464e5e
--- /dev/null
+++ b/resources/ext.tmh.thumbnail.css
@@ -0,0 +1,9 @@
+.mediaContainer,
+.PopUpMediaTransform {
+ position : relative;
+ display: block;
+}
+.thumb .mediaContainer,
+.thumb .PopUpMediaTransform {
+ margin: 0 auto;
+}
--
To view, visit https://gerrit.wikimedia.org/r/196883
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I44b7443c48193c16f725ff9d9364b0b76c902fef
Gerrit-PatchSet: 7
Gerrit-Project: mediawiki/extensions/TimedMediaHandler
Gerrit-Branch: master
Gerrit-Owner: TheDJ <[email protected]>
Gerrit-Reviewer: Brion VIBBER <[email protected]>
Gerrit-Reviewer: MarkTraceur <[email protected]>
Gerrit-Reviewer: TheDJ <[email protected]>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits