function miov(id) {
  $('ttl' + id).style.borderColor='#B1B1B1';
  // $('tti' + id).style.opacity = 0.8;
  // $('tti' + id).style.filter = 'alpha(opacity=80)';      
}
function miou(id) {
  $('ttl' + id).style.borderColor='#E1E1E1';
  // $('tti' + id).style.opacity = 1;
  // $('tti' + id).style.filter = 'alpha(opacity=100)';
}
function miov2(id) {
  $('tti' + id).style.opacity = 0.8;
  $('tti' + id).style.filter = 'alpha(opacity=80)';      
}
function miou2(id) {
  $('tti' + id).style.opacity = 1;
  $('tti' + id).style.filter = 'alpha(opacity=100)';
}
  
function getMediaBox(prefix, mid, marea, country, localurl, idarea, mvote, mtitle) {
  var out = '<table id="ttl' + prefix + mid + '" border="0" cellspacing="0" cellpadding="3" style="border: 1px solid #E1E1E1"><tr><td align="center">\n';
  out += '<div style="position: relative;">\n';
  if (country != "") { 
    out += '<div class="mediaflag"><a href="/' + marea + '/' + mid + '/' + localurl + '.html" onmouseover="miov(\'' + prefix + mid + '\')" onmouseout="miou(\'' + prefix + mid + '\')"><img src="/img/flag/' + country + '.png" width="16" height="11" border="0" alt="" style="border:1px solid #ffffff"></a></div>\n';
  } 
  out += '<a href="/' + marea + '/' + mid + '/' + localurl + '.html" onmouseover="miov(\'' + prefix + mid + '\')" onmouseout="miou(\'' + prefix + mid + '\')"><img src="/img/thumb/' + idarea + '/' + mid + '.jpg" id="tti' + prefix + mid + '" width="115" height="87" border="0" alt="" style="background-color:#E1E1E1"></a>\n';
  out += '</div></td></tr></table>\n';
  out += '<table width="127" border="0" cellspacing="0" cellpadding="0"><tr><td valign="top" align="center">\n';              
  
  out += '<span class="startxt"><span style="color:#FFCC00">';
  var star = 1;
  for (j=1; j<=mvote; j++) {
    out += '&#8226;';
    star++;
  }
  out += '</span>';
  for (j=star; j<=10; j++) {
    out += '&#8226;';
  }
  out += '</span><br>\n';
  
  out += '<div style="text-align:center;width:120px;height:32px;overflow:hidden">\n';
  out += '<b><a href="/' + marea + '/' + mid + '/' + localurl + '.html">' + mtitle + '</a></b>\n';
  out += '</div>\n';               
  out += '</td></tr></table>\n';
  
  return out;
}


function getMediaBoxHtml(prefix, mediaarray) {
  var r = '';
  r += '<table width="824" border="0" cellspacing="0" cellpadding="0"><tr>';
  r += '<td width="32" valign="top" style="padding-top:50px;padding-right:10px">' + getArrowHtml('left', prefix) + '</td>';
  r += '<td valign="top" width="760" align="center">';
    
  r += '<div id="container" style="position:relative;width:764px;height:148px;overflow:hidden;border:0">';
  r += '<div id="content_' + prefix + '" style="position:absolute;width:764px;left:0px;top:0px">'; 
  r += '<ilayer name="nscontainer" width="764" height="148" clip="0,0,764,148">';
  r += '<layer name="nscontent" width="764" height="148" visibility="hidden">';
  
  r += '<table border="0" cellspacing="0" cellpadding="0"><tr>';
  for (i=0; i<6; i++) {
    r += '<td valign="top" align="center"><div id="scritem_' + prefix + "_" + i + '">';
    r += getMediaBox(mediaarray[i][0], mediaarray[i][1], mediaarray[i][2], mediaarray[i][3], mediaarray[i][4], mediaarray[i][5], mediaarray[i][6], mediaarray[i][7]);
    r += '</div></td>';
    
    scrollpgs[prefix]++;
  }
  for (i=6; i<bestrated.length; i++) {
    r += '<td valign="top" align="center"><div id="scritem_' + prefix + "_" + i + '">';
    r += '</div></td>';
    
    scrollpgs[prefix]++;
  }
  r += '</table>';
  
  r += '</layer>';
  r += '</ilayer>';
  r += '</div></div>';
      
  r += '</td>';  
  r += '<td width="32" valign="top" style="padding-top:50px;padding-left:10px">' + getArrowHtml('right', prefix) + '</td>';
  r += '</tr></table>';
  
  return r;
}    

function getArrowHtml(dir, prefix, status) {
  var r = "";
  if (dir == "left") {
    r += '<div id="' + prefix + 'arrow' + dir + '_on" style="display:none">';
    r += '<a href="#" onclick="myScrollPrev(\'' + prefix + '\');return false" onmouseover="miov(\'' + prefix + 'arrow' + dir + '\')" onmouseout="miou(\'' + prefix + 'arrow' + dir + '\')">';
    r += '<img border="0" src="/img/arrow_sx.gif" width="22" height="22" alt="" id="ttl' + prefix + 'arrow' + dir + '">';
    r += '</a></div>';
    
    r += '<div id="' + prefix + 'arrow' + dir + '_off" style="display:block">';
    r += '<img src="/img/arrow_sx_gr.gif" width="22" height="22" alt="" id="tti' + prefix + 'arrow' + dir + '">';
    r += '</div>';
  }
  else if (dir == "right") {
    r += '<div id="' + prefix + 'arrow' + dir + '_on" style="display:none">';
    r += '<a href="#" onclick="myScrollNext(\'' + prefix + '\');return false" onmouseover="miov2(\'' + prefix + 'arrow' + dir + '\')" onmouseout="miou2(\'' + prefix + 'arrow' + dir + '\')">';
    r += '<img border="0" src="/img/arrow_dx.gif" width="22" height="22" alt="" id="tti' + prefix + 'arrow' + dir + '">';
    r += '</a></div>';
    
    r += '<div id="' + prefix + 'arrow' + dir + '_off" style="display:block">';
    r += '<img src="/img/arrow_dx_gr.gif" width="22" height="22" alt="" id="tti' + prefix + 'arrow' + dir + '">';
    r += '</div>';
  }
  return r;
}  




 
function myScrollNext(prefix){
  scrollpg[prefix]++;
  itemnr = (scrollpg[prefix]+6);
  if ($('scritem_' + prefix + "_" + itemnr).innerHTML == "") {  
    mediaarray = scrolldata[prefix][itemnr];
    $('scritem_' + prefix + "_" + itemnr).innerHTML = getMediaBox(mediaarray[0], mediaarray[1], mediaarray[2], mediaarray[3], mediaarray[4], mediaarray[5], mediaarray[6], mediaarray[7]);    
  }
  var pos0 = bytefx.$position($('scritem_' + prefix + '_0'));
  var pos1 = bytefx.$position($('scritem_' + prefix + '_1'));
  myScrollArrows(prefix); 
  scrollpos[prefix] -= (pos1.x-pos0.x);
  myScrollNextMove(prefix);
}
function myScrollPrev(prefix){
  scrollpg[prefix]--;
  var pos0 = bytefx.$position($('scritem_' + prefix + '_0'));
  var pos1 = bytefx.$position($('scritem_' + prefix + '_1'));
  myScrollArrows(prefix);
  scrollpos[prefix] += (pos1.x-pos0.x);;
  myScrollPrevMove(prefix);
}

function myScrollArrows(prefix) {
  if (scrollpg[prefix] <= 0) { 
    $('' + prefix + 'arrowleft_on').style.display = 'none';
    $('' + prefix + 'arrowleft_off').style.display = 'block';
  }
  else {
    $('' + prefix + 'arrowleft_on').style.display = 'block';
    $('' + prefix + 'arrowleft_off').style.display = 'none';
  } 
  
  if (scrollpg[prefix] >= (scrollpgs[prefix]-7)) { 
    $('' + prefix + 'arrowright_on').style.display = 'none';
    $('' + prefix + 'arrowright_off').style.display = 'block';
  }
  else {
    $('' + prefix + 'arrowright_on').style.display = 'block';
    $('' + prefix + 'arrowright_off').style.display = 'none';
  }
}

function myScrollNextMove(prefix) {
  crossobj= document.getElementById? document.getElementById("content_" + prefix) : document.all.content;
  if (window.moveupvar) clearTimeout(moveupvar)
  crossobj.style.left=parseInt(crossobj.style.left)-scrollspeed+"px"
  
  if (parseInt(crossobj.style.left) - scrollspeed > scrollpos[prefix]) {
    movedownvar=setTimeout("myScrollNextMove('" + prefix + "')",20)
  }
  else {
    crossobj.style.left = scrollpos[prefix];
  }
}
function myScrollPrevMove(prefix){
  crossobj= document.getElementById? document.getElementById("content_" + prefix) : document.all.content;

  if (window.movedownvar) clearTimeout(movedownvar)
  crossobj.style.left=parseInt(crossobj.style.left)+scrollspeed+"px"
  
  if (parseInt(crossobj.style.left) + scrollspeed < scrollpos[prefix]) {
    moveupvar=setTimeout("myScrollPrevMove('" + prefix + "')",20)
  }
  else {
    crossobj.style.left = scrollpos[prefix];
  }  
}