Skip to content

Feature Request: Add powerTipPreOpen #97

Open
@speedplane

Description

@speedplane

Currently there is an event before the data is rendered and after it is displayed to the user. It would be nice if there was an event that was triggered after render but before user display. We often want to fiddle with the placement of certain items before showing them to the user.

Activity

speedplane

speedplane commented on Jul 28, 2013

@speedplane
Author

It's an easy fix too, just add two lines in showTip:

        // set tooltip position
        if (!options.followMouse) {
            positionTipOnElement(element);
            session.isFixedTipOpen = true;
        } else {
            positionTipOnCursor();
        }

        // trigger powerTipPreOpen event
        element.trigger('powerTipPreOpen');

        // fadein
        tipElement.fadeIn(options.fadeInTime, function fadeInCallback() {
            // start desync polling
            if (!session.desyncTimeout) {
                session.desyncTimeout = setInterval(closeDesyncedTip, 500);
            }

            // trigger powerTipOpen event
            element.trigger('powerTipOpen');
        });
speedplane

speedplane commented on Jul 28, 2013

@speedplane
Author

Actually, I need a slight change to the above, because the elements need to be visible to have their attributes set:

        // trigger powerTipPreOpen event
        tipElement.show();
        element.trigger('powerTipPreOpen');
        tipElement.hide();
stevenbenner

stevenbenner commented on Aug 4, 2013

@stevenbenner
Owner

tipElement.show();

You had me up until here. What exactly are you trying to do that requires the tooltip content to be visible?

Without knowing the specifics of your situation, generally, if you run into such a situation it would be best to create/modify your elements outside of the document via DOM document fragments or jQuery detached elements. Then you can clone or move the fully prepared elements to the tooltip element via the powertipjq data attribute or just filling the #powertip div manually during the powerTipPreRender event.

speedplane

speedplane commented on Aug 4, 2013

@speedplane
Author

If you don't call show beforehand, then the width and the height of the powertip DOM element won't be set properly in the powerTipPreOpen command. This isn't a problem for simple powertips, but in my case, there are many DOM elements in the powertip that have to be neatly stacked and it requires accurate sizing.

To see an example, go here and hover over Oracle in the party names.

stevenbenner

stevenbenner commented on Aug 4, 2013

@stevenbenner
Owner

Wow, that is probably the largest tooltip that I have ever seen (imho too large). What are you trying to do here that requires or would be made easier by having a pre-open event?

speedplane

speedplane commented on Aug 5, 2013

@speedplane
Author

All of the white little boxes are the attorneys in the case. If I add the boxes naively they look really bad because there are oddly spaced gaps between the attorney names. To fix that, I use the masonry library which stacks them nicely. I want masonry to run before I start fading in the tooltip. However, in order for masonry to run properly, the elements need to be fully rendered. Accordingly, I show the DOM element very quickly, run masonry, and then hide it.

stevenbenner

stevenbenner commented on Aug 5, 2013

@stevenbenner
Owner

I've never used masonry before. But have you tried running it on an unattached jQuery object? You might be able to generate your tooltip content in a new jQuery object, run masonry on it, then attach that object to the powertipjq data attribute on page load.

Example:

// domready
$(function() {
    var attorneyList = $('<div><div class="attorney">Foo Bar, Esq.</div></div>');
    attorneyList.masonry(masonryOptions);
    $('#plaintiff').data('powertipjq', attorneyList);
    $('#plaintiff').powerTip();
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    FeatureSoftware improvements that involve implementing new features.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @stevenbenner@speedplane

        Issue actions

          Feature Request: Add powerTipPreOpen · Issue #97 · stevenbenner/jquery-powertip