var ACTIVE_PIECE = null;
var PLAYING_PIECE = null;

var PIECE_W = 124;
var PIECE_H = 124;

var PLAYER = 'player';

var PIECES = [
   {
      name: 'Някой',
      x: 32,
      y: 18,
      track: 1,
      mp3: '01.njakoj.mp3'
   },
   {
      name: 'Улици',
      x: 175,
      y: 18,
      track: 2,
      mp3: '02.ulici.mp3'
   },
   {
      name: 'После',
      x: 316,
      y: 18,
      track: 3,
      mp3: '03.posle.mp3'
   },
   {
      name: 'Ягоди и грозде',
      x: 31,
      y: 159,
      track: 4,
      mp3: '04.yagodi.mp3'
   },
   {
      name: 'Нощи в огън',
      x: 174,
      y: 159,
      track: 5,
      mp3: '05.noshti.mp3'
   },
   {
      name: 'Небеса',
      x: 315,
      y: 159,
      track: 6,
      mp3: '06.nebesa.mp3'
   },
   {
      name: 'Приказка без теб',
      x: 33,
      y: 301,
      track: 7,
      mp3: '07.prikazka.mp3'
   },
   {
      name: 'Мотив',
      x: 174,
      y: 301,
      track: 8,
      mp3: '08.motiv.mp3'
   },
   {
      name: '.link',
      x: 316,
      y: 302,
      link: '/blog'
   }
];

$(function() {
   album = $('table img').mousemove(function(e) {
      var x = parseInt(e.pageX - $(this).offset().left);
      var y = parseInt(e.pageY - $(this).offset().top);
      var piece = null;
      for (var idx=0; idx < PIECES.length; idx++) {
         var p = PIECES[idx];
         if (p.x <= x && x <= p.x + PIECE_W && p.y <= y && y <= p.y + PIECE_H) {
            piece = p;
            break;
         }
      }
      over_piece(piece);
      e.stopPropagation();
   });
   $('body').mousemove(function() {
      over_piece(null);
   });
   $('.overlay')
      .click(function() {
         play_piece(get_piece($(this).attr('piece')))
      })
      .mousemove(function(e) {
         e.stopPropagation();
      });
})

function get_piece(name) {
   for (var idx=0; idx < PIECES.length; idx++) {
      if (name == PIECES[idx].name) {
         return PIECES[idx];
      }
   }
   return null;
}

function play_piece(piece) {
   if (piece.link) {
      window.location.href = piece.link;
      return;
   }
   if (piece == PLAYING_PIECE) return;
   // stop previous piece if any
   if (PLAYING_PIECE) {
      PLAYING_PIECE.playing = false;
   }
   piece.playing = true;
   PLAYING_PIECE = piece;

   highlight(piece, 2);

   // create the player
   var flashvars = {
      autostart         : 'true',
      skin              : 'flash/modieus.swf',
      file              : 'music/' + piece.mp3
   }
   var params = {
      allowfullscreen   : 'false',
      allowscriptaccess : 'always',
      wmode             : 'opaque'
   }
   var attributes = {
      id                : PLAYER,
      name              : PLAYER
   }
   // embed the player in the place of the current player
   swfobject.embedSWF('flash/player.swf', PLAYER, '470', '30', '9', '#000000',
                                             flashvars, params, attributes);

   // hide old content
   $('#' + PLAYER).css('visibility', 'hidden');
   $('#song').css('visibility', 'hidden');
   setTimeout(function() {
      // ... and show it after some timeout needed for flash to stop blinking
      $('#song').html(piece.track + '. ' + piece.name).css('visibility', 'visible');
      $('#' + PLAYER).css('visibility', 'visible');
   }, 500);
}

function highlight(piece, state) {
   switch (state) {
      case 0:
         $('#over')
            .css('display', 'none')
         break;
      case 1:
      case 2:
         var elem = (state == 1) ? 'over' : 'play';
         $('#' + elem)
            .attr('piece', piece.name)
            .css('dislay', 'none')
            .css('left', album.offset().left)
            .css('top' , album.offset().top)
            .css('clip', 'rect(' + piece.y + ',' + (piece.x + PIECE_W) + ',' + (piece.y + PIECE_H) + ',' + piece.x + ')')
            .css('display', 'block');
         break;
   }
}

function over_piece(piece) {
   if (ACTIVE_PIECE == piece && piece) return;
   if (ACTIVE_PIECE && !ACTIVE_PIECE.playing) {
      // we just left previous piece
      ACTIVE_PIECE = null;
      highlight(piece, 0);
   }
   if (piece && !piece.playing) {
      // we are now over a new piece
      ACTIVE_PIECE = piece;
      highlight(piece, 1);
   }
}