zotero-web-library/lib/libraryUi/widgets/SearchBox.js

Web library from zotero.org

'use strict';

var log = require('libzotero/lib/Log').Logger('zotero-web-library:searchbox');

var React = require('react');

var SearchBox = React.createClass({
	displayName: 'SearchBox',

	componentWillMount: function componentWillMount() {
		// Look for a context specific search
		if (undefined !== window.zoterojsSearchContext) {
			this.setState({ searchContext: window.zoterojsSearchContext });
		}
	},
	getInitialState: function getInitialState() {
		return {
			searchContext: '',
			q: ''
		};
	},
	clearQuery: function clearQuery() {
		this.setState({ q: '' });
	},
	changeQuery: function changeQuery(evt) {
		this.setState({ q: evt.target.value });
	},
	search: function search(evt) {
		if (evt) {
			evt.preventDefault();
		}
		var q = '';
		var url = '';
		switch (this.state.searchContext) {
			case 'support':
			case 'documentation':
				q = encodeURIComponent(this.state.q + ' site:www.zotero.org/support');
				url = 'https://duckduckgo.com/?q=' + q;
				window.location = url;
				break;
			case 'forums':
				q = encodeURIComponent(this.state.q + ' site:forums.zotero.org');
				url = 'https://duckduckgo.com/?q=' + q;
				window.location = url;
				break;
			case 'people':
				q = encodeURIComponent(this.state.q);
				url = '/search/type/users?q=' + q;
				window.location = url;
				break;
			case 'group':
				q = encodeURIComponent(this.state.q);
				url = '/search/type/groups?q=' + q;
				window.location = url;
				break;
			case 'library':
			case 'grouplibrary':

				break;
		}
	},
	render: function render() {

		var placeHolder = '';
		switch (this.state.searchContext) {
			case 'people':
				placeHolder = 'Search People';break;
			case 'group':
				placeHolder = 'Search Groups';break;
			case 'documentation':
				placeHolder = 'Search Documentation';break;
			case 'library':
				placeHolder = 'Search Library';break;
			case 'grouplibrary':
				placeHolder = 'Search Library';break;
			case 'support':
				placeHolder = 'Search Support';break;
			case 'forums':
				placeHolder = 'Search Forums';break;
			default:
				placeHolder = 'Search Support';
		}

		return React.createElement(
			'form',
			{ action: '/search/', onSubmit: this.search, className: 'navbar-form navbar-right', role: 'search' },
			React.createElement(
				'div',
				{ className: 'input-group' },
				React.createElement('input', { onChange: this.changeQuery, value: this.state.q, type: 'text', name: 'q', id: 'header-search-query', className: 'search-query form-control', placeholder: placeHolder }),
				React.createElement(
					'span',
					{ className: 'input-group-btn' },
					React.createElement(
						'button',
						{ onClick: this.clearQuery, className: 'btn btn-default clear-field-button', type: 'button' },
						React.createElement('span', { className: 'glyphicons fonticon glyphicons-remove-2' })
					)
				)
			)
		);
	}
});

module.exports = SearchBox;