Brion VIBBER has uploaded a new change for review. https://gerrit.wikimedia.org/r/313977
Change subject: Select default resolution in videojs playback ...................................................................... Select default resolution in videojs playback The videojs resolution switcher was overriding our default res selection with the lowest resolution. Overriding it back by picking the first resolution that matches or surpasses the available picture area. This'll show 240p video for most small thumbnails, which plays adequately at small size even in ogv.js (except on iPhone 4S or equivalent where it's a bit flaky) Larger players as on File: pages should show larger sizes. Note it does *NOT* yet switch on fullscreen/exit. Also de-cluttered the resolution switcher by showing just the res and letting the backing format be picked automatically (ogg/webm/etc) for transcodes. Bug: T135026 Change-Id: I17d77d98e3655ed7549e49c1c2e1375b1dc1bcbf --- M TimedMediaHandler.hooks.php M TimedMediaTransformOutput.php M WebVideoTranscode/WebVideoTranscode.php M i18n/en.json M i18n/qqq.json M resources/ext.tmh.player.js 6 files changed, 87 insertions(+), 6 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/TimedMediaHandler refs/changes/77/313977/1 diff --git a/TimedMediaHandler.hooks.php b/TimedMediaHandler.hooks.php index ff28845..beeffa7 100644 --- a/TimedMediaHandler.hooks.php +++ b/TimedMediaHandler.hooks.php @@ -173,6 +173,16 @@ 'ext.tmh.videojs-replay', 'ext.tmh.mw-info-button', ], + 'messages' => [ + 'timedmedia-resolution-160', + 'timedmedia-resolution-240', + 'timedmedia-resolution-360', + 'timedmedia-resolution-480', + 'timedmedia-resolution-720', + 'timedmedia-resolution-1080', + 'timedmedia-resolution-1440', + 'timedmedia-resolution-2160', + ], ], 'ext.tmh.player.styles' => $baseExtensionResource + [ 'styles' => 'resources/ext.tmh.player.styles.less', diff --git a/TimedMediaTransformOutput.php b/TimedMediaTransformOutput.php index f1ae1fc..5290098 100644 --- a/TimedMediaTransformOutput.php +++ b/TimedMediaTransformOutput.php @@ -323,6 +323,8 @@ 'framerate', 'disablecontrols', 'transcodekey', + 'label', + 'res', ]; foreach ( $mediaSources as &$source ) { foreach ( $source as $attr => $val ) { diff --git a/WebVideoTranscode/WebVideoTranscode.php b/WebVideoTranscode/WebVideoTranscode.php index 2e041b9..fdaaa97 100644 --- a/WebVideoTranscode/WebVideoTranscode.php +++ b/WebVideoTranscode/WebVideoTranscode.php @@ -1011,11 +1011,14 @@ $src = self::getTranscodedUrlForFile( $file, $transcodeKey ); if ( $file->getHandler()->isAudio( $file ) ) { - $width = $height = 0; + $width = $height = $res = 0; + $resLabel = wfMessage( 'timedmedia-resolution-audio' )->text(); } else { + $res = self::$derivativeSettings[$transcodeKey]['maxSize']; + $resLabel = wfMessage( 'timedmedia-resolution-' . $res )->text(); list( $width, $height ) = WebVideoTranscode::getMaxSizeTransform( $file, - self::$derivativeSettings[$transcodeKey]['maxSize'] + $res ); } @@ -1035,6 +1038,10 @@ // eventually we will define a manifest xml entry point. "width" => intval( $width ), "height" => intval( $height ), + + // For videojs-resolution-switcher + 'res' => intval( $res ), + 'label' => $resLabel, ]; // a "ready" transcode should have a bitrate: diff --git a/i18n/en.json b/i18n/en.json index 652416b..cf05b2c 100644 --- a/i18n/en.json +++ b/i18n/en.json @@ -134,6 +134,14 @@ "timedmedia-derivative-desc-mp3": "MP3", "timedmedia-derivative-m4a": "AAC", "timedmedia-derivative-desc-m4a": "AAC", + "timedmedia-resolution-160": "Low 160p", + "timedmedia-resolution-240": "Low 240p", + "timedmedia-resolution-360": "SD 360p", + "timedmedia-resolution-480": "SD 480p", + "timedmedia-resolution-720": "HD 720p", + "timedmedia-resolution-1080": "HD 1080p", + "timedmedia-resolution-1440": "UHD 1440p", + "timedmedia-resolution-2160": "UHD 2160p", "timedmedia-subtitle-new": "Create new translation or edit existing", "timedmedia-subtitle-new-desc": "Select language and press the '''{{int:Timedmedia-subtitle-new-go}}''' button", "timedmedia-subtitle-new-go": "Go", diff --git a/i18n/qqq.json b/i18n/qqq.json index 4692670..904c1df 100644 --- a/i18n/qqq.json +++ b/i18n/qqq.json @@ -152,6 +152,14 @@ "timedmedia-derivative-desc-mp3": "{{optional}} Media format.", "timedmedia-derivative-m4a": "{{optional}} Short form of a media format.", "timedmedia-derivative-desc-m4a": "{{optional}} Media format.", + "timedmedia-resolution-160": "Label for video player resolution switcher for 160p low resolution.", + "timedmedia-resolution-240": "Label for video player resolution switcher for 240p low resolution.", + "timedmedia-resolution-360": "Label for video player resolution switcher for 360p standard definition.", + "timedmedia-resolution-480": "Label for video player resolution switcher for 480p standard definition.", + "timedmedia-resolution-720": "Label for video player resolution switcher for 720p high definition.", + "timedmedia-resolution-1080": "Label for video player resolution switcher for 1080p high definition.", + "timedmedia-resolution-1440": "Label for video player resolution switcher for 1440p ultra-high definition.", + "timedmedia-resolution-2160": "Label for video player resolution switcher for 2160p ultra-high definition.", "timedmedia-subtitle-new": "Used as page title.", "timedmedia-subtitle-new-desc": "Refers to {{msg-mw|Timedmedia-subtitle-new-go}}.", "timedmedia-subtitle-new-go": "Used as label for the Submit button.\n\nPreceded by (and used in) the description {{msg-mw|Timedmedia-subtitle-new-desc}}.\n{{Identical|Go}}", diff --git a/resources/ext.tmh.player.js b/resources/ext.tmh.player.js index 765f8ca..55c6d15 100755 --- a/resources/ext.tmh.player.js +++ b/resources/ext.tmh.player.js @@ -14,7 +14,15 @@ techOrder: [ 'html5', 'ogvjs' ], plugins: { videoJsResolutionSwitcher: { - sourceOrder: true + sourceOrder: true, + customSourcePicker: function( player, sources, label ) { + // Resolution switcher gets confused by preload=none on ogv.js + if ( player.preload() === 'none' ) { + player.preload( 'metadata' ); + } + player.src( sources ); + return player; + } }, responsiveLayout: { layoutMap: [ @@ -64,14 +72,52 @@ // On pages with many videos, like Category pages, don't preload em all preload = 'none'; } + + var sources = []; + $( videoplayer ).attr( { preload: preload } ).find( 'source' ).each( function () { // FIXME would be better if we can configure the plugin to make use of our preferred attributes - $source = $( this ); - $source.attr( 'res', $source.data( 'height' ) ); - $source.attr( 'label', $source.data( 'shorttitle' ) ); + var $source = $( this ), + transcodeKey = $source.data( 'transcodekey' ); + + if ( transcodeKey ) { + var matches = transcodeKey.match(/^(\d+)p\./); + if (matches) { + var res = matches[1]; + $source.attr( 'res', res ); + $source.attr( 'label', mw.message( 'timedmedia-resolution-' + res ).text() ); + } else { + $source.attr( 'res', $source.data( 'height' ) ); + $source.attr( 'label', $source.data( 'shorttitle' ) ); + } + } else { + $source.attr( 'res', '99999' ); // sorting hack + $source.attr( 'label', $source.data( 'shorttitle' ) ); + } + sources.push( { + source: this, + res: res + } ); } ); + + // Pick the first resolution at least the size of the player, + // unless they're all too small. + sources.sort( function( a, b ) { + return a.res - b.res; + }); + var defaultRes; + for ( var i = 0; i < sources.length; i++ ) { + defaultRes = sources[ i ].res; + if ( defaultRes >= $( videoplayer ).height() ) { + break; + } + } + if ( defaultRes ) { + playerConfig.plugins.videoJsResolutionSwitcher.default = defaultRes; + } + $videoplayer.parent( '.thumbinner' ).addClass( 'mw-overflow' ); // Launch the player -- To view, visit https://gerrit.wikimedia.org/r/313977 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: I17d77d98e3655ed7549e49c1c2e1375b1dc1bcbf Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/extensions/TimedMediaHandler Gerrit-Branch: master Gerrit-Owner: Brion VIBBER <br...@wikimedia.org> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits