b38dea0597
Share Gaia assets and adapters, keep private profiles and development documents local, and update both public READMEs.
69 lines
1.9 KiB
JavaScript
Executable file
69 lines
1.9 KiB
JavaScript
Executable file
/* global evt */
|
|
(function(exports) {
|
|
'use strict';
|
|
|
|
function SearchBar() {}
|
|
|
|
SearchBar.STATES = Object.freeze({
|
|
'HIDDEN': 'hidden',
|
|
'SHOWING': 'showing',
|
|
'SHOWN': 'shown'
|
|
});
|
|
|
|
var proto = SearchBar.prototype = new evt();
|
|
|
|
Object.defineProperty(proto, 'state', {
|
|
get: function sb_getState() {
|
|
return this._state;
|
|
},
|
|
set: function sb_setState(state) {
|
|
this._state = state;
|
|
this.fire(state);
|
|
}
|
|
});
|
|
|
|
proto.init = function sb_init(ui) {
|
|
this.searchUI = ui;
|
|
this.searchUI.addEventListener('transitionend', this);
|
|
|
|
this.voiceButton = this.searchUI.querySelector('.search-mic-button');
|
|
this.voiceButton.addEventListener('transitionend', this);
|
|
|
|
this.state = this.searchUI.classList.contains('hidden') ?
|
|
SearchBar.STATES.HIDDEN : SearchBar.STATES.SHOWN;
|
|
};
|
|
|
|
proto.uninit = function sb_uninit() {
|
|
this.searchUI.removeEventListener('transitionend', this);
|
|
this.voiceButton.removeEventListener('transitionend', this);
|
|
};
|
|
|
|
proto.show = function sb_show() {
|
|
this.searchUI.classList.remove('hidden');
|
|
this.state = SearchBar.STATES.SHOWING;
|
|
};
|
|
|
|
proto.hide = function sb_hide() {
|
|
this.searchUI.classList.add('hidden');
|
|
this.searchUI.classList.remove('opened');
|
|
this.state = SearchBar.STATES.HIDDEN;
|
|
};
|
|
|
|
proto.handleEvent = function sb_handleEvent(evt) {
|
|
// We have two steps transition:
|
|
// 1. background-color transition on searchUI
|
|
// 2. opacity on voiceButton
|
|
if (evt.target === this.searchUI &&
|
|
evt.propertyName === 'background-color' &&
|
|
this.state === SearchBar.STATES.SHOWING) {
|
|
this.searchUI.classList.add('opened');
|
|
} else if (evt.target === this.voiceButton &&
|
|
evt.propertyName === 'opacity' &&
|
|
this.state === SearchBar.STATES.SHOWING) {
|
|
this.state = SearchBar.STATES.SHOWN;
|
|
}
|
|
};
|
|
|
|
exports.SearchBar = SearchBar;
|
|
|
|
})(window);
|