Explore the community Forums Lectora Lectora Questions & Answers Video Player Button Alt Tags Reply To: Video Player Button Alt Tags

#427681 Score: 0
Profile photo of Johnattan Barona
Johnattan Barona
Member
beginner
intermediate
wise owl
contributor
curious george
8 pts
@jbarona9656

Hi Ryan,

Here is a solution I came up with as you cannot do it within the Lectora title without a little scripting.

First, create an HTML Extension at the Title Level, set the type to Header Scripting and copy paste the text below.

Replace the bolded text with the text you would like to have in the alt text. Unfortunately, this does not work for the mute button due to how it is programmed. It would require you to modify the javascript file, if you would like instructions to do this I can point you to the file and the text that needs changing.

 

ObjMedia.prototype.BuildMediaString = function () {
var autoStr=”
var contStr=”
var scaleStr=”
var pluginType = ”
var width=this.w
var height=this.h
var addIEheight=20
this.isPlaying = this.bAutoStart;
if( this.isPlaying ) autoStr = ‘ AUTOSTART=”TRUE”‘
else autoStr = ‘ AUTOSTART=”FALSE”‘

if(!this.MEJSMedia())
{
if(this.source.indexOf(“.mov”) >= 0)
{
this.mediaType = ‘quick’;
pluginType = ‘type=video/x-mov’;
if( this.c == 0) height += addIEheight;
scaleStr=’ scale=”tofit”‘;
}
else if ( this.source.indexOf(“.mp”) >= 0 )
{
if( this.c )
contStr += ‘ ShowControls=”TRUE”‘
else
contStr += ‘ ShowControls=”FALSE”‘
}
else if(this.source.indexOf(“.wav”) >= 0)
{
this.mediaType = ‘media’
if( !is.ns ) {
if( this.c ) {
contStr += ‘ ShowControls=”TRUE”‘
height += addIEheight
}
else contStr += ‘ ShowControls=”FALSE”‘
}
}
else if( this.source.indexOf(“.avi”) >= 0 || this.source.indexOf(“.wmv”) >= 0 || this.source.indexOf(“.asf”) >= 0 )
{
this.mediaType = ‘media’
if( !is.ns ) {
if( this.c ) {
contStr += ‘ ShowControls=”TRUE”‘
height += addIEheight
}
else contStr += ‘ ShowControls=”FALSE”‘
}
}
else if( this.source.indexOf(“.wma”) >= 0 )
this.mediaType = ‘media’;
else if( this.c )
{
this.mediaType = ‘quick’
if( is.ns )
{
var plugin = “audio/x-mpeg\””
var mimeType = eval( “navigator.mimeTypes[\”” + plugin + “]”)
if( mimeType && (!mimeType.enabledPlugin || mimeType.enabledPlugin.name.indexOf( “QuickTime” ) < 0) ) {
width = 145
height = 60
}
}
else if( is.ieMac )
height -= 10;
if( !is.ns )
height += addIEheight;
}
else if( this.source.indexOf(“.rm”) >= 0 || this.source.indexOf(“.ram”) >= 0 )
{
this.mediaType = ‘real’
if( this.name.indexOf(“video”) >= 0 )
{
contStr += ‘ controls=”ImageWindow’
if( this.c ) contStr+=’,ControlPanel’
contStr += ‘”‘
} else if ( this.c ) contStr=’ controls=”ControlPanel”‘
}

this.embed = ‘<EMBED’ +this.source+contStr;
this.embed += ‘ WIDTH=’ + width + ‘ HEIGHT=’ + height ;
this.embed += ‘ NAME=’ + this.name;
this.embed += autoStr+scaleStr+this.loopString+pluginType+’>\n’;
}
else //If it not any of the cases above we can assume it is media element compatible
{
var THIS=this;
//Setup the Media Element options
var capSelection = -1;
if(typeof (window.VarTrivSelCap) == “object”)
{
var capSel = window.VarTrivSelCap.getValue();
for (var i = 0; i < this.capLang.length; i++)
{
if( capSel == this.capLang[i])
{
capSelection = i;
break;
}
}
}

this.mediaOptions = {
enablePluginDebug: false,
plugins: [‘flash’,’youtube’,’vimeo’],
type: ”,
pluginPath: ‘MediaPlayer/’,
flashName: ‘flashmediaelement.swf’,
defaultVideoWidth: 480,
defaultVideoHeight: 270,
pluginWidth: -1,
pluginHeight: -1,
timerRate: 250,
bAutoPlay: this.bAllowAutoStart?this.bAutoStart:false,
pluginVars: [“smoothing=true”] ,
// fires when a problem is detected
error: function (){ console.log( “error creating media element” );}};
this.playerOptions = {
enablePluginDebug: false,
plugins: [‘flash’,’youtube’,’vimeo’],
type: ”,
pluginPath: ‘MediaPlayer/’,
flashName: ‘flashmediaelement.swf’,
flashStreamer : “”,
pluginWidth: -1,
pluginHeight: -1,
timerRate: 250,
bAutoPlay: this.bAllowAutoStart?this.bAutoStart:false,
pluginVars: [“smoothing=true”] ,
enablePluginSmoothing : true,
hideVolumeOnTouchDevices : false,
audioVolume : ‘vertical’,
defaultVideoWidth: 480,
defaultVideoHeight: 270,
videoWidth: -1,
videoHeight: -1,
audioWidth: this.w,
audioHeight: this.h,
startVolume: this.initVol,
loop: this.bLoop,
enableAutosize: true,
features: (!this.bControl)?[‘tracks’]:[‘playpause’,’progress’,’current’,’duration’,’tracks’,’volume’,’fullscreen’],
alwaysShowControls: this.bRollControl,
hideVideoControlsOnLoad: this.bRollControl,
iPadUseNativeControls: false,
iPhoneUseNativeControls: false,
AndroidUseNativeControls: false,
alwaysShowHours: false,
showTimecodeFrameCount: false,
framesPerSecond: 25,
enableKeyboard: this.bEnableKeys,
pauseOtherPlayers: this.bSinglePlay,
keyActions: [],
startLanguage:((capSelection == -1)?’none’:this.capLang[capSelection]),
translationSelector:((this.capFile.length>1)?true:false),
toggleCaptionsButtonWhenOnlyOne:is.ie8?true:false,
playText: ‘Play‘,
pauseText: ‘Pause‘,
fullscreenText: ‘Fullscreen‘,
tracksText: ‘Captions/Subtitles‘,
success:function(mediaElem, domObj){

THIS.mePlayer = mediaElem;

//Youtube videos dont have mediaElement.player so we get it from domObject instead
if(!mediaElem.player)
mediaElem.player = domObj.player;

if (THIS.bAutoPlay || THIS.mePlayerDoPlay)
{
THIS.mePlayerDoPlay = n;
THIS.play();
}

triv$(mediaElem).bind(‘ended’, function()
{
if(THIS.onDone)
THIS.onDone();
if(THIS.bLoop)
THIS.play();
});

THIS.initEvent(mediaElem);

triv$(“.mejs-overlay-button,.mejs-overlay-loading”, THIS.div).css({
‘display’: ‘none’
});
triv$(“.mejs-overlay-button,.mejs-overlay-play”, THIS.div).css({
‘display’: ‘block’
});
if(mediaElem.player){
triv$(‘#’ + mediaElem.player.id + ‘_captions_en’, getDisplayDocument()).prop(‘checked’,’true’).click(function(){
if(typeof (getDisplayWindow().VarTrivSelCap) == “object”)
VarTrivSelCap.set(this.value); });
triv$(‘#’ + mediaElem.player.id + ‘_captions_none’, getDisplayDocument()).prop(‘checked’,’true’).click(function(){
if(typeof (getDisplayWindow().VarTrivSelCap) == “object”)
VarTrivSelCap.set(“none”); });
/*if(THIS.bHasCaption){ //repeating this in publish because audio/snd html is already set when this is called in wndObjDesignTime
$(“.mejs-captions-position,mejs-captions-position-hover” , THIS.div).css({‘bottom’ : THIS.h – 6 + ‘px’});
}*/
if(!THIS.bRollControl)
triv$(“.mejs-controls”, THIS.div).css(‘bottom’, ‘0px’);

if (mediaElem.player)
mediaElem.player.load();
else if(THIS.mediaPlayer)
THIS.mediaPlayer.load();
//LO-2823 this was only being called by mediaelement player on play event before so fullscreen prior to playing breaks
if (mediaElem.player)
mediaElem.player.detectFullscreenMode();

//override enterFullScreen and exitFullScreen methods in media-element-and-player.js
var meFS = mediaElem.player.enterFullScreen;
var meExitFS = mediaElem.player.exitFullScreen;

mediaElem.player.enterFullScreen = function(){
meFS.call(this);
var page = GetCurrentPageDiv();
if(page && !is.iOS)
{
page.style.clip = “auto”;
page.style.width = “100%”;
page.style.height = “100%”;
this.normalLeft = page.style.left;
this.transformScale = page.style.transform;
}
if(this.container && this.container.length > 0 && !is.iOS)
this.container[0].parentNode.style.zIndex = “9001”;

THIS.isFullScreen = true;
if(!is.iOS && !is.safari){
this.fixForFullScreenPos = this.container.find(‘.mejs-controls’).css(‘bottom’);
this.container.find(‘.mejs-controls’).css(‘bottom’, ‘0px’);
}
};

mediaElem.player.exitFullScreen = function(){
if(THIS.isFullScreen)
{
meExitFS.call(this);
THIS.isFullScreen = false;

var page = GetCurrentPageDiv();
if(page)
{
page.style.clip = “”;
page.style.width = “”;
page.style.height = “”;
page.style.left = this.normalLeft;
page.style.transform = this.transformScale;
}

if(this.container && this.container.length > 0)
this.container[0].parentNode.style.zIndex = “”;

if(!is.iOS && !is.safari){
this.container.find(‘.mejs-controls’).css(‘bottom’, this.fixForFullScreenPos);
}
rebuildLayout();
}
};

var duration = null;
mediaElem.addEventListener(‘timeupdate’,function() {
if (duration !== THIS.duration) {
try{
duration = this.duration;
mejs.Utility.calculateTimeFormat(duration, mediaElem.player.options, mediaElem.player.options.framesPerSecond || 25);
mediaElem.player.setControlsSize();
}
catch (e)
{
console.log(“Error” + e);
}
}
}, false);

mediaElem.addEventListener(‘play’, function(e) {
triv$(‘.mejs-overlay-loading’, THIS.div).parent().hide();
triv$(‘.mejs-overlay-button’, THIS.div).show();
}, false);

if(is.ie9)
{
THIS.mePlayer.setVideoSize(this.w, this.h);
}
}

},
error: function (){
console.log( “error creating media element player” );
}
};

this.bMediaEle = true;
}
}