Skip to content
This repository has been archived by the owner on Apr 5, 2023. It is now read-only.

Popover on mouse move #39

Open
billybonks opened this issue Apr 28, 2014 · 2 comments
Open

Popover on mouse move #39

billybonks opened this issue Apr 28, 2014 · 2 comments

Comments

@billybonks
Copy link

is there a way to configure the popover widget to appear on mouse over

@azirbel
Copy link
Contributor

azirbel commented Jul 18, 2014

Not out of the box, but you could extend Ember.Widgets.PopoverComponent and Ember.Widgets.PopoverLinkComponent, and add the behavior you want to the PopoverLinkComponent in a similar way to how click is defined now.

I'll leave this open tagged as an enhancement, since it sounds useful - we might consider adding it in the future.

@blimmer
Copy link
Contributor

blimmer commented Feb 5, 2015

I got close on this but never got it over the finish line. Here's my code.

HoverPopoverLinkComponent = Em.Component.extend
  classNames: ['hover-popover']
  placement: 'top'
  content: null
  rootElement: '.ember-application'
  fade: true

  mouseEnter: ->
    @showPopover()

  mouseLeave: ->
    @hidePopover()

  showPopover: ->
    popover = @get('_popover')

    if popover?.get('_state') is 'inDOM'
      return
    else
      popoverView = Em.View.extend Em.Widgets.PopoverMixin,
        layoutName: 'popover-link-popover'
        controller: this
        targetElement: @get('element')
        container: @get('container')
        placement: Em.computed.alias 'controller.placement'
        fade: @get('fade')
        contentViewClass: IbottaWeb.PopoverContentView
        classNames: 'hover-popover-content'
        bodyClick: ->
      popover = popoverView.create()
      @set '_popover', popover
      popover.appendTo @get('rootElement')

  hidePopover: ->
    popover = @get('_popover')
    popover?.destroy()

I had trouble with it lining up correctly all the time. Hopefully this is a good start!

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Development

No branches or pull requests

3 participants