Brion VIBBER has submitted this change and it was merged.
Change subject: Launch videos in VLC app on iOS if installed
......................................................................
Launch videos in VLC app on iOS if installed
iOS does not support ogg/webm. Direct people to install iOS app
instead, and direct them to view videos in that instead.
This is meant as a somewhat short term solution. After the
kaltura player update (whenever that happens), it may make sense
to replace this sort of thing with ogv.js, or perhaps keep this
vlc triggering code. Either way, in the near term this is a
relative simple fix that would help us reach 11.4% of our user base.
One minor issue: If you don't have the VLC app installed, you will
get a safari cannot open the page dialog box when we try to open
with vlc. I couldn't find anyway around it. I don't think its a big
deal, since in that case we cannot play the video anyways, so an
error is not out of place.
Bug: 61095
Change-Id: I6c3b5d8aadbd69577df3fe513f780f69708450d5
---
M MwEmbedModules/EmbedPlayer/EmbedPlayer.php
M MwEmbedModules/EmbedPlayer/i18n/en.json
M MwEmbedModules/EmbedPlayer/i18n/qqq.json
A MwEmbedModules/EmbedPlayer/resources/mw.EmbedPlayerVLCApp.js
M MwEmbedModules/EmbedPlayer/resources/mw.EmbedTypes.js
M MwEmbedModules/EmbedPlayer/resources/mw.MediaPlayers.js
M MwEmbedModules/EmbedPlayer/resources/skins/mw.PlayerControlBuilder.js
7 files changed, 147 insertions(+), 7 deletions(-)
Approvals:
Brion VIBBER: Looks good to me, approved
diff --git a/MwEmbedModules/EmbedPlayer/EmbedPlayer.php
b/MwEmbedModules/EmbedPlayer/EmbedPlayer.php
index 66f6c32..c60d41c 100644
--- a/MwEmbedModules/EmbedPlayer/EmbedPlayer.php
+++ b/MwEmbedModules/EmbedPlayer/EmbedPlayer.php
@@ -64,6 +64,10 @@
"mw.EmbedPlayerGeneric" => array( 'scripts'=>
"resources/mw.EmbedPlayerGeneric.js" ),
"mw.EmbedPlayerJava" => array( 'scripts'=>
"resources/mw.EmbedPlayerJava.js"),
"mw.EmbedPlayerNative" => array( 'scripts'=>
"resources/mw.EmbedPlayerNative.js" ),
+ "mw.EmbedPlayerVLCApp" => array(
+ 'scripts'=> "resources/mw.EmbedPlayerVLCApp.js",
+ 'dependencies' => array( 'mediawiki.Uri' )
+ ),
"mw.EmbedPlayerImageOverlay" => array( 'scripts'=>
"resources/mw.EmbedPlayerImageOverlay.js" ),
"mw.EmbedPlayerVlc" => array( 'scripts'=>
"resources/mw.EmbedPlayerVlc.js" ),
diff --git a/MwEmbedModules/EmbedPlayer/i18n/en.json
b/MwEmbedModules/EmbedPlayer/i18n/en.json
index 3534011..d3221a2 100644
--- a/MwEmbedModules/EmbedPlayer/i18n/en.json
+++ b/MwEmbedModules/EmbedPlayer/i18n/en.json
@@ -49,6 +49,7 @@
"mwe-embedplayer-ogg-player-h264Native": "HTML5 H.264 player",
"mwe-embedplayer-ogg-player-webmNative": "HTML5 WebM player",
"mwe-embedplayer-ogg-player-oggPlugin": "Generic Ogg plugin",
+ "mwe-embedplayer-ogg-player-vlcAppPlayer": "VLC for iOS app",
"mwe-embedplayer-ogg-player-quicktime-mozilla": "QuickTime plugin",
"mwe-embedplayer-ogg-player-quicktime-activex": "QuickTime ActiveX",
"mwe-embedplayer-ogg-player-cortado": "Java Cortado",
@@ -77,5 +78,11 @@
"mwe-embedplayer-video-3gp": "3GP video",
"mwe-embedplayer-video-mpeg": "MPEG video",
"mwe-embedplayer-video-msvideo": "AVI video",
- "mwe-embedplayer-missing-source": "No source video was found"
-}
\ No newline at end of file
+ "mwe-embedplayer-missing-source": "No source video was found",
+ "mwe-embedplayer-vlcapp-intro": "In order to view videos from this site on
an iPhone or iPad, you need the free $1.",
+ "mwe-embedplayer-vlcapp-vlcapplinktext": "VLC app",
+ "mwe-embedplayer-vlcapp-downloadapp": "Download the VLC app from the App
Store",
+ "mwe-embedplayer-vlcapp-openvideo": "Open this video in the VLC app",
+ "mwe-embedplayer-vlcapp-downloadvideo": "Download this video",
+ "mwe-embedplayer-vlcapp-vlcapppopup": "To play videos on this site, you
need the free VLC app. Install now?"
+}
diff --git a/MwEmbedModules/EmbedPlayer/i18n/qqq.json
b/MwEmbedModules/EmbedPlayer/i18n/qqq.json
index cf3c762..df06a9b 100644
--- a/MwEmbedModules/EmbedPlayer/i18n/qqq.json
+++ b/MwEmbedModules/EmbedPlayer/i18n/qqq.json
@@ -22,6 +22,7 @@
"mwe-embedplayer-close_btn": "{{Identical|Close}}",
"mwe-embedplayer-ogg-player-mp3Native": "name of mp3 player in
configuration screen",
"mwe-embedplayer-ogg-player-aacNative": "name of AAC player in
configuration screen",
+ "mwe-embedplayer-ogg-player-VLCApp": "Name for launching video in
external VLC app, in the media player configuration screen. Only shown on
iPhones/iPads"
"mwe-embedplayer-ogg-player-cortado": "{{optional}}",
"mwe-embedplayer-ogg-player-selected": "{{Identical|Selected}}",
"mwe-embedplayer-for_best_experience": "Shown when user's browser
doesn't support playing videos. Parameters:\n* $1 - An empty <a> tag.
Don't use this parameter.",
@@ -29,5 +30,11 @@
"mwe-embedplayer-do_not_warn_again": "Standard message for
disabling\nfuture identical warnings messages",
"mwe-embedplayer-playerSelect": "{{Identical|Player}}",
"mwe-embedplayer-embed_site_or_blog": "title for iframe embed code in
share dialog",
- "mwe-embedplayer-embed_wiki": "title for wiki embed code in share
dialog"
+ "mwe-embedplayer-embed_wiki": "title for wiki embed code in share
dialog",
+ "mwe-embedplayer-vlcapp-intro": "Shown where a video would be on the
page, on iPhones/iPads. Parameter $1 is a link to the App store page for the
vlc app, with the text contianed in the mwe-embedplayer-vlcapp-vlcapplinktext
message. This message is followed by a bulleted list of links consisting of the
messages: mwe-embedplayer-vlcapp-downloadapp, mwe-embedplayer-vlcapp-openvideo,
mwe-embedplayer-vlcapp-openvideo. See also the related
mwe-embedplayer-vlcapp-vlcapppopup message.",
+ "mwe-embedplayer-vlcapp-vlcapplinktext": "Text of the $1 parameter of
mwe-embedplayer-vlcapp-intro. Will be linked to
https://itunes.apple.com/us/app/vlc-for-ios/id650377962?mt=8 (the download page
for the vlc app).",
+ "mwe-embedplayer-vlcapp-downloadapp": "First bullet point after the
mwe-embedplayer-vlcapp-intro. Links to the download page for installing the vlc
app ( https://itunes.apple.com/us/app/vlc-for-ios/id650377962?mt=8 ).",
+ "mwe-embedplayer-vlcapp-openvideo": "Second bullet point after the
mwe-embedplayer-vlcapp-intro. Link will open the video in the VLC app, if the
app is installed",
+ "mwe-embedplayer-vlcapp-downloadvideo": "Third bullet point after the
mwe-embedplayer-vlcapp-intro. Linked directly to the video file",
+ "mwe-embedplayer-vlcapp-vlcapppopup": "Popup dialog box shown to user
if they do not have the VLC app installed when trying to play a video on
iPhone/iPad. Box will be presented with this message and two buttons (OK and
cancel. Actual text of buttons may vary.) If user presses ok, they are
redirected to https://itunes.apple.com/us/app/vlc-for-ios/id650377962?mt=8.";
}
diff --git a/MwEmbedModules/EmbedPlayer/resources/mw.EmbedPlayerVLCApp.js
b/MwEmbedModules/EmbedPlayer/resources/mw.EmbedPlayerVLCApp.js
new file mode 100644
index 0000000..cddbb31
--- /dev/null
+++ b/MwEmbedModules/EmbedPlayer/resources/mw.EmbedPlayerVLCApp.js
@@ -0,0 +1,101 @@
+/**
+ * Play the video using the vlc app on iOS
+ */
+
+( function( mw, $ ) { "use strict";
+
+mw.EmbedPlayerVLCApp = {
+ // List of supported features (or lack thereof)
+ supports: {
+ 'playHead':false,
+ 'pause':false,
+ 'stop':true,
+ 'fullscreen':false,
+ 'timeDisplay':false,
+ 'volumeControl':false
+ },
+
+ // Instance name:
+ instanceOf:'VLCApp',
+
+ /*
+ * Embed this "fake" player
+ *
+ * @return {String}
+ * embed code to link to VLC app
+ */
+ embedPlayerHTML: function() {
+ var fileUrl = this.getSrc( this.seekTimeSec ),
+ vlcUrl = 'vlc://' + (new mw.Uri( fileUrl )).toString(),
+ appStoreUrl =
'//itunes.apple.com/us/app/vlc-for-ios/id650377962',
+ appInstalled = false,
+ promptInstallTimeout,
+ $link,
+ startTime;
+
+ // Replace video with download in vlc link.
+ // the <span> ends up being not used as we get the html via
.html()
+ $link = $( '<span></span>' ).append( $( '<a></a>' ).attr(
'href', appStoreUrl ).append(
+ mw.html.escape( mw.msg(
'mwe-embedplayer-vlcapp-vlcapplinktext' ) )
+ ) );
+ $( this ).html( $( '<div class="vlcapp-player"></div>' )
+ .width( this.getWidth() )
+ .height( this.getHeight() )
+ .append(
+ // mw.msg doesn't have rawParams() equivalent.
Lame.
+ mw.html.escape(
+ mw.msg( 'mwe-embedplayer-vlcapp-intro' )
+ ).replace( /\$1/g, $link.html() )
+ ).append( $( '<ul></ul>' )
+ .append( $( '<li></li>' ).append( $( '<a></a>'
).attr( 'href', appStoreUrl )
+ .text( mw.msg(
'mwe-embedplayer-vlcapp-downloadapp' ) ) )
+ ).append( $( '<li></li>' ).append( $( '<a></a>'
).attr( 'href', vlcUrl )
+ .text( mw.msg(
'mwe-embedplayer-vlcapp-openvideo' ) ) )
+ ).append( $( '<li></li>' ).append( $( '<a></a>'
).attr( 'href', fileUrl )
+ .text( mw.msg(
'mwe-embedplayer-vlcapp-downloadvideo' ) ) )
+ )
+ )
+ );
+
+ // Try to auto-open in vlc.
+ // Based on
http://stackoverflow.com/questions/627916/check-if-url-scheme-is-supported-in-javascript
+
+ $( window ).one( 'pagehide', function() {
+ appInstalled = true;
+ if ( promptInstallTimeout ) {
+ window.clearTimeout( promptInstallTimeout );
+ }
+ } );
+ startTime = (new Date).getTime();
+ try {
+ window.location = vlcUrl;
+ } catch( e ) {
+ // Just to be safe, ignore any exceptions
+ // However, it appears iOS doesn't throw any. Other
browsers do.
+ }
+ promptInstallTimeout = window.setTimeout( function() {
+ var install;
+ if ( appInstalled ) {
+ return;
+ }
+ if ( document.hidden || document.webkitHidden ) {
+ // browser still running, but in background.
+ // probably means an App was opened up.
+ return;
+ }
+ if ( (new Date).getTime() - 15000 > startTime ) {
+ // We switched to VLC more than fifteen seconds
ago.
+ // Probably we succesfully switched and the
other detection
+ // methods failed.
+ return;
+ }
+ install = confirm( mw.msg(
'mwe-embedplayer-vlcapp-vlcapppopup' ) );
+ if ( install ) {
+ window.location = appStoreUrl;
+ }
+ // Note about timeout: iPad air needs longer than an iPhone
+ }, 1000 );
+ }
+};
+
+} )( window.mediaWiki, window.jQuery );
diff --git a/MwEmbedModules/EmbedPlayer/resources/mw.EmbedTypes.js
b/MwEmbedModules/EmbedPlayer/resources/mw.EmbedTypes.js
index aa5ff47..3749f80 100644
--- a/MwEmbedModules/EmbedPlayer/resources/mw.EmbedTypes.js
+++ b/MwEmbedModules/EmbedPlayer/resources/mw.EmbedTypes.js
@@ -76,6 +76,19 @@
//var vlcMimeList = ['video/ogg', 'audio/ogg', 'audio/mpeg',
'application/ogg', 'video/x-flv', 'video/mp4', 'video/h264', 'video/x-msvideo',
'video/mpeg', 'video/3gp'];
//var vlcPlayer = new mw.MediaPlayer( 'vlc-player', vlcMimeList, 'Vlc' );
+var vlcAppPlayer = new mw.MediaPlayer( 'vlcAppPlayer', [
+ 'video/ogg',
+ 'video/ogg; codecs="theora"',
+ 'video/ogg; codecs="theora, vorbis"',
+ 'audio/ogg',
+ 'audio/ogg; codecs="vorbis"',
+ 'audio/ogg; codecs="opus"',
+ 'application/ogg',
+ 'video/webm',
+ 'video/webm; codecs="vp8"',
+ 'video/webm; codecs="vp8, vorbis"',
+], 'VLCApp' );
+
// Generic plugin
//var oggPluginPlayer = new mw.MediaPlayer( 'oggPlugin', ['video/ogg',
'application/ogg'], 'Generic' );
@@ -298,6 +311,9 @@
}
}
+ if ( mw.isIOS() ) {
+ this.mediaPlayers.addPlayer( vlcAppPlayer );
+ }
// Allow extensions to detect and add their own "players"
mw.log("EmbedPlayer::trigger:embedPlayerUpdateMediaPlayersEvent");
$( mw ).trigger( 'embedPlayerUpdateMediaPlayersEvent' ,
this.mediaPlayers );
diff --git a/MwEmbedModules/EmbedPlayer/resources/mw.MediaPlayers.js
b/MwEmbedModules/EmbedPlayer/resources/mw.MediaPlayers.js
index 7d515e9..19e7fde 100644
--- a/MwEmbedModules/EmbedPlayer/resources/mw.MediaPlayers.js
+++ b/MwEmbedModules/EmbedPlayer/resources/mw.MediaPlayers.js
@@ -33,10 +33,10 @@
this.defaultPlayers['application/vnd.apple.mpegurl'] =
['Native'];
- this.defaultPlayers['video/ogg'] = ['Native', 'Vlc', 'Java',
'Generic'];
- this.defaultPlayers['video/webm'] = ['Native', 'Vlc'];
- this.defaultPlayers['application/ogg'] = ['Native', 'Vlc',
'Java', 'Generic'];
- this.defaultPlayers['audio/ogg'] = ['Native', 'Vlc', 'Java' ];
+ this.defaultPlayers['video/ogg'] = ['Native', 'Vlc', 'Java',
'Generic', 'VLCApp'];
+ this.defaultPlayers['video/webm'] = ['Native', 'Vlc', 'VLCApp'];
+ this.defaultPlayers['application/ogg'] = ['Native', 'Vlc',
'Java', 'Generic', 'VLCApp'];
+ this.defaultPlayers['audio/ogg'] = ['Native', 'Vlc', 'Java',
'VLCApp'];
this.defaultPlayers['audio/mpeg']= ['Native', 'Kplayer'];
this.defaultPlayers['audio/mp3']= ['Native', 'Kplayer'];
this.defaultPlayers['audio/mp4']= ['Native'];
diff --git
a/MwEmbedModules/EmbedPlayer/resources/skins/mw.PlayerControlBuilder.js
b/MwEmbedModules/EmbedPlayer/resources/skins/mw.PlayerControlBuilder.js
index bea9458..98602da 100644
--- a/MwEmbedModules/EmbedPlayer/resources/skins/mw.PlayerControlBuilder.js
+++ b/MwEmbedModules/EmbedPlayer/resources/skins/mw.PlayerControlBuilder.js
@@ -1354,6 +1354,11 @@
return false;
}
+ // Not a lot of good options for an iPhone
+ if( this.embedPlayer.instanceOf == 'VLCApp' ){
+ return false;
+ }
+
// Chrome's webM support is oky though:
if( /chrome/.test(navigator.userAgent.toLowerCase() ) &&
mw.EmbedTypes.getMediaPlayers().getMIMETypePlayers(
'video/webm' ).length ){
--
To view, visit https://gerrit.wikimedia.org/r/144349
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I6c3b5d8aadbd69577df3fe513f780f69708450d5
Gerrit-PatchSet: 3
Gerrit-Project: mediawiki/extensions/TimedMediaHandler
Gerrit-Branch: master
Gerrit-Owner: Brian Wolff <bawolff...@gmail.com>
Gerrit-Reviewer: Brian Wolff <bawolff...@gmail.com>
Gerrit-Reviewer: Brion VIBBER <br...@wikimedia.org>
Gerrit-Reviewer: Gilles <gdu...@wikimedia.org>
Gerrit-Reviewer: Siebrand <siebr...@kitano.nl>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
