Commit c023797b by Ned Batchelder

Merge pull request #1583 from edx/ned/fix/lms-1337

Make remaining dialogs in wiki accessible.
parents f3aa720c cccd61eb
......@@ -79,6 +79,9 @@ key in course settings. (BLD-426)
Blades: Fix bug when the speed can only be changed when the video is playing.
LMS: The dialogs on the wiki "changes" page are now accessible to screen
readers. Now all wiki pages have been made accessible. (LMS-1337)
LMS: Change bulk email implementation to use less memory, and to better handle
duplicate tasks in celery.
......@@ -95,8 +98,8 @@ client error are correctly passed through to the client.
LMS: Improve performance of page load and thread list load for
discussion tab
LMS: The wiki markup cheatsheet dialog is now accessible to people with
disabilites. (LMS-1303)
LMS: The wiki markup cheatsheet dialog is now accessible to screen readers.
(LMS-1303)
Common: Add skip links for accessibility to CMS and LMS. (LMS-1311)
......
......@@ -60,5 +60,4 @@ class CodeMirror(BaseEditor):
"js/vendor/CodeMirror/mitx_markdown.js",
"js/wiki/accessible.js",
"js/wiki/CodeMirror.init.js",
"js/wiki/cheatsheet.js",
)
(function($){
$.fn.extend({
/*
* leanModal prepares an element to be a modal dialog. Call it once on the
* element that launches the dialog, when the page is ready. This function
* will add a .click() handler that properly opens the dialog.
*
* The launching element must:
* - be an <a> element, not a button,
* - have an href= attribute identifying the id of the dialog element,
* - have rel='leanModal'.
*/
leanModal: function(options) {
var defaults = {
top: 100,
......@@ -13,7 +23,7 @@
$("body").append(overlay);
}
options = $.extend(defaults, options);
options = $.extend(defaults, options);
return this.each(function() {
var o = options;
......@@ -23,7 +33,7 @@
$(".modal").hide();
var modal_id = $(this).attr("href");
if ($(modal_id).hasClass("video-modal")) {
//Video modals need to be cloned before being presented as a modal
//This is because actions on the video get recorded in the history.
......@@ -34,13 +44,12 @@
modal_id = '#modal_clone';
}
$("#lean_overlay").click(function() {
close_modal(modal_id);
$("#lean_overlay").click(function(e) {
close_modal(modal_id, e);
});
$(o.closeButton).click(function() {
close_modal(modal_id);
$(o.closeButton).click(function(e) {
close_modal(modal_id, e);
});
var modal_height = $(modal_id).outerHeight();
......@@ -72,34 +81,30 @@
}
window.scrollTo(0, 0);
e.preventDefault();
});
});
function close_modal(modal_id){
function close_modal(modal_id, e) {
$("#lean_overlay").fadeOut(200);
$('iframe', modal_id).attr('src', '');
$(modal_id).css({ 'display' : 'none' });
if (modal_id == '#modal_clone') {
$(modal_id).remove();
}
e.preventDefault();
}
}
});
$(document).ready(function($) {
$("a[rel*=leanModal]").each(function(){
$(this).leanModal({ top : 120, overlay: 1, closeButton: ".close-modal", position: 'absolute' });
embed = $($(this).attr('href')).find('iframe')
if(embed.length > 0) {
if(embed.attr('src').indexOf("?") > 0) {
embed.data('src', embed.attr('src') + '&autoplay=1&rel=0');
embed.attr('src', '');
} else {
embed.data('src', embed.attr('src') + '?autoplay=1&rel=0');
embed.attr('src', '');
}
}
});
$(document).ready(function ($) {
$("a[rel*=leanModal]").each(function () {
$(this).leanModal({ top : 120, overlay: 1, closeButton: ".close-modal", position: 'absolute' });
embed = $($(this).attr('href')).find('iframe')
if (embed.length > 0 && embed.attr('src')) {
var sep = (embed.attr('src').indexOf("?") > 0) ? '&' : '?';
embed.data('src', embed.attr('src') + sep + 'autoplay=1&rel=0');
embed.attr('src', '');
}
});
});
})(jQuery);
$(document).ready(function () {
$('#cheatsheetLink').click(function() {
$('#cheatsheetModal').leanModal();
});
accessible_modal("#cheatsheetLink", "#cheatsheetModal .close-modal", "#cheatsheetModal", ".content-wrapper");
});
......@@ -536,8 +536,12 @@ section.wiki {
}
.modal-header {
border: 1px solid $danger-red;
padding: ($baseline/2) ($baseline/2) 0 ($baseline/2);
margin-bottom: ($baseline/2);
h1, p {
color: #fff;
color: $base-font-color;
}
h1 {
......
......@@ -59,7 +59,7 @@
overflow: hidden;
padding-left: 10px;
padding-right: 10px;
padding-bottom: 30px;
padding-bottom: 10px;
position: relative;
z-index: 2;
......@@ -136,7 +136,7 @@
form {
margin-bottom: 12px;
padding: 0px 40px;
padding: 0px 40px 20px;
position: relative;
z-index: 2;
......
{% extends "wiki/article.html" %}
{% load wiki_tags i18n %}
{% load wiki_tags i18n sekizai_tags %}
{% load url from future %}
{% block pagetitle %}{% trans "Edit" %}: {{ article.current_revision.title }}{% endblock %}
{% block wiki_contents_tab %}
<form method="POST" class="form-horizontal" id="article_edit_form" enctype="multipart/form-data">
{% addtoblock "js" %}
<script type="text/javascript">
$(document).ready(
function ($) {
accessible_modal("#cheatsheetLink", "#cheatsheetModal .close-modal", "#cheatsheetModal", ".content-wrapper");
accessible_modal("#previewButton", "#previewModal .close-modal", "#previewModal", ".content-wrapper");
$("#previewModalBackToEditor").click(function (e) {
$("#previewModal .close-modal").click();
e.preventDefault();
});
}
);
</script>
{% endaddtoblock %}
<form method="POST" class="form-horizontal" id="article_edit_form" name="article_edit_form" enctype="multipart/form-data">
{% include "wiki/includes/editor.html" %}
<div class="form-actions">
<button type="submit" name="save" value="1" class="btn btn-large btn-primary" onclick="this.form.target=''; this.form.action='{% url 'wiki:edit' path=urlpath.path article_id=article.id %}'">
<span class="icon-ok"></span>
{% trans "Save changes" %}
</button>
<button type="submit" name="preview" value="1" class="btn btn-large" onclick="$('#previewModal').modal('show'); this.form.target = 'previewWindow'; this.form.action = '{% url 'wiki:preview' path=urlpath.path article_id=article.id %}';">
<a class="btn btn-large" id="previewButton" href="#previewModal" rel="leanModal"
onclick="
document.article_edit_form.target='previewWindow';
document.article_edit_form.action='{% url 'wiki:preview' path=urlpath.path article_id=article.id %}';
document.article_edit_form.submit();">
<span class="icon-eye-open"></span>
{% trans "Preview" %}
</button>
</a>
<a href="{% url 'wiki:delete' path=urlpath.path article_id=article.id %}" class="pull-right btn btn-danger">
<span class="icon-trash"></span>
{% trans "Delete article" %}
</a>
</div>
<div class="modal hide fade" id="previewModal">
<section id="previewModal" class="modal" aria-hidden="true">
<div class="inner-wrapper" role="dialog" aria-labelledby="preview-title">
<button class="close-modal">&#10005; <span class="sr">{% trans 'Close Modal' %}</span></button>
<header>
<h2 id="preview-title">{% trans "Wiki Preview" %}<span class="sr">, {% trans "modal open" %}</span></h2>
<hr/>
</header>
<div class="modal-body">
<iframe name="previewWindow" frameborder="0"></iframe>
</div>
......@@ -34,16 +61,13 @@
{% trans "Save changes" %}
</button>
<a href="#" class="btn btn-large" data-dismiss="modal">
<a id="previewModalBackToEditor" href="#" class="btn btn-large">
<span class="icon-circle-arrow-left"></span>
{% trans "Back to editor" %}
</a>
</div>
</div>
</section>
{% include "wiki/includes/cheatsheet.html" %}
</form>
{% endblock %}
......@@ -59,7 +59,7 @@
1. {% trans "Ordered" %}
2. {% trans "List" %}</pre>
<pre>
> {% trans "Quotes" %}</pre>
&gt; {% trans "Quotes" %}</pre>
</section>
</div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment