temporarily suppress eventhandlin

[Jens]

I implemeted a help function, similar to the one found in many tool
windows, where you first click on a questmark button afterwhich you
can get help about various control elements by clicking on them.

It works well: When you click on the questionmark your cursor changes
to a 'help' cursor and when you click on any
element a description(if one is available) is shown on the bottom of
the screen. But for elements that change the cursors on their own,
such as text input field, it works less well because the cursor
changes which is confusing to the user.

My question is the following:
Is it possible to suppres this behaviour temporarily?

 

[dhtml]

This is a basic idea. Refactor to objects.

My question is the following:
Is it possible to suppres this behaviour temporarily?

No.

Create a state object or variable and reference it in the callback.

var isInHelpMode = false;

function documentMouseoverHandler(e) {
if(isInHelpMode) return;
// et c.
}

function calendarClickHandler(e) {
// toggle help mode.
isInHelpMode = !isInHelpMode;
}

 

[Jens]

This is a basic idea. Refactor to objects.



No.

Create a state object or variable and reference it in the callback.

var isInHelpMode = false;

function documentMouseoverHandler(e) {
  if(isInHelpMode) return;
// et c.

}

function calendarClickHandler(e) {
  // toggle help mode.
  isInHelpMode = !isInHelpMode;

}

Yeah i tried this (somewhat transscribed) :

var help_mode_flag = false;
...
document.helpbutton.onclick = function() {
help_mode_flag = true;
}
...
var i = 0;
var inputs = document.getElementsByTagName('input');
for (i=0;i < inputs.length;i++) {
var tmp = inputs.onmouseover || function() {};
inputs.onmouseover = function() {
if (!help_mode_flag) {
tmp();
}
}
}
...

But this doesn't have any effect. Should be setting the event handler
of
the document object in your example?

 

[dhtml]

This is a basic idea. Refactor to objects.

Create a state object or variable and reference it in the callback.

var isInHelpMode = false;

function documentMouseoverHandler(e) {
if(isInHelpMode) return;
// et c.

function calendarClickHandler(e) {
// toggle help mode.
isInHelpMode = !isInHelpMode;

}

Yeah i tried this (somewhat transscribed) :

var help_mode_flag = false;
...
document.helpbutton.onclick = function() {
help_mode_flag = true;}

...
var i = 0;
var inputs = document.getElementsByTagName('input');
for (i=0;i < inputs.length;i++) {
var tmp = inputs.onmouseover || function() {};
inputs.onmouseover = function() {
if (!help_mode_flag) {
tmp();
}
}}

I guess you want the opposite, in your case;

if help_mode_flag is false, tmp() won't be called. It would be clearer
to not use a closure and use bubbling:

input.onmouseover = inputMouseoverHandler;

Even better:
// Captures bubbled input mouseovers.
form.onmouseover = formMouseoverHandler;

function formMouseoverHandler(e) {
e = e||event;
var target = e.target||e.srcElement,
is_an_input;
if(! is_an_input ) return;
}

...

But this doesn't have any effect. Should be setting the event handler
of
the document object in your example?

There are two event handlers in the original post. One is a mouseover
for the document, another is a click for calendarMouseOver.

documentMouseover -> checks help_mode_flag. If false, returns
immediately.
calendarClick -> sets help_mode_flag to true.

In the example I just provided, I replaced documentMouseover with
formMouseover.