expose function

[joostliketoast]

i tried using the qtip2 plugin for jquery, the function works with expose but it doesn't seem to take the parameters set in opal. using the x-string option works fine.

Any ideas why? did i implement it incorrectly?

  Element.expose :qtip

    @el = Element.find selector
    @tooltips = []
    @el.each do |tooltip|
      @tooltips.push tooltip
      %x{
        $(#{tooltip.get}).qtip({
          show: 'click',
          hide: 'unfocus',
          content: {
              title: {
                text: $(#{tooltip.get}).attr('title'),
                button: true
              },
              text: $(#{tooltip.get}).next('div') // Use the "div" element next to this for the content
          },
          position: {
            my: 'top left',  // Position my top left...
            at: 'bottom right', // at the bottom right of...
            target: $(#{tooltip.get}) // my target
          },
          style: {
              classes: 'qtip-bootstrap'
          }
        });
      }
      ## SEEMS BROKEN FOR NOW
      # tooltip.qtip(
      #   show: 'click',
      #   hide: 'unfocus',
      #   content: {
      #     title: {
      #       text: tooltip.attr('title'),
      #       button: true
      #     },
      #     text: tooltip.next('div') # Use the "div" element next to this for the content
      #   },
      #   position: {
      #     my: 'top left', # Position my top left...
      #     at: 'bottom right', # at the bottom right of...
      #     target: tooltip # my target
      #   },
      #   style: {
      #     classes: 'qtip-bootstrap'
      #   }
      # )
  end

[elia]

Does it work when you "expose" in another file?

If the answer is yes then it's known bug for which we should have an issue open in opal/opal.

[joostliketoast]

i just tried it with putting 'expose' in the file that loads in the module. sadly same result

[elia]

@joostliketoast oh I see, I skimmed through the issue description initially and missed the fact that the problem is just with params.

.expose passes on the params as the are, so you're passing a ruby/opal Hash instance instead of a bare JS object. This should work:

require 'native'

tooltip.qtip({
  show: 'click',
  hide: 'unfocus',
  content: {
    title: {
      text: tooltip.attr('title'),
      button: true
    },
    text: tooltip.next('div') # Use the "div" element next to this for the content
  },
  position: {
    my: 'top left', # Position my top left...
    at: 'bottom right', # at the bottom right of...
    target: tooltip # my target
  },
  style: {
    classes: 'qtip-bootstrap'
  }
}.to_n)

[joostliketoast]

ah thanks that worked! :)
good to know that expose uses plain js parameters instead of opal

[elia]

Great! @joostliketoast would you mind doing a PR to update the README?

[joostliketoast]

no problem i will send a PR

[elia]

Thanks!