RE: Scripting Techniques first draft

> I have published a first draft of the Scripting Techniques for WCAG
2.0:
> http://www.w3.org/WAI/GL/WCAG20/WD-WCAG20-SCRIPT-TECHS-20040910/

In regards to the popup window example from a link... The below builds
on what other people have said thus far and tries to extend the example
a little including the ideas of:
1.  where appropriate, including JavaScript actions in functions in a
separate js file instead of in the html.
2.  this.href and this.target etc. are used to simplify matters so you
only have to specify the href and target once, namely in the html
attributes href= and target=.
3.  Giving a means by which the user can be aware that a new browser
window is being opened.
4.  giving an example of how a "close window" function comes into play
in the popup window, also illustrating the use of document.write.


In the head of the html:
<script language="JavaScript" type="text/javascript"
src="script.js"></script>

In the file script.js:
<script>
function PopUp (obj) {
  window.open (obj.href,obj.target,'...'');
}
</script>
You can make a number of these popup functions for different '...'
features you might wish to use for various different types of popups.
Also you can include some focus functions here if you want to make sure
that the resultant window comes into focus whenever it is operated on.
I have tried to do this with a window.focus function but for some
reason, it does not seem to work properly.  I would appreciate any
suggestions on how the focus idea can be made to work so that the
particular popup window in question comes into focus whenever the link
on the main page is selected.
I tried 
  pane = window.open (obj.href,obj.target,'...'');
  Pane.focus();
This worked, but it only worked for windows of target "pane", not for
all windows where the function is called.

I also tried:
  window.open (obj.href,obj.target,'...'');
  Obj.target.focus();
Without proper success.
I may just be missing something minor here.
(I am using IE 6 at the moment)

Back to the example....

In the HTML:
<p><a href="document.html" target="Pane" title="Open the document in a
new browser window" onClick="return PopUp(this);" onKeyPress="return
PopUp(this);" onActivate="return PopUp(this);">Open the
document</a>.</p>

I am not sure to what extent you should replicate function calls with
onClick, onKeypress and onActivate, but here they all are.  'this' is
used so that the function popUp gets all the information such as href
and target etc.  So the only place to include href and target explicitly
is in href= and target= html attributes.  I have used the link title to
describe that it will be a new browser window that is opened.  You could
put this information in the link phrase (which would be ultimately
better) but I use the example above to show another way to do it using
link titles.

Also note that many links like this can be used, and the target=
attribute in html dictates which window is used.  So many popups can be
opened if different targets are used, but the same window is re-used if
the same target is used.  That is, the target used is not locked into
the js function in script.js, but is dictated entirely from the html
(the js function is portable across targets).  (also on this point,
refer to my focus issues described above, and the problem I had with
trying to cover the focus issues without degrading this portability of
the js function).

Now for the close window link...

In the html of document.html:
<script language="JavaScript" type="text/javascript">
<!--
document.write ('<a href="#" title="Close This Window"
onClick="window.close();  return false;" onKeyPress="window.close();
return false;" onActivate="window.close(); return false;">Close This
Window</a></li>');
// -->
</script>
<noscript>
Use your browser functions to close this window.
</noscript>

For completeness, I think that it is important to have a close link or
button in the resultant window, especially if the resultant popup window
does not have toolbars or menubars etc.  Here the close link is written
out using document.write etc. and the noscript element provides
something for the non-script agents.  At this point I cannot find a way
of providing a link that closes the window in pure html alone.  If
anyone knows of one, please let us know.  But in any case, this last
part of the example illustrates the point that people have made
regarding the need to use document.write for features that won't work
without javascript, so that users who can't deal with scripts do not get
confused by links and objects that appear but don't function for them.

Some questions about scripting techniques:
Is there a place for dealing with browser compatibility issues in script
examples and the javascript object detection ideas such as:
		if (window.focus)
	Checks to see if focus is supported but does not execute it
	So:
		if (window.focus) window.focus()
	Checks first and then executes if focus is supported.
This will make sure there are no errors generated, but there are
possibilities that they might not work n some browsers etc.  More
work-arounds might be needed.

Maybe we can have a section in scripting techniques that deals with
browser issues specifically if it is not in scope for particular
functional examples?

Mat.

Received on Tuesday, 14 September 2004 03:35:03 UTC