OLD | NEW |
1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. |
2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
4 | 4 |
5 cr.define('cr.ui', function() { | 5 cr.define('cr.ui', function() { |
6 /** | 6 /** |
7 * The class name to set on the document element. | 7 * The class name to set on the document element. |
8 * @const | 8 * @const |
9 */ | 9 */ |
10 var CLASS_NAME = 'focus-outline-visible'; | 10 var CLASS_NAME = 'focus-outline-visible'; |
(...skipping 13 matching lines...) Expand all Loading... |
24 * it. | 24 * it. |
25 * | 25 * |
26 * @param {Document} doc The document to attach the focus outline manager to. | 26 * @param {Document} doc The document to attach the focus outline manager to. |
27 * @constructor | 27 * @constructor |
28 */ | 28 */ |
29 function FocusOutlineManager(doc) { | 29 function FocusOutlineManager(doc) { |
30 this.classList_ = doc.documentElement.classList; | 30 this.classList_ = doc.documentElement.classList; |
31 | 31 |
32 var self = this; | 32 var self = this; |
33 | 33 |
34 doc.addEventListener('keydown', function(e) { | 34 doc.addEventListener( |
35 self.focusByKeyboard_ = true; | 35 'keydown', function(e) { self.focusByKeyboard_ = true; }, true); |
36 }, true); | |
37 | 36 |
38 doc.addEventListener('mousedown', function(e) { | 37 doc.addEventListener( |
39 self.focusByKeyboard_ = false; | 38 'mousedown', function(e) { self.focusByKeyboard_ = false; }, true); |
40 }, true); | |
41 | 39 |
42 doc.addEventListener('focus', function(event) { | 40 doc.addEventListener('focus', function(event) { |
43 // Update visibility only when focus is actually changed. | 41 // Update visibility only when focus is actually changed. |
44 self.updateVisibility(); | 42 self.updateVisibility(); |
45 }, true); | 43 }, true); |
46 | 44 |
47 doc.addEventListener('focusout', function(event) { | 45 doc.addEventListener('focusout', function(event) { |
48 window.setTimeout(function() { | 46 window.setTimeout(function() { |
49 if (!doc.hasFocus()) { | 47 if (!doc.hasFocus()) { |
50 self.focusByKeyboard_ = true; | 48 self.focusByKeyboard_ = true; |
51 self.updateVisibility(); | 49 self.updateVisibility(); |
52 } | 50 } |
53 }, 0); | 51 }, 0); |
54 }); | 52 }); |
55 | 53 |
56 this.updateVisibility(); | 54 this.updateVisibility(); |
57 } | 55 } |
58 | 56 |
59 FocusOutlineManager.prototype = { | 57 FocusOutlineManager.prototype = { |
60 /** | 58 /** |
61 * Whether focus change is triggered by TAB key. | 59 * Whether focus change is triggered by TAB key. |
62 * @type {boolean} | 60 * @type {boolean} |
63 * @private | 61 * @private |
64 */ | 62 */ |
65 focusByKeyboard_: true, | 63 focusByKeyboard_: true, |
66 | 64 |
67 updateVisibility: function() { | 65 updateVisibility: function() { this.visible = this.focusByKeyboard_; }, |
68 this.visible = this.focusByKeyboard_; | |
69 }, | |
70 | 66 |
71 /** | 67 /** |
72 * Whether the focus outline should be visible. | 68 * Whether the focus outline should be visible. |
73 * @type {boolean} | 69 * @type {boolean} |
74 */ | 70 */ |
75 set visible(visible) { | 71 set visible(visible) { this.classList_.toggle(CLASS_NAME, visible); }, |
76 this.classList_.toggle(CLASS_NAME, visible); | 72 get visible() { return this.classList_.contains(CLASS_NAME); } |
77 }, | |
78 get visible() { | |
79 return this.classList_.contains(CLASS_NAME); | |
80 } | |
81 }; | 73 }; |
82 | 74 |
83 /** | 75 /** |
84 * Array of Document and FocusOutlineManager pairs. | 76 * Array of Document and FocusOutlineManager pairs. |
85 * @type {Array} | 77 * @type {Array} |
86 */ | 78 */ |
87 var docsToManager = []; | 79 var docsToManager = []; |
88 | 80 |
89 /** | 81 /** |
90 * Gets a per document singleton focus outline manager. | 82 * Gets a per document singleton focus outline manager. |
91 * @param {Document} doc The document to get the |FocusOutlineManager| for. | 83 * @param {Document} doc The document to get the |FocusOutlineManager| for. |
92 * @return {cr.ui.FocusOutlineManager} The per document singleton focus | 84 * @return {cr.ui.FocusOutlineManager} The per document singleton focus |
93 * outline manager. | 85 * outline manager. |
94 */ | 86 */ |
95 FocusOutlineManager.forDocument = function(doc) { | 87 FocusOutlineManager.forDocument = function(doc) { |
96 for (var i = 0; i < docsToManager.length; i++) { | 88 for (var i = 0; i < docsToManager.length; i++) { |
97 if (doc == docsToManager[i][0]) | 89 if (doc == docsToManager[i][0]) |
98 return docsToManager[i][1]; | 90 return docsToManager[i][1]; |
99 } | 91 } |
100 var manager = new FocusOutlineManager(doc); | 92 var manager = new FocusOutlineManager(doc); |
101 docsToManager.push([doc, manager]); | 93 docsToManager.push([doc, manager]); |
102 return manager; | 94 return manager; |
103 }; | 95 }; |
104 | 96 |
105 return { | 97 return {FocusOutlineManager: FocusOutlineManager}; |
106 FocusOutlineManager: FocusOutlineManager | |
107 }; | |
108 }); | 98 }); |
OLD | NEW |