This is an automated email from the ASF dual-hosted git repository. dklco pushed a commit to branch master in repository https://gitbox.apache.org/repos/asf/sling-org-apache-sling-app-cms.git
commit 0af5e71d26e4a669c47f264842c299c10de7a2d5 Author: Dan Klco <[email protected]> AuthorDate: Wed May 15 16:51:19 2019 -0400 Improving accessibility for text based browsers and those with limited vision --- .../core/internal/filters/EditIncludeFilter.java | 37 ++++++++++---------- ui/src/main/frontend/src/js/cms.modal.js | 3 +- ui/src/main/frontend/src/js/editor.js | 17 ++------- ui/src/main/frontend/src/scss/cms.scss | 6 ++++ ui/src/main/frontend/src/scss/editor.scss | 5 +++ .../components/cms/columns/actions/actions.jsp | 40 +++++++++++++--------- .../components/cms/contenttable/contenttable.jsp | 2 +- .../components/cms/pageeditbar/actions/actions.jsp | 40 +++++++++++++--------- .../components/cms/startcontent/startcontent.jsp | 2 +- .../components/editor/slingform/slingform.jsp | 2 +- .../components/general/container/container.jsp | 4 +-- .../libs/sling-cms/components/jobs/list/list.jsp | 4 +-- 12 files changed, 89 insertions(+), 73 deletions(-) diff --git a/core/src/main/java/org/apache/sling/cms/core/internal/filters/EditIncludeFilter.java b/core/src/main/java/org/apache/sling/cms/core/internal/filters/EditIncludeFilter.java index cd5effc..b5fd996 100644 --- a/core/src/main/java/org/apache/sling/cms/core/internal/filters/EditIncludeFilter.java +++ b/core/src/main/java/org/apache/sling/cms/core/internal/filters/EditIncludeFilter.java @@ -121,34 +121,35 @@ public class EditIncludeFilter implements Filter { component = er.getComponent(); editPath = component.getEditPath(); } - writer.write("<div class=\"sling-cms-component\" data-component=\""+component+"\" data-sling-cms-title=\"" - + (component != null ? component.getTitle() : "") + "\" data-sling-cms-resource-path=\"" - + resource.getPath() + "\" data-sling-cms-resource-type=\"" + resource.getResourceType() - + "\" data-sling-cms-edit=\"" + editPath + "\"><div class=\"sling-cms-editor\">"); + String title = component != null ? component.getTitle() + : StringUtils.substringAfterLast(resource.getResourceType(), "/"); + writer.write("<div class=\"sling-cms-component\" data-component=\"" + component + "\" data-sling-cms-title=\"" + + title + "\" data-sling-cms-resource-path=\"" + resource.getPath() + + "\" data-sling-cms-resource-type=\"" + resource.getResourceType() + "\" data-sling-cms-edit=\"" + + editPath + "\"><div class=\"sling-cms-editor\">"); writer.write( "<div class=\"level has-background-grey\"><div class=\"level-left\"><div class=\"field has-addons\">"); - writer.write( - "<div class=\"control\"><button class=\"level-item button\" data-sling-cms-action=\"edit\" data-sling-cms-path=\"" - + resource.getPath() + "\" data-sling-cms-edit=\"" + editPath - + "\" title=\"Edit Component\"><span class=\"jam jam-pencil-f\"></span></button></div>"); + writer.write("<div class=\"control\"><a href=\"/cms/editor/edit.html" + resource.getPath() + "?editor=" + + editPath + "\" class=\"level-item button action-button\" title=\"Edit " + title + + "\"><span class=\"jam jam-pencil-f\"><span class=\"is-vhidden\">Edit " + title + + "</span></span></a></div>"); if (!first || !last) { - writer.write( - "<div class=\"control\"><button class=\"level-item button\" data-sling-cms-action=\"reorder\" data-sling-cms-path=\"" - + resource.getPath() - + "\" title=\"Reorder Component\"><span class=\"jam jam-arrows-v\"></span></button></div>"); + writer.write("<div class=\"control\"><a href=\"/cms/editor/reorder.html" + resource.getPath() + + "\" class=\"level-item button action-button\" title=\"Reorder " + title + + "\"><span class=\"jam jam-arrows-v\"><span class=\"is-vhidden\">Reorder " + title + + "</span></span></a></div>"); } if (!resource.getName().equals(JcrConstants.JCR_CONTENT) && exists) { - writer.write( - "<div class=\"control\"><button class=\"level-item button\" data-sling-cms-action=\"delete\" data-sling-cms-path=\"" - + resource.getPath() - + "\" title=\"Delete Component\"><span class=\"jam jam-trash\"></span></button></div>"); + writer.write("<div class=\"control\"><a href=\"/cms/editor/delete.html" + resource.getPath() + + "\" class=\"level-item button action-button\" title=\"Delete Component\"><span class=\"jam jam-trash\"><span class=\"is-vhidden\">Delete " + + title + "</span></span></a></div>"); } writer.write("</div></div>"); if (component != null) { - writer.write("<div class=\"level-right\"><div class=\"level-item has-text-light\">" + component.getTitle() - + "</div></div>"); + writer.write( + "<div class=\"level-right\"><div class=\"level-item has-text-light\">" + title + "</div></div>"); } writer.write("</div></div>"); } diff --git a/ui/src/main/frontend/src/js/cms.modal.js b/ui/src/main/frontend/src/js/cms.modal.js index 701e618..8c072e9 100644 --- a/ui/src/main/frontend/src/js/cms.modal.js +++ b/ui/src/main/frontend/src/js/cms.modal.js @@ -68,7 +68,8 @@ rava.bind(".modal", { events: { ".close,.modal-close,.close-modal,.modal-background": { - click: function () { + click: function (event) { + event.preventDefault(); this.remove(); } } diff --git a/ui/src/main/frontend/src/js/editor.js b/ui/src/main/frontend/src/js/editor.js index 4886ed6..abd30b0 100644 --- a/ui/src/main/frontend/src/js/editor.js +++ b/ui/src/main/frontend/src/js/editor.js @@ -132,20 +132,9 @@ }); }, attachClicks: function (ctx) { - CMSEditor.util.attachClick(ctx, '.sling-cms-editor .button[data-sling-cms-action=add]', function () { - CMSEditor.ui.showModal('/cms/editor/add.html' + this.dataset.slingCmsPath + '?availableTypes=' + this.dataset.slingCmsAvailableTypes, this.title); - }); - CMSEditor.util.attachClick(ctx, '.sling-cms-editor .button[data-sling-cms-action=delete]', function () { - CMSEditor.ui.showModal('/cms/editor/delete.html' + this.dataset.slingCmsPath, this.title); - }); - CMSEditor.util.attachClick(ctx, '.sling-cms-editor .button[data-sling-cms-action=edit]', function () { - CMSEditor.ui.showModal( - '/cms/editor/edit.html' + this.dataset.slingCmsPath + '?editor=' + this.dataset.slingCmsEdit, - CMSEditor.util.findParent(this, '.sling-cms-component').dataset.slingCmsTitle || this.title - ); - }); - CMSEditor.util.attachClick(ctx, '.sling-cms-editor .button[data-sling-cms-action=reorder]', function () { - CMSEditor.ui.showModal('/cms/editor/reorder.html' + this.dataset.slingCmsPath, this.title); + CMSEditor.util.attachClick(ctx, '.sling-cms-editor .action-button', function (event) { + event.preventDefault(); + CMSEditor.ui.showModal(this.href, this.title); }); }, findParent: function (el, exp) { diff --git a/ui/src/main/frontend/src/scss/cms.scss b/ui/src/main/frontend/src/scss/cms.scss index b89a2fa..24feb38 100644 --- a/ui/src/main/frontend/src/scss/cms.scss +++ b/ui/src/main/frontend/src/scss/cms.scss @@ -90,6 +90,12 @@ h5 { position: relative; } +.is-vhidden { + position: absolute !important; + top: -9999px !important; + left: -9999px !important; +} + .loader { margin: auto; width: 2em; diff --git a/ui/src/main/frontend/src/scss/editor.scss b/ui/src/main/frontend/src/scss/editor.scss index 60f9a7c..f274530 100644 --- a/ui/src/main/frontend/src/scss/editor.scss +++ b/ui/src/main/frontend/src/scss/editor.scss @@ -34,6 +34,11 @@ .is-draggable { position: relative; } + .is-vhidden { + position: absolute !important; + top: -9999px !important; + left: -9999px !important; + } .level { padding: .5em; } diff --git a/ui/src/main/resources/jcr_root/libs/sling-cms/components/cms/columns/actions/actions.jsp b/ui/src/main/resources/jcr_root/libs/sling-cms/components/cms/columns/actions/actions.jsp index b1e51fb..f2b3f07 100644 --- a/ui/src/main/resources/jcr_root/libs/sling-cms/components/cms/columns/actions/actions.jsp +++ b/ui/src/main/resources/jcr_root/libs/sling-cms/components/cms/columns/actions/actions.jsp @@ -17,21 +17,27 @@ * under the License. */ --%> <%@include file="/libs/sling-cms/global.jsp"%> -<td class="is-hidden cell-actions"> - <c:forEach var="actionConfig" items="${sling:listChildren(colConfig)}"> - <c:choose> - <c:when test="${actionConfig.valueMap.modal}"> - <a class="button Fetch-Modal" data-title="${sling:encode(actionConfig.valueMap.title,'HTML_ATTR')}" data-path="${actionConfig.valueMap.ajaxPath != null ? actionConfig.valueMap.ajaxPath : '.Main-Content form'}" href="${actionConfig.valueMap.prefix}${resource.path}" title="${sling:encode(actionConfig.valueMap.title,'HTML_ATTR')}"> - <span class="jam jam-${actionConfig.valueMap.icon}"> - </span> - </a> - </c:when> - <c:otherwise> - <a class="button" ${actionConfig.valueMap.new != false ? 'target="_blank"' : ''} href="${actionConfig.valueMap.prefix}${resource.path}" title="${sling:encode(actionConfig.valueMap.title,'HTML_ATTR')}"> - <span class="jam jam-${actionConfig.valueMap.icon}"> - </span> - </a> - </c:otherwise> - </c:choose> - </c:forEach> +<td class="is-vhidden cell-actions"> + <c:forEach var="actionConfig" items="${sling:listChildren(colConfig)}"> + <c:choose> + <c:when test="${actionConfig.valueMap.modal}"> + <a class="button Fetch-Modal" data-title="${sling:encode(actionConfig.valueMap.title,'HTML_ATTR')}" data-path="${actionConfig.valueMap.ajaxPath != null ? actionConfig.valueMap.ajaxPath : '.Main-Content form'}" href="${actionConfig.valueMap.prefix}${resource.path}" title="${sling:encode(actionConfig.valueMap.title,'HTML_ATTR')}"> + <span class="jam jam-${actionConfig.valueMap.icon}"> + <span class="is-vhidden"> + ${sling:encode(actionConfig.valueMap.title,'HTML')} + </span> + </span> + </a> + </c:when> + <c:otherwise> + <a class="button" ${actionConfig.valueMap.new != false ? 'target="_blank"' : ''} href="${actionConfig.valueMap.prefix}${resource.path}" title="${sling:encode(actionConfig.valueMap.title,'HTML_ATTR')}"> + <span class="jam jam-${actionConfig.valueMap.icon}"> + <span class="is-vhidden"> + ${sling:encode(actionConfig.valueMap.title,'HTML')} + </span> + </span> + </a> + </c:otherwise> + </c:choose> + </c:forEach> </td> \ No newline at end of file diff --git a/ui/src/main/resources/jcr_root/libs/sling-cms/components/cms/contenttable/contenttable.jsp b/ui/src/main/resources/jcr_root/libs/sling-cms/components/cms/contenttable/contenttable.jsp index 574adc3..bb085e5 100644 --- a/ui/src/main/resources/jcr_root/libs/sling-cms/components/cms/contenttable/contenttable.jsp +++ b/ui/src/main/resources/jcr_root/libs/sling-cms/components/cms/contenttable/contenttable.jsp @@ -20,7 +20,7 @@ <div class="reload-container table__wrapper" data-path="${resource.path}.html${slingRequest.requestPathInfo.suffix}"> <form method="get" class="table__filter"> <p class="control has-icons-left"> - <label class="is-hidden" for="search-term">Search</label> + <label class="is-vhidden" for="search-term">Search</label> <input class="input is-small" type="text" name="search" id="search-term"> <span class="icon is-small is-left"> <i class="jam jam-search" aria-hidden="true"></i> diff --git a/ui/src/main/resources/jcr_root/libs/sling-cms/components/cms/pageeditbar/actions/actions.jsp b/ui/src/main/resources/jcr_root/libs/sling-cms/components/cms/pageeditbar/actions/actions.jsp index 95e8b03..1a180d9 100644 --- a/ui/src/main/resources/jcr_root/libs/sling-cms/components/cms/pageeditbar/actions/actions.jsp +++ b/ui/src/main/resources/jcr_root/libs/sling-cms/components/cms/pageeditbar/actions/actions.jsp @@ -18,20 +18,28 @@ */ --%> <%@include file="/libs/sling-cms/global.jsp"%> <c:forEach var="actionConfig" items="${sling:listChildren(resource)}"> - <c:choose> - <c:when test="${actionConfig.valueMap.modal}"> - <div class="control"> - <a class="button Fetch-Modal" data-title="${sling:encode(actionConfig.valueMap.title,'HTML_ATTR')}" data-path="${actionConfig.valueMap.ajaxPath != null ? actionConfig.valueMap.ajaxPath : '.Main-Content form'}" href="${actionConfig.valueMap.prefix}${slingRequest.requestPathInfo.suffix}" title="${sling:encode(actionConfig.valueMap.title,'HTML_ATTR')}"> - <span class="jam jam-${actionConfig.valueMap.icon}"></span> - </a> - </div> - </c:when> - <c:otherwise> - <div class="control"> - <a class="button" ${actionConfig.valueMap.new != false ? 'target="_blank"' : ''} href="${actionConfig.valueMap.prefix}${slingRequest.requestPathInfo.suffix}" title="${sling:encode(actionConfig.valueMap.title,'HTML_ATTR')}"> - <span class="jam jam-${actionConfig.valueMap.icon}"></span> - </a> - </div> - </c:otherwise> - </c:choose> + <c:choose> + <c:when test="${actionConfig.valueMap.modal}"> + <div class="control"> + <a class="button Fetch-Modal" data-title="${sling:encode(actionConfig.valueMap.title,'HTML_ATTR')}" data-path="${actionConfig.valueMap.ajaxPath != null ? actionConfig.valueMap.ajaxPath : '.Main-Content form'}" href="${actionConfig.valueMap.prefix}${slingRequest.requestPathInfo.suffix}" title="${sling:encode(actionConfig.valueMap.title,'HTML_ATTR')}"> + <span class="jam jam-${actionConfig.valueMap.icon}"> + <span class="is-vhidden"> + ${sling:encode(actionConfig.valueMap.title,'HTML')} + </span> + </span> + </a> + </div> + </c:when> + <c:otherwise> + <div class="control"> + <a class="button" ${actionConfig.valueMap.new != false ? 'target="_blank"' : ''} href="${actionConfig.valueMap.prefix}${slingRequest.requestPathInfo.suffix}" title="${sling:encode(actionConfig.valueMap.title,'HTML_ATTR')}"> + <span class="jam jam-${actionConfig.valueMap.icon}"> + <span class="is-vhidden"> + ${sling:encode(actionConfig.valueMap.title,'HTML')} + </span> + </span> + </a> + </div> + </c:otherwise> + </c:choose> </c:forEach> \ No newline at end of file diff --git a/ui/src/main/resources/jcr_root/libs/sling-cms/components/cms/startcontent/startcontent.jsp b/ui/src/main/resources/jcr_root/libs/sling-cms/components/cms/startcontent/startcontent.jsp index 6836b8b..96e0f74 100644 --- a/ui/src/main/resources/jcr_root/libs/sling-cms/components/cms/startcontent/startcontent.jsp +++ b/ui/src/main/resources/jcr_root/libs/sling-cms/components/cms/startcontent/startcontent.jsp @@ -58,7 +58,7 @@ <div class="panel-block"> <form method="get" class="Get-Form" data-target=".search-result-container" data-load="div" action="${resource.path}.search.html"> <p class="control has-icons-left"> - <label class="is-hidden" for="search-term">Search</label> + <label class="is-vhidden" for="search-term">Search</label> <input class="input is-small" type="text" name="q" id="search-term" /> <span class="icon is-small is-left"> <i class="jam jam-search" aria-hidden="true"></i> diff --git a/ui/src/main/resources/jcr_root/libs/sling-cms/components/editor/slingform/slingform.jsp b/ui/src/main/resources/jcr_root/libs/sling-cms/components/editor/slingform/slingform.jsp index 616bd24..17cb3e0 100644 --- a/ui/src/main/resources/jcr_root/libs/sling-cms/components/editor/slingform/slingform.jsp +++ b/ui/src/main/resources/jcr_root/libs/sling-cms/components/editor/slingform/slingform.jsp @@ -30,7 +30,7 @@ <sling:encode value="${properties.button}" default="Save" mode="HTML" /> </button> <c:if test="${properties.skipcancel != true}"> - <button type="button" class="button close">Cancel</button> + <a href="${header.referer}" class="button close">Cancel</a> </c:if> </fieldset> </form> \ No newline at end of file diff --git a/ui/src/main/resources/jcr_root/libs/sling-cms/components/general/container/container.jsp b/ui/src/main/resources/jcr_root/libs/sling-cms/components/general/container/container.jsp index 4a56965..b6b41c8 100644 --- a/ui/src/main/resources/jcr_root/libs/sling-cms/components/general/container/container.jsp +++ b/ui/src/main/resources/jcr_root/libs/sling-cms/components/general/container/container.jsp @@ -34,9 +34,9 @@ <div class="level has-background-grey"> <div class="level-left"> <div class="level-item"> - <button class="button" data-sling-cms-action="add" data-sling-cms-path="${resource.path}" data-sling-cms-available-types="${availableTypes}" title="Add Component"> + <a href="/cms/editor/add.html${resource.path}?availableTypes=${availableTypes}" class="button action-button" data-sling-cms-action="add" data-sling-cms-path="${resource.path}" data-sling-cms-available-types="${availableTypes}" title="Add Component"> + - </button> + </a> </div> </div> <div class="level-right"> diff --git a/ui/src/main/resources/jcr_root/libs/sling-cms/components/jobs/list/list.jsp b/ui/src/main/resources/jcr_root/libs/sling-cms/components/jobs/list/list.jsp index 140baa4..2e91522 100644 --- a/ui/src/main/resources/jcr_root/libs/sling-cms/components/jobs/list/list.jsp +++ b/ui/src/main/resources/jcr_root/libs/sling-cms/components/jobs/list/list.jsp @@ -36,7 +36,7 @@ <th> <fmt:message key="slingcms.state" /> </th> - <th class="is-hidden"> + <th class="is-vhidden"> </th> </tr> </thead> @@ -66,7 +66,7 @@ <td> <sling:encode value="${job.jobState}" mode="HTML" /> </td> - <td class="is-hidden cell-actions"> + <td class="is-vhidden cell-actions"> <a class="button Fetch-Modal" data-title="<fmt:message key="slingcms.jobs.remove" />" data-path=".Main-Content form" href="/cms/jobs/delete.html/bin/cms/removejob?id=${job.id}" title="<fmt:message key="slingcms.jobs.remove" />"> <span class="jam jam-trash"> </span>
