moparisthebest
/
mail
mirror of https://github.com/moparisthebest/mail
1
0
Fork 0
Code Issues Releases Wiki Activity

Cleanup and fix keyboard event handling in editor headers

This commit is contained in:
Tankred Hase 2014-06-17 19:41:04 +02:00
parent cb60995ce1
commit e28c9a62ff
2 changed files with 30 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
src/js/controller/write.js
View File

@ -445,15 +445,17 @@ define(function(require) {
});
function addInput(field, scope) {
field.push({
address: ''
scope.$apply(function() {
field.push({
address: ''
});
});
scope.$apply();
}
function removeInput(field, index, scope) {
field.splice(index, 1);
scope.$apply();
scope.$apply(function() {
field.splice(index, 1);
});
}
function checkForEmptyInput(field) {
@ -463,20 +465,25 @@ define(function(require) {
emptyFieldExists = true;
}
});
return emptyFieldExists;
}
function cleanupEmptyInputs(field, scope) {
var i;
for (i = field.length - 2; i >= 0; i--) {
if (!field[i].address) {
field.splice(i, 1);
scope.$apply(function() {
for (var i = field.length - 2; i >= 0; i--) {
if (!field[i].address) {
field.splice(i, 1);
}
}
}
});
}
scope.$apply();
function focusInput(fieldName, index) {
var fieldId = fieldName + (index);
var fieldEl = document.getElementById(fieldId);
if (fieldEl) {
fieldEl.focus();
}
}
ngModule.directive('field', function() {
@ -497,8 +504,7 @@ define(function(require) {
}
// focus on last input when clicking on field
var id = fieldName + (field.length - 1);
document.getElementById(id).focus();
focusInput(fieldName, field.length - 1);
});
}
};
@ -525,8 +531,6 @@ define(function(require) {
element.on('keydown', function(e) {
var code = e.keyCode;
scope.$digest();
if (code === 32 || code === 188 || code === 186) {
// catch space, comma, semicolon
e.preventDefault();
@ -535,18 +539,20 @@ define(function(require) {
if (field[index].address) {
// create new field input
addInput(field, scope);
// find next input and focus
var nextId = fieldName + (index + 1);
document.getElementById(nextId).focus();
focusInput(fieldName, index + 1);
}
} else if ((code === 8 || code === 46) && !field[index].address && field.length > 1) {
// backspace, delete on empty input
// remove input
e.preventDefault();
removeInput(field, index, scope);
// focus on previous id
var previousId = fieldName + (index - 1);
document.getElementById(previousId).focus();
focusInput(fieldName, index - 1);
}
});
}

6
src/tpl/write.html
View File

@ -14,19 +14,19 @@
<p field="to">
<label>To:</label>
<span ng-repeat="recipient in to track by $index">
<input id="to{{$index}}" type="email" value="{{recipient.address}}" ng-model="recipient.address" ng-trim="false" class="label" ng-class="{'label-blank': !recipient.address || recipient.secure === undefined, 'label-primary': recipient.secure === false}" auto-size="recipient.address" spellcheck="false" ng-change="onAddressUpdate(to, $index)" address-input="to" tabindex="1" ng-mouseover="getKeyId(recipient)" focus-me="$index === 0 && state.lightbox === 'write' && writerTitle !== 'Reply'">
<input id="to{{$index}}" value="{{recipient.address}}" ng-model="recipient.address" ng-trim="false" class="label" ng-class="{'label-blank': !recipient.address || recipient.secure === undefined, 'label-primary': recipient.secure === false}" auto-size="recipient.address" spellcheck="false" ng-change="onAddressUpdate(to, $index)" address-input="to" tabindex="1" ng-mouseover="getKeyId(recipient)" focus-me="$index === 0 && state.lightbox === 'write' && writerTitle !== 'Reply'">
</span>
</p>
<p field="cc" ng-show="showCC === true">
<label>Cc:</label>
<span ng-repeat="recipient in cc track by $index">
<input id="cc{{$index}}" type="email" value="{{recipient.address}}" ng-model="recipient.address" ng-trim="false" class="label" ng-class="{'label-blank': !recipient.address || recipient.secure === undefined, 'label-primary': recipient.secure === false}" auto-size="recipient.address" spellcheck="false" ng-change="onAddressUpdate(cc, $index)" address-input="cc" tabindex="1" ng-mouseover="getKeyId(recipient)">
<input id="cc{{$index}}" value="{{recipient.address}}" ng-model="recipient.address" ng-trim="false" class="label" ng-class="{'label-blank': !recipient.address || recipient.secure === undefined, 'label-primary': recipient.secure === false}" auto-size="recipient.address" spellcheck="false" ng-change="onAddressUpdate(cc, $index)" address-input="cc" tabindex="1" ng-mouseover="getKeyId(recipient)">
</span>
</p>
<p field="bcc" ng-show="showBCC === true">
<label>Bcc:</label>
<span ng-repeat="recipient in bcc track by $index">
<input id="bcc{{$index}}" type="email" value="{{recipient.address}}" ng-model="recipient.address" ng-trim="false" class="label" ng-class="{'label-blank': !recipient.address || recipient.secure === undefined, 'label-primary': recipient.secure === false}" auto-size="recipient.address" spellcheck="false" ng-change="onAddressUpdate(bcc, $index)" address-input="bcc" tabindex="1" ng-mouseover="getKeyId(recipient)">
<input id="bcc{{$index}}" value="{{recipient.address}}" ng-model="recipient.address" ng-trim="false" class="label" ng-class="{'label-blank': !recipient.address || recipient.secure === undefined, 'label-primary': recipient.secure === false}" auto-size="recipient.address" spellcheck="false" ng-change="onAddressUpdate(bcc, $index)" address-input="bcc" tabindex="1" ng-mouseover="getKeyId(recipient)">
</span>
</p>
</div><!--/.mail-addresses-->