XUL tree checkboxes

classic Classic list List threaded Threaded
3 messages Options
Reply | Threaded
Open this post in threaded view
|

XUL tree checkboxes

Tom Brunet
I have been playing around with XUL trees containing checkboxes this
week and have run into a snag.  I'll paste my tree XUL and CSS at the
bottom of this note (you'll need your own images to reproduce).  It's a
tree with two columns, the first of which is a checkbox.  I followed
information from the XUL treecol docs to specify the first column as a
checkbox:
http://developer.mozilla.org/en/docs/XUL:Attribute:treecol.type

So, I am able to display a checkbox and change its state.  I still have
some problems:

1) I don't hear the state of the checkbox with JAWS, and I don't see
anything through MSAA to indicate that there is a checkbox.  Nor do I
hear anything when the state changes.  Any ideas on how to get some sort
of announcement here?
2) Not an accessibility issue, but how do you specify one of these
checkboxes as disabled?  The CSS in the docs imply that this is a valid
state, but I haven't figured out how to specify it yet.

main.xul:

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<?xml-stylesheet href="main.css" type="text/css"?>

<window id="topAccWindow" title="Accessibility XUL" orient="vertical"
        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
width="600" height="200">

   <script>
     function flip(event, tree) {
       if (event.keyCode == 0 || event.keyCode == 13) {
         var focusRowIndex = tree.currentIndex;
         var item = tree.contentView.getItemAtIndex(focusRowIndex);
         var chkbox = item.firstChild.firstChild;
         if (chkbox.getAttribute("editable") != "false") {
           if (chkbox.getAttribute("value") != "true")
             chkbox.setAttribute("value", "true");
           else
             chkbox.setAttribute("value", "false");
         }
       }
     }
   </script>

   <tree flex="1" seltype="single" editable="true"
onkeypress="flip(event, this);">
     <treecols>
       <treecol editable="true" type="checkbox" ordinal="1"
label="CheckCol" flex="0" persist="width"/>
       <splitter ordinal="2" hidden="true" class="tree-splitter"
state="open"
                 resizebefore="closest" resizeafter="closest"
collapse="after">
         <grippy class="tree-splitter"/>
       </splitter>
       <treecol ordinal="3" label="Title" primary="true"
                flex="1" persist="width"/>
     </treecols>
     <treechildren>
       <treeitem container="true" open="true">
         <treerow>
           <treecell editable="false" disabled="true"/>
           <treecell label="Label One"/>
         </treerow>
         <treechildren maxItems="5">
           <treeitem>
             <treerow>
               <treecell />
               <treecell label="Label Two"/>
             </treerow>
           </treeitem>
         </treechildren>
       </treeitem>
     </treechildren>
   </tree>
</window>

main.css:

   treechildren::-moz-tree-checkbox
   {
   /* unchecked checkbox treecells */
   list-style-image: url("images/checkbox0.png");
   }
   treechildren::-moz-tree-checkbox(checked)
   {
   /* checked checkbox treecells*/
   list-style-image: url("images/checkbox1.png");
   }
   treechildren::-moz-tree-checkbox(disabled)
   {
   /* disabled checkbox treecells */
   list-style-image: none;
   }
_______________________________________________
dev-accessibility mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-accessibility
Reply | Threaded
Open this post in threaded view
|

Re: XUL tree checkboxes

Evan Yan


Tom Brunet wrote:

> I have been playing around with XUL trees containing checkboxes this
> week and have run into a snag.  I'll paste my tree XUL and CSS at the
> bottom of this note (you'll need your own images to reproduce).  It's a
> tree with two columns, the first of which is a checkbox.  I followed
> information from the XUL treecol docs to specify the first column as a
> checkbox:
> http://developer.mozilla.org/en/docs/XUL:Attribute:treecol.type
>
> So, I am able to display a checkbox and change its state.  I still have
> some problems:
>
> 1) I don't hear the state of the checkbox with JAWS, and I don't see
> anything through MSAA to indicate that there is a checkbox.  Nor do I
> hear anything when the state changes.  Any ideas on how to get some sort
> of announcement here?
>  
It's a known bug.
https://bugzilla.mozilla.org/show_bug.cgi?id=312457
(Checked items in tree views do not report checked/checkable state)

Thanks,
Evan

> 2) Not an accessibility issue, but how do you specify one of these
> checkboxes as disabled?  The CSS in the docs imply that this is a valid
> state, but I haven't figured out how to specify it yet.
>
>  
_______________________________________________
dev-accessibility mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-accessibility
Reply | Threaded
Open this post in threaded view
|

Re: XUL tree checkboxes

Tom Brunet
In reply to this post by Tom Brunet
I think I finally stumbled on a small, albeit far from perfect,
workaround for this for the short-term.  I was under the mindset that
since the image was a CSS image that it did not have a tooltip and hence
could not have alt text.  I was somewhat wrong.

The treecell that corresponds to the checkbox image can have a label
attribute.  This label attribute is not displayed (overridden by the
image), but is gathered up into the MSAA node for that row, and hence is
presented to JAWS/WE/etc.  So, with alt text of 'checked.' and
'unchecked.', I can at least give the user some indication of the row's
state.

Unfortunately, there's no announcement of the new state when spacebar is
pressed and the state changes.  In addition, both JAWS and WE appear to
cache the value, so even though I've changed it through script, both
read the old alt text if I ask them to re-read the current item.  I have
to move the selection to another item and then back to hear the new state.

Like I said, far from perfect, but better than not being able to
announce anything at all.

Tom

> It's a known bug.
> https://bugzilla.mozilla.org/show_bug.cgi?id=312457
> (Checked items in tree views do not report checked/checkable state)
_______________________________________________
dev-accessibility mailing list
[hidden email]
https://lists.mozilla.org/listinfo/dev-accessibility