You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@wicket.apache.org by "Lucas (Created) (JIRA)" <ji...@apache.org> on 2012/03/26 16:10:39 UTC

[jira] [Created] (WICKET-4472) Modal window accessibility - add role and aria attributes to outer div for assitive technologies

Modal window accessibility - add role and aria attributes to outer div for assitive technologies
------------------------------------------------------------------------------------------------

                 Key: WICKET-4472
                 URL: https://issues.apache.org/jira/browse/WICKET-4472
             Project: Wicket
          Issue Type: Improvement
          Components: wicket-extensions
    Affects Versions: 1.5.5
            Reporter: Lucas
            Priority: Minor


For more accessible modal windows it is desirable that the outer DIV element has a 'dialog' role defined and an 'aria-labelledBy' attribute pointing to the modal title text. This will help assistive technologies in properly alerting people with disabilities (PwD) users about the modal windows that wicket displays.

--
This message is automatically generated by JIRA.
If you think it was sent incorrectly, please contact your JIRA administrators: https://issues.apache.org/jira/secure/ContactAdministrators!default.jspa
For more information on JIRA, see: http://www.atlassian.com/software/jira

        

[jira] [Updated] (WICKET-4472) Modal window accessibility - add role and aria attributes to outer div for assitive technologies

Posted by "Lucas (Updated) (JIRA)" <ji...@apache.org>.
     [ https://issues.apache.org/jira/browse/WICKET-4472?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel ]

Lucas updated WICKET-4472:
--------------------------

    Description: 
For more accessible modal windows it is desirable that the outer DIV element has a 'dialog' role defined and an 'aria-labelledBy' attribute pointing to the modal title text. This will help assistive technologies in properly alerting people with disabilities (PwD) users about the modal windows that wicket displays.
Until I get familiar/ready for OSS contributions, I leave you a code snippet for modal.js (around line 1170)

old:
<div class=\"wicket-modal\" id=\""+idWindow+"\" style=\"top: 10px; left: 10px; width: 100px;\">

new:
<div class=\"wicket-modal\" id=\""+idWindow+"\" role=\"dialog\" aria-labelledBy=\""+idCaptionText+""\" style=\"top: 10px; left: 10px; width: 100px;\">

  was:
For more accessible modal windows it is desirable that the outer DIV element has a 'dialog' role defined and an 'aria-labelledBy' attribute pointing to the modal title text. This will help assistive technologies in properly alerting people with disabilities (PwD) users about the modal windows that wicket displays.
Until I get familiar/ready for OSS contributions, I leave you a code snippet for modal.js (around line 1170)

<div class=\"wicket-modal\" id=\""+idWindow+"\" role=\"dialog\" aria-labelledBy=\""+idCaptionText+""\" style=\"top: 10px; left: 10px; width: 100px;\">

    
> Modal window accessibility - add role and aria attributes to outer div for assitive technologies
> ------------------------------------------------------------------------------------------------
>
>                 Key: WICKET-4472
>                 URL: https://issues.apache.org/jira/browse/WICKET-4472
>             Project: Wicket
>          Issue Type: Improvement
>          Components: wicket-extensions
>    Affects Versions: 1.5.5
>            Reporter: Lucas
>            Priority: Minor
>              Labels: accessibility, aria, dialog, modal
>   Original Estimate: 1h
>  Remaining Estimate: 1h
>
> For more accessible modal windows it is desirable that the outer DIV element has a 'dialog' role defined and an 'aria-labelledBy' attribute pointing to the modal title text. This will help assistive technologies in properly alerting people with disabilities (PwD) users about the modal windows that wicket displays.
> Until I get familiar/ready for OSS contributions, I leave you a code snippet for modal.js (around line 1170)
> old:
> <div class=\"wicket-modal\" id=\""+idWindow+"\" style=\"top: 10px; left: 10px; width: 100px;\">
> new:
> <div class=\"wicket-modal\" id=\""+idWindow+"\" role=\"dialog\" aria-labelledBy=\""+idCaptionText+""\" style=\"top: 10px; left: 10px; width: 100px;\">

--
This message is automatically generated by JIRA.
If you think it was sent incorrectly, please contact your JIRA administrators: https://issues.apache.org/jira/secure/ContactAdministrators!default.jspa
For more information on JIRA, see: http://www.atlassian.com/software/jira

        

[jira] [Issue Comment Edited] (WICKET-4472) Modal window accessibility - add role and aria attributes to outer div for assitive technologies

Posted by "Martin Grigorov (Issue Comment Edited) (JIRA)" <ji...@apache.org>.
    [ https://issues.apache.org/jira/browse/WICKET-4472?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=13244131#comment-13244131 ] 

Martin Grigorov edited comment on WICKET-4472 at 4/2/12 11:30 AM:
------------------------------------------------------------------

Task 1) is applied in 6.x.
For task 2) someone with better CSS and image manipulation skills should help.
                
      was (Author: mgrigorov):
    Task 1) is added in 6.x.
For task 2) someone with better CSS and image manipulation skills should help.
                  
> Modal window accessibility - add role and aria attributes to outer div for assitive technologies
> ------------------------------------------------------------------------------------------------
>
>                 Key: WICKET-4472
>                 URL: https://issues.apache.org/jira/browse/WICKET-4472
>             Project: Wicket
>          Issue Type: Improvement
>          Components: wicket-extensions
>    Affects Versions: 1.5.5
>            Reporter: Lucas
>            Priority: Minor
>              Labels: accessibility, aria, close_icon, dialog, labelledBy, modal
>   Original Estimate: 1h
>  Remaining Estimate: 1h
>
> For more accessible modal windows:
> 1) it is desirable that the outer DIV element has a 'dialog' role defined and an 'aria-labelledBy' attribute pointing to the modal title text. This will help assistive technologies in properly alerting people with disabilities (PwD) users about the modal windows that wicket displays.
> Until I get familiar/ready for OSS contributions, I leave you a code snippet for modal.js (around line 1170)
> old:
> <div class=\"wicket-modal\" id=\""+idWindow+"\" style=\"top: 10px; left: 10px; width: 100px;\">
> new:
> <div class=\"wicket-modal\" id=\""+idWindow+"\" role=\"dialog\" aria-labelledBy=\""+idCaptionText+"\" style=\"top: 10px; left: 10px; width: 100px;\">
> 2) it is desirable that the close icon of modal windows (top right corner) have associated text. This will help assistive technologies in properly labeling the icon. Also, because background images are hidden when high-contrast mode is active (Alt+Shift+PrtSc) the close icon should not be a background but rather an img tag, with appropriate alt attribute. Following is a suggestion of the proposed change in modal.js (around line 1191) except for the image source which I believe requires some rework from your side:
> old:
> "<a class=\"w_close\" style=\"z-index:1\" href=\"#\"></a>"+
> new:
> "<a style=\"z-index:1\" href=\"#\" title=\"close dialog\"><img src=\"???\" alt=\"close dialog\" /></a>"+

--
This message is automatically generated by JIRA.
If you think it was sent incorrectly, please contact your JIRA administrators: https://issues.apache.org/jira/secure/ContactAdministrators!default.jspa
For more information on JIRA, see: http://www.atlassian.com/software/jira

        

[jira] [Updated] (WICKET-4472) Modal window accessibility - add role and aria attributes to outer div for assitive technologies

Posted by "Lucas (Updated) (JIRA)" <ji...@apache.org>.
     [ https://issues.apache.org/jira/browse/WICKET-4472?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel ]

Lucas updated WICKET-4472:
--------------------------

    Description: 
For more accessible modal windows it is desirable that the outer DIV element has a 'dialog' role defined and an 'aria-labelledBy' attribute pointing to the modal title text. This will help assistive technologies in properly alerting people with disabilities (PwD) users about the modal windows that wicket displays.
Until I get familiar/ready for OSS contributions, I leave you a code snippet for modal.js (around line 1170)

<div class=\"wicket-modal\" id=\""+idWindow+"\" role=\"dialog\" aria-labelledBy=\""+idCaptionText+""\" style=\"top: 10px; left: 10px; width: 100px;\">

  was:For more accessible modal windows it is desirable that the outer DIV element has a 'dialog' role defined and an 'aria-labelledBy' attribute pointing to the modal title text. This will help assistive technologies in properly alerting people with disabilities (PwD) users about the modal windows that wicket displays.

    
> Modal window accessibility - add role and aria attributes to outer div for assitive technologies
> ------------------------------------------------------------------------------------------------
>
>                 Key: WICKET-4472
>                 URL: https://issues.apache.org/jira/browse/WICKET-4472
>             Project: Wicket
>          Issue Type: Improvement
>          Components: wicket-extensions
>    Affects Versions: 1.5.5
>            Reporter: Lucas
>            Priority: Minor
>              Labels: accessibility, aria, dialog
>   Original Estimate: 1h
>  Remaining Estimate: 1h
>
> For more accessible modal windows it is desirable that the outer DIV element has a 'dialog' role defined and an 'aria-labelledBy' attribute pointing to the modal title text. This will help assistive technologies in properly alerting people with disabilities (PwD) users about the modal windows that wicket displays.
> Until I get familiar/ready for OSS contributions, I leave you a code snippet for modal.js (around line 1170)
> <div class=\"wicket-modal\" id=\""+idWindow+"\" role=\"dialog\" aria-labelledBy=\""+idCaptionText+""\" style=\"top: 10px; left: 10px; width: 100px;\">

--
This message is automatically generated by JIRA.
If you think it was sent incorrectly, please contact your JIRA administrators: https://issues.apache.org/jira/secure/ContactAdministrators!default.jspa
For more information on JIRA, see: http://www.atlassian.com/software/jira

        

[jira] [Updated] (WICKET-4472) Modal window accessibility - add role and aria attributes to outer div for assitive technologies

Posted by "Lucas (Updated) (JIRA)" <ji...@apache.org>.
     [ https://issues.apache.org/jira/browse/WICKET-4472?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel ]

Lucas updated WICKET-4472:
--------------------------

         Labels: accessibility aria close_icon dialog labelledBy modal  (was: accessibility aria dialog modal)
    Description: 
For more accessible modal windows:

1) it is desirable that the outer DIV element has a 'dialog' role defined and an 'aria-labelledBy' attribute pointing to the modal title text. This will help assistive technologies in properly alerting people with disabilities (PwD) users about the modal windows that wicket displays.
Until I get familiar/ready for OSS contributions, I leave you a code snippet for modal.js (around line 1170)

old:
<div class=\"wicket-modal\" id=\""+idWindow+"\" style=\"top: 10px; left: 10px; width: 100px;\">

new:
<div class=\"wicket-modal\" id=\""+idWindow+"\" role=\"dialog\" aria-labelledBy=\""+idCaptionText+"\" style=\"top: 10px; left: 10px; width: 100px;\">

2) it is desirable that the close icon of modal windows (top right corner) have associated text. This will help assistive technologies in properly labeling the icon. Also, because background images are hidden when high-contrast mode is active (Alt+Shift+PrtSc) the close icon should not be a background but rather an img tag, with appropriate alt attribute. Following is a suggestion of the proposed change in modal.js (around line 1191) except for the image source which I believe requires some rework from your side:

old:
"<a class=\"w_close\" style=\"z-index:1\" href=\"#\"></a>"+

new:
"<a style=\"z-index:1\" href=\"#\" title=\"close dialog\"><img src=\"???\" alt=\"close dialog\" /></a>"+

  was:
For more accessible modal windows it is desirable that the outer DIV element has a 'dialog' role defined and an 'aria-labelledBy' attribute pointing to the modal title text. This will help assistive technologies in properly alerting people with disabilities (PwD) users about the modal windows that wicket displays.
Until I get familiar/ready for OSS contributions, I leave you a code snippet for modal.js (around line 1170)

old:
<div class=\"wicket-modal\" id=\""+idWindow+"\" style=\"top: 10px; left: 10px; width: 100px;\">

new:
<div class=\"wicket-modal\" id=\""+idWindow+"\" role=\"dialog\" aria-labelledBy=\""+idCaptionText+""\" style=\"top: 10px; left: 10px; width: 100px;\">

    
> Modal window accessibility - add role and aria attributes to outer div for assitive technologies
> ------------------------------------------------------------------------------------------------
>
>                 Key: WICKET-4472
>                 URL: https://issues.apache.org/jira/browse/WICKET-4472
>             Project: Wicket
>          Issue Type: Improvement
>          Components: wicket-extensions
>    Affects Versions: 1.5.5
>            Reporter: Lucas
>            Priority: Minor
>              Labels: accessibility, aria, close_icon, dialog, labelledBy, modal
>   Original Estimate: 1h
>  Remaining Estimate: 1h
>
> For more accessible modal windows:
> 1) it is desirable that the outer DIV element has a 'dialog' role defined and an 'aria-labelledBy' attribute pointing to the modal title text. This will help assistive technologies in properly alerting people with disabilities (PwD) users about the modal windows that wicket displays.
> Until I get familiar/ready for OSS contributions, I leave you a code snippet for modal.js (around line 1170)
> old:
> <div class=\"wicket-modal\" id=\""+idWindow+"\" style=\"top: 10px; left: 10px; width: 100px;\">
> new:
> <div class=\"wicket-modal\" id=\""+idWindow+"\" role=\"dialog\" aria-labelledBy=\""+idCaptionText+"\" style=\"top: 10px; left: 10px; width: 100px;\">
> 2) it is desirable that the close icon of modal windows (top right corner) have associated text. This will help assistive technologies in properly labeling the icon. Also, because background images are hidden when high-contrast mode is active (Alt+Shift+PrtSc) the close icon should not be a background but rather an img tag, with appropriate alt attribute. Following is a suggestion of the proposed change in modal.js (around line 1191) except for the image source which I believe requires some rework from your side:
> old:
> "<a class=\"w_close\" style=\"z-index:1\" href=\"#\"></a>"+
> new:
> "<a style=\"z-index:1\" href=\"#\" title=\"close dialog\"><img src=\"???\" alt=\"close dialog\" /></a>"+

--
This message is automatically generated by JIRA.
If you think it was sent incorrectly, please contact your JIRA administrators: https://issues.apache.org/jira/secure/ContactAdministrators!default.jspa
For more information on JIRA, see: http://www.atlassian.com/software/jira

        

[jira] [Commented] (WICKET-4472) Modal window accessibility - add role and aria attributes to outer div for assitive technologies

Posted by "Martin Grigorov (Commented) (JIRA)" <ji...@apache.org>.
    [ https://issues.apache.org/jira/browse/WICKET-4472?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=13238421#comment-13238421 ] 

Martin Grigorov commented on WICKET-4472:
-----------------------------------------

Thanks for the ticket!
Either attach the changes as patches or at least paste how it looks now and how it should become. This will make it easier for us to dig the specific code and modify it. Otherwise we can make a mistake and modify the wrong div ...
                
> Modal window accessibility - add role and aria attributes to outer div for assitive technologies
> ------------------------------------------------------------------------------------------------
>
>                 Key: WICKET-4472
>                 URL: https://issues.apache.org/jira/browse/WICKET-4472
>             Project: Wicket
>          Issue Type: Improvement
>          Components: wicket-extensions
>    Affects Versions: 1.5.5
>            Reporter: Lucas
>            Priority: Minor
>              Labels: accessibility, aria, dialog
>   Original Estimate: 1h
>  Remaining Estimate: 1h
>
> For more accessible modal windows it is desirable that the outer DIV element has a 'dialog' role defined and an 'aria-labelledBy' attribute pointing to the modal title text. This will help assistive technologies in properly alerting people with disabilities (PwD) users about the modal windows that wicket displays.

--
This message is automatically generated by JIRA.
If you think it was sent incorrectly, please contact your JIRA administrators: https://issues.apache.org/jira/secure/ContactAdministrators!default.jspa
For more information on JIRA, see: http://www.atlassian.com/software/jira

        

[jira] [Commented] (WICKET-4472) Modal window accessibility - add role and aria attributes to outer div for assitive technologies

Posted by "Martin Grigorov (Commented) (JIRA)" <ji...@apache.org>.
    [ https://issues.apache.org/jira/browse/WICKET-4472?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=13244131#comment-13244131 ] 

Martin Grigorov commented on WICKET-4472:
-----------------------------------------

Task 1) is added in 6.x.
For task 2) someone with better CSS and image manipulation skills should help.
                
> Modal window accessibility - add role and aria attributes to outer div for assitive technologies
> ------------------------------------------------------------------------------------------------
>
>                 Key: WICKET-4472
>                 URL: https://issues.apache.org/jira/browse/WICKET-4472
>             Project: Wicket
>          Issue Type: Improvement
>          Components: wicket-extensions
>    Affects Versions: 1.5.5
>            Reporter: Lucas
>            Priority: Minor
>              Labels: accessibility, aria, close_icon, dialog, labelledBy, modal
>   Original Estimate: 1h
>  Remaining Estimate: 1h
>
> For more accessible modal windows:
> 1) it is desirable that the outer DIV element has a 'dialog' role defined and an 'aria-labelledBy' attribute pointing to the modal title text. This will help assistive technologies in properly alerting people with disabilities (PwD) users about the modal windows that wicket displays.
> Until I get familiar/ready for OSS contributions, I leave you a code snippet for modal.js (around line 1170)
> old:
> <div class=\"wicket-modal\" id=\""+idWindow+"\" style=\"top: 10px; left: 10px; width: 100px;\">
> new:
> <div class=\"wicket-modal\" id=\""+idWindow+"\" role=\"dialog\" aria-labelledBy=\""+idCaptionText+"\" style=\"top: 10px; left: 10px; width: 100px;\">
> 2) it is desirable that the close icon of modal windows (top right corner) have associated text. This will help assistive technologies in properly labeling the icon. Also, because background images are hidden when high-contrast mode is active (Alt+Shift+PrtSc) the close icon should not be a background but rather an img tag, with appropriate alt attribute. Following is a suggestion of the proposed change in modal.js (around line 1191) except for the image source which I believe requires some rework from your side:
> old:
> "<a class=\"w_close\" style=\"z-index:1\" href=\"#\"></a>"+
> new:
> "<a style=\"z-index:1\" href=\"#\" title=\"close dialog\"><img src=\"???\" alt=\"close dialog\" /></a>"+

--
This message is automatically generated by JIRA.
If you think it was sent incorrectly, please contact your JIRA administrators: https://issues.apache.org/jira/secure/ContactAdministrators!default.jspa
For more information on JIRA, see: http://www.atlassian.com/software/jira