Hide passed tests
Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; ClaudeBot/1.0; +claudebot@anthropic.com) Running...
Running Thumbnail Player embed test : Testing Thumb embed test markup, will be hidden
Thumbnail embed
The thumbnail embed method takes the same arguments as "kWidget.embed".
Thumbnail embed will pass all the configuration to the kWidget.embed when the user "click" on the play button.
The player context menu can be disabled by setting the "EmbedPlayer.DisableContextMenu" UIVar to true.
<div id="myEmbedTarget" style="width:400px;height:330px;"></div>
<script src="{{HTML5LibraryURL}}"></script>
<script>
mw.setConfig("EmbedPlayer.DisableContextMenu",true);
kWidget.thumbEmbed({
'targetId': 'myEmbedTarget',
'wid': '_243342',
'uiconf_id' : '12905712',
'entry_id' : '0_uka1msg4',
});
</script>
Here are several embed modes to compare performance when embedding lots of players on a single page.
Default:( Thumb embed )
Force Mobile HTML5 ( thumbs )
Force No thumbs Flash ( warning resource intensive ).
Force No thumbs HTML5 ( warning resource intensive )
Custom play button
You can override the playButton with on-page CSS:
.kWidgetPlayBtn {
background: url("flower.jpg");
}
Play video content
Custom Thumbnail embed HTML
Load the entry data from the API, then embed with captureClickEventForiOS flag for one click playback for iOS
var entryId = '0_uka1msg4';
new kWidget.api( {
'wid' : '_243342',
}).doRequest({
'service' : 'baseentry',
'action' : 'list',
'filter:objectType' : 'KalturaBaseEntryFilter',
'filter:idEqual' : entryId
}, function(data){
if( !data.objects || !data.objects[0] ){
kWidget.log('Error getting entry')
return ;
}
var entry = data.objects[0];
var settings = {
'targetId': 'player-target',
'wid' : '_243342',
'entry_id': entryId,
'uiconf_id': '20540612',
// since we already have the click gesture run kWiget embed with special capture click flag:
'captureClickEventForiOS' : true
}
// set callbakck to play on media ready ( works in iOS since we captured user gesture above)
settings.readyCallback = function (playerId) {
// issue a play ( since we already clicked the play button )
var kdp = document.getElementById(playerId);
kdp.kBind('mediaReady', function () {
kdp.sendNotification('doPlay');
});
}
$('#player-target')
.append(
'<div style="position: relative; width: 100%; height: 100%;">' +
'<img class="kWidgetCentered" src="' + kWidget.getKalturaThumbUrl(settings) + '"">' +
'<div class="kWidgetCentered kWidgetPlayBtn"></div>' +
'<div style="position:absolute;top:10px;left:10px;width:300px;background-color:black;color:white">' +
entry.name + ' ' + entry.duration + ' seconds ' +
'</div>' +
'</div>'
)
.click(function(){
kWidget.embed(settings);
})
})