scripts/apps/search/directives/ItemSearchbar.ts
import _ from 'lodash';
ItemSearchbar.$inject = ['$location', '$document', 'asset'];
/**
* Item search component
*/
export function ItemSearchbar($location, $document, asset) {
return {
scope: true,
templateUrl: asset.templateUrl('apps/search/views/item-searchbar.html'),
link: function(scope, elem) {
var ENTER = 13;
scope.focused = false;
var input = elem.find('#search-input');
scope.searchOnEnter = function($event) {
if ($event.keyCode === ENTER) {
scope.search();
$event.stopPropagation();
}
};
scope.search = function() {
if (scope.query) {
let newQuery = _.uniq(scope.query.split(/[\s]+/));
scope.query = newQuery.join(' ');
}
$location.search('q', scope.query || null);
};
scope.cancel = function() {
scope.query = null;
scope.search();
input.focus();
// to be implemented
};
const init = () => {
let srch = $location.search();
if (srch.q && srch.q !== '') {
scope.query = srch.q.replace(/[()]/g, '');
} else {
scope.query = null;
}
};
init();
scope.$on('tag:removed', init);
function closeOnClick() {
scope.$applyAsync(() => {
scope.focused = false;
});
}
$document.bind('click', closeOnClick);
scope.$on('$destroy', () => {
$document.unbind('click', closeOnClick);
});
},
};
}