var ajaxingMenu = null;
var ajaxingContent = null;
var loaderBar = '<img src="/' + setupINST + '/frontend/elements/design/background/ajax-loader-ml.gif">';
var PRODUCT_IMAGES = [];
document.observe("dom:loaded", function () {
  rightMenu();
  chooseProductImage();
  getTopCatalogSheet();
  countryMap();
  contactUsCheck();
});

function rightMenu(list) {

  var rightMenuLink = list ? list : $$('a[rel|="ajax-menu"]');
  if (rightMenuLink) {
    rightMenuLink.each(function (a) {
      a.observe('click', function (e) {

        $$('#catalog-menu li a.active').invoke('removeClassName', 'active');
        $$('#catalog-menu a.loading').invoke('removeClassName', 'loading');

        var duration = 0.3;
        Event.stop(e);
        var self = this,
          href = self.readAttribute('href'),
          level = isSEF ? href.replace(/^\//, '').split('/').length - 1 : href.toQueryParams().open.split('/').length,
          sub_menu = "div.content-box-list > ul",
          a_padding = parseInt(self.getStyle('paddingLeft').replace('px', '')),
          li = self.up('ul', 0) ? self.up('li') : self.up('div.content-box-list');

        if(self.up('ul', 0)){self.addClassName('active');}
        if (level > 1) {
          for (i = 1; i < level; i++) {
            sub_menu = sub_menu + ' > li > ul';
          }
        }

        if (li.hasClassName('expanded')) { // Collapse its expanded menu
          li.removeClassName('expanded');
          li.addClassName('collapsed');
          if (li.down('ul')) {
            new Effect.BlindUp(li.down('ul'), {
              duration: duration,
              afterFinishInternal: function () {
                li.down('ul').hide();
              }
            });
          }
        } else if (li.down('ul')) { // Show existing sub menu
          if ($$(sub_menu)) {
            $$(sub_menu).each(function (ul) {
              ul.hide();
              if (ul.select('ul')) {
                ul.select('ul').each(function (sub) {
                  sub.hide();
                });
              }
            });
          }
          li.adjacent('.expanded').each(function (l) {
            l.removeClassName('expanded');
            l.addClassName('collapsed');
          })
          li.removeClassName('collapsed');
          li.addClassName('expanded');
          new Effect.BlindDown(li.down('ul'), {
            duration: duration
          });
        } else { // Call Ajax to show a new sub menu
          if (ajaxingMenu != null) {
            ajaxingMenu.transport.abort();
            $$('a[rel|="ajax-menu"]').each(function (obj) {
              if (obj.hasClassName('loading')) {
                obj.removeClassName('loading');
              }
            });
          }
          ajaxingMenu = new Ajax.Request(href, {
            method: 'post',
            parameters: {
              template: 'category_list',
              debug: 'off',
              ajax: '1'
            }, onCreate: function () {
              if ($$(sub_menu)) {
                $$(sub_menu).each(function (ul) {
                  new Effect.BlindUp($(ul), {
                    duration: duration,
                    afterFinishInternal: function () {
                      $(ul).hide();
                    }
                  });
                });
              }
            }, onLoading: function () {
              self.addClassName('loading');
            }, onFailure: function () {
              self.removeClassName('loading');
            }, onSuccess: function (res) {
              try {
                li.adjacent('.expanded').each(function (l) {
                  l.removeClassName('expanded');
                  l.addClassName('collapsed');
                })
                li.removeClassName('collapsed');
                li.addClassName('expanded');
                li.insert({
                  'bottom': res.responseText
                });
                var ul = li.down('ul');
                if (level > 4) {
                  ul.select('li > a').each(function (a) {
                    a.setStyle({
                      backgroundPosition: a_padding + 'px 50%',
                      paddingLeft: (a_padding + 40) + 'px'
                    });
                  });
                }
                ul.hide();
                new Effect.BlindDown($(ul), {
                  duration: duration
                });
                self.removeClassName('loading');
                rightMenu(ul.select('a[rel|="ajax-menu"]'));
              } catch (e) {
                self.removeClassName('loading');
              }
            }
          }); //ajax
        } //else
      }); //observe
    }); //each
  }
}

function getTopCatalogSheet(herf) {
  var topCatalogs = $$('h2 > a[rel|="ajax-menu"]'),
      mainContent = $('main-content');

  if (topCatalogs) {
    topCatalogs.each(function (cat) {
      cat.observe('click', function (e) {
        Event.stop(e);
        var self = this,
            href = self.readAttribute("href"),
            menuBox = self.up('div.content-box-list');

        if (!self.hasClassName('active')) { // Check on the current top catalog
          topCatalogs.invoke('removeClassName', 'active');
          self.addClassName('active');
          if (ajaxingContent != null) {
            ajaxingContent.transport.abort();
          }
          ajaxingContent = new Ajax.Request(href, {
            parameters: {
              debug: 'off',
              ajax: '1'
            }, onLoading: function () {
              mainContent.update(loaderBar);
            }, onFailure: function () {
              mainContent.update('');
            }, onSuccess: function (res) {
              mainContent.update(res.responseText);
            }
          }); //ajax
        }
      }); //observe
    }); //each
  }
}

function chooseProductImage() {
  var thumbnails = $$('a.open-large-image'), 
      container = $('product-image'),
      noImage = '<span class="not-img">no image</span>',
      i = 1,
      cls = 'active',
      clearSelected = function(t){
        thumbnails.invoke('removeClassName', cls);
        t.addClassName(cls);
     };
     
    if(container && thumbnails) {
        if(container.down('img')){
           PRODUCT_IMAGES['prodThumb1'] = container.down('img');
        }    

    thumbnails.each(function (thumb) {
      thumb.writeAttribute('id', 'prodThumb' + (i++));
      thumb.observe('click', function (e) {
        e.stop();

        if(this.hasClassName(cls)){
           return false;
        }else if( PRODUCT_IMAGES[thumb.id] && $('active-main-image') ){
           $('active-main-image').replace(PRODUCT_IMAGES[thumb.id]);
           var span = $('active-main-image').next('span', 0);
           if(!thumb.down('img').alt.blank()){
             span.show().update(thumb.down('img').alt);
           }else{
              span.hide();
           }
           clearSelected(thumb);
           return false; 
        }
     
        // thumbnails
        clearSelected(thumb);
        var self = this,
          src = self.href,
          alt = self.down('img', 0).readAttribute('alt'),
          boxSize = self.rel.toQueryParams(),
          boxheight = boxSize.height,
          img = new Image();

        img.onerror = function () {
          try {
            container.update(noImage);
          } catch (err) {
            alert('img.onerror = ' + err);
          }
        }
        img.onload = function () {
          try {
            if($('loader')){ $('loader').remove() };
            container.writeAttribute('style', '');
            container.insert({
              bottom: new Element('span').addClassName('media-caption-text').update(alt)
            });
            $(img).show();
          } catch (err) {
            alert('img.onload = ' + err);
          }
        }

        var callImage = function () {
          $(img).hide().writeAttribute('id', 'active-main-image');
          img.src = src;
          container.insert({
            top: img
          });
        PRODUCT_IMAGES[thumb.id] = img;
        }

        // container
        container.setStyle({
          height: boxheight + 'px'
        });
        container.update('');
        container.insert(new Element('div',{ id: 'loader'}).addClassName('not-img').update(loaderBar));
        callImage.delay(1);
      }); //observe
    }); //each
  }
}

function countryMap(){
  var a = $$('[rel="flag"]');
  var map = $('map');
  if(a && map){
     var m = map.down('img',0),
         defaultSrc = m.readAttribute('src');

     a.each(function(o){
         var c = o.className || o.readAttribute('name');

         o.observe('mouseover', function(e){
            var src = defaultSrc.replace(/map_\w+\./i, 'map_'+c+'.');
            m.writeAttribute("src", src);
         })
         o.observe('mouseout', function(e){
            m.writeAttribute("src", defaultSrc);
         });
     });
  }
}

function contactUsCheck() {
    var form = $('contact-us');
    var inputs = $$('input[type="text"]');
    var cls = 'invalid';
    var subject = $('inquiry');
    var name = $('name');
    var contactInfo = $('contact_info');
    var pttr = /(?:^$)|(?:^(?:\+\d{2}|00\d{2})?[ ]?[1-9]{1}[0-9]{7,}$)/;
    var emailPttr = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;

    if(form && inputs){
        form.observe('submit', function(e) {
           
             inputs.invoke('removeClassName', cls);
             [subject, name, contactInfo].each(function(i){
                    if(i.value.blank()) { 
                         i.addClassName(cls);
                         e.stop();
                    }
             });
             if(!pttr.test(contactInfo.value) && !emailPttr.test(contactInfo.value)){
                     contactInfo.addClassName(cls);
                      e.stop();
             }
        });
    }
}