Skip to content

Commit

Permalink
Split hasfocus binding.
Browse files Browse the repository at this point in the history
  • Loading branch information
mbest committed Aug 29, 2012
2 parents 055c8fc + 93e6681 commit 5900182
Showing 1 changed file with 35 additions and 0 deletions.
35 changes: 35 additions & 0 deletions src/binding/defaultBindings/hasfocusBinding.js
@@ -0,0 +1,35 @@
var hasfocusUpdatingProperty = '__ko_hasfocusUpdating';
ko.bindingHandlers['hasfocus'] = {
'init': function(element, valueAccessor, allBindingsAccessor) {
var handleElementFocusChange = function(isFocused) {
// Where possible, ignore which event was raised and determine focus state using activeElement,
// as this avoids phantom focus/blur events raised when changing tabs in modern browsers.
// However, not all KO-targeted browsers (Firefox 2) support activeElement. For those browsers,
// prevent a loss of focus when changing tabs/windows by setting a flag that prevents hasfocus
// from calling 'blur()' on the element when it loses focus.
// Discussion at https://github.com/SteveSanderson/knockout/pull/352
element[hasfocusUpdatingProperty] = true;
var ownerDoc = element.ownerDocument;
if ("activeElement" in ownerDoc) {
isFocused = (ownerDoc.activeElement === element);
}
var modelValue = valueAccessor();
ko.expressionRewriting.writeValueToProperty(modelValue, allBindingsAccessor, 'hasfocus', isFocused, true);
element[hasfocusUpdatingProperty] = false;
};
var handleElementFocusIn = handleElementFocusChange.bind(null, true);
var handleElementFocusOut = handleElementFocusChange.bind(null, false);

ko.utils.registerEventHandler(element, "focus", handleElementFocusIn);
ko.utils.registerEventHandler(element, "focusin", handleElementFocusIn); // For IE
ko.utils.registerEventHandler(element, "blur", handleElementFocusOut);
ko.utils.registerEventHandler(element, "focusout", handleElementFocusOut); // For IE
},
'update': function(element, valueAccessor) {
if (!element[hasfocusUpdatingProperty]) {
var value = ko.utils.unwrapObservable(valueAccessor());
value ? element.focus() : element.blur();
ko.utils.triggerEvent(element, value ? "focusin" : "focusout"); // For IE, which doesn't reliably fire "focus" or "blur" events synchronously
}
}
};

0 comments on commit 5900182

Please sign in to comment.