MDL-58515 assignfeedback_editpdf: Fix comment tabbing and focus outline

This commit is contained in:
Tony Butler
2017-04-17 15:40:27 +01:00
parent 0714bcb2a2
commit e082fbd978
5 changed files with 33 additions and 9 deletions
+6
View File
@@ -314,6 +314,12 @@ ul.assignfeedback_editpdf_menu {
min-height: 1.2em;
}
.assignfeedback_editpdf_widget .commentdrawable textarea:focus {
outline: thin dotted #333;
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
}
.assignfeedback_editpdf_widget .commentdrawable {
display: inline-block;
z-index: 1;
@@ -2562,6 +2562,7 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
container.setAttribute('tabindex', '-1');
label.setAttribute('tabindex', '0');
node.setAttribute('tabindex', '-1');
menu.setAttribute('tabindex', '0');
if (!this.editor.get('readonly')) {
container.append(menu);
@@ -2681,6 +2682,8 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
if (node.collapse.delay) {
node.collapse.delay.cancel();
}
// Give comment a tabindex to prevent focus outline being suppressed.
node.setAttribute('tabindex', '0');
// Expand comment and pass focus to it.
node.expand();
node.focus();
@@ -2697,7 +2700,10 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
label.setAttribute('tabindex', '0');
}, this);
// Always restore label tabindex when leaving.
// Always restore the default tabindex states when moving away.
node.on('blur', function() {
node.setAttribute('tabindex', '-1');
}, this);
label.on('blur', function() {
label.setAttribute('tabindex', '0');
}, this);
File diff suppressed because one or more lines are too long
@@ -2562,6 +2562,7 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
container.setAttribute('tabindex', '-1');
label.setAttribute('tabindex', '0');
node.setAttribute('tabindex', '-1');
menu.setAttribute('tabindex', '0');
if (!this.editor.get('readonly')) {
container.append(menu);
@@ -2681,6 +2682,8 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
if (node.collapse.delay) {
node.collapse.delay.cancel();
}
// Give comment a tabindex to prevent focus outline being suppressed.
node.setAttribute('tabindex', '0');
// Expand comment and pass focus to it.
node.expand();
node.focus();
@@ -2697,7 +2700,10 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
label.setAttribute('tabindex', '0');
}, this);
// Always restore label tabindex when leaving.
// Always restore the default tabindex states when moving away.
node.on('blur', function() {
node.setAttribute('tabindex', '-1');
}, this);
label.on('blur', function() {
label.setAttribute('tabindex', '0');
}, this);
+7 -1
View File
@@ -185,6 +185,7 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
container.setAttribute('tabindex', '-1');
label.setAttribute('tabindex', '0');
node.setAttribute('tabindex', '-1');
menu.setAttribute('tabindex', '0');
if (!this.editor.get('readonly')) {
container.append(menu);
@@ -304,6 +305,8 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
if (node.collapse.delay) {
node.collapse.delay.cancel();
}
// Give comment a tabindex to prevent focus outline being suppressed.
node.setAttribute('tabindex', '0');
// Expand comment and pass focus to it.
node.expand();
node.focus();
@@ -320,7 +323,10 @@ var COMMENT = function(editor, gradeid, pageno, x, y, width, colour, rawtext) {
label.setAttribute('tabindex', '0');
}, this);
// Always restore label tabindex when leaving.
// Always restore the default tabindex states when moving away.
node.on('blur', function() {
node.setAttribute('tabindex', '-1');
}, this);
label.on('blur', function() {
label.setAttribute('tabindex', '0');
}, this);