|
1 | 1 | import Ember from 'ember'; |
2 | | -import PromiseController from './promise'; |
| 2 | +import PromiseController from 'phoenix/controllers/promise'; |
| 3 | +import KeyEventsMixin from 'phoenix/mixins/key-events'; |
3 | 4 | import { request } from 'ic-ajax'; |
4 | 5 |
|
5 | | -export default Ember.Controller.extend({ |
| 6 | +export default Ember.Component.extend(KeyEventsMixin, { |
| 7 | + classNameBindings: [':quick-jump', 'isActive:active', 'isLoading:loading'], |
| 8 | + tagName: 'section', |
| 9 | + |
6 | 10 | query: null, |
7 | 11 | results: null, |
8 | 12 | requestPromise: null, |
| 13 | + isActive: false, |
| 14 | + isLoading: Ember.computed.oneWay('requestPromise.isLoading'), |
| 15 | + placeholder: null, |
9 | 16 |
|
10 | 17 | resultSectionsOrder: [ |
11 | 18 | 'user', 'contact', 'advisor', 'project', 'entity', 'account', 'target' |
@@ -123,9 +130,50 @@ export default Ember.Controller.extend({ |
123 | 130 | } |
124 | 131 | }, |
125 | 132 |
|
| 133 | + clickEventName: Ember.computed('elementId', function() { |
| 134 | + return `click.${this.get('elementId')}`; |
| 135 | + }), |
| 136 | + |
| 137 | + didInsertElement: function() { |
| 138 | + this._super.apply(this, arguments); |
| 139 | + |
| 140 | + Ember.$(document).on(this.get('clickEventName'), (event) => { |
| 141 | + var $target = Ember.$(event.target); |
| 142 | + var $nonBlurringElements = this.$('.bar, .results'); |
| 143 | + |
| 144 | + if ($target.closest($nonBlurringElements).length === 0) { |
| 145 | + this.send('clear'); |
| 146 | + } |
| 147 | + |
| 148 | + return true; |
| 149 | + }); |
| 150 | + }, |
| 151 | + |
| 152 | + willDestroyElement: function() { |
| 153 | + this._super.apply(this, arguments); |
| 154 | + |
| 155 | + Ember.$(document).off(this.get('clickEventName')); |
| 156 | + }, |
| 157 | + |
| 158 | + onIsActiveDidChange: Ember.observer('isActive', function() { |
| 159 | + if (!this.get('isActive')) { |
| 160 | + this.$('input').blur(); |
| 161 | + } |
| 162 | + }), |
| 163 | + |
| 164 | + keyEvents: { |
| 165 | + esc: function() { |
| 166 | + this.set('isActive', false); |
| 167 | + } |
| 168 | + }, |
| 169 | + |
126 | 170 | actions: { |
127 | 171 | clear: function() { |
128 | 172 | this.set('query', null); |
| 173 | + }, |
| 174 | + |
| 175 | + activate: function() { |
| 176 | + this.set('isActive', true); |
129 | 177 | } |
130 | 178 | } |
131 | 179 | }); |
0 commit comments