Effect.Scroll = Class.create(Effect.Base, {
  initialize: function(element) {
    this.element = $(element);
    var options = Object.extend({
      x:    0,
      y:    0,
      mode: 'absolute'
    } , arguments[1] || {}  );
    this.start(options);
  },
  setup: function() {
    if (this.options.continuous && !this.element._ext ) {
      this.element.cleanWhitespace();
      this.element._ext = true;
      this.element.appendChild(this.element.firstChild);
    }

    this.originalLeft = this.element.scrollLeft;
    this.originalTop = this.element.scrollTop;

    if(this.options.mode == 'absolute') {
      this.options.x -= this.originalLeft;
      this.options.y -= this.originalTop;
    } else {

    }
  },
  update: function(position) {
    this.element.scrollLeft = this.options.x * position + this.originalLeft;
    this.element.scrollTop  = this.options.y * position + this.originalTop;
  }
});

function moveTo(container, element){
  var container_y = Position.cumulativeOffset($(container))[1]
  var element_y = Position.cumulativeOffset($(element))[1]
  var container_x = Position.cumulativeOffset($(container))[0]
  var element_x = Position.cumulativeOffset($(element))[0]
  new Effect.Scroll(container, {
      x:(element_x - container_x),
      y:(element_y - container_y),
      duration: 1
      //,transition: Effect.Transitions.spring
  });
  return false;
}


var tabs = {
    scrollContainer:'events-tabs-slider',
    allTabsWidth: null,
    //current: 'account',
    //ids: ['Account','Order','Items'],
    init: function(options) {

        this.options = Object.extend({
            transition: 'fade'
        }, options || {});

//        console.log(this.options.transition)

        if(/MSIE [65]/.test(navigator.appVersion)) {
            this.options.transition = 'none';
        }

        var trans = this.options.transition;
        if(trans == 'none' || trans == 'fade') {
            var panelwidth = $('panel-container').getWidth() - 30;
            $$('#panel-container .panel').each(function(el) {
//                console.log(el.getStyle('padding'));

                if(/MSIE [657]/.test(navigator.appVersion)) {
                    //- remove width of scrollbar for IE!
                    panelwidth = panelwidth - 10;
                }

                el.setStyle({
                    width: (panelwidth)+'px',
                    position:'absolute',
                    top:'0',
                    left:'0'
                });
            }, this);

        }
        else if(trans == 'slide') {
            $('panel-container').setStyle({height:'6000px', width:'auto'});

            $$('#panel-container .panel').each(function(el) {
                el.setStyle({
                    //cssFloat:'left',
                    height:'550px',
                    //width:'630px',
                    display:''
                });
            });
        }


        $('events-tabs-inner').select('li').each(function(li) {
            this.allTabsWidth += li.offsetWidth;
        }, this);

        //console.log('tab width: ' + this.allTabsWidth);
        //console.log('container width: ' + $(this.scrollContainer).offsetWidth);

        if(this.allTabsWidth > $(this.scrollContainer).offsetWidth) {

            $('events-tabs-slider').setStyle({paddingLeft:'24px'});


            $('event-tabs-right').show().observe('click',function() {
                this.scrollTabs(150);
            }.bindAsEventListener(this));

            $('event-tabs-left').show(); /*.observe('click',function() {
                this.scrollTabs(-150);
            }.bindAsEventListener(this));*/
        }
    },
    changeTab: function(activeTab) {
        var lis = activeTab.up('ul').childElements(); //.parentNode.parentNode.getElementsByTagName('LI');
        for(var i=0; i<lis.length; i++) {
            lis[i].id='';
        }
        activeTab.up().id = 'current';
    },
    change: function(id, o) {
        this.changeTab($(o));
		//if(!$('section'+id)) return;

        if(this.options.transition == 'none') {
            $(id).show().siblings().invoke("hide");
        }
        else if(this.options.transition == 'fade') {
            $(id).appear({duration:0.5}).siblings().invoke("fade", {duration:0.5});
        }
        else if(this.options.transition == 'slide') {
            //moveTo($('events-panel'), $(id));
            Effect.Move($('panel-container'),{
                mode: 'absolute',
                x:0,
                y: $(id).offsetTop
            })
        }

        //var len = this.ids.length;
        //for(i=0; i<len; i++) {
        //    //$('item' + this.ids[i]).className='';
        //    $('section' + this.ids[i]).hide();
        //}

        //$(id).className = 'current';
        //location.href = location.pathname + location.search + '#' + id;

        //$('section'+id).show();

        //$('leaderMedical').hide(); $('leaderMain').show();
        //$('leaderMain').hide(); $('leaderMedical').show();
    },
    scrollTabs: function(amt) {
        //moveTo($('tabs-event-silder'), )
        //console.log($('events-tabs-slider'));
        if(this.tabIsScrolling) {
            return;
        }
        this.tabIsScrolling = true;

        var elScrollLeft,
            ulWidth = 0,
            elWidth = 0,
            el = $('events-tabs-slider');

        elWidth = el.offsetWidth - (23*2);
        elScrollLeft = el.scrollLeft

        $('events-tabs-inner').select('li').each(function(li) {
            ulWidth += li.offsetWidth;
        });


        if(amt < 0 && el.scrollLeft <= 0) {
            return;
        }


        $('event-tabs-right').stopObserving('click');
        $('event-tabs-left').stopObserving('click');

        if(el.scrollLeft + amt <= 0) {
            $('event-tabs-left').setStyle({backgroundImage:'url(/images/tabs_arrowleft_inactive.jpg)',cursor:'default'});

            $('event-tabs-right').setStyle({backgroundImage:'url(/images/tabs_arrowright_active.jpg)',cursor:'pointer'});
            $('event-tabs-right').observe('click', function() {
                this.scrollTabs(150);
            }.bindAsEventListener(this));
        }
        else {
            $('event-tabs-left').setStyle({backgroundImage:'url(/images/tabs_arrowleft_active.jpg)',cursor:'pointer'});
            $('event-tabs-left').observe('click', function() {
                this.scrollTabs(-150);
            }.bindAsEventListener(this));

            if(elWidth+el.scrollLeft+amt < ulWidth) {
                $('event-tabs-right').setStyle({backgroundImage:'url(/images/tabs_arrowright_active.jpg)',cursor:'pointer'});
                $('event-tabs-right').observe('click', function() {
                    this.scrollTabs(150);
                }.bindAsEventListener(this));
            }
            else {
                $('event-tabs-right').setStyle({backgroundImage:'url(/images/tabs_arrowright_inactive.jpg)',cursor:'default'});
                //$('event-tabs-right').show();
            }
        }

        if(elWidth+el.scrollLeft+amt > ulWidth) {
            //console.log('here');
            var tmp = (elWidth+el.scrollLeft+amt) - ulWidth;
            amt -= tmp;
        }

      new Effect.Scroll(el, {
          x:amt,
          y:0,
          mode: 'relative',
          duration: 0.3,
          afterFinish: function() {
            this.tabIsScrolling = false;
          }.bind(this)
          //,transition: Effect.Transitions.spring
        });
    }
}

document.observe("dom:loaded", function() {
    tabs.init({transition: 'fade'});

    setInterval(function() {

        $$('#rightColAds>div').each(function(el) {
            var spans = el.select('span');
            //console.log(spans.length);
            if(spans.length > 1) {
                var theel
                do {
                    theel = spans[ Math.floor(Math.random()*(spans.length)) ];
                } while(theel.visible());
                //console.log(theel);
                theel.appear().siblings().invoke("fade");
            }
        });
    }, 8000);


});
