window.choosenMetros = [];

$(document).ready(function (){

   function addMetro(title){
      var addMetro = {};
      addMetro['title'] = title;
      for(var i = 0; i < window.metros.length; i++){
         var metro = window.metros[i];
         if(metro.title == title){
            addMetro['id'] = metro.id;
            break;
         }
      }
      var add = true;
      for(var i = 0; i < window.choosenMetros.length; i++){
         if(window.choosenMetros[i].title == addMetro['title']){
            add = false;
         }
      }
      if(add && addMetro['id']){
         window.choosenMetros.push(addMetro);
      }
      updateMetroList();
   }

   function getMetroIdByTitle(title){
      for(var i = 0; i < window.metros.length; i++){
         var metro = window.metros[i];
         if(metro.title == title){
            return metro.id;
         }
      }
   }

   function updateMetroList(){
      var html = '';
      var titles = [];

      for(var i = 0; i < window.choosenMetros.length; i++){
         var p = '<p class="addedMetro">' + window.choosenMetros[i]['title'] +
               '<a href="#" id="' + window.choosenMetros[i]['id'] + '" class="delMetro">x</a>' +
               '</p>';
         html += p;
         titles.push($.trim(window.choosenMetros[i]['title']));
      }
      $('.metros').html(html);

      $('.metroItem').each(function (i, item){
         var text = $.trim($(item).text());
         var id = $(item).attr('id');
         if(~$.inArray(text, titles)){
            $(item).addClass('metroChecked');
            $('#img' + id).addClass('metroImageChecked');
         } else{
            $(item).removeClass('metroChecked');
            $('#img' + id).removeClass('metroImageChecked');
         }
      });

      // adding hidden fields
      var hiddenHtml = '';
      for(var i = 0; i < window.choosenMetros.length; i++){
         var id = window.choosenMetros[i]['id'];
         hiddenHtml += '<input type="hidden" name="metroFilter[]" value="' + id + '" /> ';
      }
      $('#metroHiddens').html(hiddenHtml);
   }

   function delMetro(id){
      for(var i = 0; i < window.choosenMetros.length; i++){
         if(window.choosenMetros[i].id == id){
            window.choosenMetros.splice(i, 1);
            break;
         }
      }
      updateMetroList();
   }

   function toggleMetroItem(span) {
      var self = $(span);
      var title = $.trim(self.text());
      if(self.parent().hasClass('metroChecked')){
         delMetro(getMetroIdByTitle(title));
      } else{
         addMetro(title);
      }
   }

   $('#schemePlace').live('click', function(e) {
      if ($(e.target).closest('.metroItem').length) {
         toggleMetroItem(e.target);
      }
   })
   /*$('.metroItem span').live('click', function (){
      toggleMetroItem(this);
   });*/

   $('.delMetro').live('click', function (e){
      var id = $(this).attr('id');
      e.preventDefault();
      delMetro(id);
   });

   $('#chooseMetro').fancybox({
      'width':640,
      'height':970,
      'titlePosition':'top',
      autoScale:false,
      autoDimensions:false,
      onComplete:function (){
         var optionsHtml = '';
         for(var i = 0; i < window.metros.length; i++){
            var metro = window.metros[i];
            optionsHtml += '<option value="' + metro['id'] + '">' + metro['title'] + '</option>';
         }
         $('#metrosSelect').html(optionsHtml);
         updateMetroList();

         $('#schemePlace div[name^="img"]').each(function (i, item){
            $(item).addClass('metroImage');
            var id = parseInt($(item).attr('name').substr(3));
            if (id) {
               $(item).click(function(e) {
                  var span = $('#schemePlace .div' + id + ' span');
                  toggleMetroItem(span);
               });
            }
         });

         /*$('.metroItem').each(function (i, item){
            if ($.inArray($.trim($(item).text()), rightSided) > -1) {
               $(item).addClass('metroItemRight');
            }
         });*/

      }
   });

   $('#saveMetros').live('click', function (e){
      $.fancybox.close()
   });

   $('#metrosSelect option').live('dblclick', (function (){
      var title = $.trim($(this).text());
      addMetro(title);
   }));

   $('.navig > ul > li').hover(function (e){
      var self = $(this);
      if(self.find('.submenu').length){
         self.find('.submenu').show();
      }
   }, function (e){
      var self = $(this);
      if(self.find('.submenu').length){
         self.find('.submenu').hide();
      }
   });

   $('.zayvka_show').click(function (e){
      $('#zayavka').toggle();
   });
});