Implementing mouseover functionality

GoDiagram
#1

I am attempting to implement some mouse-over functionality in a GoDiagram control I use to create org. charts.

My first step was to try to have the cursor change from a pointer to a hand. This behavior is demonstrated in the TreeApp example in your sample projects.

I have the GoWeb.js file included in my project, as in the TreeApp sample.
I have verified that the goDoMouseOver function is called at the appropriate times, and that it runs without error. But, the goSearchEvent function that is called from within goDoMouseOver never returns a ‘pointer’ cursor when the user “mouses over” a node in my diagram. A ‘pointer’ cursor is returned from goSearchEvents in the TreeApp sample when a node experiences a mouse over event.

I can’t figure out why my project behaves differently.

In the Northwoods.GoWeb.Instruments.xml document, the description for the OnMouseOver event states the following:

“Change the cursor to Cursors.Hand if the user can modify the value of this indicator interactively.”

but, I am not sure I understand “if the user can modify the value of this indicator interactively” means.

Is there something that I have failed to enable that would allow this behavior to occur?

Can you point me in the right direction?

My eventual goal is to have the nodes in my org chart change color on mouseover, in addition to changing the mouse pointer to a hand. If that is possible.

As always, thanks for any help you can provide.

#2

Try http://www.nwoods.com/forum/uploads/WebSite3.zip

WARNING: doing server round-trips during mouse-over events can impose significant demand on the server. The JavaScript code in goOnMouseOver, in the head of the ASPX file, tries to minimize that by only reloading when the current node that the mouse is over has changed.
This sample also demonstrates panning the document using the left mouse button (instead of the middle one) and opening a browser window when the user clicks on a node.
#3

Walter,

Thanks, as always, for your response.

I think I will take your warning seriously, and set the node animation for mouse-over events aside for the time being. However, I would like to figure out why I can’t get the cursor change to work.

This statement from the Instruments.xml document’s description of OnMouseOver:

“Change the cursor to Cursors.Hand if the user can modify the value of this indicator interactively.”

…leads me to believe that node.Editable should be set to true, or something like that. But, I have tried that and it has had no effect. Please see my original post in this thread for a description of my debugging efforts in the GoWeb.js code.

Any ideas?

Thanks again for your continued helpfulness. I have been able to implement some pretty cool functionality on our website in a relatively short amount of time, thanks to your product, and your help.

#4

Oh, sorry, I completely ignored your issue with cursors while addressing your issue with highlighting, which requires automatically generating new images while the mouse is moving. Updating the cursor doesn’t require new images, and shouldn’t be a performance problem.

By default nodes (and links) don't have any cursor associated with them. Only GoHandles for resizing and GoPorts that are "linkable" have cursors. So you should override GoObject.GetCursorName on your node class:
[code] public override String GetCursorName(GoView view) {
return "hand";
}[/code]
That tells GoViewDataRenderer that there's a cursor associated with an object, so that the information is transmitted to the client.
I don't want to overemphasize the performance impact of generating and reloading images during mouse-overs. You should try it and see if it's OK. Maybe that's an option that you could turn on/off dynamically based on load.
#5

Walter,

Thanks again.

I am sorry to keep bugging you but I still have not succeeded in getting the cursor to change on mouse-over. Here is the entire implementation of my node class:

Imports Microsoft.VisualBasic
Imports Northwoods.GoWeb

Public Class OrgNode
Inherits GoBasicNode

Private mClassID As Long

Public Property ClassID() As Long
    Get
        Return mClassID
    End Get
    Set(ByVal value As Long)
        mClassID = value
    End Set
End Property

Public Overrides Function GetPartInfo(ByVal view As Northwoods.GoWeb.GoView, ByVal renderer As Northwoods.GoWeb.IGoPartInfoRenderer) As Northwoods.GoWeb.GoPartInfo
    Dim info As GoPartInfo = renderer.CreatePartInfo()
    info = MyBase.GetPartInfo(view, renderer)
    info("PartID") = Me.PartID
    Return info
End Function

Public Overrides Function GetCursorName(ByVal view As Northwoods.GoWeb.GoView) As String
    Return "hand"
End Function

End Class

There isn’t much there yet (I’ll be adding more custom properties later). When I put a break point in my override of GetCursorName()…it is never hit. So, for whatever reason, GetCursorName isn’t being called.

Additionally, I have implemented an XMLTransformBasicNode class that consumes XML input and places it in nodes that are instantiated from the OrgNode class described above. The “Selectable” and “Editable” (for testing) properties of the node are set to true during this transformation process.

As I said earlier, the goDoMouseOver function defined in GoWeb.js is running, as it should. But, the hand cursor is not being returned when goDoMouseOver calls goSearchEvent(e, curarr, ‘auto’).

FYI, I have implemented a NodeClicked function in the Javascript of the aspx page in question, and it is functioning properly. It accesses goInfo.PartID from my override of GetPartInfo in OrgNode.vb.

I hope this information paints a clear picture. If you can suggest anything I can do to debug this, I would really appreciate it.

Thanks again.
roger

#6

First, “hand” isn’t an HTML cursor name – GoDiagram translates it to “pointer”.

Second, when I try it, it doesn't work, but the proper cursor name has been transmitted to the client JavaScript for that area. I'll need to debug this to see why it isn't working right.
#7

Aaahhaaa!

I can get the hand-pointer-cursor-thingy if, when creating the nodes, I use node.Text = “blah blah blah” or, if I use:

Dim lbl = New GoText()
…set some lbl properties
lbl.Text = “blah blah blah”
node.Label = lbl

But, if I set node.LabelSpot = GoObject.MiddleCenter…I do not get mouseover changes.

So, it seems I need to override the GoText.GetCursorName function as well. If there is one…

Which seems logical.

PS: This is with the GetCursorName override in OrgNode.vb as follows:
Public Overrides Function GetCursorName(ByVal view As Northwoods.GoWeb.GoView) As String
Return “hand”
End Function

Yes! I tried it. I have overridden GetCursorName for GoText and it works.

Thanks, as always.

Now on to other challenges, which I may ask about later :-(

#8

Ah, that’s because the Label (a GoText) is in front of the Port (a GoPort) which is in front of the Shape (a GoShape).

So when the pointer is over the Label, everything works fine.
The Port's Style is "None", so it has no appearance. When the pointer is over the Port, then the Port's normal cursor appears (as I think it should).
It's just that there's no visible thing for the node to be able to get the node's cursor and not the Port's cursor, except for the Label.
Still, I'm wondering if GoViewDataRenderer.BuildCursorSearchArray is doing the most convenient thing.