Question

I am learning Coffeescript and trying to convert the following JavaScript code to Coffescript and (I think) I am almost there. Mainly, I am having an issue with making the timer and popover_parent variables global:

$('.some_element').popover(
  {
    delay: { show: 350, hide: 100 }       
  }
);
var timer,
    popover_parent;
function hidePopover(elem) {
    $(elem).popover('hide');
}
$('.some_element').hover(
    function() {
      var self = this;
      clearTimeout(timer);
      $('.popover').hide(); //Hide any open popovers on other elements.
      popover_parent = self
      $(self).popover('show');            
    }, 
    function() {
      var self = this;
      timer = setTimeout(function(){hidePopover(self)},300);                 
});
$('.popover').on({
  mouseover: function() {
    clearTimeout(timer);
  },
  mouseleave: function() {
    var self = this;
    timer = setTimeout(function(){hidePopover(popover_parent)},300); 
  }
});

This is what I have so far:

$ ->
  $('.some_element')
    .popover ->
      delay: {show:350, hide: 100}
$ ->
  hidePopover = (elem) ->
    $(elem).popover('hide')

  $('.some_element').hover(
    ->
      self = $(this)
      clearTimeout(timer)
      $('.popover').hide()
      popover_parent = self
      $(self).popover('show')
    ->
      self = $(this)
      timer = setTimeout(
        ->
          hidePopover(self) 300
      )
  )

$ ->
  $(document).on({
    mouseover: ->
      clearTimeout(timer)
    mouseleave: ->
      timer = setTimeout(
        ->
          hidePopover(popover_parent) 300
      )
  })

Any suggestions would be greatly appreciated.

Thanks!

Answer 1

I’m not sure if you knew about http://js2coffee.org, but if it works with your code it’s a really quick way to learn how to convert Javascript to Coffeescript. I used it a lot when getting started with coffee.

It also does compilation of coffee to js, of course.