Skip to content

Commit

Permalink
Elastic: Fix focus after adding/removing recipient input in mail compose
Browse files Browse the repository at this point in the history
  • Loading branch information
alecpl committed May 11, 2018
1 parent b1ea91c commit 2548a7c
Show file tree
Hide file tree
Showing 3 changed files with 18 additions and 7 deletions.
4 changes: 2 additions & 2 deletions skins/elastic/templates/bounce.html
Expand Up @@ -34,7 +34,7 @@ <h2 id="aria-label-composeheaders" class="voice"><roundcube:label name="arialabe
<div class="input-group">
<roundcube:object name="composeHeaders" part="cc" id="_cc" form="form" tabindex="1" data-recipient-input="true" />
<span class="input-group-append">
<a href="#delete" onclick="$('#_cc').val('').change()" class="input-group-text icon cancel" title="<roundcube:label name='delete' />" tabindex="1"><span class="inner"><roundcube:label name="delete" /></span></a>
<a href="#delete" onclick="UI.header_reset('_cc')" class="input-group-text icon cancel" title="<roundcube:label name='delete' />" tabindex="1"><span class="inner"><roundcube:label name="delete" /></span></a>
</span>
</div>
</div>
Expand All @@ -45,7 +45,7 @@ <h2 id="aria-label-composeheaders" class="voice"><roundcube:label name="arialabe
<div class="input-group">
<roundcube:object name="composeHeaders" part="bcc" id="_bcc" form="form" tabindex="1" data-recipient-input="true" />
<span class="input-group-append">
<a href="#delete" onclick="$('#_bcc').val('').change()" class="input-group-text icon cancel" title="<roundcube:label name='delete' />" tabindex="1"><span class="inner"><roundcube:label name="delete" /></span></a>
<a href="#delete" onclick="UI.header_reset('_bcc')" class="input-group-text icon cancel" title="<roundcube:label name='delete' />" tabindex="1"><span class="inner"><roundcube:label name="delete" /></span></a>
</span>
</div>
</div>
Expand Down
8 changes: 4 additions & 4 deletions skins/elastic/templates/compose.html
Expand Up @@ -181,7 +181,7 @@ <h2 id="aria-label-composeheaders" class="voice"><roundcube:label name="arialabe
<div class="input-group">
<roundcube:object name="composeHeaders" part="cc" id="_cc" form="form" tabindex="1" data-recipient-input="true" />
<span class="input-group-append">
<a href="#delete" onclick="$('#_cc').val('').change()" class="input-group-text icon cancel" title="<roundcube:label name='delete' />" tabindex="1"><span class="inner"><roundcube:label name="delete" /></span></a>
<a href="#delete" onclick="UI.header_reset('_cc')" class="input-group-text icon cancel" title="<roundcube:label name='delete' />" tabindex="1"><span class="inner"><roundcube:label name="delete" /></span></a>
</span>
</div>
</div>
Expand All @@ -192,7 +192,7 @@ <h2 id="aria-label-composeheaders" class="voice"><roundcube:label name="arialabe
<div class="input-group">
<roundcube:object name="composeHeaders" part="bcc" id="_bcc" form="form" tabindex="1" data-recipient-input="true" />
<span class="input-group-append">
<a href="#delete" onclick="$('#_bcc').val('').change()" class="input-group-text icon cancel" title="<roundcube:label name='delete' />" tabindex="1"><span class="inner"><roundcube:label name="delete" /></span></a>
<a href="#delete" onclick="UI.header_reset('_bcc')" class="input-group-text icon cancel" title="<roundcube:label name='delete' />" tabindex="1"><span class="inner"><roundcube:label name="delete" /></span></a>
</span>
</div>
</div>
Expand All @@ -203,7 +203,7 @@ <h2 id="aria-label-composeheaders" class="voice"><roundcube:label name="arialabe
<div class="input-group">
<roundcube:object name="composeHeaders" part="replyto" id="_replyto" form="form" tabindex="1" data-recipient-input="true" />
<span class="input-group-append">
<a href="#delete" onclick="$('#_replyto').val('').change()" class="input-group-text icon cancel" title="<roundcube:label name='delete' />" tabindex="1"><span class="inner"><roundcube:label name="delete" /></span></a>
<a href="#delete" onclick="UI.header_reset('_replyto')" class="input-group-text icon cancel" title="<roundcube:label name='delete' />" tabindex="1"><span class="inner"><roundcube:label name="delete" /></span></a>
</span>
</div>
</div>
Expand All @@ -214,7 +214,7 @@ <h2 id="aria-label-composeheaders" class="voice"><roundcube:label name="arialabe
<div class="input-group">
<roundcube:object name="composeHeaders" part="followupto" id="_followupto" form="form" tabindex="1" data-recipient-input="true" />
<span class="input-group-append">
<a href="#delete" onclick="$('#_followupto').val('').change()" class="input-group-text icon cancel" title="<roundcube:label name='delete' />" tabindex="1"><span class="inner"><roundcube:label name="delete" /></span></a>
<a href="#delete" onclick="UI.header_reset('_followupto')" class="input-group-text icon cancel" title="<roundcube:label name='delete' />" tabindex="1"><span class="inner"><roundcube:label name="delete" /></span></a>
</span>
</div>
</div>
Expand Down
13 changes: 12 additions & 1 deletion skins/elastic/ui.js
Expand Up @@ -63,6 +63,7 @@ function rcube_elastic_ui()
this.spellmenu = spellmenu;
this.searchmenu = searchmenu;
this.headersmenu = headersmenu;
this.header_reset = header_reset;
this.attachmentmenu = attachmentmenu;
this.mailtomenu = mailtomenu;
this.show_list = show_list;
Expand Down Expand Up @@ -2480,11 +2481,21 @@ function rcube_elastic_ui()

$(this)[$(target).is(':visible') ? 'removeClass' : 'addClass']('active')
.off().on('click', function() {
$(target).removeClass('hidden').find('.recipient-input > input').focus();
$(target).removeClass('hidden').find('.recipient-input input').focus();
});
});
};

/**
* Reset/hide compose message recipient input
*/
function header_reset(id)
{
$('#' + id).val('').change()
// jump to the next input
.closest('.form-group').nextAll(':not(.hidden)').first().find('input').focus();
};

/**
* Create/Update quota widget (setquota event handler)
*/
Expand Down

0 comments on commit 2548a7c

Please sign in to comment.