
window.addEvent('domready', function() {
    new Tabtastic('#tab-container', '.tabs', '.tab-content');

    /* Check for slider */
    if($$('.brand #slider .section').length > 1) { 
          window.slider = new Slider(".brand #slider", {'width': 904, 'max': 5});
    }
    
    /* Brand category column leveling  */
    window.addEvent('domready', function() {
          var expandables = document.getElements('ul.brand-category');

          expandables.each(function(element){
                var collapsed_items = 7;
                if(element.getFirst().get('class') == 'section-callout')
                      collapsed_items = collapsed_items + 1;

                new ToggleList(element, {'moreText': 'More', 'lessText': 'Less', 'collapsed': collapsed_items});
          });
    });

    /* New Styles Toggle */
    if($('new-styles')) {
        //Set variables to be used later on
        var newStyles = document.getElement('#new-styles');
        var newStylesFirstItem = document.getElement('#new-styles').getFirst();

        //Remove classes for formatting purposes
        newStyles.removeClass('extended-list');
        newStylesFirstItem.removeClass('heading');

        //Instantiate ToggleList Class for New Styles
        new ToggleList($('new-styles'), {'moreText': '[+] View More New Styles', 'lessText': '[-] View Less Styles', 'collapsed': 3, 'listDisplay':'inline'});
        //Set additional click event for additional class toggling
        document.getElement('#new-styles li.toggle-show').addEvent('click', function() {
            if(this.getFirst().hasClass('expanded')) {
                newStyles.addClass('extended-list clear');
                newStylesFirstItem.addClass('heading').setStyle('display','block');
            } 
            else {
                this.getParent().removeClass('extended-list');
                this.getParent().getFirst().removeClass('heading');
            }
        });
    }

    /* Function for Brand Notify Me to add thank you */
    window.addEvent("domready", function(){
      var form = document.getElement("#brand-notifyme .standard-form");				
      if (!form) return;
      var brandname = window.brandname || "this brand";
        var myform = new AsyncForm("#brand-notifyme .standard-form",{
          'validations':[
              {'present': ['email','Please enter your email address.']}
          ],

          'onSuccess':function(fields){
            var parent = $('brand-notification');
            var header = new Element('h4',{'text':"Thank You For Your Notification Request!"});
            var body = new Element('p',{'text':"We will send an email to " + fields.email + " should new styles of "+brandname.cleanASCII()+" become available."});
            parent.empty();
            parent.grab(header);
            parent.grab(body);
            parent.setStyle('width','100%');
          }
          
        });
    });

});

var OverlayPlayer = new Class({
    Implements: Options,
    options: {
        'channels':[],
        'default_channel':[],
        'text':null,
        'page_title':'Zappos.com',
        'featured_header':'Featured Zappos.com Videos',
         //'search_header':'Search', // Currently disabled
        'body_text':'Zappos.com was founded in 1999 with the goal of becoming the premiere destination for online shoes. Since then, we\'ve become much more than just an online shoe store. Our unwavering focus on superior customer service has allowed us to expand our online offerings to include handbags, clothing, electronics and so much more! If you\'re looking for shoes, clothing and handbags online, compare us to other online shoe and online clothing stores, as well as online handbag stores. You\'ll find the absolute best service and the best selection in online shopping here at Zappos.com!',
        'button_color':'#f6d58e',
        'text_color':'#ffffff',
        'background_color':'#000000',
        'background_url':''
    },

    initialize: function(el, position, options) {
        this.setOptions(options);
        var embedPlayerDiv = new Element('div', {id: 'embed-player'});
        embedPlayerDiv.inject(document.getElement(el), position);

        Overlay.queryEmbed('embed-player', 
        {
            "default_overlay": "1318e3e1-7487-4218-8a8d-fbfd54f90377", 
            "criteria": {
                "channels": this.options['channels']
            }, 
            "default_channel": this.options['default_channel'],
            "text": this.options['text'],
            "client": "ZAPPOS"
        }, {
            "flashVars": {
                "PAGE_TITLE": this.options['page_title'],
                "FEATURED_HEADER": this.options['featured_header'],
                //"SEARCH_HEADER":options['search_header'], // Currently disabled
                "CONTEXT": "Brand+Landing+Page", 
                "BODY_TEXT": this.options['body_text'],
                "BUTTON_COLOR": this.options['button_color'],
                "TEXT_COLOR": this.options['text_color'],
                "BACKGROUND_COLOR": this.options['background_color'],
                "BACKGROUND_URL": this.options['background_url'],
                "EMBEDDED_PLAYER_CONFIG": "%7B%22HEIGHT%22%3A+%22330%22%2C+%22playerURL%22%3A+%22http%3A%2F%2Fcontent.retail.overlay.tv%2Fflash%2Fzappos%2Fretail_recorder.swf%22%2C+%22WIDTH%22%3A+%22295%22%7D"
           }, 
            "playerURL": "http://content.retail.overlay.tv/flash/zappos/retail_player_experience.swf", "width": "966", "height": "650"
        }
        );
        
    }
});

var ToggleThisMug = new Class({

  Implements: Options,
  options: {
    'needle':560,
    'fade':false,
    'open_msg':'read more', 
    'close_msg':'read less',
    'url':'#read-more',
    'toggle_class':'',
    'toggle_id':'toggle-this-mug'
  },

  initialize: function (el, options) {
    this.setOptions(options);
  
    this.el = document.getElement(el);
    this.needle = this.options['needle'];

    if(!this.el || this.el.get('html').length < this.needle) 
      return false;

    this.fade = this.options['fade'];
    this.open_msg = this.options['open_msg'];
    this.close_msg = this.options['close_msg'];
    this.content = this.el.get('html');
    this.url = this.options['url'];
    this.toggle_class = this.options['toggle_class'];

    if(this.toggle_class)
      this.toggle_class = ' ' + this.toggle_class;

    this.toggle_id = this.options['toggle_id'];
    this.toggler = new Element('a', {'href':this.url, 'class':'toggle-me' + this.toggle_class, 'id':this.toggle_id, 'html':this.open_msg});
    this.setToggle();
  },

  setToggle: function() {

    var teaser = this.content.substring(this.needle, this.needle + 1);

    while(teaser != ' ') {
      this.needle++;
      teaser = this.content.substring(this.needle, this.needle + 1);
    }

    this.teaser_content = this.content.substring(0, this.needle);
    this.onToggleOption(this.teaser_content, this.el, this.open_msg, false);

    this.toggler_length = this.el.get('html').length - this.teaser_content.length;
    var ref_this = this;

    $(this.toggle_id).addEvent('click', function(e) {
      e.preventDefault();
      ref_this.onToggle();
    });
  },

  onToggle: function() {
    if(this.el.get('html').length - this.toggler_length == this.teaser_content.length) {
      this.onToggleOption(this.content, this.el, this.close_msg, this.fade);
    } else {
      this.onToggleOption(this.teaser_content, this.el, this.open_msg, this.fade);
    }
  },

  onToggleOption: function(toggle_content, toggler_location, msg, fade) {
    if(fade) {
      var fade = new Fx.Tween(this.el);
      fade.start('opacity', '0', '1');
    }

    this.el.set('html', toggle_content);
    this.el.grab(this.toggler);
    $(this.toggle_id).set('text', msg);
  }

});

var Tabtastic = new Class({
  initialize: function(tabContainer, tabs, tabContent) {
    if(document.getElement(tabContainer)) {
      document.getElement(tabContainer + ' ' + tabContent).getChildren().setStyle('display', 'none');
      document.getElement(tabContainer + ' ' + tabs + ' li:first-child').addClass('active-tab');
      document.getElement(tabContainer + ' ' + tabContent + ' div:first-child').setStyle('display', 'block');

      $$(tabContainer + ' .tabs li').addEvent('click', function(event) {
        event.preventDefault();
        document.getElement(tabContainer + ' ' + tabs).getChildren().removeClass('active-tab');
        document.getElement(tabContainer + ' ' + tabContent).getChildren().setStyle('display', 'none');

        this.addClass('active-tab');
        var activeTab = this.getElement(':first-child').get('href').split('#');
        document.getElement(tabContainer + ' #' + activeTab[1]).setStyle('display', 'block');

      });
    }
  }
});

