разобрался
вот проверенный рабочий код
Код:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script>
var channelNames = new Array(
"01 ТВ3",
"02 Первый игровой",
"03 СТС",
"04 РБК",
"05 Звезда",
"06 НТВ",
"07 ТНТ",
"08 ДТВ",
"09 Россия 2",
"10 Luxe TV",
"11 2x2",
"12 Fashion",
"13 Россия 1",
"14 ТВЦ Сибирь",
"15 О2 ТВ",
"16 RU ТВ",
"17 Life",
"18 Style TV",
"19 Агро ТВ",
"20 ТРО",
"21 СГУ ТВ",
"22 МИР",
"23 MTV",
"24 РЖД",
"25 Music BOX",
"26 Music BOX",
"27 Юмор ТВ",
"28 5 Канал",
"29 7 ТВ",
"30 Россия К",
"31 Радость моя",
"32 "
);
var channelCount = channelNames.length;
var channelCurrent = 1;
var mode = 'preview'; /* Mayby fullscreen or preview*/
var channelbaseurl = 'udp://224.1.1.'
var firstgen;
var tv;
var firstkey = false;
function stbObjects()
{
if (window.navigator.appName == 'Netscape')
return false;
if(typeof(stb) =='undefined') stb=new Stb();
if(typeof(stb_media) =='undefined') stb_media=new Stb_Media();
if(typeof(webbrowser)=='undefined') webbrowser=new Webbrowser();
if(typeof(stb) =='undefined') {window.alert('Error: check of plugins Stb failed'); return false;}
if(typeof(stb_media) =='undefined') {window.alert('Error: check of plugins Stb_Media failed'); return false;}
if(typeof(webbrowser)=='undefined') {window.alert('Error: check of plugins Webbrowser failed'); return false;}
return true;
}
function initTV ()
{
tv=new Object();
if (!stbObjects()) return false;
tv.nameDiv = document.getElementById('channel_name');
tv.channelCount = channelCount;
tv.channelCurrent = channelCurrent;
tv.channelListItemTop = 0;
tv.state = 'idle';
tv.mode = mode;
tv.channelbaseurl = channelbaseurl;
stb.volup();
stb.voldown();
tv.volup = function ()
{
stb.volup();
}
tv.voldown = function ()
{
stb.voldown();
}
tv.channelinit = function ()
{
return true;
}
tv.channelStop = function ()
{
if (!stbObjects()) return false;
if (stb_media.eventCode) stb_media.stop();
this.updateMode();
return true;
}
tv.channelPlay = function ()
{
if (!stbObjects()) return false;
if (this.channelCurrent < 1 || this.channelCurrent > 255 )
{
window.alert('This version accept channel only in 1..255 range');
return false;
}
stb_media.play(this.channelbaseurl + this.channelCurrent + ':1234');
this.updateMode();
return true;
}
tv.setMode = function (mode)
{
this.mode = mode;
this.updateMode();
}
tv.updateMode = function ()
{
if (!stbObjects()) return false;
if (this.mode == 'fullscreen')
{
document.getElementById("channel_list").style.display = 'none';
document.getElementById("preview" ).style.display = 'none';
stb_media.setTransparentColor(0x000000);
stb_media.setPIG(true,800,600,0,0);
//stb_media.setTransparentColor(0xffC0C0C0);
//stb_media.setAlphaLevel(0);
//stb_media.setPIG(false);
}
if (this.mode == 'preview')
{
document.getElementById("channel_list").style.display = 'block';
document.getElementById("preview" ).style.display = 'block';
stb_media.setTransparentColor(0x000000);
stb_media.setAlphaLevel(255);
stb_media.setPIG(true,300,200,350,100);
}
return true;
}
tv.setChannel =
function (channel)
{
if (channel == this.channelCurrent) return true;
this.channelStop();
channel = (channel <= this.channelCount)?(channel):(this.channelCount);
this.channelCurrent=channel;
this.drawSelectedChannel();
this.channelPlay();
this.updateMode();
this.displayChannelName();
return true;
}
tv.displayChannelName =
function ()
{
if (this.mode == 'fullscreen')
{
this.nameDiv.innerHTML = channelNames[this.channelCurrent - 1];
this.nameDiv.style.display = 'block';
setTimeout("document.getElementById('channel_name').style.display = 'none'", 4000);
}
return true;
}
tv.drawSelectedChannel =
function ()
{
this.channelListItemTop = 75 - (this.channelCurrent - 1) * 60;
channelItems = document.getElementsByTagName('span');
for ( i = 0 ; i < channelItems.length ; i ++ )
{
class = channelItems[i].getAttribute('class');
if ( class && ( class == 'channel' || class == 'channel_selected' ))
{
channelItems[i].style.top = this.channelListItemTop + 'px';
if (channelItems[i].getAttribute('id') == 'channel' + this.channelCurrent )
channelItems[i].setAttribute('class', 'channel_selected')
else
channelItems[i].setAttribute('class', 'channel')
}
}
return true;
}
tv.nextChannel =
function ()
{
channel = this.channelCurrent;
channel ++;
// Return to first if over last channel
channel = (channel > this.channelCount)?(1):(channel);
this.setChannel(channel);
}
tv.prevChannel =
function ()
{
channel = this.channelCurrent;
channel --;
// Return to first if over last channel
channel = (channel < 1)?(this.channelCount):(channel);
this.setChannel(channel);
}
return tv;
}
function keyHandler(event)
{
var key = event.keyCode ? event.keyCode : event.which;
if ( firstkey )
{
if ( key <= 0x39 && key >= 0x30 ) { tv.setChannel((firstkey - 0x30)*10 + key - 0x30 ); firstkey = false; }
else firstkey = false;
}
else if ( key <= 0x39 && key >= 0x30 ) firstkey = key ;
switch (key)
{
case 0x30: // 0
break;
case 0x31: // 1
break;
case 0x32: // 2
break;
case 0x33: // 3
break;
case 0x34: // 4
break;
case 0x35: // 5
break;
case 0x36: // 6
break;
case 0x37: // 7
break;
case 0x38: // 8
break;
case 0x39: // 9
break;
case 13: // Enter
tv.setMode('fullscreen');
tv.displayChannelName();
break;
case 8: // Del
break;
case 113: // Back
tv.setMode('preview');
break;
case 38: // Up
case 33: // Channel +
tv.nextChannel();
break;
case 40: // Down
case 34: // Channel -
tv.prevChannel();
break;
case 37: // Left
tv.voldown();
break;
case 39: // Right
tv.volup();
break;
default:
break;
}
}
function initPage()
{
if(typeof(tv) =='undefined') tv=initTV();
channel_list = document.getElementById("channel_list");
channelListItemTop = 75 - (channelCurrent - 1) * 60;
for ( i = 1 ; i <= tv.channelCount ; i ++ )
{
item = document.createElement('span');
item.setAttribute('class', ((i == channelCurrent)?('channel_selected'):('channel'))); // эта строка возможно неправильна
item.setAttribute('id', 'channel'+i);
item.style.top = channelListItemTop + 'px';
text = document.createTextNode((channelNames[i-1] != "" && typeof(channelNames[i-1]) !='undefined')?channelNames[i-1]:i);
item.appendChild(text);
channel_list.appendChild(item);
item = document.createElement('br');
channel_list.appendChild(item);
}
document.addEventListener( "keypress", keyHandler, false );
if (!stbObjects()) return false;
tv.channelinit();
tv.channelPlay();
}
function exitPage()
{
if (!stbObjects()) return false;
stb_media.stop();
stb_media.setAlphaLevel(255);
stb.save_vol();
}
window.onunload=exitPage;
window.onload=initPage;
//window.onkeyup=keyHandler(event);
</script>
<style>
#channel_list
{
padding: -100px;
width:220px;
height:300px;
overflow: hidden;
font-size:20px;
text-align:center;
margin-left:40px;
margin-top:40px;
padding: 10px;
border: 3px solid red;
}
span.channel
{
position: relative;
top: -250px;
left: 25px;
width: 150px;
height: 30px;
margin-left: 10px;
font-size: 20px;
text-align: center;
vertical-align: middle;
color: black;
background-color: white;
border: 2px solid white;
display: block;
}
span.channel_selected
{
position: relative;
top: -250px;
left: 25px;
width: 173px;
height: 50px;
font-size: 24px;
text-align: center;
vertical-align: middle;
color: white;
background-color: green; //black
border: 2px solid white;
display: block;
}
div#channel_name
{
position: absolute;
display: none;
font-size: 50px;
width: 400px;
height: 100px;
left: 100px;
top: 50px;
z-index: 10;
border: 2px solid white;
color: #00FF00;
background-color: #101010;
}
div#preview
{
position: absolute;
width: 304px;
height: 206px;
left: 348px;
top: 96px;
z-index: 10;
border: 2px solid white;
background-color: #000000;
}
body
{
background-color: #000000;
}
</style>
</head>
<body bgcolor="#000000">
<div id="channel_name"></div>
<div id="channel_list"></div>
<div id="preview"></div>
</body>
</html>