Improve accessibility on attachments list: use custom tabindex attribute + ...

Thomas Bruederli

2014-06-18 9240c96339b26989f060c57c61a2677e2f1e502e

 program/js/app.js

@@ -1677,7 +1677,7 @@
      case 63232: // "up", in safari keypress
      case 63233: // "down", in safari keypress
        focus_menu_item(keyCode == 38 || keyCode == 63232 ? -1 : 1);
        break;
        return rcube_event.cancel(e);

      case 9:   // tab
        if (this.focused_menu) {
@@ -3553,26 +3553,32 @@
        myprompt = $('<div class="prompt">').html('<div class="message">' + this.get_label('nosubjectwarning') + '</div>')
          .appendTo(document.body),
        prompt_value = $('<input>').attr({type: 'text', size: 30}).val(this.get_label('nosubject'))
          .appendTo(myprompt);
          .appendTo(myprompt),
        save_func = function() {
          input_subject.val(prompt_value.val());
          myprompt.dialog('close');
          ref.command(cmd, { nocheck:true });  // repeat command which triggered this
        };

      buttons[this.get_label('cancel')] = function(){
      buttons[this.get_label('sendmessage')] = function() {
        save_func($(this));
      };
      buttons[this.get_label('cancel')] = function() {
        input_subject.focus();
        $(this).dialog('close');
      };
      buttons[this.get_label('sendmessage')] = function(){
        input_subject.val(prompt_value.val());
        $(this).dialog('close');
        ref.command(cmd, { nocheck:true });  // repeat command which triggered this
      };

      myprompt.dialog({
        modal: true,
        resizable: false,
        buttons: buttons,
        close: function(event, ui) { $(this).remove() }
        close: function(event, ui) { $(this).remove(); }
      });

      prompt_value.select();
      prompt_value.select().keydown(function(e) {
        if (e.which == 13) save_func();
      });

      return false;
    }

@@ -3650,7 +3656,7 @@
      $(this).dialog('close');
    };

    this.show_popup_dialog(html, this.gettext('savenewresponse'), buttons);
    this.show_popup_dialog(html, this.gettext('newresponse'), buttons);

    $('#ffresponsetext').val(text);
    $('#ffresponsename').select();
@@ -4064,7 +4070,7 @@

    if (!att.complete && att.frame)
      att.html = '<a title="'+this.get_label('cancel')+'" onclick="return rcmail.cancel_attachment_upload(\''+name+'\', \''+att.frame+'\');" href="#cancelupload" class="cancelupload">'
        + (this.env.cancelicon ? '<img src="'+this.env.cancelicon+'" alt="" />' : this.get_label('cancel')) + '</a>' + att.html;
        + (this.env.cancelicon ? '<img src="'+this.env.cancelicon+'" alt="'+this.get_label('cancel')+'" />' : this.get_label('cancel')) + '</a>' + att.html;

    var indicator, li = $('<li>');

@@ -4081,6 +4087,10 @@
      li.appendTo(this.gui_objects.attachmentlist);
    }

    // set tabindex attribute
    var tabindex = $(this.gui_objects.attachmentlist).attr('data-tabindex') || '0';
    li.find('a').attr('tabindex', tabindex);

    if (upload_id && this.env.attachments[upload_id])
      delete this.env.attachments[upload_id];