This package is meant to provide a standard way to handle informational tooltips when users hover over (on desktop devices) or touch (on mobile devices) a state or county in the Map Center.
When a user performs either of those actions, the following things occur:
If the user is on a desktop device, the tooltip position will update continously as the cursor moves within the same state or county, and the tooltip element will be removed when the cursor is no longer over that area.
Function
nhmc.tooltips.init()
This function performs any initialization steps required by the tooltip system. This currently includes only calling nhmc.tooltips.bindHover.
Array
This is a standard JavaScript array that contains zero or more handles returned by dojo.connect. Dojo’s event handling for graphics objects (and other items in general, but we only use it for graphics objects) is powerful in that it doesn’t require DOM elements to exist as in jQuery–but it introduces a bit more complexity in that binding an event handler returns a handle that must be passed later to dojo.disconnect in order to unbind that handler.
The handles stored in this array correspond only to the event handlers required by the tooltip system. This array should be treated as an implementation detail of nhmc.tooltips.bindHover and nhmc.tooltips.unbindHover and probably should not be accessed by any other parts of the Map Center.
Function
nhmc.tooltips.bindHover()
This function binds all event handlers needed for the interactions listed above to occur. This includes all checking for mobile devices in order to bind these event handlers correctly; of course, any module-specific handling of such devices (such as different positioning, different content or providing a close button) will have to perform those checks elsewhere as well.
Function
nhmc.tooltips.unbindHover()
This function shuts down the tooltip system by unbinding all event handlers bound by nhmc.tooltips.bindHover.
Function
nhmc.tooltips.position(e)
This function is an event handler that sets the position of the tooltip element. By default, this function places the tooltip close to the user’s mouse cursor (or touch location), but offset in the y-direction by nhmc.tooltips.xOffset and in the x-direction by nhmc.tooltips.yOffset. (Yes, this makes no sense. It’s the same convention used by CSS Globe‘s tutorial, and it doesn’t make sense there either.) If the tooltip would extend below the bottom of the document or to the right of the document’s right edge, it is moved to the opposite side of the user’s cursor (or touch location) in order to prevent this.
In certain cases, a module developer might want to override this position; for example, we do this for broadcast versions of just about all of our maps so the tooltip is always on the left side of the document. To do this, simply assign a new function to nhmc.tooltips.position. For example, since we set the position of #tooltip in this case using broadcast-specific stylesheets, we simply assign a function with an empty body:
nhmc.tooltips.position = function(e) {};
Number
This property determines how many pixels away from the mouse cursor (or touch location) the tooltip should be positioned in the y-direction.
Number
This property determines how many pixels away from the mouse cursor (or touch location) the tooltip should be positioned in the x-direction.
Function
nhmc.tooltips.render()
This function creates the tooltip element #tooltip, appends it to the <body> and renders its content.
Important
This function is meant to be overridden by module developers. The value of this is the Dojo path object being hovered over (or touched). If you need to access information about that area, access the name or FIPS code with this.nhmcData; more information about the properties of that object are available in the nhmc.geo documentation.
Function
nhmc.tooltips.addClose()
This function is meant to be called from within nhmc.tooltips.render for touch devices as determined by Modernizr.touch. It provides a close button for users to remove the currently showing tooltip and rebind the tooltip system’s event handlers.