  ///
  /// Script JavaSCript do Mapa
  /// NetForce Tecnologia
  ///

  var _map = new MapaClass();


  $(document).ready(function() {

    // Iniciar estrutura do mapa
    _map.init();

    $('.mapa .noroeste').click(function() { _map.animate('noroeste'); });    
    $('.mapa .norte').click(function()    { _map.animate('norte'); });    
    $('.mapa .nordeste').click(function() { _map.animate('nordeste'); });    
    $('.mapa .sudoeste').click(function() { _map.animate('sudoeste'); });    
    $('.mapa .sul').click(function()      { _map.animate('sul');});    
    $('.mapa .sudeste').click(function()  { _map.animate('sudeste'); });    
    $('.mapa .oeste').click(function()    { _map.animate('oeste'); });    
    $('.mapa .leste').click(function()    { _map.animate('leste'); });

    // Mini
    $('.mini-mapa .noroeste').click(function() { _map.animate('noroeste'); });    
    $('.mini-mapa .norte').click(function()    { _map.animate('norte'); });    
    $('.mini-mapa .nordeste').click(function() { _map.animate('nordeste'); });    
    $('.mini-mapa .sudoeste').click(function() { _map.animate('sudoeste'); });    
    $('.mini-mapa .sul').click(function()      { _map.animate('sul');});    
    $('.mini-mapa .sudeste').click(function()  { _map.animate('sudeste'); });    
    $('.mini-mapa .oeste').click(function()    { _map.animate('oeste'); });    
    $('.mini-mapa .leste').click(function()    { _map.animate('leste'); });    

    $('.coord').fadeTo(0, 0.20, function() { $(this).show()});

    $('#mapaPOS').click(function() {
       var pX = $('#mapaPOSX').val().intVal();
       var pY = $('#mapaPOSY').val().intVal();
       _map.gotoXY(pX, pY);
    });
  });

  /**
   * Objeto de controle do Mapa
   */
   function MapaClass()
   {
     this.box  = null;
     this.mini = null;
     this.mapX = 0;
     this.mapY = 0;
     this.urlUpdate = '';

     this.init = function()
     {
       this.box  = $('#boxMapa');
       if (this.box.size() == 0)
         return false;
       this.mini = $('#boxMiniMapa');
       this.mapX = this.box.attr('mapX').intVal();
       this.mapY = this.box.attr('mapY').intVal();
       this.urlUpdate = this.box.attr('update');
       this.prepareCells();
     };

     this.animate = function(dir)
     {
       this.popupHide();

       var atual = $('#bodyMapa');
       $('.coord').fadeOut();

       switch (dir)
       {
         case 'noroeste' : this.mapY -= 9; this.mapX -= 9; break;
         case 'norte'    : this.mapY -= 9; break;
         case 'nordeste' : this.mapY -= 9; this.mapX += 9; break;
         case 'sudoeste' : this.mapY += 9; this.mapX -= 9; break;
         case 'sul'      : this.mapY += 9; break;
         case 'sudeste'  : this.mapY += 9; this.mapX += 9; break;
         case 'oeste'    : this.mapX -= 9; break;
         case 'leste'    : this.mapX += 9; break;
       }

       // Criar novo
       this.box.append('<table id="newBoxMapa" cellpadding="0px" cellspacing="0px" border="0px" class="grade"><tr><td>x</td></tr></table>');
       var novo = $('#newBoxMapa');

       // Carregar novo via ajax
       this.carregar(novo);

       // Trocar
       switch (dir)
       {
         case 'noroeste':
           novo.css('top',  '-648px');
           novo.css('left', '-450px');
           novo.show();

           novo.animate({top: '-324px', left: '0px'}, 'normal');
           atual.animate({top: '+324px', left: '+450px'}, 'normal', function() {
            atual.remove();
             novo.css('left', '0px');
             novo.css('top',  '0px');
             novo.attr('id',  'bodyMapa');
             $('.coord').fadeTo(0, 0.20, function() { $(this).show()});
           });
           break;    

         case 'norte':
           novo.css('top',  '-648px');
           novo.css('left', '0px');
           novo.show();

           novo.animate({top: '-324px'}, 'normal');
           atual.animate({top: '+324px'}, 'normal', function() {
            atual.remove();
             novo.css('left', '0px');
             novo.css('top',  '0px');
             novo.attr('id',  'bodyMapa');
             $('.coord').fadeTo(0, 0.20, function() { $(this).show()});
           });
           break;    

         case 'nordeste':
           novo.css('top',  '-648px');
           novo.css('left', '+450px');
           novo.show();

           novo.animate({top: '-324px', left: '0px'}, 'normal');
           atual.animate({top: '+324px', left: '-450px'}, 'normal', function() {
            atual.remove();
             novo.css('left', '0px');
             novo.css('top',  '0px');
             novo.attr('id',  'bodyMapa');
             $('.coord').fadeTo(0, 0.20, function() { $(this).show()});
           });
           break;    

         case 'sudoeste':
           novo.css('top',  '0px');
           novo.css('left', '-450px');
           novo.show();

           novo.animate({top: '-324px', left: '0px'}, 'normal');
           atual.animate({top: '-324px', left: '+450px'}, 'normal', function() {
            atual.remove();
             novo.css('left', '0px');
             novo.css('top',  '0px');
             novo.attr('id',  'bodyMapa');
             $('.coord').fadeTo(0, 0.20, function() { $(this).show()});
           });
           break;    

         case 'sul':
           novo.css('top',  '0px');
           novo.css('left', '0px');
           novo.show();

           novo.animate({top: '-324px'}, 'normal');
           atual.animate({top: '-324px'}, 'normal', function() {
             atual.remove();
             novo.css('left', '0px');
             novo.css('top',  '0px');
             novo.attr('id',  'bodyMapa');
             $('.coord').fadeTo(0, 0.20, function() { $(this).show()});
           });
           break;

         case 'sudeste':
           novo.css('top',  '0px');
           novo.css('left', '+450px');
           novo.show();

           novo.animate({top: '-324px', left: '0px'}, 'normal');
           atual.animate({top: '-324px', left: '-450px'}, 'normal', function() {
            atual.remove();
             novo.css('left', '0px');
             novo.css('top',  '0px');
             novo.attr('id',  'bodyMapa');
             $('.coord').fadeTo(0, 0.20, function() { $(this).show()});
           });
           break;    

         case 'oeste':
           novo.css('top',  '-324px');
           novo.css('left', '-450px');
           novo.show();

           novo.animate({left: '0px'}, 'normal');
           atual.animate({left: '+450px'}, 'normal', function() {
             atual.remove();
             novo.css('left', '0px');
             novo.css('top',  '0px');
             novo.attr('id',  'bodyMapa');
             $('.coord').fadeTo(0, 0.20, function() { $(this).show()});
           });
           break;

         case 'leste':
           novo.css('top',  '-324px');
           novo.css('left', '+450px');
           novo.show();

           novo.animate({left: '0px'}, 'normal');
           atual.animate({left: '-450px'}, 'normal', function() {
             atual.remove();
             novo.css('left', '0px');
             novo.css('top',  '0px');
             novo.attr('id',  'bodyMapa');
             $('.coord').fadeTo(0, 0.20, function() { $(this).show()});
           });
           break;
       }

       this.miniMap();
     };

     this.gotoXY = function(goX, goY)
     {
       this.popupHide();

       var atual = $('#bodyMapa');
       $('.coord').fadeOut();

       this.mapX = goX;
       this.mapY = goY;

       // Criar novo
       this.box.append('<table id="newBoxMapa" cellpadding="0px" cellspacing="0px" border="0px" class="grade"><tr><td>x</td></tr></table>');
       var novo = $('#newBoxMapa');

       // Carregar novo via ajax
       this.carregar(novo);

       // Trocar
       novo.css('top',  '0px');
       novo.css('left', '0px');
       novo.fadeIn();

       atual.fadeOut('fast', function() {
         atual.remove();
         novo.css('left', '0px');
         novo.css('top',  '0px');
         novo.attr('id',  'bodyMapa');
         $('.coord').fadeTo(0, 0.20, function() { $(this).show()});
       });

       $('#mapaPOSX').val(goX);
       $('#mapaPOSY').val(goY);

       this.miniMap();
     };

     this.prepareCells = function()
     {
       $('.mapa-item[i_titulo]').each(function() {
         var cell = $(this);
         cell.click(function() { _map.popup(cell); });
       });
     };

     this.carregar = function(novo)
     {
       var obj = this;
       var url = this.urlUpdate;
       url += '&mapX=' + this.mapX;
       url += '&mapY=' + this.mapY;

       $.ajax({
         type: 'GET',
         url : url,
         async: false,
         success: function(data) { novo.html(data); obj.prepareCells(); }
         });
     };

     this.miniMap = function()
     {
       var atual = $('#bodyMiniMapa');

       // Criar novo
       this.mini.append('<table id="newBoxMiniMapa" cellpadding="0px" cellspacing="0px" border="0px" class="grade"><tr><td>x</td></tr></table>');
       var novo = $('#newBoxMiniMapa');

       // Carregar novo via ajax
       this.carregarMini(novo);

       // Trocar
       novo.css('top',  '0px');
       novo.css('left', '0px');
       novo.fadeIn();

       atual.fadeOut('fast', function() {
         atual.remove();
         novo.css('left', '0px');
         novo.css('top',  '0px');
         novo.attr('id',  'bodyMiniMapa');
       });
     };

     this.carregarMini = function(novo)
     {
       var obj = this;
       var url = this.urlUpdate;
       url += '&mapX=' + this.mapX;
       url += '&mapY=' + this.mapY;
       url += '&zoom=mini';

       $.ajax({
         type: 'GET',
         url : url,
         async: false,
         success: function(data) { novo.html(data); }
         });
     };

     this.popup = function(cell)
     {
       var popup = $('#mapaPopup');
       cell      = $(cell);

       if ((popup.css('display') == 'none') || ((popup.css('display') != 'none') && (popup.attr('bat') != cell.attr('i_titulo'))))
       {
         popup.attr('bat', cell.attr('i_titulo'));

         $('#mapaTitulo').html(cell.attr('i_titulo'));
         $('#mapaPontos').html(cell.attr('i_pontos'));
         $('#mapaUsuario').html('<a href="' + cell.attr('i_usuariohref') + '">' + cell.attr('i_usuario') + '</a>');

         if (cell.attr('i_nacao') != '')
           $('#mapaNacao').html('<a href="' + cell.attr('i_nacaohref') + '">' + cell.attr('i_nacao') + '</a>');
         else
           $('#mapaNacao').html('&nbsp;');

         $('#mapaCmdCenter a').click(function() { _map.gotoXY(cell.attr('i_posX').intVal(), cell.attr('i_posY').intVal()); });
         $('#mapaCmddTropas a').attr('href', cell.attr('i_tropas'));
         $('#mapaCmdRecursos a').attr('href', cell.attr('i_recursos'));
         $('#mapaCmdMsg a').attr('href', cell.attr('i_msg'));

         var pop = new NFPopup();
         pop.popup = popup;
         pop.comp  = cell;
         pop.fadeIn();
       } else {
         popup.fadeOut();
       }
     };

     this.popupHide = function()
     {
       var pop = $('#mapaPopup');
       pop.fadeOut();
     };

   };
