preview embed type selectors NB: changes to embed.js
This commit is contained in:
parent
20ef805c0c
commit
9b9923b6d5
4 changed files with 127 additions and 61 deletions
22
lsp/main.js
22
lsp/main.js
|
@ -1323,13 +1323,29 @@ function buildstreamembed(streamName,embedbase) {
|
||||||
var script = document.createElement('script');
|
var script = document.createElement('script');
|
||||||
script.src = embedbase+'embed_'+streamName+'.js';
|
script.src = embedbase+'embed_'+streamName+'.js';
|
||||||
script.onload = function(){
|
script.onload = function(){
|
||||||
|
if (typeof mistvideo[streamName].error != 'undefined') {
|
||||||
|
$('#preview-container').text(mistvideo[streamName].error);
|
||||||
|
}
|
||||||
|
else {
|
||||||
var priority = mistvideo[streamName].source;
|
var priority = mistvideo[streamName].source;
|
||||||
if (priority.length > 0) {
|
if (priority.length > 0) {
|
||||||
|
$radio = $('<input>').attr('type','radio').attr('name','forcetype').attr('title','The embed type that is being used.').change(function(){
|
||||||
|
$('#preview-container').attr('data-forcetype',$(this).val()).html('');
|
||||||
|
|
||||||
|
var script = document.createElement('script');
|
||||||
|
script.src = embedbase+'embed_'+streamName+'.js';
|
||||||
|
script.onload = function(){
|
||||||
|
|
||||||
|
};
|
||||||
|
document.getElementById('preview-container').appendChild( script );
|
||||||
|
});
|
||||||
priority.sort(function(a,b){
|
priority.sort(function(a,b){
|
||||||
return b.priority - a.priority;
|
return b.priority - a.priority;
|
||||||
});
|
});
|
||||||
var $table = $('<table>').html(
|
var $table = $('<table>').html(
|
||||||
$('<tr>').html(
|
$('<tr>').html(
|
||||||
|
$('<th>')
|
||||||
|
).append(
|
||||||
$('<th>').text('URL')
|
$('<th>').text('URL')
|
||||||
).append(
|
).append(
|
||||||
$('<th>').text('Type')
|
$('<th>').text('Type')
|
||||||
|
@ -1340,6 +1356,10 @@ function buildstreamembed(streamName,embedbase) {
|
||||||
for (var i in priority) {
|
for (var i in priority) {
|
||||||
$table.append(
|
$table.append(
|
||||||
$('<tr>').html(
|
$('<tr>').html(
|
||||||
|
$('<td>').html(
|
||||||
|
$radio.clone(true).attr('data-name',priority[i].type).val(i)
|
||||||
|
)
|
||||||
|
).append(
|
||||||
$('<td>').text(priority[i].url)
|
$('<td>').text(priority[i].url)
|
||||||
).append(
|
).append(
|
||||||
$('<td>').text(priority[i].type)
|
$('<td>').text(priority[i].type)
|
||||||
|
@ -1349,11 +1369,13 @@ function buildstreamembed(streamName,embedbase) {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
$('#listprotocols').html($table);
|
$('#listprotocols').html($table);
|
||||||
|
$table.find('[name=forcetype][data-name="'+mistvideo[streamName].embedded_type+'"]').attr('checked','checked');
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
$('#listprotocols').html('No data in info embed file.');
|
$('#listprotocols').html('No data in info embed file.');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
document.getElementById('preview-container').appendChild( script );
|
document.getElementById('preview-container').appendChild( script );
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
12
lsp/pages.js
12
lsp/pages.js
|
@ -294,9 +294,19 @@ function showTab(tabName,streamName) {
|
||||||
},10000);
|
},10000);
|
||||||
updateOverview();
|
updateOverview();
|
||||||
|
|
||||||
if (!settings.settings.config.capabilities) { saveAndReload(); }
|
|
||||||
|
|
||||||
break;
|
break;
|
||||||
case 'protocols':
|
case 'protocols':
|
||||||
|
|
||||||
|
if (typeof settings.settings.capabilities == 'undefined') {
|
||||||
|
getData(function(data){
|
||||||
|
settings.settings.capabilities = data.capabilities;
|
||||||
|
showTab('protocols');
|
||||||
|
},{capabilities:true});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
var $tbody = $('<tbody>').attr('id','protocols-tbody');
|
var $tbody = $('<tbody>').attr('id','protocols-tbody');
|
||||||
|
|
||||||
$('#page').html(
|
$('#page').html(
|
||||||
|
|
|
@ -2,22 +2,31 @@
|
||||||
<head>
|
<head>
|
||||||
<title>Test the stream embedding</title>
|
<title>Test the stream embedding</title>
|
||||||
<style></style>
|
<style></style>
|
||||||
<script src=jquery.js></script>
|
<script src=plugins/jquery.js></script>
|
||||||
<script src='../src/connectors/embed.js'></script>
|
<script src='../src/connectors/embed.js'></script>
|
||||||
<script>
|
<script>
|
||||||
|
var embed_settings = {};
|
||||||
$(function(){
|
$(function(){
|
||||||
$('button').click(function(){
|
$('button#embed').click(function(){
|
||||||
$('#embedcontainer').html('');
|
$('#embedcontainer, #button_container').html('');
|
||||||
|
|
||||||
var streamName = $(this).parent().children('input').val();
|
var streamName = $('input[name=streamName]').val();
|
||||||
|
var embedtype = $('input[name=force]').val();
|
||||||
|
|
||||||
var info = document.createElement('script');
|
var info = document.createElement('script');
|
||||||
info.src = 'http://localhost:8080/info_'+streamName+'.js';
|
info.src = 'http://localhost:8080/info_'+streamName+'.js';
|
||||||
document.getElementById('embedcontainer').appendChild(info);
|
document.getElementById('embedcontainer').appendChild(info);
|
||||||
info.onload = function(){
|
info.onload = function(){
|
||||||
|
if (embedtype == '') {
|
||||||
|
$('#embedcontainer').removeAttr('data-forcetype');
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
$('#embedcontainer').attr('data-forcetype',embedtype);
|
||||||
|
}
|
||||||
|
$('#embedcontainer').append(
|
||||||
|
$('<div>').text('Embedded: '+mistembed(streamName))
|
||||||
|
);
|
||||||
console.log(mistvideo[streamName]);
|
console.log(mistvideo[streamName]);
|
||||||
|
|
||||||
mistembed(streamName);
|
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
@ -26,11 +35,14 @@
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<label>
|
<label>
|
||||||
Enter the streamname:
|
Enter the streamname: <input type=text value=bunny name=streamName>
|
||||||
<input type=text></input>
|
</label><br>
|
||||||
<button>Get video info</button>
|
<label>
|
||||||
</label>
|
Force embed type number: <input type=number name=force min=1> (blank for auto)
|
||||||
<div id=embedcontainer>
|
</label><br>
|
||||||
|
<button id=embed>Embed</button>
|
||||||
|
<div id=button_container></div>
|
||||||
|
<div id=embedcontainer style="width: 100%; height: 35em;">
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
|
@ -115,6 +115,7 @@ function mistembed(streamname)
|
||||||
}
|
}
|
||||||
|
|
||||||
var maintype = parseType(src.type);
|
var maintype = parseType(src.type);
|
||||||
|
mistvideo[streamname].embedded_type = src.type;
|
||||||
|
|
||||||
switch(maintype[0])
|
switch(maintype[0])
|
||||||
{
|
{
|
||||||
|
@ -130,7 +131,7 @@ function mistembed(streamname)
|
||||||
flashplayer = 'http://fpdownload.adobe.com/strobe/FlashMediaPlayback.swf';
|
flashplayer = 'http://fpdownload.adobe.com/strobe/FlashMediaPlayback.swf';
|
||||||
}
|
}
|
||||||
|
|
||||||
container.innerHTML = '<object width="' + videowidth + '" height="' + videoheight + '">' +
|
container.innerHTML += '<object width="' + videowidth + '" height="' + videoheight + '">' +
|
||||||
'<param name="movie" value="' + flashplayer + '"></param>' +
|
'<param name="movie" value="' + flashplayer + '"></param>' +
|
||||||
'<param name="flashvars" value="src=' + url + '"></param>' +
|
'<param name="flashvars" value="src=' + url + '"></param>' +
|
||||||
'<param name="allowFullScreen" value="true"></param>' +
|
'<param name="allowFullScreen" value="true"></param>' +
|
||||||
|
@ -141,27 +142,30 @@ function mistembed(streamname)
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case 'html5':
|
case 'html5':
|
||||||
container.innerHTML = '<video width="' + videowidth + '" height="' + videoheight + '" src="' + encodeURI(src.url) + '" controls="controls" ><strong>No HTML5 video support</strong></video>';
|
container.innerHTML += '<video width="' + videowidth + '" height="' + videoheight + '" src="' + encodeURI(src.url) + '" controls="controls" ><strong>No HTML5 video support</strong></video>';
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case 'silverlight':
|
case 'silverlight':
|
||||||
container.innerHTML = '<object data="data:application/x-silverlight," type="application/x-silverlight" width="' + videowidth + '" height="' + videoheight + '"><param name="source" value="' + encodeURI(src.url) + '/player.xap"/><param name="onerror" value="onSilverlightError" /><param name="autoUpgrade" value="true" /><param name="background" value="white" /><param name="enableHtmlAccess" value="true" /><param name="minRuntimeVersion" value="3.0.40624.0" /><param name="initparams" value =\'autoload=false,autoplay=true,displaytimecode=false,enablecaptions=true,joinLive=true,muted=false,playlist=<playList><playListItems><playListItem title="Test" description="testing" mediaSource="' + encodeURI(src.url) + '" adaptiveStreaming="true" thumbSource="" frameRate="25.0" width="" height=""></playListItem></playListItems></playList>\' /><a href="http://go.microsoft.com/fwlink/?LinkID=124807" style="text-decoration: none;"> <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none" /></a></object>';
|
container.innerHTML += '<object data="data:application/x-silverlight," type="application/x-silverlight" width="' + videowidth + '" height="' + videoheight + '"><param name="source" value="' + encodeURI(src.url) + '/player.xap"/><param name="onerror" value="onSilverlightError" /><param name="autoUpgrade" value="true" /><param name="background" value="white" /><param name="enableHtmlAccess" value="true" /><param name="minRuntimeVersion" value="3.0.40624.0" /><param name="initparams" value =\'autoload=false,autoplay=true,displaytimecode=false,enablecaptions=true,joinLive=true,muted=false,playlist=<playList><playListItems><playListItem title="Test" description="testing" mediaSource="' + encodeURI(src.url) + '" adaptiveStreaming="true" thumbSource="" frameRate="25.0" width="" height=""></playListItem></playListItems></playList>\' /><a href="http://go.microsoft.com/fwlink/?LinkID=124807" style="text-decoration: none;"> <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none" /></a></object>';
|
||||||
break;
|
break;
|
||||||
|
|
||||||
|
|
||||||
case 'fallback':
|
case 'fallback':
|
||||||
container.innerHTML = '<strong>No support for any player found</strong>';
|
container.innerHTML += '<strong>No support for any player found</strong>';
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
var video = mistvideo[streamname],
|
var video = mistvideo[streamname],
|
||||||
container = document.createElement('div'),
|
container = document.createElement('div'),
|
||||||
scripts = document.getElementsByTagName('script'),
|
scripts = document.getElementsByTagName('script'),
|
||||||
me = scripts[scripts.length - 1];
|
me = scripts[scripts.length - 1];
|
||||||
|
|
||||||
|
if (me.parentNode.hasAttribute('data-forcetype')) {
|
||||||
|
var forceType = me.parentNode.getAttribute('data-forcetype');
|
||||||
|
}
|
||||||
|
|
||||||
if (video.width == 0) { video.width = 250; }
|
if (video.width == 0) { video.width = 250; }
|
||||||
if (video.height == 0) { video.height = 250; }
|
if (video.height == 0) { video.height = 250; }
|
||||||
|
|
||||||
|
@ -188,6 +192,22 @@ function mistembed(streamname)
|
||||||
foundPlayer = false,
|
foundPlayer = false,
|
||||||
len = video.source.length;
|
len = video.source.length;
|
||||||
|
|
||||||
|
if (typeof forceType != 'undefined') {
|
||||||
|
i = forceType;
|
||||||
|
if (typeof video.source[i] == 'undefined') {
|
||||||
|
container.innerHTML = '<strong>Invalid force integer ('+i+').</strong>';
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
if ( hasSupport(video.source[i].type) ) {
|
||||||
|
buildPlayer(video.source[i], container.parentNode, video.width, video.height, vtype);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
container.innerHTML = '<strong>Your browser does not support the type "'+video.source[i].type+'".</strong>';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
|
||||||
for(i = 0; i < len; i++)
|
for(i = 0; i < len; i++)
|
||||||
{
|
{
|
||||||
//console.log("trying support for type " + video.source[i].type + " (" + parseType(video.source[i].type)[0] + " - " + parseType(video.source[i].type)[1] + ")");
|
//console.log("trying support for type " + video.source[i].type + " (" + parseType(video.source[i].type)[0] + " - " + parseType(video.source[i].type)[1] + ")");
|
||||||
|
@ -208,5 +228,7 @@ function mistembed(streamname)
|
||||||
buildPlayer({type: 'fallback'}, container.parentNode, video.width, video.height);
|
buildPlayer({type: 'fallback'}, container.parentNode, video.width, video.height);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return (typeof mistvideo[streamname].embedded_type != 'undefined' ? mistvideo[streamname].embedded_type : false);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Reference in a new issue