coffee to JS - which is easier to read?

original.js

PWFE.TabbedContentRotator = function() {};

PWFE.TabbedContentRotator.prototype = {
	
		tabCount: 0,
		tabCompId:"",
		currentPagePath:"",
		resourcePath:"",

	    init : function(tabCount, tabCompId, currentPagePath, resourcePath) {
	        var self = this;
	        if(tabCount) self.tabCount = tabCount;
	        if(tabCompId) self.tabCompId = tabCompId;
	        if(currentPagePath) self.currentPagePath = currentPagePath;
	        if(resourcePath) self.resourcePath = resourcePath;
	        
	        $("#"+self.tabCompId).tabs({spinner:'Retrieving data...'});
	        $("#"+self.tabCompId+"_addTab").css("cursor","pointer");
	    },
		
		setHeight: function(tabHeight) {
	        var self = this;
            $("#"+self.tabCompId+" > div [id^='"+self.tabCompId+"_tab'][class*='ui-tabs-panel']").css("height",tabHeight+"px");
            $("#"+self.tabCompId+" > div [id^='"+self.tabCompId+"_tab'][class*='ui-tabs-panel']").css("overflow","auto");
		},
		
		setOrientation: function(tabOrientation) {
	        var self = this;
            $("#"+self.tabCompId).tabs().addClass('tabs-'+tabOrientation+' ui-helper-clearfix');
            $("#"+self.tabCompId+" li").removeClass('ui-corner-all ui-corner-top').addClass('ui-corner-'+tabOrientation);			
		},
		
		setRandomization: function() {
	        var self = this;
            var randomnumber=Math.floor(Math.random()*self.tabCount);
            $("#"+self.tabCompId).tabs("select",randomnumber);			
		},
		
		setRotation: function(rotationDelay) {
			var self = this;
			var isMouseAtPanel = false;
			//set mouseover and mouseout effect on tab panel (tab content body)
            $("#"+self.tabCompId+" > div [id^='"+self.tabCompId+"_tab'][class*='ui-tabs-panel']").hoverIntent(function(){
                $("#"+self.tabCompId).tabs('rotate', 0, true);
                isMouseAtPanel = true;
                //console.log("mouseover at tab panel element..");
            },
            function(){
                $("#"+self.tabCompId).tabs({fx:{opacity:'toggle'}}).tabs('rotate', rotationDelay*1000, true);
                isMouseAtPanel = false;
            });
            //set mouseover and mouseout effect on tab head elements (li)..
            //mouseIntent fixes issue of not opening the correct element
            $("#"+self.tabCompId+" ul li").hoverIntent({timeout:300, over:function(){
                $("#"+self.tabCompId).tabs('rotate', 0, true);
                $("#"+self.tabCompId).tabs('select', $(this).attr("myid"));
            },
            out:function(){
                //console.log("mouseout at tab heading element...");
            	if(!isMouseAtPanel) {
            		$("#"+self.tabCompId).tabs({fx:{opacity:'toggle'}}).tabs('rotate', rotationDelay*1000, true);
            	}
            }});
            
            //start rotation
            $("#"+self.tabCompId).tabs({fx:{opacity: "toggle"}}).tabs("rotate", rotationDelay*1000, true);            
            /* This is to fix the issue of jumping page during rotation */
            $("#"+self.tabCompId).tabs({ fx: { opacity: 'toggle' },
                select: function(event, ui) {                   
                    $(this).css('height', $(this).height());
                    $(this).css('overflow', 'hidden');
               },
               show: function(event, ui) {
                   $(this).css('height', 'auto');
                   $(this).css('overflow', 'visible');
               }
           });          
		},
		
		registerAddTabHandler: function() {
	        var self = this;
	         $('#'+self.tabCompId+'_addTab').click(function() {
	             $.ajax({
	                 dataType: 'html',
	                 url: self.currentPagePath + '/_jcr_content._managetabs.html',
	                 cache: false,
	                 timeout: 30000,
	                 data: {resPath: self.resourcePath, action:'addTab'},
	                 success: function(data) {
	                     document.location.reload();
	                 }
	             });
	         });
	     },
	     
	     reloadOnTabShow: function(tabIndex) {
	    	 var self = this;
	    	 $('#'+self.tabCompId).tabs("select", tabIndex);
	    	 $('#'+self.tabCompId).bind('tabsselect', function(event, ui) {
	    		 document.location.href= self.currentPagePath+'.html?'+self.tabCompId+'_tabIndex='+ui.panel.id;
	    	 });
	     }	     
};

tabbedcontent.annoying.coffee

PWFE.TabbedContentRotator = ->

PWFE.TabbedContentRotator:: =

  IDPROP : "myid"
  POPPED : "popped"
  POPPER_CSS_CLASS : "popper"
  DIR_RIGHT : "right"
  DIR_LEFT : "left"

  init: (@tabCount, @tabCompId, @currentPagePath, @resourcePath, @prefix, @hash) ->
    @tabIndex = @grabSelectedFromHash()
    @tabOrientation = ""
    @itemsInView = []
    @allItems = []
    if @tabIndex.length > 0 and isNaN(@tabIndex) is false and @tabIndex >= 0
      $("#" + @tabCompId).tabs
        spinner: "Retrieving data..."
        selected: @tabIndex
    else
      $("#" + @tabCompId).tabs spinner: "Retrieving data..."
    $("#" + @tabCompId + "_addTab").css "cursor", "pointer"

    @registerHashUpdate()
    @registerPoppers()


  delayAlert : -> x = setTimeout("$(window).resize()", 500)


  #This should only be used when in edit mode, obviously
  enableSortable: ->
    self = this
    selector = "#" + self.tabCompId + " .ui-tabs-nav"
    $(selector).sortable
      items: "li:not(.ui-state-disabled)"
      update: (event, ui) ->
        thisID = $(ui.item).attr("nodePath")
        thisParent = $(ui.item).attr("parentPath")
        next = $(ui.item).next().attr("nodePath")
        params = "cmd=movePage" + "&_charset_=utf-8" + "&srcPath=" + thisID + "&destParentPath=" + (thisParent += "&before=")
        params += "&destParentPath=" + (thisParent += "&before=")
        params += next  if next?
        if (thisID?) and (thisParent?)
          response = CQ.HTTP.post("/bin/wcmcommand?" + params)
          ok = response.headers.Status and response.headers.Status is "200"
          unless ok
            $("#containerBottom_tabs .ui-tabs-nav").sortable "destroy"
            CQ.Notification.notify "Tabs Component ", "<div style=\"color:#ff0000\">Error moving tab - temporarily turning off sorting capability</div>", 2
            new PWFE.TabbedContentRotator().refreshTabs()
          if ok
            self.tabIndex = $(ui.item).index()
            self.hash = parent.document.location.hash
            self.updateHash $(ui.item).index()
            new PWFE.TabbedContentRotator().refreshTabs()
            CQ.Notification.notify "Tabs Component ", "Move Successful! <br> <b>A page refresh may be necessary to continue editing the content</b>", 2


  #Returns the current <li> tab, that is active. Different than @grabSelectedFromHash
  getSelected: ->
    self = this
    for item,i in @getContentTabs()
      return $(item) if $(item).hasClass("ui-state-active")


  #Content tab <li>s have the class 'data-item' on them, the poppers do not
  getContentTabs: -> $("#" + @tabCompId + " ul li").filter (tab,elem) -> $(elem).hasClass("data-item")


  #Every time a tab is hidden, the popped attribute should be set to false o removed
  getUnPoppedTabs:(listitems)-> $(listitems).filter (tab,elem) -> $(elem).attr("popped") != "true"


  #Including poppers, etc
  getVisibleTabs: -> $("#" + @tabCompId + " ul li").filter (tab,elem) -> $(elem).is(":visible")


  grabSelectedFromHash: ->
    self = this
    hashes = self.hash.split("#")
    i = 0
    while i < hashes.length
      innersplit = hashes[i].split(self.prefix + "_")
      return hashes[i].replace(self.prefix + "_", "")  if innersplit.length is 2 and not isNaN(innersplit[1])
      i++
    0


  hidePopper :(direction) ->
    switch direction
      when @DIR_RIGHT then $("#" + @tabCompId + "_popright").hide().attr(self.POPPED,true).attr("poppedDirection",direction).attr("lastChangedBy","hidePopper")
      when @DIR_LEFT then $("#" + @tabCompId + "_popleft").hide().attr(self.POPPED,true).attr("poppedDirection",direction).attr("lastChangedBy","hidePopper")


  # Moves the tabs right or left, and selects the next or previous tab
  pop:(direction) ->
    self = this
    listitems = self.getContentTabs()
    itemsinview = self.getUnPoppedTabs(listitems)
    firstVisID = $(itemsinview.first()).attr(@IDPROP)
    lastVisID = $(itemsinview.last()).attr(@IDPROP)

    for item,i in listitems
      switch direction
        when self.DIR_RIGHT
          if $(listitems[i+1]).length == 1  and $(item).attr(self.IDPROP) == lastVisID
            $(listitems[i+1]).show().attr(self.POPPED,false).attr("poppedDirection",direction).attr("lastChangedBy","pop")
            $(itemsinview).first().hide().attr(self.POPPED,true).attr("poppedDirection",direction).attr("lastChangedBy","pop")
            $("#" + self.tabCompId).tabs("select",self.tabIndex + 1)
        when self.DIR_LEFT
          if $(listitems[i-1]).length == 1  and $(item).attr(self.IDPROP) == firstVisID
            $(listitems[i-1]).show().attr(self.POPPED,false).attr("poppedDirection",direction).attr("lastChangedBy","pop")
            $(itemsinview).last().hide().attr(self.POPPED,true).attr("poppedDirection",direction).attr("lastChangedBy","pop")
            $("#" + self.tabCompId).tabs("select",self.tabIndex - 1)

    self.updatePopper()


  refreshTabs: -> $("button:contains('--Refresh Tabs--')").click()


  registerAddTabHandler: ->
    self = this
    $("#" + self.tabCompId + "_addTab").click ->
      $.ajax
        dataType: "html"
        url: self.currentPagePath + "/_jcr_content._managetabs.html"
        cache: false
        timeout: 30000
        data:
          resPath: self.resourcePath
          action: "addTab"

        success: (data) ->
          $("button:contains('--Refresh Tabs--')").click()
          CQ.Notification.notify "Tabs Component ", "Tab Added! <br> <b>A page refresh may be necessary to continue editing the content</b>", 2


  registerHashUpdate: ->
    self = this
    $("#" + self.tabCompId).bind "tabsselect", (event, ui) ->
      self.hash = parent.document.location.hash
      self.tabIndex = ui.index
      self.updateHash self.tabIndex


  registerPoppers : ->
    self = this
    $("#" + self.tabCompId + "_popright a").click -> self.pop(self.DIR_RIGHT)
    $("#" + self.tabCompId + "_popleft a").click -> self.pop(self.DIR_LEFT)


  reloadOnTabShow: ->
    self = this
    $("#" + self.tabCompId).bind "tabsselect", (event, ui) ->
      parent.document.location.href = self.currentPagePath + ".html#" + self.prefix + "_" + ui.index


  #This method should really only be called once, after all the plumbing / setup / init
  responsify: ->
    self = this
    @originalTabOrientation = @tabOrientation #So we can revert to the original
    listitems = @getContentTabs()
    $(window).resize ->
      if document.body.clientWidth < 1000
        self.setOrientation ""
        objwidth = 0
        for item,i in listitems
          objwidth += $(item).offset().left  if i is 0
          objwidth += $(item).outerWidth(true)
          if objwidth >= $(item).parent().width() or objwidth >= document.body.clientWidth
            $("#" + self.tabCompId).tabs("select", self.tabIndex - 1)  if $(item).index() is self.tabIndex
            $(item).hide().attr(self.POPPED,true).attr("lastChangedBy","responsify")
          else
            $(item).show().attr(self.POPPED,false).attr("lastChangedBy","responsify")
        self.updatePopper()
        self.updateVisibleTabs()
      else
        self.setOrientation self.originalTabOrientation
        $(item).show().attr(self.POPPED,false).attr("lastChangedBy","responsify") for item in listitems

    $(window).resize()
    @delayAlert() #BAND AID, not necessary in all browsers


  setHeight: (tabHeight) ->
    $("#" + @tabCompId + " > div [id^='" + @tabCompId + "_tab'][class*='ui-tabs-panel']").css "height", tabHeight + "px"
    $("#" + @tabCompId + " > div [id^='" + @tabCompId + "_tab'][class*='ui-tabs-panel']").css "overflow", "auto"


  setOrientation: (tborient) ->
    DEFAULT_TOP_LI_CLASSES = "ui-corner-all ui-corner-top"
    $("#" + @tabCompId).removeClass "tabs-" + @tabOrientation + " ui-helper-clearfix"
    $("#" + @tabCompId + " li").removeClass DEFAULT_TOP_LI_CLASSES
    @tabOrientation = tborient
    if @tabOrientation isnt ""
      $("#" + @tabCompId).tabs().addClass "tabs-" + @tabOrientation + " ui-helper-clearfix"
      $("#" + @tabCompId + " li").addClass "ui-corner-" + tborient
    else
      $("#" + @tabCompId).tabs()


  setRandomization: ->
    randomnumber = Math.floor(Math.random() * @tabCount)
    $("#" + @tabCompId).tabs "select", randomnumber


  setRotation: (rotationDelay) ->
    self = this
    isMouseAtPanel = false
    $("#" + self.tabCompId + " > div [id^='" + self.tabCompId + "_tab'][class*='ui-tabs-panel']").hoverIntent (->
      $("#" + self.tabCompId).tabs "rotate", 0, true
      isMouseAtPanel = true
    ), ->
      $("#" + self.tabCompId).tabs(fx:
        opacity: "toggle"
      ).tabs "rotate", rotationDelay * 1000, true
      isMouseAtPanel = false

    $("#" + self.tabCompId + " ul li").hoverIntent
      timeout: 300
      over: ->
        $("#" + self.tabCompId).tabs "rotate", 0, true
        $("#" + self.tabCompId).tabs "select", $(this).attr(self.IDPROP)

      out: ->
        unless isMouseAtPanel
          $("#" + self.tabCompId).tabs(fx:
            opacity: "toggle"
          ).tabs "rotate", rotationDelay * 1000, true

    $("#" + self.tabCompId).tabs(fx:
      opacity: "toggle"
    ).tabs "rotate", rotationDelay * 1000, true
    $("#" + self.tabCompId).tabs
      fx:
        opacity: "toggle"

      select: (event, ui) ->
        $(this).css "height", $(this).height()
        $(this).css "overflow", "hidden"

      show: (event, ui) ->
        $(this).css "height", "auto"
        $(this).css "overflow", "visible"


  showPopper : (direction) ->
    switch direction
      when @DIR_RIGHT then $("#" + @tabCompId + "_popright").show().attr(self.POPPED,false).attr("poppedDirection",direction).attr("lastChangedBy","showPopper")
      when @DIR_LEFT then $("#" + @tabCompId + "_popleft").show().attr(self.POPPED,false).attr("poppedDirection",direction).attr("lastChangedBy","showPopper")

  #Updates the hash in the URL
  updateHash: (index) ->
    self = this
    linkHashIndex = -1
    hashes = self.hash.split("#")
    i = 0

    for hash,i in hashes
      if hash.indexOf(self.prefix) > -1
        linkHashIndex = i
        hashes[i] = self.prefix + "_" + index

    p_d_l = parent.document.location
    if linkHashIndex > -1 then p_d_l.hash = hashes.join("#") else p_d_l.href = p_d_l.href + "#" + self.prefix + "_" + index

  #This will make sure the proper (left or right) popper is in view
  updatePopper:() ->

    listitems = @getContentTabs()
    itemsinview = @getUnPoppedTabs(listitems)

    hasMore = $(listitems).last().attr(@IDPROP) != $(itemsinview).last().attr(@IDPROP)
    if hasMore then @showPopper(@DIR_RIGHT) else @hidePopper(@DIR_RIGHT)

    hasLess = $(listitems).first().attr(@IDPROP) != $(itemsinview).first().attr(@IDPROP)
    if hasLess then @showPopper(@DIR_LEFT) else @hidePopper(@DIR_LEFT)

    @updateVisibleTabs()

  #This will make sure that the current selected tab is within view. It's a relatively heavy operation
  updateVisibleTabs:() ->
    contentwidth = 0
    selected = @getSelected()
    listitems = @getContentTabs()
    itemsinview = @getUnPoppedTabs(listitems)

    # First we go through all of the visible tabs to determine the content's total width, only with the poppers (left / right)
    for item,i in @getVisibleTabs()
      contentwidth += $(item).offset().left  if i is 0
      contentwidth += $(item).outerWidth(true) if $(item).hasClass(@POPPER_CSS_CLASS)

    # Secondly we go through all of the visible tabs that are NOT poppers. These will be safe to remove, the poppers are not
    for item,i in @getVisibleTabs()
      if !$(item).hasClass(@POPPER_CSS_CLASS)
        contentwidth += $(item).outerWidth(true)
        if contentwidth >= $(item).parent().width() or contentwidth >= document.body.clientWidth
          $(item).hide().attr(@POPPED,true).attr("lastChangedBy","updatePopper")


    #The idea here is we want to pop the tabs until the one selected is visible
    if selected and  !$(selected).is(":visible")
      id = $(selected).attr(@IDPROP)

      # depends on which way it's out of the visible content
      switchdir = @DIR_RIGHT if $("#" + @tabCompId + " li[myid='"+ id + "']").index() > $(itemsinview).last().index()
      switchdir = @DIR_LEFT if $("#" + @tabCompId + " li[myid='"+ id + "']").index() < $(itemsinview).first().index()

      if switchdir?.length > 1
        for tab,i in $(itemsinview) #tried a while loop, but am afraid of an infinite loop crashing the browser
          @pop(switchdir) unless $("#" + @tabCompId + " li[myid='"+ id + "']").is(":visible") or $("#" + @tabCompId + " li[myid='"+ id + "']").attr(@POPPED) is "false"

tabbedcontent.js

PWFE.TabbedContentRotator = function() {};

PWFE.TabbedContentRotator.prototype = {
  IDPROP: "myid",
  POPPED: "popped",
  POPPER_CSS_CLASS: "popper",
  DIR_RIGHT: "right",
  DIR_LEFT: "left",
  init: function(tabCount, tabCompId, currentPagePath, resourcePath, prefix, hash) {
    this.tabCount = tabCount;
    this.tabCompId = tabCompId;
    this.currentPagePath = currentPagePath;
    this.resourcePath = resourcePath;
    this.prefix = prefix;
    this.hash = hash;
    this.tabIndex = this.grabSelectedFromHash();
    this.tabOrientation = "";
    this.itemsInView = [];
    this.allItems = [];
    if (this.tabIndex.length > 0 && isNaN(this.tabIndex) === false && this.tabIndex >= 0) {
      $("#" + this.tabCompId).tabs({
        spinner: "Retrieving data...",
        selected: this.tabIndex
      });
    } else {
      $("#" + this.tabCompId).tabs({
        spinner: "Retrieving data..."
      });
    }
    $("#" + this.tabCompId + "_addTab").css("cursor", "pointer");
    this.registerHashUpdate();
    return this.registerPoppers();
  },
  delayAlert: function() {
    var x;
    return x = setTimeout("$(window).resize()", 500);
  },
  enableSortable: function() {
    var selector, self;
    self = this;
    selector = "#" + self.tabCompId + " .ui-tabs-nav";
    return $(selector).sortable({
      items: "li:not(.ui-state-disabled)",
      update: function(event, ui) {
        var next, ok, params, response, thisID, thisParent;
        thisID = $(ui.item).attr("nodePath");
        thisParent = $(ui.item).attr("parentPath");
        next = $(ui.item).next().attr("nodePath");
        params = "cmd=movePage" + "&_charset_=utf-8" + "&srcPath=" + thisID + "&destParentPath=" + (thisParent += "&before=");
        params += "&destParentPath=" + (thisParent += "&before=");
        if (next != null) {
          params += next;
        }
        if ((thisID != null) && (thisParent != null)) {
          response = CQ.HTTP.post("/bin/wcmcommand?" + params);
          ok = response.headers.Status && response.headers.Status === "200";
          if (!ok) {
            $("#containerBottom_tabs .ui-tabs-nav").sortable("destroy");
            CQ.Notification.notify("Tabs Component ", "<div style=\"color:#ff0000\">Error moving tab - temporarily turning off sorting capability</div>", 2);
            new PWFE.TabbedContentRotator().refreshTabs();
          }
          if (ok) {
            self.tabIndex = $(ui.item).index();
            self.hash = parent.document.location.hash;
            self.updateHash($(ui.item).index());
            new PWFE.TabbedContentRotator().refreshTabs();
            return CQ.Notification.notify("Tabs Component ", "Move Successful! <br> <b>A page refresh may be necessary to continue editing the content</b>", 2);
          }
        }
      }
    });
  },
  getSelected: function() {
    var i, item, self, _i, _len, _ref;
    self = this;
    _ref = this.getContentTabs();
    for (i = _i = 0, _len = _ref.length; _i < _len; i = ++_i) {
      item = _ref[i];
      if ($(item).hasClass("ui-state-active")) {
        return $(item);
      }
    }
  },
  getContentTabs: function() {
    return $("#" + this.tabCompId + " ul li").filter(function(tab, elem) {
      return $(elem).hasClass("data-item");
    });
  },
  getUnPoppedTabs: function(listitems) {
    return $(listitems).filter(function(tab, elem) {
      return $(elem).attr("popped") !== "true";
    });
  },
  getVisibleTabs: function() {
    return $("#" + this.tabCompId + " ul li").filter(function(tab, elem) {
      return $(elem).is(":visible");
    });
  },
  grabSelectedFromHash: function() {
    var hashes, i, innersplit, self;
    self = this;
    hashes = self.hash.split("#");
    i = 0;
    while (i < hashes.length) {
      innersplit = hashes[i].split(self.prefix + "_");
      if (innersplit.length === 2 && !isNaN(innersplit[1])) {
        return hashes[i].replace(self.prefix + "_", "");
      }
      i++;
    }
    return 0;
  },
  hidePopper: function(direction) {
    switch (direction) {
      case this.DIR_RIGHT:
        return $("#" + this.tabCompId + "_popright").hide().attr(self.POPPED, true).attr("poppedDirection", direction).attr("lastChangedBy", "hidePopper");
      case this.DIR_LEFT:
        return $("#" + this.tabCompId + "_popleft").hide().attr(self.POPPED, true).attr("poppedDirection", direction).attr("lastChangedBy", "hidePopper");
    }
  },
  pop: function(direction) {
    var firstVisID, i, item, itemsinview, lastVisID, listitems, self, _i, _len;
    self = this;
    listitems = self.getContentTabs();
    itemsinview = self.getUnPoppedTabs(listitems);
    firstVisID = $(itemsinview.first()).attr(this.IDPROP);
    lastVisID = $(itemsinview.last()).attr(this.IDPROP);
    for (i = _i = 0, _len = listitems.length; _i < _len; i = ++_i) {
      item = listitems[i];
      switch (direction) {
        case self.DIR_RIGHT:
          if ($(listitems[i + 1]).length === 1 && $(item).attr(self.IDPROP) === lastVisID) {
            $(listitems[i + 1]).show().attr(self.POPPED, false).attr("poppedDirection", direction).attr("lastChangedBy", "pop");
            $(itemsinview).first().hide().attr(self.POPPED, true).attr("poppedDirection", direction).attr("lastChangedBy", "pop");
            $("#" + self.tabCompId).tabs("select", self.tabIndex + 1);
          }
          break;
        case self.DIR_LEFT:
          if ($(listitems[i - 1]).length === 1 && $(item).attr(self.IDPROP) === firstVisID) {
            $(listitems[i - 1]).show().attr(self.POPPED, false).attr("poppedDirection", direction).attr("lastChangedBy", "pop");
            $(itemsinview).last().hide().attr(self.POPPED, true).attr("poppedDirection", direction).attr("lastChangedBy", "pop");
            $("#" + self.tabCompId).tabs("select", self.tabIndex - 1);
          }
      }
    }
    return self.updatePopper();
  },
  refreshTabs: function() {
    return $("button:contains('--Refresh Tabs--')").click();
  },
  registerAddTabHandler: function() {
    var self;
    self = this;
    return $("#" + self.tabCompId + "_addTab").click(function() {
      return $.ajax({
        dataType: "html",
        url: self.currentPagePath + "/_jcr_content._managetabs.html",
        cache: false,
        timeout: 30000,
        data: {
          resPath: self.resourcePath,
          action: "addTab"
        },
        success: function(data) {
          $("button:contains('--Refresh Tabs--')").click();
          return CQ.Notification.notify("Tabs Component ", "Tab Added! <br> <b>A page refresh may be necessary to continue editing the content</b>", 2);
        }
      });
    });
  },
  registerHashUpdate: function() {
    var self;
    self = this;
    return $("#" + self.tabCompId).bind("tabsselect", function(event, ui) {
      self.hash = parent.document.location.hash;
      self.tabIndex = ui.index;
      return self.updateHash(self.tabIndex);
    });
  },
  registerPoppers: function() {
    var self;
    self = this;
    $("#" + self.tabCompId + "_popright a").click(function() {
      return self.pop(self.DIR_RIGHT);
    });
    return $("#" + self.tabCompId + "_popleft a").click(function() {
      return self.pop(self.DIR_LEFT);
    });
  },
  reloadOnTabShow: function() {
    var self;
    self = this;
    return $("#" + self.tabCompId).bind("tabsselect", function(event, ui) {
      return parent.document.location.href = self.currentPagePath + ".html#" + self.prefix + "_" + ui.index;
    });
  },
  responsify: function() {
    var listitems, self;
    self = this;
    this.originalTabOrientation = this.tabOrientation;
    listitems = this.getContentTabs();
    $(window).resize(function() {
      var i, item, objwidth, _i, _j, _len, _len1, _results;
      if (document.body.clientWidth < 1000) {
        self.setOrientation("");
        objwidth = 0;
        for (i = _i = 0, _len = listitems.length; _i < _len; i = ++_i) {
          item = listitems[i];
          if (i === 0) {
            objwidth += $(item).offset().left;
          }
          objwidth += $(item).outerWidth(true);
          if (objwidth >= $(item).parent().width() || objwidth >= document.body.clientWidth) {
            if ($(item).index() === self.tabIndex) {
              $("#" + self.tabCompId).tabs("select", self.tabIndex - 1);
            }
            $(item).hide().attr(self.POPPED, true).attr("lastChangedBy", "responsify");
          } else {
            $(item).show().attr(self.POPPED, false).attr("lastChangedBy", "responsify");
          }
        }
        self.updatePopper();
        return self.updateVisibleTabs();
      } else {
        self.setOrientation(self.originalTabOrientation);
        _results = [];
        for (_j = 0, _len1 = listitems.length; _j < _len1; _j++) {
          item = listitems[_j];
          _results.push($(item).show().attr(self.POPPED, false).attr("lastChangedBy", "responsify"));
        }
        return _results;
      }
    });
    $(window).resize();
    return this.delayAlert();
  },
  setHeight: function(tabHeight) {
    $("#" + this.tabCompId + " > div [id^='" + this.tabCompId + "_tab'][class*='ui-tabs-panel']").css("height", tabHeight + "px");
    return $("#" + this.tabCompId + " > div [id^='" + this.tabCompId + "_tab'][class*='ui-tabs-panel']").css("overflow", "auto");
  },
  setOrientation: function(tborient) {
    var DEFAULT_TOP_LI_CLASSES;
    DEFAULT_TOP_LI_CLASSES = "ui-corner-all ui-corner-top";
    $("#" + this.tabCompId).removeClass("tabs-" + this.tabOrientation + " ui-helper-clearfix");
    $("#" + this.tabCompId + " li").removeClass(DEFAULT_TOP_LI_CLASSES);
    this.tabOrientation = tborient;
    if (this.tabOrientation !== "") {
      $("#" + this.tabCompId).tabs().addClass("tabs-" + this.tabOrientation + " ui-helper-clearfix");
      return $("#" + this.tabCompId + " li").addClass("ui-corner-" + tborient);
    } else {
      return $("#" + this.tabCompId).tabs();
    }
  },
  setRandomization: function() {
    var randomnumber;
    randomnumber = Math.floor(Math.random() * this.tabCount);
    return $("#" + this.tabCompId).tabs("select", randomnumber);
  },
  setRotation: function(rotationDelay) {
    var isMouseAtPanel, self;
    self = this;
    isMouseAtPanel = false;
    $("#" + self.tabCompId + " > div [id^='" + self.tabCompId + "_tab'][class*='ui-tabs-panel']").hoverIntent((function() {
      $("#" + self.tabCompId).tabs("rotate", 0, true);
      return isMouseAtPanel = true;
    }), function() {
      $("#" + self.tabCompId).tabs({
        fx: {
          opacity: "toggle"
        }
      }).tabs("rotate", rotationDelay * 1000, true);
      return isMouseAtPanel = false;
    });
    $("#" + self.tabCompId + " ul li").hoverIntent({
      timeout: 300,
      over: function() {
        $("#" + self.tabCompId).tabs("rotate", 0, true);
        return $("#" + self.tabCompId).tabs("select", $(this).attr(self.IDPROP));
      },
      out: function() {
        if (!isMouseAtPanel) {
          return $("#" + self.tabCompId).tabs({
            fx: {
              opacity: "toggle"
            }
          }).tabs("rotate", rotationDelay * 1000, true);
        }
      }
    });
    $("#" + self.tabCompId).tabs({
      fx: {
        opacity: "toggle"
      }
    }).tabs("rotate", rotationDelay * 1000, true);
    return $("#" + self.tabCompId).tabs({
      fx: {
        opacity: "toggle"
      },
      select: function(event, ui) {
        $(this).css("height", $(this).height());
        return $(this).css("overflow", "hidden");
      },
      show: function(event, ui) {
        $(this).css("height", "auto");
        return $(this).css("overflow", "visible");
      }
    });
  },
  showPopper: function(direction) {
    switch (direction) {
      case this.DIR_RIGHT:
        return $("#" + this.tabCompId + "_popright").show().attr(self.POPPED, false).attr("poppedDirection", direction).attr("lastChangedBy", "showPopper");
      case this.DIR_LEFT:
        return $("#" + this.tabCompId + "_popleft").show().attr(self.POPPED, false).attr("poppedDirection", direction).attr("lastChangedBy", "showPopper");
    }
  },
  updateHash: function(index) {
    var hash, hashes, i, linkHashIndex, p_d_l, self, _i, _len;
    self = this;
    linkHashIndex = -1;
    hashes = self.hash.split("#");
    i = 0;
    for (i = _i = 0, _len = hashes.length; _i < _len; i = ++_i) {
      hash = hashes[i];
      if (hash.indexOf(self.prefix) > -1) {
        linkHashIndex = i;
        hashes[i] = self.prefix + "_" + index;
      }
    }
    p_d_l = parent.document.location;
    if (linkHashIndex > -1) {
      return p_d_l.hash = hashes.join("#");
    } else {
      return p_d_l.href = p_d_l.href + "#" + self.prefix + "_" + index;
    }
  },
  updatePopper: function() {
    var hasLess, hasMore, itemsinview, listitems;
    listitems = this.getContentTabs();
    itemsinview = this.getUnPoppedTabs(listitems);
    hasMore = $(listitems).last().attr(this.IDPROP) !== $(itemsinview).last().attr(this.IDPROP);
    if (hasMore) {
      this.showPopper(this.DIR_RIGHT);
    } else {
      this.hidePopper(this.DIR_RIGHT);
    }
    hasLess = $(listitems).first().attr(this.IDPROP) !== $(itemsinview).first().attr(this.IDPROP);
    if (hasLess) {
      this.showPopper(this.DIR_LEFT);
    } else {
      this.hidePopper(this.DIR_LEFT);
    }
    return this.updateVisibleTabs();
  },
  updateVisibleTabs: function() {
    var contentwidth, i, id, item, itemsinview, listitems, selected, switchdir, tab, _i, _j, _k, _len, _len1, _len2, _ref, _ref1, _ref2, _results;
    contentwidth = 0;
    selected = this.getSelected();
    listitems = this.getContentTabs();
    itemsinview = this.getUnPoppedTabs(listitems);
    _ref = this.getVisibleTabs();
    for (i = _i = 0, _len = _ref.length; _i < _len; i = ++_i) {
      item = _ref[i];
      if (i === 0) {
        contentwidth += $(item).offset().left;
      }
      if ($(item).hasClass(this.POPPER_CSS_CLASS)) {
        contentwidth += $(item).outerWidth(true);
      }
    }
    _ref1 = this.getVisibleTabs();
    for (i = _j = 0, _len1 = _ref1.length; _j < _len1; i = ++_j) {
      item = _ref1[i];
      if (!$(item).hasClass(this.POPPER_CSS_CLASS)) {
        contentwidth += $(item).outerWidth(true);
        if (contentwidth >= $(item).parent().width() || contentwidth >= document.body.clientWidth) {
          $(item).hide().attr(this.POPPED, true).attr("lastChangedBy", "updatePopper");
        }
      }
    }
    if (selected && !$(selected).is(":visible")) {
      id = $(selected).attr(this.IDPROP);
      if ($("#" + this.tabCompId + " li[myid='" + id + "']").index() > $(itemsinview).last().index()) {
        switchdir = this.DIR_RIGHT;
      }
      if ($("#" + this.tabCompId + " li[myid='" + id + "']").index() < $(itemsinview).first().index()) {
        switchdir = this.DIR_LEFT;
      }
      if ((switchdir != null ? switchdir.length : void 0) > 1) {
        _ref2 = $(itemsinview);
        _results = [];
        for (i = _k = 0, _len2 = _ref2.length; _k < _len2; i = ++_k) {
          tab = _ref2[i];
          if (!($("#" + this.tabCompId + " li[myid='" + id + "']").is(":visible") || $("#" + this.tabCompId + " li[myid='" + id + "']").attr(this.POPPED) === "false")) {
            _results.push(this.pop(switchdir));
          } else {
            _results.push(void 0);
          }
        }
        return _results;
      }
    }
  }
};