
function initPlayer() {
  var top20video = $('top20video');
  if(top20video){

  playTop20Video();  
  }  
  var buttons = $ES('span.play');
  var i = 0;
  if (buttons) {
	  buttons.each(function(button) {
	    var cid = button.id.substr(button.id.indexOf('-')+1);
	    if (cid) {
	      var el = new Element('span', {'id': 'player' + i});
	      el.injectInside(button); 
	      var so = new SWFObject("/assets/swf/player.swf", "swfplayer" + i, "15", "15", "8", "#000000");
	      so.addParam("wmode", "transparent");
	      so.addVariable("cidSenderId", i);
	      so.addVariable("cid", cid);
	      so.write("player" + i);
	      i++;    
	    }
	  });
  }
}
function playTop20Video(){
	var so = new SWFObject("/assets/swf/top20-mainos.swf", "top20mainos", "428", "321", "8", "#000000");
	so.addParam("wmode", "transparent");
	so.write("top20video");
}

function toggleSound(playerId)
{
  var players = $ES('span.play span');
  var i = 0;
  if (players) {
    players.each(function(player) {
      var movie = findMovie('swf' + player.id);
      if (player.id == 'player' + playerId) {
        movie.playSound();

        var parentId = player.getParent().id;
        var cid = parentId.substr(parentId.indexOf('-')+1);
	      var jSonRequest = new Json.Remote("/json/stat/", {
	        method: 'get'
        }).send({'cid': cid});

      } else {
        movie.stopSound();
      }
    });
  }
}



function findMovie(movieName) 
{
    if (navigator.appName.indexOf("Microsoft") != -1) {
      return window[movieName]
    } else {
      return document[movieName]
    }
}




 




window.onload = function()
{
  var manufacturer = $('selectManufacturer');
  var device = $('selectDevice');
  if (manufacturer && device) {
    manufacturer.onchange = function() {
			var jSonRequest = new Json.Remote("/json/device/", {
			 method: 'get',
			 onComplete: function(devices){
          $('selectDevice').options.length = 1;
          
			    devices.each(function(d) {
			      var option = new Element('option', {
			        value: d.url
			      });
			      option.setText(d.name);
			      option.injectInside($('selectDevice'));
			    });
			}}).send({'manufacturer': $('selectManufacturer').getValue()});
    }
    device.onchange = function() {
      if (this.getValue()) {
        location = this.getValue();
      }
      return false;
    }
  }
   
  var chart = $('chart');
  if (chart && !window.ie) {
    var images = $ES('img.albumArt');
    images.each(function(image) 
    {
      var src = image.src.substring(0, image.src.length - 10) + 'large1.jpg';
      var largeImg = new Element('img',  
      {
        'id': 'l' + image.id,
        'src': src,
        'events': {
          load: function() {
            this.injectBefore(image);
            return;
          },
          mouseout: clearT
        },
        'styles': {
          'position': 'absolute',
          'width': 40,
          'height': 40,
          'margin': 0,
          'z-index': 200,
          'visibility': 'hidden'
          
        }
      });
      
      image.onmouseover = function() {
        if ($('l' + this.id)) {
          var li = $('l' + this.id);
          if (!li.hasClass('on')) {
		        var trans = $('l' + this.id).effects({
		          duration: 100,
		          onStart: function() {
		            li.addClass('on');
	              li.setStyle('visibility', 'visible');
		          },
		          onComplete: function() {
		            li.removeClass('on');  
		          }
	          });
		        trans.start({'width': [40, 135], 'height': [40, 135], 'margin-top': [0, -60], 'margin-left': [0, -47]});
	        }
        }
        return;
      }
      
    });
  }
}
  function clearT() {
    var im = this; 
    if (!$(im.id).hasClass('on')) {
   var trans = this.effects({
     duration: 100, 
     onStart: function() {
        im.addClass('on');
      },
     onComplete: function() {
       im.setStyle('visibility', 'hidden');
       im.removeClass('on');
      }
    });
   trans.start({'width': 40, 'height': 40, 'margin-top': 0, 'margin-left': 0});
  } else {
    clearT.delay(500, im);

  }
    return;
  }
         

