sequenceserver 3.0 → 3.1.0

data/public/sequenceserver-search.min.js

@@ -9,6 +9,17 @@
 /******/ (() => { // webpackBootstrap
 /******/ 	var __webpack_modules__ = ({
 
+/***/ "./public/js/collapse_preferences.js":
+/*!*******************************************!*\
+  !*** ./public/js/collapse_preferences.js ***!
+  \*******************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (/* binding */ CollapsePreferences)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nvar CollapsePreferences = /*#__PURE__*/function () {\n  function CollapsePreferences(component) {\n    _classCallCheck(this, CollapsePreferences);\n    this.component = component;\n    this.collapsePreferences = JSON.parse(localStorage.getItem('collapsePreferences')) || [];\n  }\n  return _createClass(CollapsePreferences, [{\n    key: \"toggleCollapse\",\n    value: function toggleCollapse() {\n      var _this = this;\n      var currentlyCollapsed = this.component.state.collapsed;\n      this.component.setState({\n        collapsed: !currentlyCollapsed\n      });\n      var collapsePreferences = JSON.parse(localStorage.getItem('collapsePreferences')) || [];\n      if (currentlyCollapsed) {\n        localStorage.setItem('collapsePreferences', JSON.stringify(collapsePreferences.filter(function (name) {\n          return name !== _this.component.name;\n        })));\n      } else {\n        var uniqueCollapsePreferences = _toConsumableArray(new Set(collapsePreferences.concat([this.component.name])));\n        localStorage.setItem('collapsePreferences', JSON.stringify(uniqueCollapsePreferences));\n      }\n    }\n  }, {\n    key: \"preferenceStoredAsCollapsed\",\n    value: function preferenceStoredAsCollapsed() {\n      return this.collapsePreferences.includes(this.component.name);\n    }\n  }, {\n    key: \"renderCollapseIcon\",\n    value: function renderCollapseIcon() {\n      return this.component.state.collapsed ? this.plusIcon() : this.minusIcon();\n    }\n  }, {\n    key: \"minusIcon\",\n    value: function minusIcon() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", {\n        className: \"fa fa-minus-square-o\"\n      });\n    }\n  }, {\n    key: \"plusIcon\",\n    value: function plusIcon() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"i\", {\n        className: \"fa fa-plus-square-o\"\n      });\n    }\n  }]);\n}();\n\n\n//# sourceURL=webpack://SequenceServer/./public/js/collapse_preferences.js?");
+
+/***/ }),
+
 /***/ "./public/js/databases.js":
 /*!********************************!*\
   !*** ./public/js/databases.js ***!
@@ -16,7 +27,7 @@
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Databases: () => (/* binding */ Databases)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var underscore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! underscore */ \"./node_modules/underscore/modules/index-all.js\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\n\n\n\nvar Databases = /*#__PURE__*/function (_Component) {\n  _inherits(Databases, _Component);\n  var _super = _createSuper(Databases);\n  function Databases(props) {\n    var _this;\n    _classCallCheck(this, Databases);\n    _this = _super.call(this, props);\n    _this.state = {\n      type: ''\n    };\n    _this.preSelectedDbs = _this.props.preSelectedDbs;\n    _this.databases = _this.databases.bind(_assertThisInitialized(_this));\n    _this.nselected = _this.nselected.bind(_assertThisInitialized(_this));\n    _this.categories = _this.categories.bind(_assertThisInitialized(_this));\n    _this.handleClick = _this.handleClick.bind(_assertThisInitialized(_this));\n    _this.handleToggle = _this.handleToggle.bind(_assertThisInitialized(_this));\n    _this.renderDatabases = _this.renderDatabases.bind(_assertThisInitialized(_this));\n    _this.renderDatabase = _this.renderDatabase.bind(_assertThisInitialized(_this));\n    return _this;\n  }\n  _createClass(Databases, [{\n    key: \"componentDidUpdate\",\n    value: function componentDidUpdate() {\n      if (this.databases() && this.databases().length === 1) {\n        $('.databases').find('input').prop('checked', true);\n        this.handleClick(this.databases()[0]);\n      }\n      if (this.preSelectedDbs) {\n        var selectors = this.preSelectedDbs.map(function (db) {\n          return \"input[value=\".concat(db.id, \"]\");\n        });\n        $(selectors.join(',')).prop('checked', true);\n        this.handleClick(this.preSelectedDbs[0]);\n        this.preSelectedDbs = null;\n      }\n      this.props.onDatabaseTypeChanged(this.state.type);\n    }\n  }, {\n    key: \"databases\",\n    value: function databases(category) {\n      var databases = this.props.databases;\n      if (category) {\n        databases = underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].select(databases, function (database) {\n          return database.type === category;\n        });\n      }\n      return underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].sortBy(databases, 'title');\n    }\n  }, {\n    key: \"nselected\",\n    value: function nselected() {\n      return $('input[name=\"databases[]\"]:checked').length;\n    }\n  }, {\n    key: \"categories\",\n    value: function categories() {\n      return underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].uniq(underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].map(this.props.databases, underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].iteratee('type'))).sort();\n    }\n  }, {\n    key: \"handleClick\",\n    value: function handleClick(database) {\n      var type = this.nselected() ? database.type : '';\n      if (type != this.state.type) this.setState({\n        type: type\n      });\n    }\n  }, {\n    key: \"handleToggle\",\n    value: function handleToggle(toggleState, type) {\n      switch (toggleState) {\n        case '[Select all]':\n          $(\".\".concat(type, \" .database input:not(:checked)\")).click();\n          break;\n        case '[Deselect all]':\n          $(\".\".concat(type, \" .database input:checked\")).click();\n          break;\n      }\n      this.forceUpdate();\n    }\n  }, {\n    key: \"renderDatabases\",\n    value: function renderDatabases(category) {\n      // Panel name and column width.\n      var panelTitle = category[0].toUpperCase() + category.substring(1).toLowerCase() + ' databases';\n      var columnClass = this.categories().length === 1 ? 'col-md-12' : 'col-md-6';\n\n      // Toggle button.\n      var toggleState = '[Select all]';\n      var toggleClass = 'btn-link';\n      var toggleShown = this.databases(category).length > 1;\n      var toggleDisabled = this.state.type && this.state.type !== category;\n      if (toggleShown && toggleDisabled) toggleClass += ' disabled';\n      if (!toggleShown) toggleClass += ' hidden';\n      if (this.nselected() === this.databases(category).length) {\n        toggleState = '[Deselect all]';\n      }\n\n      // JSX.\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"div\", {\n        className: columnClass,\n        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)(\"div\", {\n          className: \"panel panel-default\",\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)(\"div\", {\n            className: \"panel-heading\",\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"h4\", {\n              style: {\n                display: 'inline'\n              },\n              children: panelTitle\n            }), \" \\xA0\\xA0\", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"button\", {\n              type: \"button\",\n              className: toggleClass,\n              disabled: toggleDisabled,\n              onClick: function () {\n                this.handleToggle(toggleState, category);\n              }.bind(this),\n              children: toggleState\n            })]\n          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"ul\", {\n            className: 'list-group databases ' + category,\n            children: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].map(this.databases(category), underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function (database, index) {\n              return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"li\", {\n                className: \"list-group-item\",\n                children: this.renderDatabase(database)\n              }, 'DB_' + category + index);\n            }, this))\n          })]\n        })\n      }, 'DB_' + category);\n    }\n  }, {\n    key: \"renderDatabase\",\n    value: function renderDatabase(database) {\n      var disabled = this.state.type && this.state.type !== database.type;\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)(\"label\", {\n        className: disabled && 'disabled database' || 'database',\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"input\", {\n          type: \"checkbox\",\n          name: \"databases[]\",\n          value: database.id,\n          \"data-type\": database.type,\n          disabled: disabled,\n          onChange: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function () {\n            this.handleClick(database);\n          }, this)\n        }), ' ' + (database.title || database.name)]\n      });\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"div\", {\n        className: \"form-group databases-container\",\n        children: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].map(this.categories(), this.renderDatabases)\n      });\n    }\n  }]);\n  return Databases;\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\n\n//# sourceURL=webpack://SequenceServer/./public/js/databases.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Databases: () => (/* binding */ Databases)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var underscore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! underscore */ \"./node_modules/underscore/modules/index-all.js\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _callSuper(_this, derived, args) {\n  function isNativeReflectConstruct() {\n    if (typeof Reflect === \"undefined\" || !Reflect.construct) return false;\n    if (Reflect.construct.sham) return false;\n    if (typeof Proxy === \"function\") return true;\n    try {\n      return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));\n    } catch (e) {\n      return false;\n    }\n  }\n  derived = _getPrototypeOf(derived);\n  return _possibleConstructorReturn(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], _getPrototypeOf(_this).constructor) : derived.apply(_this, args));\n}\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\n\n\nvar Databases = /*#__PURE__*/function (_Component) {\n  function Databases(props) {\n    var _this2;\n    _classCallCheck(this, Databases);\n    _this2 = _callSuper(this, Databases, [props]);\n    _this2.state = {\n      type: '',\n      currentlySelectedDatabases: []\n    };\n    _this2.preSelectedDbs = _this2.props.preSelectedDbs;\n    _this2.databases = _this2.databases.bind(_this2);\n    _this2.nselected = _this2.nselected.bind(_this2);\n    _this2.categories = _this2.categories.bind(_this2);\n    _this2.handleToggle = _this2.handleToggle.bind(_this2);\n    _this2.renderDatabases = _this2.renderDatabases.bind(_this2);\n    _this2.renderDatabase = _this2.renderDatabase.bind(_this2);\n    return _this2;\n  }\n  _inherits(Databases, _Component);\n  return _createClass(Databases, [{\n    key: \"componentDidUpdate\",\n    value: function componentDidUpdate(_prevProps, prevState) {\n      // If there's only one database, select it.\n      if (this.databases() && this.databases().length === 1 && this.state.currentlySelectedDatabases.length === 0) {\n        this.setState({\n          currentlySelectedDatabases: this.databases()\n        });\n      }\n      if (this.preSelectedDbs && this.preSelectedDbs.length !== 0) {\n        this.setState({\n          currentlySelectedDatabases: this.preSelectedDbs\n        });\n        this.preSelectedDbs = null;\n      }\n      var type = this.state.currentlySelectedDatabases[0] ? this.state.currentlySelectedDatabases[0].type : '';\n      if (type != this.state.type) {\n        this.setState({\n          type: type\n        });\n        this.props.onDatabaseTypeChanged(type);\n      }\n      if (prevState.currentlySelectedDatabases !== this.state.currentlySelectedDatabases) {\n        // Call the prop function with the new state\n        this.props.onDatabaseSelectionChanged(this.state.currentlySelectedDatabases);\n      }\n    }\n  }, {\n    key: \"databases\",\n    value: function databases(category) {\n      var databases = this.props.databases;\n      if (category) {\n        databases = underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].select(databases, function (database) {\n          return database.type === category;\n        });\n      }\n      return underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].sortBy(databases, 'title');\n    }\n  }, {\n    key: \"nselected\",\n    value: function nselected() {\n      return this.state.currentlySelectedDatabases.length;\n    }\n  }, {\n    key: \"categories\",\n    value: function categories() {\n      return underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].uniq(underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].map(this.props.databases, underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].iteratee('type'))).sort();\n    }\n  }, {\n    key: \"handleToggle\",\n    value: function handleToggle(toggleState, type) {\n      switch (toggleState) {\n        case '[Select all]':\n          this.setState({\n            currentlySelectedDatabases: this.databases(type)\n          });\n          break;\n        case '[Deselect all]':\n          this.setState({\n            currentlySelectedDatabases: []\n          });\n          break;\n      }\n    }\n  }, {\n    key: \"renderDatabases\",\n    value: function renderDatabases(category) {\n      // Panel name and column width.\n      var panelTitle = category[0].toUpperCase() + category.substring(1).toLowerCase() + ' databases';\n      var columnClass = this.categories().length === 1 ? 'col-span-2' : '';\n\n      // Toggle button.\n      var toggleState = '[Select all]';\n      var toggleClass = 'px-2 text-sm';\n      var toggleShown = this.databases(category).length > 1;\n      var toggleDisabled = this.state.type && this.state.type !== category;\n      if (toggleShown && toggleDisabled) {\n        toggleClass += ' text-gray-400';\n      } else {\n        toggleClass += ' text-seqblue';\n      }\n      if (!toggleShown) toggleClass += ' hidden';\n      if (this.nselected() === this.databases(category).length) {\n        toggleState = '[Deselect all]';\n      }\n\n      // JSX.\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"div\", {\n        className: columnClass,\n        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)(\"div\", {\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)(\"div\", {\n            className: \"border-b border-seqorange mb-2\",\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"h4\", {\n              style: {\n                display: 'inline'\n              },\n              className: \"font-medium\",\n              children: panelTitle\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"button\", {\n              type: \"button\",\n              className: toggleClass,\n              disabled: toggleDisabled,\n              onClick: function () {\n                this.handleToggle(toggleState, category);\n              }.bind(this),\n              children: toggleState\n            })]\n          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"ul\", {\n            className: 'databases ' + category,\n            children: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].map(this.databases(category), underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function (database, index) {\n              return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"li\", {\n                children: this.renderDatabase(database)\n              }, 'DB_' + category + index);\n            }, this))\n          })]\n        })\n      }, 'DB_' + category);\n    }\n  }, {\n    key: \"handleDatabaseSelectionClick\",\n    value: function handleDatabaseSelectionClick(database) {\n      var isSelected = this.state.currentlySelectedDatabases.some(function (db) {\n        return db.id === database.id;\n      });\n      if (isSelected) {\n        this.setState(function (prevState) {\n          return {\n            currentlySelectedDatabases: prevState.currentlySelectedDatabases.filter(function (db) {\n              return db.id !== database.id;\n            })\n          };\n        });\n      } else {\n        this.setState(function (prevState) {\n          return {\n            currentlySelectedDatabases: [].concat(_toConsumableArray(prevState.currentlySelectedDatabases), [database])\n          };\n        });\n      }\n    }\n  }, {\n    key: \"renderDatabase\",\n    value: function renderDatabase(database) {\n      var isDisabled = this.state.type && this.state.type !== database.type;\n      var isChecked = this.state.currentlySelectedDatabases.some(function (db) {\n        return db.id === database.id;\n      });\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)(\"label\", {\n        className: isDisabled && 'database text-gray-400' || 'database text-seqblue',\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"input\", {\n          type: \"checkbox\",\n          name: \"databases[]\",\n          value: database.id,\n          \"data-type\": database.type,\n          disabled: isDisabled,\n          checked: isChecked,\n          onChange: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function () {\n            this.handleDatabaseSelectionClick(database);\n          }, this)\n        }), ' ' + (database.title || database.name)]\n      });\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(\"div\", {\n        className: \"my-6 grid md:grid-cols-2 gap-4\",\n        children: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].map(this.categories(), this.renderDatabases)\n      });\n    }\n  }]);\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\n\n//# sourceURL=webpack://SequenceServer/./public/js/databases.js?");
 
 /***/ }),
 
@@ -27,7 +38,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (/* binding */ _default)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var underscore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! underscore */ \"./node_modules/underscore/modules/index-all.js\");\n/* harmony import */ var jstree__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! jstree */ \"./node_modules/jstree/dist/jstree.js\");\n/* harmony import */ var jstree__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(jstree__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _databases__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./databases */ \"./public/js/databases.js\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\n\n\n\n\n\nvar _default = /*#__PURE__*/function (_Databases) {\n  _inherits(_default, _Databases);\n  var _super = _createSuper(_default);\n  function _default(props) {\n    var _this;\n    _classCallCheck(this, _default);\n    _this = _super.call(this, props);\n    _this.handleLoadTree = _this.handleLoadTree.bind(_assertThisInitialized(_this));\n    _this.renderDatabases = _this.renderDatabases.bind(_assertThisInitialized(_this));\n    _this.renderDatabaseSearch = _this.renderDatabaseSearch.bind(_assertThisInitialized(_this));\n    _this.renderDatabaseTree = _this.renderDatabaseTree.bind(_assertThisInitialized(_this));\n    return _this;\n  }\n  _createClass(_default, [{\n    key: \"handleLoadTree\",\n    value: function handleLoadTree(category) {\n      var tree_id = '#' + category + '_database_tree';\n      // hack that is needed to sync the selected tree db with the hidden main db\n      window.jstree_node_change_timeout = null;\n\n      // when a tree database gets selected\n      $(tree_id).on('select_node.jstree deselect_node.jstree', function (e, data) {\n        if (window.jstree_node_change_timeout) {\n          clearTimeout(window.jstree_node_change_timeout);\n          window.jstree_node_change_timeout = null;\n        }\n        window.jstree_node_change_timeout = setTimeout(function () {\n          // uncheck all input\n          $('div#database_list input[type=\"checkbox\"]:checked').click();\n          setTimeout(function () {\n            // get all selected tree dbs. Also includes folders. Therefore, the id must have a length of 32\n            // this id is used to find the corresponding element from the hidden main form\n            var selected = $(tree_id).jstree('get_selected').filter(function (selected) {\n              return selected.length == 32;\n            });\n            $.each(selected, function (index, value) {\n              // select hidden element to trigger original sequenceserver behavior, like blast algorithm, ...\n              $('input[value=\"' + value + '\"]').click();\n            });\n          }, 100);\n        }, 100);\n      });\n      $(tree_id).jstree({\n        'core': {\n          'data': this.props.tree[category]\n        },\n        'plugins': ['checkbox', 'search', 'sort'],\n        'checkbox': {\n          'keep_selected_style': false\n        }\n      });\n    }\n  }, {\n    key: \"handleTreeSearch\",\n    value: function handleTreeSearch(category, tree_id, search_id) {\n      var search_for = $('#' + search_id).val();\n      $('#' + tree_id).jstree(true).search(search_for);\n    }\n  }, {\n    key: \"renderDatabases\",\n    value: function renderDatabases(category) {\n      // Panel name and column width.\n      var panelTitle = category[0].toUpperCase() + category.substring(1).toLowerCase() + ' databases';\n      var columnClass = this.categories().length === 1 ? 'col-md-12' : 'col-md-6';\n\n      // Toggle button.\n      var toggleState = '[Select all]';\n      var toggleClass = 'btn-link';\n      var toggleShown = this.databases(category).length > 1;\n      var toggleDisabled = this.state.type && this.state.type !== category;\n      if (toggleShown && toggleDisabled) toggleClass += ' disabled';\n      if (!toggleShown) toggleClass += ' hidden';\n      if (this.nselected() === this.databases(category).length) {\n        toggleState = '[Deselect all]';\n      }\n\n      // JSX.\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(\"div\", {\n        className: columnClass,\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(\"div\", {\n          className: \"panel panel-default\",\n          id: \"database_list\",\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(\"div\", {\n            className: \"panel-heading\",\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"h4\", {\n              style: {\n                display: 'inline'\n              },\n              children: panelTitle\n            }), \" \\xA0\\xA0\", this.renderDatabaseSearch(category), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"button\", {\n              type: \"button\",\n              className: toggleClass,\n              disabled: toggleDisabled,\n              style: {\n                display: 'none'\n              },\n              onClick: function () {\n                this.handleToggle(toggleState, category);\n              }.bind(this),\n              children: toggleState\n            })]\n          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"ul\", {\n            className: 'list-group databases ' + category,\n            style: {\n              display: 'none'\n            },\n            children: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].map(this.databases(category), underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function (database, index) {\n              return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"li\", {\n                className: \"list-group-item\",\n                children: this.renderDatabase(database)\n              }, 'DB_' + category + index);\n            }, this))\n          })]\n        }), this.renderDatabaseTree(category)]\n      }, 'DB_' + category);\n    }\n  }, {\n    key: \"renderDatabaseSearch\",\n    value: function renderDatabaseSearch(category) {\n      var tree_id = category + '_database_tree';\n      var search_id = tree_id + '_search';\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"input\", {\n        type: \"text\",\n        id: search_id,\n        \"class\": \"input\",\n        onKeyUp: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function () {\n          this.handleTreeSearch(category, tree_id, search_id);\n        }, this)\n      });\n    }\n  }, {\n    key: \"renderDatabaseTree\",\n    value: function renderDatabaseTree(category) {\n      var tree_id = category + '_database_tree';\n      var data = this.props.tree[category];\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"div\", {\n        id: tree_id,\n        className: 'jstree_div',\n        onClick: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function () {\n          this.handleLoadTree(category);\n        }, this)\n      });\n    }\n  }]);\n  return _default;\n}(_databases__WEBPACK_IMPORTED_MODULE_3__.Databases);\n\n\n//# sourceURL=webpack://SequenceServer/./public/js/databases_tree.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (/* binding */ _default)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var underscore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! underscore */ \"./node_modules/underscore/modules/index-all.js\");\n/* harmony import */ var jstree__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! jstree */ \"./node_modules/jstree/dist/jstree.js\");\n/* harmony import */ var jstree__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(jstree__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _databases__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./databases */ \"./public/js/databases.js\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _callSuper(_this, derived, args) {\n  function isNativeReflectConstruct() {\n    if (typeof Reflect === \"undefined\" || !Reflect.construct) return false;\n    if (Reflect.construct.sham) return false;\n    if (typeof Proxy === \"function\") return true;\n    try {\n      return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));\n    } catch (e) {\n      return false;\n    }\n  }\n  derived = _getPrototypeOf(derived);\n  return _possibleConstructorReturn(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], _getPrototypeOf(_this).constructor) : derived.apply(_this, args));\n}\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\n\n\n\n\nvar _default = /*#__PURE__*/function (_Databases) {\n  function _default(props) {\n    var _this2;\n    _classCallCheck(this, _default);\n    _this2 = _callSuper(this, _default, [props]);\n    _this2.handleLoadTree = _this2.handleLoadTree.bind(_this2);\n    _this2.renderDatabases = _this2.renderDatabases.bind(_this2);\n    _this2.renderDatabaseSearch = _this2.renderDatabaseSearch.bind(_this2);\n    _this2.renderDatabaseTree = _this2.renderDatabaseTree.bind(_this2);\n    return _this2;\n  }\n  _inherits(_default, _Databases);\n  return _createClass(_default, [{\n    key: \"handleLoadTree\",\n    value: function handleLoadTree(category) {\n      var tree_id = '#' + category + '_database_tree';\n      // hack that is needed to sync the selected tree db with the hidden main db\n      window.jstree_node_change_timeout = null;\n\n      // when a tree database gets selected\n      $(tree_id).on('select_node.jstree deselect_node.jstree', function (e, data) {\n        if (window.jstree_node_change_timeout) {\n          clearTimeout(window.jstree_node_change_timeout);\n          window.jstree_node_change_timeout = null;\n        }\n        window.jstree_node_change_timeout = setTimeout(function () {\n          // uncheck all input\n          $('div#database_list input[type=\"checkbox\"]:checked').click();\n          setTimeout(function () {\n            // get all selected tree dbs. Also includes folders. Therefore, the id must have a length of 32\n            // this id is used to find the corresponding element from the hidden main form\n            var selected = $(tree_id).jstree('get_selected').filter(function (selected) {\n              return selected.length == 32;\n            });\n            $.each(selected, function (index, value) {\n              // select hidden element to trigger original sequenceserver behavior, like blast algorithm, ...\n              $('input[value=\"' + value + '\"]').click();\n            });\n          }, 100);\n        }, 100);\n      });\n      $(tree_id).jstree({\n        'core': {\n          'data': this.props.tree[category]\n        },\n        'plugins': ['checkbox', 'search', 'sort'],\n        'checkbox': {\n          'keep_selected_style': false\n        }\n      });\n    }\n  }, {\n    key: \"handleTreeSearch\",\n    value: function handleTreeSearch(category, tree_id, search_id) {\n      var search_for = $('#' + search_id).val();\n      $('#' + tree_id).jstree(true).search(search_for);\n    }\n  }, {\n    key: \"renderDatabases\",\n    value: function renderDatabases(category) {\n      // Panel name and column width.\n      var panelTitle = category[0].toUpperCase() + category.substring(1).toLowerCase() + ' databases';\n      var columnClass = this.categories().length === 1 ? 'col-md-12' : 'col-md-6';\n\n      // Toggle button.\n      var toggleState = '[Select all]';\n      var toggleClass = 'btn-link';\n      var toggleShown = this.databases(category).length > 1;\n      var toggleDisabled = this.state.type && this.state.type !== category;\n      if (toggleShown && toggleDisabled) toggleClass += ' disabled';\n      if (!toggleShown) toggleClass += ' hidden';\n      if (this.nselected() === this.databases(category).length) {\n        toggleState = '[Deselect all]';\n      }\n\n      // JSX.\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(\"div\", {\n        className: columnClass,\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(\"div\", {\n          className: \"panel panel-default\",\n          id: \"database_list\",\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(\"div\", {\n            className: \"panel-heading\",\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"h4\", {\n              style: {\n                display: 'inline'\n              },\n              children: panelTitle\n            }), \" \\xA0\\xA0\", this.renderDatabaseSearch(category), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"button\", {\n              type: \"button\",\n              className: toggleClass,\n              disabled: toggleDisabled,\n              style: {\n                display: 'none'\n              },\n              onClick: function () {\n                this.handleToggle(toggleState, category);\n              }.bind(this),\n              children: toggleState\n            })]\n          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"ul\", {\n            className: 'list-group databases ' + category,\n            style: {\n              display: 'none'\n            },\n            children: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].map(this.databases(category), underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function (database, index) {\n              return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"li\", {\n                className: \"list-group-item\",\n                children: this.renderDatabase(database)\n              }, 'DB_' + category + index);\n            }, this))\n          })]\n        }), this.renderDatabaseTree(category), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"link\", {\n          rel: \"stylesheet\",\n          media: \"screen,print\",\n          type: \"text/css\",\n          href: \"vendor/github/vakata/jstree@3.3.8/dist/themes/default/style.min.css\"\n        })]\n      }, 'DB_' + category);\n    }\n  }, {\n    key: \"renderDatabaseSearch\",\n    value: function renderDatabaseSearch(category) {\n      var tree_id = category + '_database_tree';\n      var search_id = tree_id + '_search';\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"input\", {\n        type: \"text\",\n        id: search_id,\n        className: \"border rounded px-1\",\n        placeholder: \"Search...\",\n        onKeyUp: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function () {\n          this.handleTreeSearch(category, tree_id, search_id);\n        }, this)\n      });\n    }\n  }, {\n    key: \"renderDatabaseTree\",\n    value: function renderDatabaseTree(category) {\n      var tree_id = category + '_database_tree';\n      var data = this.props.tree[category];\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"div\", {\n        id: tree_id,\n        className: 'jstree_div',\n        onClick: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function () {\n          this.handleLoadTree(category);\n        }, this)\n      });\n    }\n  }]);\n}(_databases__WEBPACK_IMPORTED_MODULE_3__.Databases);\n\n\n//# sourceURL=webpack://SequenceServer/./public/js/databases_tree.js?");
 
 /***/ }),
 
@@ -38,7 +49,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   DnD: () => (/* binding */ DnD)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\n\n/**\n * Drag n drop widget.\n */\n\n\nvar DnD = /*#__PURE__*/function (_Component) {\n  _inherits(DnD, _Component);\n  var _super = _createSuper(DnD);\n  function DnD(props) {\n    var _this;\n    _classCallCheck(this, DnD);\n    _this = _super.call(this, props);\n    _this.state = {\n      query: null\n    };\n    return _this;\n  }\n  _createClass(DnD, [{\n    key: \"componentDidMount\",\n    value: function componentDidMount() {\n      var self = this;\n      var FASTA_FORMAT = /^>/;\n      $(document).ready(function () {\n        var tgtMarker = $('.dnd-overlay');\n        var dndError = function dndError(id) {\n          $('.dnd-error').hide();\n          $('#' + id + '-notification').show();\n          tgtMarker.effect('fade', 2500);\n        };\n        $(document).on('dragenter', function (evt) {\n          // Do not activate DnD if a modal is active.\n          if ($.modalActive()) return;\n\n          // Based on http://stackoverflow.com/a/8494918/1205465.\n          // Contrary to what the above link says, the snippet below can't\n          // distinguish directories from files. We handle that on drop.\n          var dt = evt.originalEvent.dataTransfer;\n          var isFile = dt.types && (dt.types.indexOf &&\n          // Chrome and Safari\n          dt.types.indexOf('Files') != -1 || dt.types.contains &&\n          // Firefox\n          dt.types.contains('application/x-moz-file'));\n          if (!isFile) {\n            return;\n          }\n          $('.dnd-error').hide();\n          tgtMarker.stop(true, true);\n          tgtMarker.show();\n          dt.effectAllowed = 'copy';\n          if (self.state.query.isEmpty()) {\n            $('.dnd-overlay-overwrite').hide();\n            $('.dnd-overlay-drop').show('drop', {\n              direction: 'down'\n            }, 'fast');\n          } else {\n            $('.dnd-overlay-drop').hide();\n            $('.dnd-overlay-overwrite').show('drop', {\n              direction: 'down'\n            }, 'fast');\n          }\n        }).on('dragleave', '.dnd-overlay', function (evt) {\n          tgtMarker.hide();\n          $('.dnd-overlay-drop').hide();\n          $('.dnd-overlay-overwrite').hide();\n        }).on('dragover', '.dnd-overlay', function (evt) {\n          evt.originalEvent.dataTransfer.dropEffect = 'copy';\n          evt.preventDefault();\n        }).on('drop', '.dnd-overlay', function (evt) {\n          evt.preventDefault();\n          evt.stopPropagation();\n          var indicator = $('#sequence-file');\n          self.state.query.focus();\n          var files = evt.originalEvent.dataTransfer.files;\n          if (files.length > 1) {\n            dndError('dnd-multi');\n            return;\n          }\n          var file = files[0];\n          if (file.size > 250 * 1048576) {\n            dndError('dnd-large-file');\n            return;\n          }\n          var reader = new FileReader();\n          reader.onload = function (e) {\n            var content = e.target.result;\n            if (FASTA_FORMAT.test(content)) {\n              indicator.text(file.name + ' ');\n              self.state.query.value(content);\n              tgtMarker.hide();\n            } else {\n              // apparently not FASTA\n              dndError('dnd-format');\n            }\n          };\n          reader.onerror = function (e) {\n            // Couldn't read. Means dropped stuff wasn't FASTA file.\n            dndError('dnd-format');\n          };\n          reader.readAsText(file);\n        });\n      });\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n        className: \"dnd-overlay\",\n        style: {\n          display: 'none'\n        },\n        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n          className: \"container dnd-overlay-container\",\n          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n            className: \"row\",\n            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"div\", {\n              className: \"col-md-offset-2 col-md-10\",\n              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"p\", {\n                className: \"dnd-overlay-drop\",\n                style: {\n                  display: 'none'\n                },\n                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"i\", {\n                  className: \"fa fa-2x fa-file-o\"\n                }), \"Drop query sequence file here\"]\n              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"p\", {\n                className: \"dnd-overlay-overwrite\",\n                style: {\n                  display: 'none'\n                },\n                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"i\", {\n                  className: \"fa fa-2x fa-file-o\"\n                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"span\", {\n                  style: {\n                    color: 'red'\n                  },\n                  children: \"Overwrite\"\n                }), \" query sequence file\"]\n              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"div\", {\n                className: \"dnd-errors\",\n                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n                  className: \"dnd-error row\",\n                  id: \"dnd-multi-notification\",\n                  style: {\n                    display: 'none'\n                  },\n                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n                    className: \"col-md-6 col-md-offset-3\",\n                    children: \"One file at a time please.\"\n                  })\n                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n                  className: \"dnd-error row\",\n                  id: \"dnd-large-file-notification\",\n                  style: {\n                    display: 'none'\n                  },\n                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n                    className: \"col-md-6 col-md-offset-3\",\n                    children: \"Too big a file. Can only do less than 250 MB. >_<\"\n                  })\n                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n                  className: \"dnd-error row\",\n                  id: \"dnd-format-notification\",\n                  style: {\n                    display: 'none'\n                  },\n                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n                    className: \"col-md-6 col-md-offset-3\",\n                    children: \"Only FASTA files please.\"\n                  })\n                })]\n              })]\n            })\n          })\n        })\n      });\n    }\n  }]);\n  return DnD;\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\n\n//# sourceURL=webpack://SequenceServer/./public/js/dnd.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   DnD: () => (/* binding */ DnD)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _callSuper(_this, derived, args) {\n  function isNativeReflectConstruct() {\n    if (typeof Reflect === \"undefined\" || !Reflect.construct) return false;\n    if (Reflect.construct.sham) return false;\n    if (typeof Proxy === \"function\") return true;\n    try {\n      return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));\n    } catch (e) {\n      return false;\n    }\n  }\n  derived = _getPrototypeOf(derived);\n  return _possibleConstructorReturn(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], _getPrototypeOf(_this).constructor) : derived.apply(_this, args));\n}\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\n\n/**\n * Drag n drop widget.\n */\n\nvar DnD = /*#__PURE__*/function (_Component) {\n  function DnD(props) {\n    var _this2;\n    _classCallCheck(this, DnD);\n    _this2 = _callSuper(this, DnD, [props]);\n    _this2.state = {\n      query: null\n    };\n    return _this2;\n  }\n  _inherits(DnD, _Component);\n  return _createClass(DnD, [{\n    key: \"componentDidMount\",\n    value: function componentDidMount() {\n      var self = this;\n      var FASTA_FORMAT = /^>/;\n      $(document).ready(function () {\n        var tgtMarker = $('.dnd-overlay');\n        var dndError = function dndError(id) {\n          $('.dnd-error').hide();\n          $('#' + id + '-notification').show();\n          tgtMarker.effect('fade', 2500);\n        };\n        $(document).on('dragenter', function (evt) {\n          // Do not activate DnD if a modal is active.\n          if ($.modalActive()) return;\n\n          // Based on http://stackoverflow.com/a/8494918/1205465.\n          // Contrary to what the above link says, the snippet below can't\n          // distinguish directories from files. We handle that on drop.\n          var dt = evt.originalEvent.dataTransfer;\n          var isFile = dt.types && (dt.types.indexOf &&\n          // Chrome and Safari\n          dt.types.indexOf('Files') != -1 || dt.types.contains &&\n          // Firefox\n          dt.types.contains('application/x-moz-file'));\n          if (!isFile) {\n            return;\n          }\n          $('.dnd-error').hide();\n          tgtMarker.stop(true, true);\n          tgtMarker.show();\n          dt.effectAllowed = 'copy';\n          if (self.state.query.isEmpty()) {\n            $('.dnd-overlay-overwrite').hide();\n            $('.dnd-overlay-drop').show('drop', {\n              direction: 'down'\n            }, 'fast');\n          } else {\n            $('.dnd-overlay-drop').hide();\n            $('.dnd-overlay-overwrite').show('drop', {\n              direction: 'down'\n            }, 'fast');\n          }\n        }).on('dragleave', '.dnd-overlay', function (evt) {\n          tgtMarker.hide();\n          $('.dnd-overlay-drop').hide();\n          $('.dnd-overlay-overwrite').hide();\n        }).on('dragover', '.dnd-overlay', function (evt) {\n          evt.originalEvent.dataTransfer.dropEffect = 'copy';\n          evt.preventDefault();\n        }).on('drop', '.dnd-overlay', function (evt) {\n          evt.preventDefault();\n          evt.stopPropagation();\n          var indicator = $('#sequence-file');\n          self.state.query.focus();\n          var files = evt.originalEvent.dataTransfer.files;\n          if (files.length > 1) {\n            dndError('dnd-multi');\n            return;\n          }\n          var file = files[0];\n          if (file.size > 250 * 1048576) {\n            dndError('dnd-large-file');\n            return;\n          }\n          var reader = new FileReader();\n          reader.onload = function (e) {\n            var content = e.target.result;\n            if (FASTA_FORMAT.test(content)) {\n              indicator.text(file.name + ' ');\n              self.state.query.value(content);\n              tgtMarker.hide();\n            } else {\n              // apparently not FASTA\n              dndError('dnd-format');\n            }\n          };\n          reader.onerror = function (e) {\n            // Couldn't read. Means dropped stuff wasn't FASTA file.\n            dndError('dnd-format');\n          };\n          reader.readAsText(file);\n        });\n      });\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n        className: \"dnd-overlay absolute left-0 top-0 w-full h-full bg-gray-200 bg-opacity-75 z-40\",\n        style: {\n          display: 'none'\n        },\n        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"div\", {\n          className: \"flex flex-col space-y-4 h-full items-center justify-center dnd-overlay-container text-2xl\",\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"p\", {\n            className: \"dnd-overlay-drop flex items-center space-x-4\",\n            style: {\n              display: 'none'\n            },\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"i\", {\n              className: \"fa fa-2x fa-file\"\n            }), \"Drop query sequence file here\"]\n          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"p\", {\n            className: \"dnd-overlay-overwrite flex items-center space-x-4\",\n            style: {\n              display: 'none'\n            },\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"i\", {\n              className: \"fa fa-2x fa-file\"\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"span\", {\n              className: \"text-red-800\",\n              children: \"Overwrite\"\n            }), \"&nbps;query sequence file\"]\n          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"div\", {\n            className: \"dnd-errors text-red-800\",\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n              className: \"dnd-error row\",\n              id: \"dnd-multi-notification\",\n              style: {\n                display: 'none'\n              },\n              children: \"One file at a time please.\"\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n              className: \"dnd-error row\",\n              id: \"dnd-large-file-notification\",\n              style: {\n                display: 'none'\n              },\n              children: \"Too big a file. Can only do less than 250 MB. >_<\"\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n              className: \"dnd-error row\",\n              id: \"dnd-format-notification\",\n              style: {\n                display: 'none'\n              },\n              children: \"Only FASTA files please.\"\n            })]\n          })]\n        })\n      });\n    }\n  }]);\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\n\n//# sourceURL=webpack://SequenceServer/./public/js/dnd.js?");
 
 /***/ }),
 
@@ -60,7 +71,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   fastqToFasta: () => (/* binding */ fastqToFasta)\n/* harmony export */ });\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\nvar convertChunk = function convertChunk(fastqChunk) {\n  fastqChunk[0] = '>' + fastqChunk[0].substring(1);\n  return fastqChunk.slice(0, 2);\n};\nvar isValidFastq = function isValidFastq(fastqChunk) {\n  if (fastqChunk.length !== 4) {\n    return false;\n  }\n  return fastqChunk[0][0] === '@' && fastqChunk[2][0] === '+' && fastqChunk[1].length === fastqChunk[3].length;\n};\nvar fastqToFasta = function fastqToFasta(sequence) {\n  var trimmedSequence = sequence.trim();\n  // return unmodified if sequence does not look like fastq\n  if (!trimmedSequence.startsWith('@')) {\n    return sequence;\n  }\n  var sequenceLines = trimmedSequence.split('\\n');\n  var fastaChunks = [];\n  for (var i = 0; i < sequenceLines.length; i += 4) {\n    var fastqChunk = sequenceLines.slice(i, i + 4);\n    if (isValidFastq(fastqChunk)) {\n      fastaChunks.push.apply(fastaChunks, _toConsumableArray(convertChunk(fastqChunk)));\n    } else {\n      // return unmodified sequence if it does not look like valid fastq\n      return sequence;\n    }\n  }\n  return fastaChunks.join('\\n');\n};\n\n//# sourceURL=webpack://SequenceServer/./public/js/fastq_to_fasta.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   fastqToFasta: () => (/* binding */ fastqToFasta)\n/* harmony export */ });\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nvar convertChunk = function convertChunk(fastqChunk) {\n  fastqChunk[0] = '>' + fastqChunk[0].substring(1);\n  return fastqChunk.slice(0, 2);\n};\nvar isValidFastq = function isValidFastq(fastqChunk) {\n  if (fastqChunk.length !== 4) {\n    return false;\n  }\n  return fastqChunk[0][0] === '@' && fastqChunk[2][0] === '+' && fastqChunk[1].length === fastqChunk[3].length;\n};\nvar fastqToFasta = function fastqToFasta(sequence) {\n  var trimmedSequence = sequence.trim();\n  // return unmodified if sequence does not look like fastq\n  if (!trimmedSequence.startsWith('@')) {\n    return sequence;\n  }\n  var sequenceLines = trimmedSequence.split('\\n');\n  var fastaChunks = [];\n  for (var i = 0; i < sequenceLines.length; i += 4) {\n    var fastqChunk = sequenceLines.slice(i, i + 4);\n    if (isValidFastq(fastqChunk)) {\n      fastaChunks.push.apply(fastaChunks, _toConsumableArray(convertChunk(fastqChunk)));\n    } else {\n      // return unmodified sequence if it does not look like valid fastq\n      return sequence;\n    }\n  }\n  return fastaChunks.join('\\n');\n};\n\n//# sourceURL=webpack://SequenceServer/./public/js/fastq_to_fasta.js?");
 
 /***/ }),
 
@@ -71,7 +82,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Form: () => (/* binding */ Form)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _search_button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./search_button */ \"./public/js/search_button.js\");\n/* harmony import */ var _query__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./query */ \"./public/js/query.js\");\n/* harmony import */ var _databases_tree__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./databases_tree */ \"./public/js/databases_tree.js\");\n/* harmony import */ var _databases__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./databases */ \"./public/js/databases.js\");\n/* harmony import */ var underscore__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! underscore */ \"./node_modules/underscore/modules/index-all.js\");\n/* harmony import */ var _options__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./options */ \"./public/js/options.js\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\n\n\n\n\n\n\n\n/**\n * Search form.\n *\n * Top level component that initialises and holds all other components, and\n * facilitates communication between them.\n */\n\n\nvar Form = /*#__PURE__*/function (_Component) {\n  _inherits(Form, _Component);\n  var _super = _createSuper(Form);\n  function Form(props) {\n    var _this;\n    _classCallCheck(this, Form);\n    _this = _super.call(this, props);\n    _this.state = {\n      databases: [],\n      preDefinedOpts: {},\n      tree: {}\n    };\n    _this.useTreeWidget = _this.useTreeWidget.bind(_assertThisInitialized(_this));\n    _this.determineBlastMethod = _this.determineBlastMethod.bind(_assertThisInitialized(_this));\n    _this.handleSequenceTypeChanged = _this.handleSequenceTypeChanged.bind(_assertThisInitialized(_this));\n    _this.handleDatabaseTypeChanged = _this.handleDatabaseTypeChanged.bind(_assertThisInitialized(_this));\n    _this.handleAlgoChanged = _this.handleAlgoChanged.bind(_assertThisInitialized(_this));\n    _this.handleFormSubmission = _this.handleFormSubmission.bind(_assertThisInitialized(_this));\n    _this.formRef = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.createRef)();\n    return _this;\n  }\n  _createClass(Form, [{\n    key: \"componentDidMount\",\n    value: function componentDidMount() {\n      /**\n      * Fetch data to initialise the search interface from the server. These\n      * include list of databases to search against, advanced options to\n      * apply when an algorithm is selected, and a query sequence that\n      * the user may want to search in the databases.\n      */\n      var search = location.search.split(/\\?|&/).filter(Boolean);\n      var job_id = sessionStorage.getItem('job_id');\n      if (job_id) {\n        search.unshift(\"job_id=\".concat(job_id));\n      }\n      $.getJSON(\"searchdata.json?\".concat(search.join('&')), function (data) {\n        /* Update form state (i.e., list of databases and predefined\n         * advanced options.\n         */\n        this.setState({\n          tree: data['tree'],\n          databases: data['database'],\n          preSelectedDbs: data['preSelectedDbs'],\n          preDefinedOpts: data['options']\n        });\n\n        /* Pre-populate the form with server sent query sequences\n         * (if any).\n         */\n        if (data['query']) {\n          this.refs.query.value(data['query']);\n        }\n        setTimeout(function () {\n          $('.jstree_div').click();\n        }, 1000);\n      }.bind(this));\n\n      /* Enable submitting form on Cmd+Enter */\n      $(document).on('keydown', function (e) {\n        var $button = $('#method');\n        if (!$button.is(':disabled') && e.ctrlKey && e.key === 'Enter') {\n          $button.trigger('click');\n        }\n      });\n\n      // show overlay to create visual feedback on button click\n      $('#method').on('click', function () {\n        $('#overlay').css('display', 'block');\n      });\n    }\n  }, {\n    key: \"useTreeWidget\",\n    value: function useTreeWidget() {\n      return !underscore__WEBPACK_IMPORTED_MODULE_5__[\"default\"].isEmpty(this.state.tree);\n    }\n  }, {\n    key: \"handleFormSubmission\",\n    value: function handleFormSubmission(evt) {\n      evt.preventDefault();\n      var form = this.formRef.current;\n      var formData = new FormData(form);\n      formData.append('method', this.refs.button.state.methods[0]);\n      fetch(window.location.href, {\n        method: 'POST',\n        body: formData\n      }).then(function (res) {\n        //remove overlay when form is submitted\n        $('#overlay').css('display', 'none');\n        // redirect\n        if (res.redirected && res.url) {\n          // setTimeout is needed here as a workaround because safari doesnt allow async calling of window.open\n          // so setTimeout makes the method get called on the main thread.\n          setTimeout(function () {\n            window.open(res.url, $('#toggleNewTab').is(':checked') ? '_blank' : '_self');\n          }, 0);\n        }\n      });\n    }\n  }, {\n    key: \"determineBlastMethod\",\n    value: function determineBlastMethod() {\n      var database_type = this.databaseType;\n      var sequence_type = this.sequenceType;\n      if (this.refs.query.isEmpty()) {\n        return [];\n      }\n\n      //database type is always known\n      switch (database_type) {\n        case 'protein':\n          switch (sequence_type) {\n            case undefined:\n              return ['blastp', 'blastx'];\n            case 'protein':\n              return ['blastp'];\n            case 'nucleotide':\n              return ['blastx'];\n          }\n          break;\n        case 'nucleotide':\n          switch (sequence_type) {\n            case undefined:\n              return ['tblastn', 'blastn', 'tblastx'];\n            case 'protein':\n              return ['tblastn'];\n            case 'nucleotide':\n              return ['blastn', 'tblastx'];\n          }\n          break;\n      }\n      return [];\n    }\n  }, {\n    key: \"handleSequenceTypeChanged\",\n    value: function handleSequenceTypeChanged(type) {\n      this.sequenceType = type;\n      this.refs.button.setState({\n        hasQuery: !this.refs.query.isEmpty(),\n        hasDatabases: !!this.databaseType,\n        methods: this.determineBlastMethod()\n      });\n    }\n  }, {\n    key: \"handleDatabaseTypeChanged\",\n    value: function handleDatabaseTypeChanged(type) {\n      this.databaseType = type;\n      this.refs.button.setState({\n        hasQuery: !this.refs.query.isEmpty(),\n        hasDatabases: !!this.databaseType,\n        methods: this.determineBlastMethod()\n      });\n    }\n  }, {\n    key: \"handleAlgoChanged\",\n    value: function handleAlgoChanged(algo) {\n      if (algo in this.state.preDefinedOpts) {\n        var preDefinedOpts = this.state.preDefinedOpts[algo];\n        this.refs.opts.setState({\n          method: algo,\n          preOpts: preDefinedOpts,\n          value: (preDefinedOpts['last search'] || preDefinedOpts['default']).join(' ')\n        });\n      } else {\n        this.refs.opts.setState({\n          preOpts: {},\n          value: '',\n          method: ''\n        });\n      }\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"div\", {\n        className: \"container\",\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n          id: \"overlay\",\n          style: {\n            position: 'absolute',\n            top: 0,\n            left: 0,\n            width: '100vw',\n            height: '100vw',\n            background: 'rgba(0, 0, 0, 0.2)',\n            display: 'none',\n            zIndex: 99\n          }\n        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"div\", {\n          className: \"notifications\",\n          id: \"notifications\",\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(FastqNotification, {}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(NucleotideNotification, {}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(ProteinNotification, {}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(MixedNotification, {})]\n        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"form\", {\n          id: \"blast\",\n          ref: this.formRef,\n          onSubmit: this.handleFormSubmission,\n          className: \"form-horizontal\",\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n            className: \"form-group query-container\",\n            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_query__WEBPACK_IMPORTED_MODULE_2__.SearchQueryWidget, {\n              ref: \"query\",\n              onSequenceTypeChanged: this.handleSequenceTypeChanged\n            })\n          }), this.useTreeWidget() ? /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_databases_tree__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n            ref: \"databases\",\n            databases: this.state.databases,\n            tree: this.state.tree,\n            preSelectedDbs: this.state.preSelectedDbs,\n            onDatabaseTypeChanged: this.handleDatabaseTypeChanged\n          }) : /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_databases__WEBPACK_IMPORTED_MODULE_4__.Databases, {\n            ref: \"databases\",\n            databases: this.state.databases,\n            preSelectedDbs: this.state.preSelectedDbs,\n            onDatabaseTypeChanged: this.handleDatabaseTypeChanged\n          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"div\", {\n            className: \"form-group\",\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_options__WEBPACK_IMPORTED_MODULE_6__.Options, {\n              ref: \"opts\"\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n              className: \"col-md-2\",\n              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n                className: \"form-group\",\n                style: {\n                  'textAlign': 'center',\n                  'padding': '7px 0'\n                },\n                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"label\", {\n                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"input\", {\n                    type: \"checkbox\",\n                    id: \"toggleNewTab\"\n                  }), \" Open results in new tab\"]\n                })\n              })\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_search_button__WEBPACK_IMPORTED_MODULE_1__.SearchButton, {\n              ref: \"button\",\n              onAlgoChanged: this.handleAlgoChanged\n            })]\n          })]\n        })]\n      });\n    }\n  }]);\n  return Form;\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\nvar ProteinNotification = /*#__PURE__*/function (_Component2) {\n  _inherits(ProteinNotification, _Component2);\n  var _super2 = _createSuper(ProteinNotification);\n  function ProteinNotification() {\n    _classCallCheck(this, ProteinNotification);\n    return _super2.apply(this, arguments);\n  }\n  _createClass(ProteinNotification, [{\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n        className: \"notification row\",\n        id: \"protein-sequence-notification\",\n        style: {\n          display: 'none'\n        },\n        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n          className: \"alert-info col-md-6 col-md-offset-3\",\n          children: \"Detected: amino-acid sequence(s).\"\n        })\n      });\n    }\n  }]);\n  return ProteinNotification;\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\nvar NucleotideNotification = /*#__PURE__*/function (_Component3) {\n  _inherits(NucleotideNotification, _Component3);\n  var _super3 = _createSuper(NucleotideNotification);\n  function NucleotideNotification() {\n    _classCallCheck(this, NucleotideNotification);\n    return _super3.apply(this, arguments);\n  }\n  _createClass(NucleotideNotification, [{\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n        className: \"notification row\",\n        id: \"nucleotide-sequence-notification\",\n        style: {\n          display: 'none'\n        },\n        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n          className: \"alert-info col-md-6 col-md-offset-3\",\n          children: \"Detected: nucleotide sequence(s).\"\n        })\n      });\n    }\n  }]);\n  return NucleotideNotification;\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\nvar FastqNotification = /*#__PURE__*/function (_Component4) {\n  _inherits(FastqNotification, _Component4);\n  var _super4 = _createSuper(FastqNotification);\n  function FastqNotification() {\n    _classCallCheck(this, FastqNotification);\n    return _super4.apply(this, arguments);\n  }\n  _createClass(FastqNotification, [{\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n        className: \"notification row\",\n        id: \"fastq-sequence-notification\",\n        style: {\n          display: 'none'\n        },\n        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n          className: \"alert-info col-md-6 col-md-offset-3\",\n          children: \"Detected FASTQ and automatically converted to FASTA.\"\n        })\n      });\n    }\n  }]);\n  return FastqNotification;\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\nvar MixedNotification = /*#__PURE__*/function (_Component5) {\n  _inherits(MixedNotification, _Component5);\n  var _super5 = _createSuper(MixedNotification);\n  function MixedNotification() {\n    _classCallCheck(this, MixedNotification);\n    return _super5.apply(this, arguments);\n  }\n  _createClass(MixedNotification, [{\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n        className: \"notification row\",\n        id: \"mixed-sequence-notification\",\n        style: {\n          display: 'none'\n        },\n        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n          className: \"alert-danger col-md-10 col-md-offset-1\",\n          children: \"Error: mixed nucleotide and amino-acid sequences detected.\"\n        })\n      });\n    }\n  }]);\n  return MixedNotification;\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\n\n//# sourceURL=webpack://SequenceServer/./public/js/form.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Form: () => (/* binding */ Form)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _search_button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./search_button */ \"./public/js/search_button.js\");\n/* harmony import */ var _query__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./query */ \"./public/js/query.js\");\n/* harmony import */ var _databases_tree__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./databases_tree */ \"./public/js/databases_tree.js\");\n/* harmony import */ var _databases__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./databases */ \"./public/js/databases.js\");\n/* harmony import */ var underscore__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! underscore */ \"./node_modules/underscore/modules/index-all.js\");\n/* harmony import */ var options__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! options */ \"./public/js/null_plugins/options.js\");\n/* harmony import */ var query_stats__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! query_stats */ \"./public/js/null_plugins/query_stats.js\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _callSuper(_this, derived, args) {\n  function isNativeReflectConstruct() {\n    if (typeof Reflect === \"undefined\" || !Reflect.construct) return false;\n    if (Reflect.construct.sham) return false;\n    if (typeof Proxy === \"function\") return true;\n    try {\n      return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));\n    } catch (e) {\n      return false;\n    }\n  }\n  derived = _getPrototypeOf(derived);\n  return _possibleConstructorReturn(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], _getPrototypeOf(_this).constructor) : derived.apply(_this, args));\n}\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\n\n\n\n\n\n\n\n\n/**\n * Search form.\n *\n * Top level component that initialises and holds all other components, and\n * facilitates communication between them.\n */\n\nvar Form = /*#__PURE__*/function (_Component) {\n  function Form(props) {\n    var _this2;\n    _classCallCheck(this, Form);\n    _this2 = _callSuper(this, Form, [props]);\n    _this2.state = {\n      databases: [],\n      preSelectedDbs: [],\n      currentlySelectedDbs: [],\n      preDefinedOpts: {},\n      tree: {},\n      residuesInQuerySequence: 0,\n      blastMethod: ''\n    };\n    _this2.useTreeWidget = _this2.useTreeWidget.bind(_this2);\n    _this2.determineBlastMethods = _this2.determineBlastMethods.bind(_this2);\n    _this2.handleSequenceTypeChanged = _this2.handleSequenceTypeChanged.bind(_this2);\n    _this2.handleSequenceChanged = _this2.handleSequenceChanged.bind(_this2);\n    _this2.handleDatabaseTypeChanged = _this2.handleDatabaseTypeChanged.bind(_this2);\n    _this2.handleDatabaseSelectionChanged = _this2.handleDatabaseSelectionChanged.bind(_this2);\n    _this2.handleAlgoChanged = _this2.handleAlgoChanged.bind(_this2);\n    _this2.handleFormSubmission = _this2.handleFormSubmission.bind(_this2);\n    _this2.formRef = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.createRef)();\n    _this2.setButtonState = _this2.setButtonState.bind(_this2);\n    return _this2;\n  }\n  _inherits(Form, _Component);\n  return _createClass(Form, [{\n    key: \"componentDidMount\",\n    value: function componentDidMount() {\n      /**\n      * Fetch data to initialise the search interface from the server. These\n      * include list of databases to search against, advanced options to\n      * apply when an algorithm is selected, and a query sequence that\n      * the user may want to search in the databases.\n      */\n      var search = location.search.split(/\\?|&/).filter(Boolean);\n      var job_id = sessionStorage.getItem('job_id');\n      if (job_id) {\n        search.unshift(\"job_id=\".concat(job_id));\n      }\n      $.getJSON(\"searchdata.json?\".concat(search.join('&')), function (data) {\n        /* Update form state (i.e., list of databases and predefined\n         * advanced options.\n         */\n        this.setState({\n          tree: data['tree'],\n          databases: data['database'],\n          preSelectedDbs: data['preSelectedDbs'],\n          preDefinedOpts: data['options'],\n          blastTaskMap: data['blastTaskMap']\n        });\n\n        /* Pre-populate the form with server sent query sequences\n         * (if any).\n         */\n        if (data['query']) {\n          this.refs.query.value(data['query']);\n        }\n        setTimeout(function () {\n          $('.jstree_div').click();\n        }, 1000);\n      }.bind(this));\n\n      /* Enable submitting form on Cmd+Enter */\n      $(document).on('keydown', function (e) {\n        var $button = $('#method');\n        if (!$button.is(':disabled') && e.ctrlKey && e.key === 'Enter') {\n          $button.trigger('click');\n        }\n      });\n\n      // show overlay to create visual feedback on button click\n      $('#method').on('click', function () {\n        $('#overlay').css('display', 'block');\n      });\n    }\n  }, {\n    key: \"useTreeWidget\",\n    value: function useTreeWidget() {\n      return !underscore__WEBPACK_IMPORTED_MODULE_5__[\"default\"].isEmpty(this.state.tree);\n    }\n  }, {\n    key: \"handleFormSubmission\",\n    value: function handleFormSubmission(evt) {\n      evt.preventDefault();\n      var form = this.formRef.current;\n      var formData = new FormData(form);\n      formData.append('method', this.refs.button.state.methods[0]);\n      fetch(window.location.href, {\n        method: 'POST',\n        body: formData\n      }).then(function (res) {\n        //remove overlay when form is submitted\n        $('#overlay').css('display', 'none');\n        // redirect\n        if (res.redirected && res.url) {\n          // setTimeout is needed here as a workaround because safari doesnt allow async calling of window.open\n          // so setTimeout makes the method get called on the main thread.\n          setTimeout(function () {\n            window.open(res.url, $('#toggleNewTab').is(':checked') ? '_blank' : '_self');\n          }, 0);\n        }\n      });\n    }\n  }, {\n    key: \"determineBlastMethods\",\n    value: function determineBlastMethods() {\n      var database_type = this.databaseType;\n      var sequence_type = this.sequenceType;\n      if (this.refs.query.isEmpty()) {\n        return [];\n      }\n\n      //database type is always known\n      switch (database_type) {\n        case 'protein':\n          switch (sequence_type) {\n            case undefined:\n              return ['blastp', 'blastx'];\n            case 'protein':\n              return ['blastp'];\n            case 'nucleotide':\n              return ['blastx'];\n          }\n          break;\n        case 'nucleotide':\n          switch (sequence_type) {\n            case undefined:\n              return ['tblastn', 'blastn', 'tblastx'];\n            case 'protein':\n              return ['tblastn'];\n            case 'nucleotide':\n              return ['blastn', 'tblastx'];\n          }\n          break;\n      }\n      return [];\n    }\n  }, {\n    key: \"handleSequenceChanged\",\n    value: function handleSequenceChanged(residuesInQuerySequence) {\n      if (residuesInQuerySequence !== this.state.residuesInQuerySequence) this.setState({\n        residuesInQuerySequence: residuesInQuerySequence\n      });\n    }\n  }, {\n    key: \"handleSequenceTypeChanged\",\n    value: function handleSequenceTypeChanged(type) {\n      this.sequenceType = type;\n      this.setButtonState();\n    }\n  }, {\n    key: \"handleDatabaseTypeChanged\",\n    value: function handleDatabaseTypeChanged(type) {\n      this.databaseType = type;\n      this.setButtonState();\n    }\n  }, {\n    key: \"setButtonState\",\n    value: function setButtonState() {\n      this.refs.button.setState({\n        hasQuery: !this.refs.query.isEmpty(),\n        hasDatabases: !!this.databaseType,\n        methods: this.determineBlastMethods()\n      });\n    }\n  }, {\n    key: \"handleDatabaseSelectionChanged\",\n    value: function handleDatabaseSelectionChanged(selectedDbs) {\n      if (!underscore__WEBPACK_IMPORTED_MODULE_5__[\"default\"].isEqual(selectedDbs, this.state.currentlySelectedDbs)) this.setState({\n        currentlySelectedDbs: selectedDbs\n      });\n    }\n  }, {\n    key: \"handleAlgoChanged\",\n    value: function handleAlgoChanged(algo) {\n      if (algo in this.state.preDefinedOpts) {\n        this.setState({\n          blastMethod: algo\n        });\n      } else {\n        this.setState({\n          blastMethod: ''\n        });\n      }\n    }\n  }, {\n    key: \"residuesInSelectedDbs\",\n    value: function residuesInSelectedDbs() {\n      return this.state.currentlySelectedDbs.reduce(function (sum, db) {\n        return sum + parseInt(db.ncharacters, 10);\n      }, 0);\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsxs)(\"div\", {\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(\"div\", {\n          id: \"overlay\",\n          style: {\n            position: 'absolute',\n            top: 0,\n            left: 0,\n            width: '100vw',\n            height: '100vw',\n            background: 'rgba(0, 0, 0, 0.2)',\n            display: 'none',\n            zIndex: 99\n          }\n        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsxs)(\"div\", {\n          className: \"fixed top-0 left-0 w-full max-h-8 px-8\",\n          \"data-notifications\": true,\n          id: \"notifications\",\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(FastqNotification, {}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(NucleotideNotification, {}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(ProteinNotification, {}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(MixedNotification, {})]\n        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsxs)(\"form\", {\n          id: \"blast\",\n          ref: this.formRef,\n          onSubmit: this.handleFormSubmission,\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsxs)(\"div\", {\n            className: \"px-4\",\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(_query__WEBPACK_IMPORTED_MODULE_2__.SearchQueryWidget, {\n              ref: \"query\",\n              onSequenceTypeChanged: this.handleSequenceTypeChanged,\n              onSequenceChanged: this.handleSequenceChanged\n            }), this.useTreeWidget() ? /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(_databases_tree__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n              ref: \"databases\",\n              databases: this.state.databases,\n              tree: this.state.tree,\n              preSelectedDbs: this.state.preSelectedDbs,\n              onDatabaseTypeChanged: this.handleDatabaseTypeChanged,\n              onDatabaseSelectionChanged: this.handleDatabaseSelectionChanged\n            }) : /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(_databases__WEBPACK_IMPORTED_MODULE_4__.Databases, {\n              ref: \"databases\",\n              databases: this.state.databases,\n              preSelectedDbs: this.state.preSelectedDbs,\n              onDatabaseTypeChanged: this.handleDatabaseTypeChanged,\n              onDatabaseSelectionChanged: this.handleDatabaseSelectionChanged\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(options__WEBPACK_IMPORTED_MODULE_6__.Options, {\n              blastMethod: this.state.blastMethod,\n              predefinedOptions: this.state.preDefinedOpts[this.state.blastMethod] || {},\n              blastTasks: (this.state.blastTaskMap || {})[this.state.blastMethod]\n            })]\n          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(\"div\", {\n            className: \"py-6\"\n          }), \" \", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsxs)(\"div\", {\n            className: \"pb-4 pt-2 px-4 sticky bottom-0 md:flex flex-row md:space-x-4 items-center justify-end bg-gradient-to-t to-gray-100/90 from-white/90\",\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(query_stats__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n              residuesInQuerySequence: this.state.residuesInQuerySequence,\n              numberOfDatabasesSelected: this.state.currentlySelectedDbs.length,\n              residuesInSelectedDbs: this.residuesInSelectedDbs(),\n              currentBlastMethod: this.state.blastMethod\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsxs)(\"label\", {\n              className: \"block my-4 md:my-2\",\n              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(\"input\", {\n                type: \"checkbox\",\n                id: \"toggleNewTab\"\n              }), \" Open results in new tab\"]\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(_search_button__WEBPACK_IMPORTED_MODULE_1__.SearchButton, {\n              ref: \"button\",\n              onAlgoChanged: this.handleAlgoChanged\n            })]\n          })]\n        })]\n      });\n    }\n  }]);\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\nvar ProteinNotification = /*#__PURE__*/function (_Component2) {\n  function ProteinNotification() {\n    _classCallCheck(this, ProteinNotification);\n    return _callSuper(this, ProteinNotification, arguments);\n  }\n  _inherits(ProteinNotification, _Component2);\n  return _createClass(ProteinNotification, [{\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(\"div\", {\n        \"data-role\": \"notification\",\n        id: \"protein-sequence-notification\",\n        style: {\n          display: 'none'\n        },\n        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(\"div\", {\n          className: \"bg-blue-100 border rounded border-blue-800 px-4 py-2 my-2\",\n          children: \"Detected: amino-acid sequence(s).\"\n        })\n      });\n    }\n  }]);\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\nvar NucleotideNotification = /*#__PURE__*/function (_Component3) {\n  function NucleotideNotification() {\n    _classCallCheck(this, NucleotideNotification);\n    return _callSuper(this, NucleotideNotification, arguments);\n  }\n  _inherits(NucleotideNotification, _Component3);\n  return _createClass(NucleotideNotification, [{\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(\"div\", {\n        \"data-role\": \"notification\",\n        id: \"nucleotide-sequence-notification\",\n        style: {\n          display: 'none'\n        },\n        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(\"div\", {\n          className: \"bg-blue-100 border rounded border-blue-800 px-4 py-2 my-2\",\n          children: \"Detected: nucleotide sequence(s).\"\n        })\n      });\n    }\n  }]);\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\nvar FastqNotification = /*#__PURE__*/function (_Component4) {\n  function FastqNotification() {\n    _classCallCheck(this, FastqNotification);\n    return _callSuper(this, FastqNotification, arguments);\n  }\n  _inherits(FastqNotification, _Component4);\n  return _createClass(FastqNotification, [{\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(\"div\", {\n        \"data-role\": \"notification\",\n        id: \"fastq-sequence-notification\",\n        style: {\n          display: 'none'\n        },\n        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(\"div\", {\n          className: \"bg-blue-100 border rounded border-blue-800 px-4 py-2 my-2\",\n          children: \"Detected FASTQ and automatically converted to FASTA.\"\n        })\n      });\n    }\n  }]);\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\nvar MixedNotification = /*#__PURE__*/function (_Component5) {\n  function MixedNotification() {\n    _classCallCheck(this, MixedNotification);\n    return _callSuper(this, MixedNotification, arguments);\n  }\n  _inherits(MixedNotification, _Component5);\n  return _createClass(MixedNotification, [{\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(\"div\", {\n        \"data-role\": \"notification\",\n        id: \"mixed-sequence-notification\",\n        style: {\n          display: 'none'\n        },\n        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(\"div\", {\n          className: \"alert-danger col-md-10 col-md-offset-1\",\n          children: \"Error: mixed nucleotide and amino-acid sequences detected.\"\n        })\n      });\n    }\n  }]);\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\n\n//# sourceURL=webpack://SequenceServer/./public/js/form.js?");
 
 /***/ }),
 
@@ -82,7 +93,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (/* binding */ Grapher)\n/* harmony export */ });\n/* harmony import */ var underscore__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! underscore */ \"./node_modules/underscore/modules/index-all.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _svgExporter__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./svgExporter */ \"./public/js/svgExporter.js\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\n\n // create handlers for SVG and PNG download buttons\n\n// Each instance of Grapher is added to this object once the component has been\n// mounted. This is so that grapher can be iterated over and redrawn on window\n// resize event.\n\n\nvar Graphers = {};\n\n// Grapher is a function that takes a Graph class and returns a React component.\n// This React component provides HTML boilerplate to add heading, to make the\n// graphs collapsible, to redraw graphs when window is resized, and SVG and PNG\n// export buttons and functionality.\nfunction Grapher(Graph) {\n  return /*#__PURE__*/function (_React$Component) {\n    _inherits(_class, _React$Component);\n    var _super = _createSuper(_class);\n    function _class(props) {\n      var _this;\n      _classCallCheck(this, _class);\n      _this = _super.call(this, props);\n      _this.state = {\n        collapsed: Graph.canCollapse() && _this.props.collapsed\n      };\n      _this.svgContainerRef = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.createRef)();\n      return _this;\n    }\n    _createClass(_class, [{\n      key: \"collapseId\",\n      value: function collapseId() {\n        return Graph.collapseId(this.props);\n      }\n    }, {\n      key: \"render\",\n      value: function render() {\n        var cssClasses = Graph.className() + ' grapher';\n        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"div\", {\n          ref: \"grapher\",\n          className: cssClasses,\n          children: [this.header(), this.svgContainerJSX()]\n        });\n      }\n    }, {\n      key: \"header\",\n      value: function header() {\n        if (Graph.canCollapse()) {\n          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"div\", {\n            className: \"grapher-header\",\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"h4\", {\n              className: \"caption\",\n              \"data-toggle\": \"collapse\",\n              \"data-target\": '#' + this.collapseId(),\n              children: [this.state.collapsed ? this.plusIcon() : this.minusIcon(), \"\\xA0\", Graph.name()]\n            }), !this.state.collapsed && this.graphLinksJSX()]\n          });\n        } else {\n          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"div\", {\n            className: \"grapher-header\",\n            children: !this.state.collapsed && this.graphLinksJSX()\n          });\n        }\n      }\n    }, {\n      key: \"minusIcon\",\n      value: function minusIcon() {\n        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"i\", {\n          className: \"fa fa-minus-square-o\"\n        });\n      }\n    }, {\n      key: \"plusIcon\",\n      value: function plusIcon() {\n        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"i\", {\n          className: \"fa fa-plus-square-o\"\n        });\n      }\n    }, {\n      key: \"graphLinksJSX\",\n      value: function graphLinksJSX() {\n        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"div\", {\n          className: \"hit-links graph-links\",\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"a\", {\n            href: \"#\",\n            className: \"btn-link export-to-svg\",\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"i\", {\n              className: \"fa fa-download\"\n            }), \" SVG\"]\n          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"span\", {\n            className: \"line\",\n            children: \"|\"\n          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"a\", {\n            href: \"#\",\n            className: \"btn-link export-to-png\",\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"i\", {\n              className: \"fa fa-download\"\n            }), \" PNG\"]\n          })]\n        });\n      }\n    }, {\n      key: \"svgContainerJSX\",\n      value: function svgContainerJSX() {\n        var cssClasses = Graph.className() + ' svg-container collapse';\n        if (!this.state.collapsed) cssClasses += ' in';\n        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"div\", {\n          ref: this.svgContainerRef,\n          id: this.collapseId(),\n          className: cssClasses\n        });\n      }\n    }, {\n      key: \"componentDidMount\",\n      value: function componentDidMount() {\n        Graphers[this.collapseId()] = this;\n\n        // Draw visualisation for the first time. Visualisations are\n        // redrawn when browser window is resized.\n        this.draw();\n      }\n    }, {\n      key: \"componentDidUpdate\",\n      value: function componentDidUpdate() {\n        // Re-draw visualisation when the component change state.\n        this.draw();\n      }\n    }, {\n      key: \"svgContainer\",\n      value: function svgContainer() {\n        return $(this.svgContainerRef.current);\n      }\n    }, {\n      key: \"draw\",\n      value: function draw() {\n        // Clean slate.\n        this.svgContainer().empty();\n        this.graph = null;\n\n        // Draw if uncollapsed.\n        if (this.state.collapsed) {\n          return;\n        }\n        this.graph = new Graph(this.svgContainer(), this.props);\n        this.svgContainer().find('svg').attr('data-name', Graph.dataName(this.props));\n      }\n    }]);\n    return _class;\n  }((react__WEBPACK_IMPORTED_MODULE_1___default().Component));\n}\n\n// Redraw if window resized.\n$(window).resize(underscore__WEBPACK_IMPORTED_MODULE_0__[\"default\"].debounce(function () {\n  underscore__WEBPACK_IMPORTED_MODULE_0__[\"default\"].each(Graphers, function (grapher) {\n    grapher.draw();\n  });\n}, 125));\n\n// Swap-icon and toggle .graph-links on collapse.\n$('body').on('hidden.bs.collapse', '.collapse', function () {\n  var component = Graphers[$(this).attr('id')];\n  if (component) {\n    component.setState({\n      collapsed: true\n    });\n  }\n});\n$('body').on('shown.bs.collapse', '.collapse', function () {\n  var component = Graphers[$(this).attr('id')];\n  if (component) {\n    component.setState({\n      collapsed: false\n    });\n  }\n});\n\n//# sourceURL=webpack://SequenceServer/./public/js/grapher.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (/* binding */ Grapher)\n/* harmony export */ });\n/* harmony import */ var underscore__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! underscore */ \"./node_modules/underscore/modules/index-all.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _svgExporter__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./svgExporter */ \"./public/js/svgExporter.js\");\n/* harmony import */ var _collapse_preferences__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./collapse_preferences */ \"./public/js/collapse_preferences.js\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _callSuper(_this, derived, args) {\n  function isNativeReflectConstruct() {\n    if (typeof Reflect === \"undefined\" || !Reflect.construct) return false;\n    if (Reflect.construct.sham) return false;\n    if (typeof Proxy === \"function\") return true;\n    try {\n      return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));\n    } catch (e) {\n      return false;\n    }\n  }\n  derived = _getPrototypeOf(derived);\n  return _possibleConstructorReturn(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], _getPrototypeOf(_this).constructor) : derived.apply(_this, args));\n}\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\n\n // create handlers for SVG and PNG download buttons\n\n\n// Each instance of Grapher is added to this object once the component has been\n// mounted. This is so that grapher can be iterated over and redrawn on window\n// resize event.\n\nvar Graphers = {};\n\n// Grapher is a function that takes a Graph class and returns a React component.\n// This React component provides HTML boilerplate to add heading, to make the\n// graphs collapsible, to redraw graphs when window is resized, and SVG and PNG\n// export buttons and functionality.\nfunction Grapher(Graph) {\n  return /*#__PURE__*/function (_React$Component) {\n    function _class(props) {\n      var _this2;\n      _classCallCheck(this, _class);\n      _this2 = _callSuper(this, _class, [props]);\n      _this2.name = Graph.name();\n      _this2.collapsePreferences = new _collapse_preferences__WEBPACK_IMPORTED_MODULE_3__[\"default\"](_this2);\n      var isCollapsed = _this2.collapsePreferences.preferenceStoredAsCollapsed();\n      _this2.state = {\n        collapsed: Graph.canCollapse() && (_this2.props.collapsed || isCollapsed)\n      };\n      _this2.svgContainerRef = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.createRef)();\n      return _this2;\n    }\n    _inherits(_class, _React$Component);\n    return _createClass(_class, [{\n      key: \"graphId\",\n      value: function graphId() {\n        return Graph.graphId(this.props);\n      }\n    }, {\n      key: \"render\",\n      value: function render() {\n        // Do not render when Graph.name() is null\n        if (Graph.name() === null) {\n          return null;\n        } else {\n          var cssClasses = Graph.className() + ' grapher';\n          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(\"div\", {\n            ref: \"grapher\",\n            className: cssClasses,\n            children: [this.header(), this.svgContainerJSX()]\n          });\n        }\n      }\n    }, {\n      key: \"header\",\n      value: function header() {\n        var _this3 = this;\n        if (Graph.canCollapse()) {\n          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(\"div\", {\n            className: \"grapher-header\",\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(\"h4\", {\n              className: \"caption\",\n              onClick: function onClick() {\n                return _this3.collapsePreferences.toggleCollapse();\n              },\n              children: [this.collapsePreferences.renderCollapseIcon(), \"\\xA0\", Graph.name()]\n            }), !this.state.collapsed && this.graphLinksJSX()]\n          });\n        } else {\n          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"div\", {\n            className: \"grapher-header\",\n            children: !this.state.collapsed && this.graphLinksJSX()\n          });\n        }\n      }\n    }, {\n      key: \"graphLinksJSX\",\n      value: function graphLinksJSX() {\n        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(\"div\", {\n          className: \"hit-links graph-links\",\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(\"a\", {\n            href: \"#\",\n            className: \"btn-link export-to-svg\",\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"i\", {\n              className: \"fa fa-download\"\n            }), \" SVG\"]\n          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"span\", {\n            className: \"line\",\n            children: \"|\"\n          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(\"a\", {\n            href: \"#\",\n            className: \"btn-link export-to-png\",\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"i\", {\n              className: \"fa fa-download\"\n            }), \" PNG\"]\n          })]\n        });\n      }\n    }, {\n      key: \"svgContainerJSX\",\n      value: function svgContainerJSX() {\n        var cssClasses = Graph.className() + ' svg-container collapse';\n        if (!this.state.collapsed) cssClasses += ' in';\n        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(\"div\", {\n          ref: this.svgContainerRef,\n          id: this.graphId(),\n          className: cssClasses\n        });\n      }\n    }, {\n      key: \"componentDidMount\",\n      value: function componentDidMount() {\n        Graphers[this.graphId()] = this;\n\n        // Draw visualisation for the first time. Visualisations are\n        // redrawn when browser window is resized.\n        this.draw();\n      }\n    }, {\n      key: \"componentDidUpdate\",\n      value: function componentDidUpdate() {\n        // Re-draw visualisation when the component change state.\n        this.draw();\n      }\n    }, {\n      key: \"svgContainer\",\n      value: function svgContainer() {\n        return $(this.svgContainerRef.current);\n      }\n    }, {\n      key: \"draw\",\n      value: function draw() {\n        // Clean slate.\n        this.svgContainer().empty();\n        this.graph = null;\n\n        // Draw if uncollapsed.\n        if (this.state.collapsed) {\n          return;\n        }\n        this.graph = new Graph(this.svgContainer(), this.props);\n        this.svgContainer().find('svg').attr('data-name', Graph.dataName(this.props));\n      }\n    }]);\n  }((react__WEBPACK_IMPORTED_MODULE_1___default().Component));\n}\n\n// Redraw if window resized.\n$(window).resize(underscore__WEBPACK_IMPORTED_MODULE_0__[\"default\"].debounce(function () {\n  underscore__WEBPACK_IMPORTED_MODULE_0__[\"default\"].each(Graphers, function (grapher) {\n    grapher.draw();\n  });\n}, 125));\n\n//# sourceURL=webpack://SequenceServer/./public/js/grapher.js?");
 
 /***/ }),
 
@@ -93,7 +104,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var d3__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! d3 */ \"./node_modules/d3/d3.js\");\n/* harmony import */ var d3__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(d3__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var underscore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! underscore */ \"./node_modules/underscore/modules/index-all.js\");\n/* harmony import */ var _grapher__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./grapher */ \"./public/js/grapher.js\");\n/* harmony import */ var _visualisation_helpers__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./visualisation_helpers */ \"./public/js/visualisation_helpers.js\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./utils */ \"./public/js/utils.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\n\n\n\n\n\nvar Graph = /*#__PURE__*/function () {\n  function Graph($svgContainer, props) {\n    _classCallCheck(this, Graph);\n    this.svg_container = $svgContainer;\n    var $queryDiv = $svgContainer.parents('.resultn');\n    var hits = this.extractData(props.query.hits, props.query.number);\n    this.graphIt($queryDiv, $svgContainer, 0, 20, null, hits);\n  }\n  _createClass(Graph, [{\n    key: \"extractData\",\n    value: function extractData(query_hits, number) {\n      var hits = [];\n      query_hits.map(function (hit) {\n        var _hsps = [];\n        var hsps = hit.hsps;\n        underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].each(hsps, function (hsp) {\n          var _hsp = {};\n          _hsp.hspEvalue = hsp.evalue;\n          _hsp.hspStart = hsp.qstart;\n          _hsp.hspEnd = hsp.qend;\n          _hsp.hspFrame = hsp.sframe;\n          _hsp.hspId = 'Query_' + number + '_hit_' + hit.number + '_hsp_' + hsp.number;\n          _hsp.hspIdentity = hsp.identity;\n          _hsp.hspGaps = hsp.gaps;\n          _hsp.hspPositives = hsp.positives;\n          _hsp.hspLength = hsp.length;\n          _hsps.push(_hsp);\n        });\n        _hsps.hitId = hit.id;\n        _hsps.hitDef = 'Query_' + number + '_hit_' + hit.number;\n        _hsps.hitEvalue = hit.hsps[0].evalue;\n        hits.push(_hsps);\n      });\n      return hits;\n    }\n  }, {\n    key: \"setupTooltip\",\n    value: function setupTooltip() {\n      this.svg_container.find('[data-toggle=\"tooltip\"]').tooltip({\n        'placement': 'top',\n        'container': 'body',\n        'html': 'true',\n        'delay': 0,\n        'white-space': 'nowrap'\n      });\n    }\n  }, {\n    key: \"setupClick\",\n    value: function setupClick($graphDiv) {\n      $('a', $graphDiv).click(function (evt) {\n        evt.preventDefault();\n        evt.stopPropagation();\n        window.location.hash = $(this).attr('href');\n      });\n    }\n  }, {\n    key: \"graphControls\",\n    value: function graphControls($queryDiv, $graphDiv, isInit, opts, hits) {\n      var MIN_HITS_TO_SHOW = 20;\n      var totalHits, shownHits, lessButton, moreButton;\n      var countHits = function countHits() {\n        totalHits = hits.length;\n        shownHits = $queryDiv.find('.ghit > g').length;\n      };\n      var setupButtons = function setupButtons($queryDiv, $graphDiv) {\n        $graphDiv.append($('<button/>').addClass('btn btn-link more').attr('type', 'button').attr('data-parent-query', $queryDiv.attr('id')).html('View More&nbsp;').append($('<i/>').html('&nbsp;&nbsp;').addClass('fa fa-angle-double-down')), $('<button/>').addClass('btn btn-link less').attr('type', 'button').attr('data-parent-query', $queryDiv.attr('id')).html('View Less&nbsp;').append($('<i/>').html('&nbsp;&nbsp;').addClass('fa fa-angle-double-up')));\n        lessButton = $('.less', $graphDiv);\n        moreButton = $('.more', $graphDiv);\n      };\n      var initButtons = function initButtons() {\n        countHits();\n        if (totalHits === MIN_HITS_TO_SHOW || shownHits < MIN_HITS_TO_SHOW) {\n          lessButton.hide();\n          moreButton.hide();\n        } else if (shownHits === totalHits) {\n          moreButton.hide();\n          lessButton.show();\n        } else if (shownHits === MIN_HITS_TO_SHOW) {\n          lessButton.hide();\n          moreButton.show();\n        } else {\n          lessButton.show();\n          moreButton.show();\n        }\n      };\n\n      // Setup view buttons' state properly if called for first time.\n      if (isInit === true) {\n        setupButtons($queryDiv, $graphDiv);\n        initButtons();\n      }\n      moreButton.on('click', underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function (e) {\n        countHits();\n        this.graphIt($queryDiv, $graphDiv, shownHits, MIN_HITS_TO_SHOW, opts, hits);\n        initButtons();\n        this.setupTooltip();\n        e.stopPropagation();\n      }, this));\n      lessButton.on('click', underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function (e) {\n        countHits();\n        var diff = shownHits - MIN_HITS_TO_SHOW;\n\n        // Decrease number of shown hits by defined constant.\n        if (diff >= MIN_HITS_TO_SHOW) {\n          this.graphIt($queryDiv, $graphDiv, shownHits, -MIN_HITS_TO_SHOW, opts, hits);\n          initButtons();\n        } else if (diff !== 0) {\n          // Ensure a certain number of hits always stay in graph.\n          this.graphIt($queryDiv, $graphDiv, shownHits, MIN_HITS_TO_SHOW - shownHits, opts, hits);\n          initButtons();\n        }\n        this.setupTooltip();\n        e.stopPropagation();\n      }, this));\n    }\n  }, {\n    key: \"drawLegend\",\n    value: function drawLegend(svg, options, width, height, hits) {\n      var svg_legend = svg.append('g').attr('transform', 'translate(0,' + (height - 1.75 * options.margin) + ')');\n      svg_legend.append('rect').attr('x', 7.5 * (width - 2 * options.margin) / 10).attr('width', 2 * (width - 4 * options.margin) / 10).attr('height', options.legend).attr('fill', 'url(#legend-grad)');\n      svg_legend.append('text').attr('class', ' legend-text').attr('transform', 'translate(0, ' + options.legend + ')').attr('x', 9.5 * (width - 2 * options.margin) / 10 + options.margin / 2).text('Weaker hits');\n      // .text(function() {\n      //   return Helpers.prettify_evalue(hits[hits.length-1].hitEvalue);\n      // })\n\n      svg_legend.append('text').attr('class', ' legend-text').attr('transform', 'translate(0, ' + options.legend + ')').attr('x', 6.7 * (width - 2 * options.margin) / 10 - options.margin / 2).text('Stronger hits');\n      // .text(function () {\n      //   return Helpers.prettify_evalue(hits[0].hitEvalue);\n      // })\n\n      svg.append('linearGradient').attr('id', 'legend-grad').selectAll('stop').data([{\n        offset: '0%',\n        color: '#000'\n      }, {\n        offset: '45%',\n        color: '#c74f14'\n      }, {\n        offset: '100%',\n        color: '#f6bea2'\n      }]).enter().append('stop').attr('offset', function (d) {\n        return d.offset;\n      }).attr('stop-color', function (d) {\n        return d.color;\n      });\n    }\n  }, {\n    key: \"graphIt\",\n    value: function graphIt($queryDiv, $graphDiv, index, howMany, opts, inhits) {\n      /* barHeight: Height of each hit track.\n       * legend: Height reserved for the overview legend.\n       * margin: Margin around the svg element.\n       */\n      var defaults = {\n          barHeight: 4,\n          legend: inhits.length > 1 ? 3 : 0,\n          margin: 20\n        },\n        options = $.extend(defaults, opts);\n      var hits = inhits.slice(0, index + howMany);\n\n      // Don't draw anything when no hits are obtained.\n      if (hits.length < 1) return false;\n      if (index !== 0) {\n        // Currently, we have no good way to extend pre-existing graph\n        // and hence, are removing the old one and redrawing.\n        $graphDiv.find('svg').remove();\n      }\n      var queryLen = $queryDiv.data().queryLen;\n      var q_i = $queryDiv.attr('id');\n      var width = $graphDiv.width();\n      var height = hits.length * options.barHeight + 2 * options.legend + 4 * options.margin;\n\n      // var height = $graphDiv.height();\n\n      var SEQ_TYPES = {\n        blastn: 'nucleic_acid',\n        blastp: 'amino_acid',\n        blastx: 'nucleic_acid',\n        tblastx: 'nucleic_acid',\n        tblastn: 'amino_acid'\n      };\n      var svg = d3__WEBPACK_IMPORTED_MODULE_0___default().select($graphDiv[0]).selectAll('svg').data([hits]).enter().insert('svg', ':first-child').attr('width', width).attr('height', height).append('g').attr('transform', 'translate(' + options.margin / 2 + ', ' + 1.5 * options.margin + ')');\n      var x = d3__WEBPACK_IMPORTED_MODULE_0___default().scale.linear().range([0, width - options.margin]);\n      x.domain([1, queryLen]);\n      var algorithm = $queryDiv.data().algorithm;\n      var formatter = _visualisation_helpers__WEBPACK_IMPORTED_MODULE_3__.tick_formatter(x, SEQ_TYPES[algorithm]);\n      var _tValues = x.ticks(11);\n      _tValues.pop();\n      var xAxis = d3__WEBPACK_IMPORTED_MODULE_0___default().svg.axis().scale(x).orient('top').tickValues(_tValues.concat([1, queryLen])).tickFormat(formatter);\n\n      // Attach the axis to DOM (<svg> element)\n      var container = svg.append('g').attr('transform', 'translate(0, ' + options.margin + ')').append('g').attr('class', 'x axis').call(xAxis);\n\n      // Vertical alignment of ticks\n      container.selectAll('text').attr('x', '25px').attr('y', '2px').attr('transform', 'rotate(-90)');\n      var y = d3__WEBPACK_IMPORTED_MODULE_0___default().scale.ordinal().rangeBands([0, height - 3 * options.margin - 2 * options.legend], 0.3);\n      y.domain(hits.map(function (d) {\n        return d.hitId;\n      }));\n      var gradScale = d3__WEBPACK_IMPORTED_MODULE_0___default().scale.log().domain([d3__WEBPACK_IMPORTED_MODULE_0___default().min([1e-5, d3__WEBPACK_IMPORTED_MODULE_0___default().min(hits.map(function (d) {\n        if (parseFloat(d.hitEvalue) === 0.0) return undefined;\n        return d.hitEvalue;\n      }))]), d3__WEBPACK_IMPORTED_MODULE_0___default().max(hits.map(function (d) {\n        return d.hitEvalue;\n      }))]).range([0, 0.8]);\n      svg.append('g').attr('class', 'ghit').attr('transform', 'translate(0, ' + 1.65 * (options.margin - options.legend) + ')').selectAll('.hits').data(hits).enter().append('g').each(function (d, i) {\n        // TODO: Avoid too many variables and improve naming.\n\n        d3__WEBPACK_IMPORTED_MODULE_0___default().select(this).selectAll('.hsp').data(d).enter().append('a').each(function (v, j) {\n          // Drawing the HSPs connector line using the same\n          // color as that of the hit track (using lookahead).\n          var yHspline = y(d.hitId) + options.barHeight / 2;\n          var hsplineColor = d3__WEBPACK_IMPORTED_MODULE_0___default().hsl(20, 0.82, gradScale(v.hspEvalue));\n          if (j + 1 < d.length) {\n            if (d[j].hspEnd <= d[j + 1].hspStart) {\n              d3__WEBPACK_IMPORTED_MODULE_0___default().select(this.parentNode).append('line').attr('x1', x(d[j].hspEnd)).attr('y1', yHspline).attr('x2', x(d[j + 1].hspStart)).attr('y2', yHspline).attr('stroke', hsplineColor);\n            } else if (d[j].hspStart > d[j + 1].hspEnd) {\n              d3__WEBPACK_IMPORTED_MODULE_0___default().select(this.parentNode).append('line').attr('x1', x(d[j + 1].hspEnd)).attr('y1', yHspline).attr('x2', x(d[j].hspStart)).attr('y2', yHspline).attr('stroke', hsplineColor);\n            }\n          }\n          var alt_tooltip = d.hitId + '<br>E value: ' + _visualisation_helpers__WEBPACK_IMPORTED_MODULE_3__.prettify_evalue(v.hspEvalue) + \"<br>Identities: \".concat(_utils__WEBPACK_IMPORTED_MODULE_4__[\"default\"].inPercentage(v.hspIdentity, v.hspLength));\n          // if chosen algorithm was blastn, the tooltip won't show the Positives% value in the tooltip\n          if (algorithm != 'blastn') {\n            alt_tooltip += \"<br>Positives: \".concat(_utils__WEBPACK_IMPORTED_MODULE_4__[\"default\"].inPercentage(v.hspPositives, v.hspLength));\n          }\n          alt_tooltip += \", Gaps: \".concat(_utils__WEBPACK_IMPORTED_MODULE_4__[\"default\"].inPercentage(v.hspGaps, v.hspLength));\n\n          // Draw the rectangular hit tracks itself.\n          d3__WEBPACK_IMPORTED_MODULE_0___default().select(this).attr('xlink:href', '#' + q_i + '_hit_' + (i + 1)).append('rect').attr('data-toggle', 'tooltip').attr('title', alt_tooltip).attr('class', 'bar').attr('x', function (d) {\n            return x(d.hspStart);\n          }).attr('y', y(d.hitId)).attr('width', function (d) {\n            return x(d.hspEnd - d.hspStart + 1);\n          }).attr('height', options.barHeight).attr('fill', d3__WEBPACK_IMPORTED_MODULE_0___default().rgb(hsplineColor));\n        });\n      });\n\n      // Draw legend only when more than one hit present\n      if (hits.length > 1) {\n        this.drawLegend(svg, options, width, height, inhits);\n      }\n      // Bind listener events once all the graphical elements have\n      // been drawn for first time.\n      if (index === 0) {\n        this.graphControls($queryDiv, $graphDiv, true, opts, inhits);\n      }\n      // Refresh tooltip each time graph is redrawn.\n      this.setupTooltip();\n      // Ensure clicking on 'rect' takes user to the relevant hit on all\n      // browsers.\n      this.setupClick($graphDiv);\n    }\n  }], [{\n    key: \"canCollapse\",\n    value: function canCollapse() {\n      return true;\n    }\n  }, {\n    key: \"name\",\n    value: function name() {\n      return 'Graphical overview of aligning hit sequences to the query';\n    }\n  }, {\n    key: \"className\",\n    value: function className() {\n      return 'alignment-overview';\n    }\n  }, {\n    key: \"collapseId\",\n    value: function collapseId(props) {\n      return 'alignment_' + props.query.number;\n    }\n  }, {\n    key: \"dataName\",\n    value: function dataName(props) {\n      return 'Alignment-Overview-' + props.query.id;\n    }\n  }]);\n  return Graph;\n}();\nvar HitsOverview = (0,_grapher__WEBPACK_IMPORTED_MODULE_2__[\"default\"])(Graph);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (HitsOverview);\n\n//# sourceURL=webpack://SequenceServer/./public/js/hits_overview.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var d3__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! d3 */ \"./node_modules/d3/d3.js\");\n/* harmony import */ var d3__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(d3__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var underscore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! underscore */ \"./node_modules/underscore/modules/index-all.js\");\n/* harmony import */ var grapher__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! grapher */ \"./public/js/grapher.js\");\n/* harmony import */ var _visualisation_helpers__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./visualisation_helpers */ \"./public/js/visualisation_helpers.js\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./utils */ \"./public/js/utils.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\n\n\n\n\n\nvar Graph = /*#__PURE__*/function () {\n  function Graph($svgContainer, props) {\n    _classCallCheck(this, Graph);\n    this.svg_container = $svgContainer;\n    var $queryDiv = $svgContainer.parents('.resultn');\n    var hits = this.extractData(props.query.hits, props.query.number);\n    this.graphIt($queryDiv, $svgContainer, 0, 20, null, hits);\n  }\n  return _createClass(Graph, [{\n    key: \"extractData\",\n    value: function extractData(query_hits, number) {\n      var hits = [];\n      query_hits.map(function (hit) {\n        var _hsps = [];\n        var hsps = hit.hsps;\n        underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].each(hsps, function (hsp) {\n          var _hsp = {};\n          _hsp.hspEvalue = hsp.evalue;\n          _hsp.hspStart = hsp.qstart;\n          _hsp.hspEnd = hsp.qend;\n          _hsp.hspFrame = hsp.sframe;\n          _hsp.hspId = 'Query_' + number + '_hit_' + hit.number + '_hsp_' + hsp.number;\n          _hsp.hspIdentity = hsp.identity;\n          _hsp.hspGaps = hsp.gaps;\n          _hsp.hspPositives = hsp.positives;\n          _hsp.hspLength = hsp.length;\n          _hsps.push(_hsp);\n        });\n        _hsps.hitId = hit.id;\n        _hsps.hitDef = 'Query_' + number + '_hit_' + hit.number;\n        _hsps.hitEvalue = hit.hsps[0].evalue;\n        hits.push(_hsps);\n      });\n      return hits;\n    }\n  }, {\n    key: \"setupTooltip\",\n    value: function setupTooltip() {\n      this.svg_container.find('[data-toggle=\"tooltip\"]').tooltip({\n        'placement': 'top',\n        'container': 'body',\n        'html': 'true',\n        'delay': 0,\n        'white-space': 'nowrap'\n      });\n    }\n  }, {\n    key: \"setupClick\",\n    value: function setupClick($graphDiv) {\n      $('a', $graphDiv).click(function (evt) {\n        evt.preventDefault();\n        evt.stopPropagation();\n        window.location.hash = $(this).attr('href');\n      });\n    }\n  }, {\n    key: \"graphControls\",\n    value: function graphControls($queryDiv, $graphDiv, isInit, opts, hits) {\n      var MIN_HITS_TO_SHOW = 20;\n      var totalHits, shownHits, lessButton, moreButton;\n      var countHits = function countHits() {\n        totalHits = hits.length;\n        shownHits = $queryDiv.find('.ghit > g').length;\n      };\n      var setupButtons = function setupButtons($queryDiv, $graphDiv) {\n        $graphDiv.append($('<button/>').addClass('btn btn-link more').attr('type', 'button').attr('data-parent-query', $queryDiv.attr('id')).html('View More&nbsp;').append($('<i/>').html('&nbsp;&nbsp;').addClass('fa fa-angle-double-down')), $('<button/>').addClass('btn btn-link less').attr('type', 'button').attr('data-parent-query', $queryDiv.attr('id')).html('View Less&nbsp;').append($('<i/>').html('&nbsp;&nbsp;').addClass('fa fa-angle-double-up')));\n        lessButton = $('.less', $graphDiv);\n        moreButton = $('.more', $graphDiv);\n      };\n      var initButtons = function initButtons() {\n        countHits();\n        if (totalHits === MIN_HITS_TO_SHOW || shownHits < MIN_HITS_TO_SHOW) {\n          lessButton.hide();\n          moreButton.hide();\n        } else if (shownHits === totalHits) {\n          moreButton.hide();\n          lessButton.show();\n        } else if (shownHits === MIN_HITS_TO_SHOW) {\n          lessButton.hide();\n          moreButton.show();\n        } else {\n          lessButton.show();\n          moreButton.show();\n        }\n      };\n\n      // Setup view buttons' state properly if called for first time.\n      if (isInit === true) {\n        setupButtons($queryDiv, $graphDiv);\n        initButtons();\n      }\n      moreButton.on('click', underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function (e) {\n        countHits();\n        this.graphIt($queryDiv, $graphDiv, shownHits, MIN_HITS_TO_SHOW, opts, hits);\n        initButtons();\n        this.setupTooltip();\n        e.stopPropagation();\n      }, this));\n      lessButton.on('click', underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function (e) {\n        countHits();\n        var diff = shownHits - MIN_HITS_TO_SHOW;\n\n        // Decrease number of shown hits by defined constant.\n        if (diff >= MIN_HITS_TO_SHOW) {\n          this.graphIt($queryDiv, $graphDiv, shownHits, -MIN_HITS_TO_SHOW, opts, hits);\n          initButtons();\n        } else if (diff !== 0) {\n          // Ensure a certain number of hits always stay in graph.\n          this.graphIt($queryDiv, $graphDiv, shownHits, MIN_HITS_TO_SHOW - shownHits, opts, hits);\n          initButtons();\n        }\n        this.setupTooltip();\n        e.stopPropagation();\n      }, this));\n    }\n  }, {\n    key: \"drawLegend\",\n    value: function drawLegend(svg, options, width, height, hits) {\n      var svg_legend = svg.append('g').attr('transform', 'translate(0,' + (height - 1.75 * options.margin) + ')');\n      svg_legend.append('rect').attr('x', 7.5 * (width - 2 * options.margin) / 10).attr('width', 2 * (width - 4 * options.margin) / 10).attr('height', options.legend).attr('fill', 'url(#legend-grad)');\n      svg_legend.append('text').attr('class', ' legend-text').attr('transform', 'translate(0, ' + options.legend + ')').attr('x', 9.5 * (width - 2 * options.margin) / 10 + options.margin / 2).text('Weaker hits');\n      // .text(function() {\n      //   return Helpers.prettify_evalue(hits[hits.length-1].hitEvalue);\n      // })\n\n      svg_legend.append('text').attr('class', ' legend-text').attr('transform', 'translate(0, ' + options.legend + ')').attr('x', 6.7 * (width - 2 * options.margin) / 10 - options.margin / 2).text('Stronger hits');\n      // .text(function () {\n      //   return Helpers.prettify_evalue(hits[0].hitEvalue);\n      // })\n\n      svg.append('linearGradient').attr('id', 'legend-grad').selectAll('stop').data([{\n        offset: '0%',\n        color: '#000'\n      }, {\n        offset: '45%',\n        color: '#c74f14'\n      }, {\n        offset: '100%',\n        color: '#f6bea2'\n      }]).enter().append('stop').attr('offset', function (d) {\n        return d.offset;\n      }).attr('stop-color', function (d) {\n        return d.color;\n      });\n    }\n  }, {\n    key: \"graphIt\",\n    value: function graphIt($queryDiv, $graphDiv, index, howMany, opts, inhits) {\n      /* barHeight: Height of each hit track.\n       * legend: Height reserved for the overview legend.\n       * margin: Margin around the svg element.\n       */\n      var defaults = {\n          barHeight: 4,\n          legend: inhits.length > 1 ? 3 : 0,\n          margin: 20\n        },\n        options = $.extend(defaults, opts);\n      var hits = inhits.slice(0, index + howMany);\n\n      // Don't draw anything when no hits are obtained.\n      if (hits.length < 1) return false;\n      if (index !== 0) {\n        // Currently, we have no good way to extend pre-existing graph\n        // and hence, are removing the old one and redrawing.\n        $graphDiv.find('svg').remove();\n      }\n      var queryLen = $queryDiv.data().queryLen;\n      var q_i = $queryDiv.attr('id');\n      var width = $graphDiv.width();\n      var height = hits.length * options.barHeight + 2 * options.legend + 4 * options.margin;\n\n      // var height = $graphDiv.height();\n\n      var SEQ_TYPES = {\n        blastn: 'nucleic_acid',\n        blastp: 'amino_acid',\n        blastx: 'nucleic_acid',\n        tblastx: 'nucleic_acid',\n        tblastn: 'amino_acid'\n      };\n      var svg = d3__WEBPACK_IMPORTED_MODULE_0___default().select($graphDiv[0]).selectAll('svg').data([hits]).enter().insert('svg', ':first-child').attr('width', width).attr('height', height).append('g').attr('transform', 'translate(' + options.margin / 2 + ', ' + 1.5 * options.margin + ')');\n      var x = d3__WEBPACK_IMPORTED_MODULE_0___default().scale.linear().range([0, width - options.margin]);\n      x.domain([1, queryLen]);\n      var algorithm = $queryDiv.data().algorithm;\n      var formatter = _visualisation_helpers__WEBPACK_IMPORTED_MODULE_3__.tick_formatter(x, SEQ_TYPES[algorithm]);\n      var _tValues = x.ticks(11);\n      _tValues.pop();\n      var xAxis = d3__WEBPACK_IMPORTED_MODULE_0___default().svg.axis().scale(x).orient('top').tickValues(_tValues.concat([1, queryLen])).tickFormat(formatter);\n\n      // Attach the axis to DOM (<svg> element)\n      var container = svg.append('g').attr('transform', 'translate(0, ' + options.margin + ')').append('g').attr('class', 'x axis').call(xAxis);\n\n      // Vertical alignment of ticks\n      container.selectAll('text').attr('x', '25px').attr('y', '2px').attr('transform', 'rotate(-90)');\n      var y = d3__WEBPACK_IMPORTED_MODULE_0___default().scale.ordinal().rangeBands([0, height - 3 * options.margin - 2 * options.legend], 0.3);\n      y.domain(hits.map(function (d) {\n        return d.hitId;\n      }));\n      var gradScale = d3__WEBPACK_IMPORTED_MODULE_0___default().scale.log().domain([d3__WEBPACK_IMPORTED_MODULE_0___default().min([1e-5, d3__WEBPACK_IMPORTED_MODULE_0___default().min(hits.map(function (d) {\n        if (parseFloat(d.hitEvalue) === 0.0) return undefined;\n        return d.hitEvalue;\n      }))]), d3__WEBPACK_IMPORTED_MODULE_0___default().max(hits.map(function (d) {\n        return d.hitEvalue;\n      }))]).range([0, 0.8]);\n      svg.append('g').attr('class', 'ghit').attr('transform', 'translate(0, ' + 1.65 * (options.margin - options.legend) + ')').selectAll('.hits').data(hits).enter().append('g').each(function (d, i) {\n        // TODO: Avoid too many variables and improve naming.\n\n        d3__WEBPACK_IMPORTED_MODULE_0___default().select(this).selectAll('.hsp').data(d).enter().append('a').each(function (v, j) {\n          // Drawing the HSPs connector line using the same\n          // color as that of the hit track (using lookahead).\n          var yHspline = y(d.hitId) + options.barHeight / 2;\n          var hsplineColor = d3__WEBPACK_IMPORTED_MODULE_0___default().hsl(20, 0.82, gradScale(v.hspEvalue));\n          if (j + 1 < d.length) {\n            if (d[j].hspEnd <= d[j + 1].hspStart) {\n              d3__WEBPACK_IMPORTED_MODULE_0___default().select(this.parentNode).append('line').attr('x1', x(d[j].hspEnd)).attr('y1', yHspline).attr('x2', x(d[j + 1].hspStart)).attr('y2', yHspline).attr('stroke', hsplineColor);\n            } else if (d[j].hspStart > d[j + 1].hspEnd) {\n              d3__WEBPACK_IMPORTED_MODULE_0___default().select(this.parentNode).append('line').attr('x1', x(d[j + 1].hspEnd)).attr('y1', yHspline).attr('x2', x(d[j].hspStart)).attr('y2', yHspline).attr('stroke', hsplineColor);\n            }\n          }\n          var alt_tooltip = d.hitId + '<br>E value: ' + _visualisation_helpers__WEBPACK_IMPORTED_MODULE_3__.prettify_evalue(v.hspEvalue) + \"<br>Identities: \".concat(_utils__WEBPACK_IMPORTED_MODULE_4__[\"default\"].inPercentage(v.hspIdentity, v.hspLength));\n          // if chosen algorithm was blastn, the tooltip won't show the Positives% value in the tooltip\n          if (algorithm != 'blastn') {\n            alt_tooltip += \"<br>Positives: \".concat(_utils__WEBPACK_IMPORTED_MODULE_4__[\"default\"].inPercentage(v.hspPositives, v.hspLength));\n          }\n          alt_tooltip += \", Gaps: \".concat(_utils__WEBPACK_IMPORTED_MODULE_4__[\"default\"].inPercentage(v.hspGaps, v.hspLength));\n\n          // Draw the rectangular hit tracks itself.\n          d3__WEBPACK_IMPORTED_MODULE_0___default().select(this).attr('xlink:href', '#' + q_i + '_hit_' + (i + 1)).append('rect').attr('data-toggle', 'tooltip').attr('title', alt_tooltip).attr('class', 'bar').attr('x', function (d) {\n            return x(d.hspStart);\n          }).attr('y', y(d.hitId)).attr('width', function (d) {\n            return x(d.hspEnd - d.hspStart + 1);\n          }).attr('height', options.barHeight).attr('fill', d3__WEBPACK_IMPORTED_MODULE_0___default().rgb(hsplineColor));\n        });\n      });\n\n      // Draw legend only when more than one hit present\n      if (hits.length > 1) {\n        this.drawLegend(svg, options, width, height, inhits);\n      }\n      // Bind listener events once all the graphical elements have\n      // been drawn for first time.\n      if (index === 0) {\n        this.graphControls($queryDiv, $graphDiv, true, opts, inhits);\n      }\n      // Refresh tooltip each time graph is redrawn.\n      this.setupTooltip();\n      // Ensure clicking on 'rect' takes user to the relevant hit on all\n      // browsers.\n      this.setupClick($graphDiv);\n    }\n  }], [{\n    key: \"canCollapse\",\n    value: function canCollapse() {\n      return true;\n    }\n  }, {\n    key: \"name\",\n    value: function name() {\n      return 'Graphical overview of aligning hit sequences to the query';\n    }\n  }, {\n    key: \"className\",\n    value: function className() {\n      return 'alignment-overview';\n    }\n  }, {\n    key: \"graphId\",\n    value: function graphId(props) {\n      return 'alignment_' + props.query.number;\n    }\n  }, {\n    key: \"dataName\",\n    value: function dataName(props) {\n      return 'Alignment-Overview-' + props.query.id;\n    }\n  }]);\n}();\nvar HitsOverview = (0,grapher__WEBPACK_IMPORTED_MODULE_2__[\"default\"])(Graph);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (HitsOverview);\n\n//# sourceURL=webpack://SequenceServer/./public/js/hits_overview.js?");
 
 /***/ }),
 
@@ -115,7 +126,40 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var jque
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var d3__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! d3 */ \"./node_modules/d3/d3.js\");\n/* harmony import */ var d3__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(d3__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var underscore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! underscore */ \"./node_modules/underscore/modules/index-all.js\");\n/* harmony import */ var _grapher__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./grapher */ \"./public/js/grapher.js\");\n/* harmony import */ var _visualisation_helpers__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./visualisation_helpers */ \"./public/js/visualisation_helpers.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\n\n\n\n\n\n/**\n * Renders Length Distribution of all hits per query\n */\nvar Graph = /*#__PURE__*/function () {\n  function Graph($svg_container, props) {\n    _classCallCheck(this, Graph);\n    this.query = props.query;\n    this._seq_type = _visualisation_helpers__WEBPACK_IMPORTED_MODULE_3__.get_seq_type(props.algorithm);\n    this.svg_container = $svg_container;\n    if (props.algorithm == 'blastx') {\n      this.query_length = this.query.length / 3;\n    } else if (props.algorithm == 'tblastn') {\n      this.query_length = this.query.length * 3;\n    } else {\n      this.query_length = this.query.length;\n    }\n    this._margin = {\n      top: 30,\n      right: 25,\n      bottom: 55,\n      left: 12.5\n    };\n    this.initiate($svg_container.width(), $svg_container.height());\n  }\n  _createClass(Graph, [{\n    key: \"initiate\",\n    value: function initiate(width, height) {\n      this._width = width - this._margin.left - this._margin.right;\n      this._height = height - this._margin.top - this._margin.bottom;\n      this.svg = d3__WEBPACK_IMPORTED_MODULE_0___default().select(this.svg_container[0]).insert('svg', ':first-child').attr('width', this._width + this._margin.right + this._margin.left).attr('height', this._height + this._margin.top + this._margin.bottom).append('g').attr('transform', 'translate(' + this._margin.left + ',' + this._margin.top + ')');\n      this.hit_lengths();\n      this.define_scale_and_bins();\n      this.update_data();\n      this.draw();\n    }\n  }, {\n    key: \"draw\",\n    value: function draw() {\n      this.draw_rectangles();\n      this.draw_query_line();\n      this.draw_axes();\n      this.setupTooltip();\n    }\n  }, {\n    key: \"define_scale_and_bins\",\n    value: function define_scale_and_bins() {\n      this._scale_x = d3__WEBPACK_IMPORTED_MODULE_0___default().scale.linear().domain([0, d3__WEBPACK_IMPORTED_MODULE_0___default().max([this.query_length, d3__WEBPACK_IMPORTED_MODULE_0___default().max(this._data)]) * 1.01]).nice().range([0, this._width]);\n      this._bins = d3__WEBPACK_IMPORTED_MODULE_0___default().layout.histogram().range(this._scale_x.domain()).bins(this._scale_x.ticks(50))(this._data);\n      this._scale_y = d3__WEBPACK_IMPORTED_MODULE_0___default().scale.linear().domain([0, d3__WEBPACK_IMPORTED_MODULE_0___default().max(this._bins, function (d) {\n        return d.length;\n      })]).range([this._height, 0]).nice();\n    }\n  }, {\n    key: \"hit_lengths\",\n    value: function hit_lengths() {\n      this._data = underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].map(this.query.hits, underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].iteratee('length'));\n    }\n  }, {\n    key: \"setupTooltip\",\n    value: function setupTooltip() {\n      this.svg_container.find('[data-toggle=\"tooltip\"]').tooltip({\n        'placement': 'top',\n        'container': 'body',\n        'html': 'true',\n        'delay': 0,\n        'white-space': 'nowrap'\n      });\n    }\n  }, {\n    key: \"setupResponsiveness\",\n    value: function setupResponsiveness() {\n      var currentWidth = $(window).width();\n      console.log('cureent ' + currentWidth);\n      var debounced_draw = underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].debounce(underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function () {\n        if (currentWidth != $(window).width()) {\n          console.log('redraw initiated ' + this._height);\n          this.draw();\n          currentWidth = $(window).width();\n        }\n      }, this), 125);\n      $(window).resize(debounced_draw);\n    }\n  }, {\n    key: \"tick_formatter\",\n    value: function tick_formatter(seq_type) {\n      var ticks = this._scale_x.ticks();\n      var format = d3__WEBPACK_IMPORTED_MODULE_0___default().format('.1f');\n      var prefix = d3__WEBPACK_IMPORTED_MODULE_0___default().formatPrefix(ticks[ticks.length - 1]);\n      var suffixes = {\n        amino_acid: 'aa',\n        nucleic_acid: 'bp'\n      };\n      return function (d) {\n        if (d === 0) {\n          return;\n        }\n        if (underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].indexOf(ticks, d) >= 0) {\n          if (suffixes[seq_type] == 'aa') {\n            return d + ' ' + suffixes[seq_type];\n          } else {\n            return format(prefix.scale(d)) + ' ' + prefix.symbol + suffixes[seq_type];\n          }\n        } else {\n          return;\n        }\n      };\n    }\n  }, {\n    key: \"update_data\",\n    value: function update_data() {\n      var self = this;\n      var data2 = [];\n      this._bins.map(function (bin) {\n        var inner_data = [];\n        bin.reverse();\n        var y0 = bin.length;\n        bin.map(function (d, i) {\n          var y1 = bin.length - (i + 1);\n          var len_index = underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].findIndex(self.query.hits, {\n            length: d\n          });\n          var evalue = self.query.hits[len_index].hsps[0].evalue;\n          var item = {\n            value: d,\n            id: self.query.hits[len_index].id,\n            evalue: evalue,\n            url: '#Query_' + self.query.number + '_hit_' + self.query.hits[len_index].number,\n            y0: y0,\n            y1: y0 += y1 - y0,\n            color: _visualisation_helpers__WEBPACK_IMPORTED_MODULE_3__.get_colors_for_evalue(evalue, self.query.hits)\n          };\n          inner_data.push(item);\n        });\n        var item = {\n          data: inner_data,\n          x: bin.x,\n          dx: bin.dx,\n          length: bin.length\n        };\n        data2.push(item);\n      });\n      this._update_data = data2;\n    }\n  }, {\n    key: \"draw_rectangles\",\n    value: function draw_rectangles() {\n      var self = this;\n      var bar = this.svg.selectAll('.bar').data(this._update_data).enter().append('g').attr('class', 'g').attr('transform', function (d) {\n        return 'translate(' + (self._scale_x(d.x) + self._margin.left) + ',0)';\n      });\n      bar.selectAll('rect').data(function (d) {\n        return d.data;\n      }).enter().append('a').attr('xlink:href', function (i) {\n        return i.url;\n      }).append('rect').attr('class', 'bar').attr('data-toggle', 'tooltip').attr('title', function (i) {\n        return i.id + ' ' + '<br>E value: ' + _visualisation_helpers__WEBPACK_IMPORTED_MODULE_3__.prettify_evalue(i.evalue) + '<br>Length: ' + i.value;\n      }).attr('x', 1).attr('y', function (i) {\n        return self._scale_y(i.y0);\n      }).attr('width', self._scale_x(this._bins[1].x) - self._scale_x(this._bins[0].x) - 1).attr('height', function (i) {\n        return self._scale_y(i.y1) - self._scale_y(i.y0);\n      }).attr('fill', function (i) {\n        return i.color;\n      });\n    }\n  }, {\n    key: \"draw_query_line\",\n    value: function draw_query_line() {\n      var query_line = this.svg.append('g').attr('class', 'query_line').attr('transform', 'translate(' + (this._margin.left + this._scale_x(this.query_length)) + ',0)');\n      query_line.append('rect').attr('x', 1).attr('class', 'bar').attr('width', 4).attr('height', this._height).style('fill', '#c74f14');\n      query_line.append('text').attr('dy', '0.75em').attr('y', -10).attr('x', 2).attr('text-anchor', 'start').text('Query').style('fill', '#000').attr('transform', 'rotate(-45)');\n    }\n  }, {\n    key: \"draw_axes\",\n    value: function draw_axes() {\n      var space, len;\n      len = this._scale_y.ticks().length;\n      if (len >= 5) {\n        space = 5;\n      } else {\n        space = len;\n      }\n      var formatter = this.tick_formatter(this._seq_type.subject_seq_type);\n      var x_axis = d3__WEBPACK_IMPORTED_MODULE_0___default().svg.axis().scale(this._scale_x).orient('bottom').ticks(50).tickFormat(formatter);\n      var y_axis = d3__WEBPACK_IMPORTED_MODULE_0___default().svg.axis().scale(this._scale_y).orient('left').tickValues(this._scale_y.ticks(space)).outerTickSize(0).tickFormat(function (e) {\n        if (Math.floor(e) != e) {\n          return;\n        }\n        return e;\n      });\n      var ticks = this._scale_y.ticks();\n      for (var i in ticks) {\n        if (ticks[i] % 1 != 0) {\n          y_axis.tickValues(d3__WEBPACK_IMPORTED_MODULE_0___default().range(0, d3__WEBPACK_IMPORTED_MODULE_0___default().max(this._bins, function (d) {\n            return d.length;\n          }) + 1));\n          break;\n        }\n      }\n      var self = this;\n      var xContainer = this.svg.append('g').attr('class', 'axis axis--x').attr('transform', 'translate(' + this._margin.left + ',' + this._height + ')').call(x_axis);\n      xContainer.selectAll('line').attr('y2', function (d) {\n        var ticks = self._scale_x.ticks();\n        if (underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].indexOf(ticks, d) >= 0) {\n          return 7;\n        } else {\n          return 4;\n        }\n      });\n      xContainer.selectAll('text').style('text-anchor', 'end').attr('x', '-8px').attr('y', '3px').attr('dy', '0').attr('transform', 'rotate(-90)');\n      var yContainer = this.svg.append('g').attr('class', 'axis axis--y').attr('transform', 'translate(' + this._margin.left + ',0)').call(y_axis);\n    }\n  }], [{\n    key: \"canCollapse\",\n    value: function canCollapse() {\n      return true;\n    }\n  }, {\n    key: \"name\",\n    value: function name() {\n      return 'Length distribution of matching hit sequences';\n    }\n  }, {\n    key: \"className\",\n    value: function className() {\n      return 'length-distribution';\n    }\n  }, {\n    key: \"collapseId\",\n    value: function collapseId(props) {\n      return 'length_' + props.query.number;\n    }\n  }, {\n    key: \"dataName\",\n    value: function dataName(props) {\n      return 'length-distribution-' + props.query.id;\n    }\n  }]);\n  return Graph;\n}();\nvar LengthDistribution = (0,_grapher__WEBPACK_IMPORTED_MODULE_2__[\"default\"])(Graph);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (LengthDistribution);\n\n//# sourceURL=webpack://SequenceServer/./public/js/length_distribution.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var d3__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! d3 */ \"./node_modules/d3/d3.js\");\n/* harmony import */ var d3__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(d3__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var underscore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! underscore */ \"./node_modules/underscore/modules/index-all.js\");\n/* harmony import */ var grapher__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! grapher */ \"./public/js/grapher.js\");\n/* harmony import */ var _visualisation_helpers__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./visualisation_helpers */ \"./public/js/visualisation_helpers.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\n\n\n\n\n\n/**\n * Renders Length Distribution of all hits per query\n */\nvar Graph = /*#__PURE__*/function () {\n  function Graph($svg_container, props) {\n    _classCallCheck(this, Graph);\n    this.query = props.query;\n    this._seq_type = _visualisation_helpers__WEBPACK_IMPORTED_MODULE_3__.get_seq_type(props.algorithm);\n    this.svg_container = $svg_container;\n    if (props.algorithm == 'blastx') {\n      this.query_length = this.query.length / 3;\n    } else if (props.algorithm == 'tblastn') {\n      this.query_length = this.query.length * 3;\n    } else {\n      this.query_length = this.query.length;\n    }\n    this._margin = {\n      top: 30,\n      right: 25,\n      bottom: 55,\n      left: 12.5\n    };\n    this.initiate($svg_container.width(), $svg_container.height());\n  }\n  return _createClass(Graph, [{\n    key: \"initiate\",\n    value: function initiate(width, height) {\n      this._width = width - this._margin.left - this._margin.right;\n      this._height = height - this._margin.top - this._margin.bottom;\n      this.svg = d3__WEBPACK_IMPORTED_MODULE_0___default().select(this.svg_container[0]).insert('svg', ':first-child').attr('width', this._width + this._margin.right + this._margin.left).attr('height', this._height + this._margin.top + this._margin.bottom).append('g').attr('transform', 'translate(' + this._margin.left + ',' + this._margin.top + ')');\n      this.hit_lengths();\n      this.define_scale_and_bins();\n      this.update_data();\n      this.draw();\n    }\n  }, {\n    key: \"draw\",\n    value: function draw() {\n      this.draw_rectangles();\n      this.draw_query_line();\n      this.draw_axes();\n      this.setupTooltip();\n    }\n  }, {\n    key: \"define_scale_and_bins\",\n    value: function define_scale_and_bins() {\n      this._scale_x = d3__WEBPACK_IMPORTED_MODULE_0___default().scale.linear().domain([0, d3__WEBPACK_IMPORTED_MODULE_0___default().max([this.query_length, d3__WEBPACK_IMPORTED_MODULE_0___default().max(this._data)]) * 1.01]).nice().range([0, this._width]);\n      this._bins = d3__WEBPACK_IMPORTED_MODULE_0___default().layout.histogram().range(this._scale_x.domain()).bins(this._scale_x.ticks(50))(this._data);\n      this._scale_y = d3__WEBPACK_IMPORTED_MODULE_0___default().scale.linear().domain([0, d3__WEBPACK_IMPORTED_MODULE_0___default().max(this._bins, function (d) {\n        return d.length;\n      })]).range([this._height, 0]).nice();\n    }\n  }, {\n    key: \"hit_lengths\",\n    value: function hit_lengths() {\n      this._data = underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].map(this.query.hits, underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].iteratee('length'));\n    }\n  }, {\n    key: \"setupTooltip\",\n    value: function setupTooltip() {\n      this.svg_container.find('[data-toggle=\"tooltip\"]').tooltip({\n        'placement': 'top',\n        'container': 'body',\n        'html': 'true',\n        'delay': 0,\n        'white-space': 'nowrap'\n      });\n    }\n  }, {\n    key: \"setupResponsiveness\",\n    value: function setupResponsiveness() {\n      var currentWidth = $(window).width();\n      console.log('cureent ' + currentWidth);\n      var debounced_draw = underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].debounce(underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function () {\n        if (currentWidth != $(window).width()) {\n          console.log('redraw initiated ' + this._height);\n          this.draw();\n          currentWidth = $(window).width();\n        }\n      }, this), 125);\n      $(window).resize(debounced_draw);\n    }\n  }, {\n    key: \"tick_formatter\",\n    value: function tick_formatter(seq_type) {\n      var ticks = this._scale_x.ticks();\n      var format = d3__WEBPACK_IMPORTED_MODULE_0___default().format('.1f');\n      var prefix = d3__WEBPACK_IMPORTED_MODULE_0___default().formatPrefix(ticks[ticks.length - 1]);\n      var suffixes = {\n        amino_acid: 'aa',\n        nucleic_acid: 'bp'\n      };\n      return function (d) {\n        if (d === 0) {\n          return;\n        }\n        if (underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].indexOf(ticks, d) >= 0) {\n          if (suffixes[seq_type] == 'aa') {\n            return d + ' ' + suffixes[seq_type];\n          } else {\n            return format(prefix.scale(d)) + ' ' + prefix.symbol + suffixes[seq_type];\n          }\n        } else {\n          return;\n        }\n      };\n    }\n  }, {\n    key: \"update_data\",\n    value: function update_data() {\n      var self = this;\n      var data2 = [];\n      this._bins.map(function (bin) {\n        var inner_data = [];\n        bin.reverse();\n        var y0 = bin.length;\n        bin.map(function (d, i) {\n          var y1 = bin.length - (i + 1);\n          var len_index = underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].findIndex(self.query.hits, {\n            length: d\n          });\n          var evalue = self.query.hits[len_index].hsps[0].evalue;\n          var item = {\n            value: d,\n            id: self.query.hits[len_index].id,\n            evalue: evalue,\n            url: '#Query_' + self.query.number + '_hit_' + self.query.hits[len_index].number,\n            y0: y0,\n            y1: y0 += y1 - y0,\n            color: _visualisation_helpers__WEBPACK_IMPORTED_MODULE_3__.get_colors_for_evalue(evalue, self.query.hits)\n          };\n          inner_data.push(item);\n        });\n        var item = {\n          data: inner_data,\n          x: bin.x,\n          dx: bin.dx,\n          length: bin.length\n        };\n        data2.push(item);\n      });\n      this._update_data = data2;\n    }\n  }, {\n    key: \"draw_rectangles\",\n    value: function draw_rectangles() {\n      var self = this;\n      var bar = this.svg.selectAll('.bar').data(this._update_data).enter().append('g').attr('class', 'g').attr('transform', function (d) {\n        return 'translate(' + (self._scale_x(d.x) + self._margin.left) + ',0)';\n      });\n      bar.selectAll('rect').data(function (d) {\n        return d.data;\n      }).enter().append('a').attr('xlink:href', function (i) {\n        return i.url;\n      }).append('rect').attr('class', 'bar').attr('data-toggle', 'tooltip').attr('title', function (i) {\n        return i.id + ' ' + '<br>E value: ' + _visualisation_helpers__WEBPACK_IMPORTED_MODULE_3__.prettify_evalue(i.evalue) + '<br>Length: ' + i.value;\n      }).attr('x', 1).attr('y', function (i) {\n        return self._scale_y(i.y0);\n      }).attr('width', self._scale_x(this._bins[1].x) - self._scale_x(this._bins[0].x) - 1).attr('height', function (i) {\n        return self._scale_y(i.y1) - self._scale_y(i.y0);\n      }).attr('fill', function (i) {\n        return i.color;\n      });\n    }\n  }, {\n    key: \"draw_query_line\",\n    value: function draw_query_line() {\n      var query_line = this.svg.append('g').attr('class', 'query_line').attr('transform', 'translate(' + (this._margin.left + this._scale_x(this.query_length)) + ',0)');\n      query_line.append('rect').attr('x', 1).attr('class', 'bar').attr('width', 4).attr('height', this._height).style('fill', '#c74f14');\n      query_line.append('text').attr('dy', '0.75em').attr('y', -10).attr('x', 2).attr('text-anchor', 'start').text('Query').style('fill', '#000').attr('transform', 'rotate(-45)');\n    }\n  }, {\n    key: \"draw_axes\",\n    value: function draw_axes() {\n      var space, len;\n      len = this._scale_y.ticks().length;\n      if (len >= 5) {\n        space = 5;\n      } else {\n        space = len;\n      }\n      var formatter = this.tick_formatter(this._seq_type.subject_seq_type);\n      var x_axis = d3__WEBPACK_IMPORTED_MODULE_0___default().svg.axis().scale(this._scale_x).orient('bottom').ticks(50).tickFormat(formatter);\n      var y_axis = d3__WEBPACK_IMPORTED_MODULE_0___default().svg.axis().scale(this._scale_y).orient('left').tickValues(this._scale_y.ticks(space)).outerTickSize(0).tickFormat(function (e) {\n        if (Math.floor(e) != e) {\n          return;\n        }\n        return e;\n      });\n      var ticks = this._scale_y.ticks();\n      for (var i in ticks) {\n        if (ticks[i] % 1 != 0) {\n          y_axis.tickValues(d3__WEBPACK_IMPORTED_MODULE_0___default().range(0, d3__WEBPACK_IMPORTED_MODULE_0___default().max(this._bins, function (d) {\n            return d.length;\n          }) + 1));\n          break;\n        }\n      }\n      var self = this;\n      var xContainer = this.svg.append('g').attr('class', 'axis axis--x').attr('transform', 'translate(' + this._margin.left + ',' + this._height + ')').call(x_axis);\n      xContainer.selectAll('line').attr('y2', function (d) {\n        var ticks = self._scale_x.ticks();\n        if (underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].indexOf(ticks, d) >= 0) {\n          return 7;\n        } else {\n          return 4;\n        }\n      });\n      xContainer.selectAll('text').style('text-anchor', 'end').attr('x', '-8px').attr('y', '3px').attr('dy', '0').attr('transform', 'rotate(-90)');\n      this.svg.append('g').attr('class', 'axis axis--y').attr('transform', 'translate(' + this._margin.left + ',0)').call(y_axis);\n    }\n  }], [{\n    key: \"canCollapse\",\n    value: function canCollapse() {\n      return true;\n    }\n  }, {\n    key: \"name\",\n    value: function name() {\n      return 'Length distribution of matching hit sequences';\n    }\n  }, {\n    key: \"className\",\n    value: function className() {\n      return 'length-distribution';\n    }\n  }, {\n    key: \"graphId\",\n    value: function graphId(props) {\n      return 'length_' + props.query.number;\n    }\n  }, {\n    key: \"dataName\",\n    value: function dataName(props) {\n      return 'length-distribution-' + props.query.id;\n    }\n  }]);\n}();\nvar LengthDistribution = (0,grapher__WEBPACK_IMPORTED_MODULE_2__[\"default\"])(Graph);\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (LengthDistribution);\n\n//# sourceURL=webpack://SequenceServer/./public/js/length_distribution.js?");
+
+/***/ }),
+
+/***/ "./public/js/null_plugins/options.js":
+/*!*******************************************!*\
+  !*** ./public/js/null_plugins/options.js ***!
+  \*******************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Options: () => (/* reexport safe */ _options__WEBPACK_IMPORTED_MODULE_0__.Options)\n/* harmony export */ });\n/* harmony import */ var _options__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../options */ \"./public/js/options.js\");\n\n\n\n//# sourceURL=webpack://SequenceServer/./public/js/null_plugins/options.js?");
+
+/***/ }),
+
+/***/ "./public/js/null_plugins/query_stats.js":
+/*!***********************************************!*\
+  !*** ./public/js/null_plugins/query_stats.js ***!
+  \***********************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _callSuper(_this, derived, args) {\n  function isNativeReflectConstruct() {\n    if (typeof Reflect === \"undefined\" || !Reflect.construct) return false;\n    if (Reflect.construct.sham) return false;\n    if (typeof Proxy === \"function\") return true;\n    try {\n      return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));\n    } catch (e) {\n      return false;\n    }\n  }\n  derived = _getPrototypeOf(derived);\n  return _possibleConstructorReturn(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], _getPrototypeOf(_this).constructor) : derived.apply(_this, args));\n}\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\nvar QueryStats = /*#__PURE__*/function (_React$Component) {\n  function QueryStats() {\n    _classCallCheck(this, QueryStats);\n    return _callSuper(this, QueryStats, arguments);\n  }\n  _inherits(QueryStats, _React$Component);\n  return _createClass(QueryStats, [{\n    key: \"render\",\n    value: function render() {}\n  }, {\n    key: \"componentDidUpdate\",\n    value: function componentDidUpdate() {\n      console.log(\"Query stats:\", this.props);\n    }\n  }]);\n}((react__WEBPACK_IMPORTED_MODULE_0___default().Component));\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (QueryStats);\n\n//# sourceURL=webpack://SequenceServer/./public/js/null_plugins/query_stats.js?");
+
+/***/ }),
+
+/***/ "./public/js/null_plugins/search_header_plugin.js":
+/*!********************************************************!*\
+  !*** ./public/js/null_plugins/search_header_plugin.js ***!
+  \********************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   SearchHeaderPlugin: () => (/* binding */ SearchHeaderPlugin)\n/* harmony export */ });\nvar SearchHeaderPlugin = function SearchHeaderPlugin() {\n  return '';\n};\n\n//# sourceURL=webpack://SequenceServer/./public/js/null_plugins/search_header_plugin.js?");
 
 /***/ }),
 
@@ -126,7 +170,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Options: () => (/* binding */ Options)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\nfunction _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== \"undefined\" && arr[Symbol.iterator] || arr[\"@@iterator\"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"] != null) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\n// Component for the advanced params input field.\n\n\nvar Options = /*#__PURE__*/function (_Component) {\n  _inherits(Options, _Component);\n  var _super = _createSuper(Options);\n  function Options(props) {\n    var _this;\n    _classCallCheck(this, Options);\n    _this = _super.call(this, props);\n    _this.state = {\n      preOpts: {},\n      value: '',\n      method: ''\n    };\n    _this.updateBox = _this.updateBox.bind(_assertThisInitialized(_this));\n    _this.optionsJSX = _this.optionsJSX.bind(_assertThisInitialized(_this));\n    _this.showAdvancedOptions = _this.showAdvancedOptions.bind(_assertThisInitialized(_this));\n    return _this;\n  }\n  _createClass(Options, [{\n    key: \"updateBox\",\n    value: function updateBox(value) {\n      this.setState({\n        value: value\n      });\n    }\n  }, {\n    key: \"optionsJSX\",\n    value: function optionsJSX() {\n      var _this2 = this;\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"span\", {\n        className: \"input-group-btn dropdown\",\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"button\", {\n          className: \"btn bnt-sm btn-default dropdown-toggle\",\n          \"data-toggle\": \"dropdown\",\n          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"i\", {\n            className: \"fa fa-caret-down\"\n          })\n        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"ul\", {\n          id: \"advanced-params-dropdown\",\n          className: \"dropdown-menu dropdown-menu-right\",\n          children: Object.entries(this.state.preOpts).map(function (_ref, index) {\n            var _ref2 = _slicedToArray(_ref, 2),\n              key = _ref2[0],\n              value = _ref2[1];\n            value = value.join(' ');\n            if (value.trim() === _this2.state.value.trim()) var className = 'yellow-background';\n            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"li\", {\n              className: className,\n              onClick: function onClick() {\n                return _this2.updateBox(value);\n              },\n              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"strong\", {\n                children: [key, \":\"]\n              }), \"\\xA0\", value]\n            }, index);\n          })\n        })]\n      });\n    }\n  }, {\n    key: \"showAdvancedOptions\",\n    value: function showAdvancedOptions(e) {\n      var ids = ['blastn', 'tblastn', 'blastp', 'blastx', 'tblastx'];\n      var method = this.state.method.toLowerCase();\n      // hide options for other algorithms and only show for selected algorithm\n      for (var _i2 = 0, _ids = ids; _i2 < _ids.length; _i2++) {\n        var id = _ids[_i2];\n        $(\"#\".concat(id))[id === method ? 'show' : 'hide']();\n      }\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      var _this3 = this;\n      var classNames = 'form-control';\n      if (this.state.value.trim()) {\n        classNames += ' yellow-background';\n      }\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n        className: \"col-md-7\",\n        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n          className: \"form-group\",\n          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n            className: \"col-md-12\",\n            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"div\", {\n              className: \"input-group\",\n              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"label\", {\n                className: \"control-label\",\n                htmlFor: \"advanced\",\n                children: [\"Advanced parameters:\", this.state.method && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"sup\", {\n                  style: {\n                    marginLeft: '2px'\n                  },\n                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"a\", {\n                    href: \"\",\n                    onClick: this.showAdvancedOptions,\n                    \"data-toggle\": \"modal\",\n                    \"data-target\": \"#help\",\n                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"i\", {\n                      className: \"fa fa-question-circle\"\n                    })\n                  })\n                })]\n              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"input\", {\n                type: \"text\",\n                className: classNames,\n                onChange: function onChange(e) {\n                  return _this3.updateBox(e.target.value);\n                },\n                id: \"advanced\",\n                name: \"advanced\",\n                value: this.state.value,\n                placeholder: \"eg: -evalue 1.0e-5 -num_alignments 100\",\n                title: \"View, and enter advanced parameters.\"\n              }), Object.keys(this.state.preOpts).length > 1 && this.optionsJSX()]\n            })\n          })\n        })\n      });\n    }\n  }]);\n  return Options;\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\n\n//# sourceURL=webpack://SequenceServer/./public/js/options.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   Options: () => (/* binding */ Options)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== \"undefined\" && arr[Symbol.iterator] || arr[\"@@iterator\"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"] != null) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _callSuper(_this, derived, args) {\n  function isNativeReflectConstruct() {\n    if (typeof Reflect === \"undefined\" || !Reflect.construct) return false;\n    if (Reflect.construct.sham) return false;\n    if (typeof Proxy === \"function\") return true;\n    try {\n      return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));\n    } catch (e) {\n      return false;\n    }\n  }\n  derived = _getPrototypeOf(derived);\n  return _possibleConstructorReturn(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], _getPrototypeOf(_this).constructor) : derived.apply(_this, args));\n}\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\n// Component for the advanced params input field.\n\nvar Options = /*#__PURE__*/function (_Component) {\n  function Options(props) {\n    var _this2;\n    _classCallCheck(this, Options);\n    _this2 = _callSuper(this, Options, [props]);\n    _this2.state = {\n      textValue: '',\n      objectValue: _this2.defaultObjectValue(),\n      paramsMode: 'advanced'\n    };\n    _this2.onTextValueChanged = _this2.onTextValueChanged.bind(_this2);\n    _this2.optionsPresetsJSX = _this2.optionsPresetsJSX.bind(_this2);\n    _this2.advancedParamsJSX = _this2.advancedParamsJSX.bind(_this2);\n    _this2.showAdvancedOptionsHelp = _this2.showAdvancedOptionsHelp.bind(_this2);\n    return _this2;\n  }\n  _inherits(Options, _Component);\n  return _createClass(Options, [{\n    key: \"defaultObjectValue\",\n    value: function defaultObjectValue() {\n      return {\n        max_target_seqs: '',\n        evalue: '',\n        task: ''\n      };\n    }\n  }, {\n    key: \"componentDidUpdate\",\n    value: function componentDidUpdate(prevProps) {\n      if (prevProps.predefinedOptions !== this.props.predefinedOptions) {\n        var defaultOptions = this.props.predefinedOptions[\"default\"] || {\n          attributes: []\n        };\n        var advancedOptions = this.props.predefinedOptions['last search'] || defaultOptions || {\n          attributes: []\n        };\n        var initialTextValue = advancedOptions.attributes.join(' ').trim();\n        var parsedOptions = this.parsedOptions(initialTextValue);\n        this.setState({\n          textValue: initialTextValue,\n          objectValue: parsedOptions\n        });\n      }\n    }\n  }, {\n    key: \"onTextValueChanged\",\n    value: function onTextValueChanged(textValue) {\n      var parsedOptions = this.parsedOptions(textValue.toString());\n      this.setState({\n        textValue: textValue.toString(),\n        objectValue: parsedOptions\n      });\n    }\n  }, {\n    key: \"parsedOptions\",\n    value: function parsedOptions(textValue) {\n      var words = textValue.split(\" \");\n      var parsedOptions = this.defaultObjectValue();\n      // Iterate through the words in steps of 2, treating each pair as an option and its potential value\n      for (var i = 0; i < words.length; i += 2) {\n        // Ensure there is a pair available\n        if (words[i]) {\n          if (words[i].startsWith(\"-\")) {\n            var optionName = words[i].substring(1).trim();\n            if (words[i + 1]) {\n              // Use the second word as the value for this option\n              parsedOptions[optionName] = words[i + 1];\n            } else {\n              // No value found for this option, set it to null or a default value\n              parsedOptions[optionName] = null;\n            }\n          }\n        }\n      }\n      return parsedOptions;\n    }\n  }, {\n    key: \"optionsPresetsJSX\",\n    value: function optionsPresetsJSX() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n        id: \"options-presets\",\n        className: \"w-full\",\n        children: Object.keys(this.props.predefinedOptions).length > 1 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.Fragment, {\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"h3\", {\n            className: \"w-full font-medium border-b border-seqorange mb-2\",\n            children: \"Settings\"\n          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"p\", {\n            className: \"text-sm\",\n            children: \"Choose a predefined setting or customize BLAST parameters.\"\n          }), this.presetListJSX()]\n        })\n      });\n    }\n  }, {\n    key: \"presetListJSX\",\n    value: function presetListJSX() {\n      var _this3 = this;\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"ul\", {\n        className: \"text-sm my-1\",\n        children: Object.entries(this.props.predefinedOptions).map(function (_ref, index) {\n          var _ref2 = _slicedToArray(_ref, 2),\n            key = _ref2[0],\n            config = _ref2[1];\n          var textValue = config.attributes.join(' ').trim();\n          var description = config.description || textValue;\n          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"label\", {\n            className: \"block w-full px-2 py-1 hover:bg-gray-200 cursor-pointer\",\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"input\", {\n              type: \"radio\",\n              name: \"predefinedOption\",\n              value: textValue,\n              checked: textValue === _this3.state.textValue,\n              onChange: function onChange() {\n                return _this3.onTextValueChanged(textValue);\n              }\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"strong\", {\n              className: \"ml-2\",\n              children: [key, \":\"]\n            }), \"\\xA0\", description]\n          }, index);\n        })\n      });\n    }\n  }, {\n    key: \"advancedParamsJSX\",\n    value: function advancedParamsJSX() {\n      var _this4 = this;\n      if (this.state.paramsMode !== 'advanced') {\n        return null;\n      }\n      var classNames = 'flex-grow block px-4 py-1 text-gray-900 border border-gray-300 rounded-lg bg-gray-50 text-base';\n      if (this.state.textValue) {\n        classNames += ' bg-yellow-100';\n      }\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"div\", {\n        className: \"w-full\",\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"div\", {\n          className: \"flex items-end\",\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"label\", {\n            className: \"flex items-center\",\n            htmlFor: \"advanced\",\n            children: \"Advanced parameters\"\n          }), this.props.blastMethod && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"button\", {\n            className: \"text-seqblue ml-2\",\n            type: \"button\",\n            onClick: this.showAdvancedOptionsHelp,\n            \"data-toggle\": \"modal\",\n            \"data-target\": \"#help\",\n            children: [\"See available options\", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"i\", {\n              className: \"fa fa-question-circle ml-1 w-3 h-4 fill-current\"\n            })]\n          }), !this.props.blastMethod && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"span\", {\n            className: \"text-gray-600 ml-2 text-sm hidden sm:block\",\n            children: \"Select databases and fill in the query to see options.\"\n          })]\n        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"div\", {\n          className: \"flex-grow flex w-full\",\n          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"input\", {\n            type: \"text\",\n            className: classNames,\n            onChange: function onChange(e) {\n              return _this4.onTextValueChanged(e.target.value);\n            },\n            id: \"advanced\",\n            name: \"advanced\",\n            value: this.state.textValue,\n            placeholder: \"eg: -evalue 1.0e-5 -num_alignments 100\",\n            title: \"View, and enter advanced parameters.\"\n          })\n        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"div\", {\n          className: \"text-sm text-gray-600 mt-2\",\n          children: [\"Options as they would appear in a command line when calling BLAST eg: \", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"i\", {\n            children: \"-evalue 1.0e-5 -num_alignments 100\"\n          })]\n        })]\n      });\n    }\n  }, {\n    key: \"showAdvancedOptionsHelp\",\n    value: function showAdvancedOptionsHelp(e) {\n      var ids = ['blastn', 'tblastn', 'blastp', 'blastx', 'tblastx'];\n      var method = this.props.blastMethod.toLowerCase();\n      // hide options for other algorithms and only show for selected algorithm\n      for (var _i2 = 0, _ids = ids; _i2 < _ids.length; _i2++) {\n        var id = _ids[_i2];\n        if (id === method) {\n          document.getElementById(id).classList.remove('hidden');\n        } else {\n          document.getElementById(id).classList.add('hidden');\n        }\n      }\n      document.querySelector('[data-help-modal]').classList.remove('hidden');\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"div\", {\n        className: \"flex-grow flex flex-col items-start sm:items-center space-y-4\",\n        children: [this.optionsPresetsJSX(), this.advancedParamsJSX()]\n      });\n    }\n  }]);\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\n\n//# sourceURL=webpack://SequenceServer/./public/js/options.js?");
 
 /***/ }),
 
@@ -137,7 +181,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ReportQuery: () => (/* binding */ ReportQuery),\n/* harmony export */   SearchQueryWidget: () => (/* binding */ SearchQueryWidget)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var underscore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! underscore */ \"./node_modules/underscore/modules/index-all.js\");\n/* harmony import */ var _hits_overview__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./hits_overview */ \"./public/js/hits_overview.js\");\n/* harmony import */ var _length_distribution__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./length_distribution */ \"./public/js/length_distribution.js\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./utils */ \"./public/js/utils.js\");\n/* harmony import */ var _fastq_to_fasta__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./fastq_to_fasta */ \"./public/js/fastq_to_fasta.js\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\n\n\n // length distribution of hits\n\n\n\n/**\n * Query component displays query defline, graphical overview, length\n * distribution, and hits table.\n */\n\n\nvar ReportQuery = /*#__PURE__*/function (_Component) {\n  _inherits(ReportQuery, _Component);\n  var _super = _createSuper(ReportQuery);\n  function ReportQuery() {\n    _classCallCheck(this, ReportQuery);\n    return _super.apply(this, arguments);\n  }\n  _createClass(ReportQuery, [{\n    key: \"shouldComponentUpdate\",\n    value:\n    // Each update cycle will cause all previous queries to be re-rendered.\n    // We avoid that by implementing shouldComponentUpdate life-cycle hook.\n    // The trick is to simply check if the components has recieved props\n    // before.\n    function shouldComponentUpdate() {\n      // If the component has received props before, query property will\n      // be set on it. If it is, we return false so that the component\n      // is not re-rendered. If the query property is not set, we return\n      // true: this must be the first time react is trying to render the\n      // component.\n      return !this.props.query;\n    }\n    // Kind of public API //\n\n    /**\n     * Returns the id of query.\n     */\n  }, {\n    key: \"domID\",\n    value: function domID() {\n      return 'Query_' + this.props.query.number;\n    }\n  }, {\n    key: \"queryLength\",\n    value: function queryLength() {\n      return this.props.query.length;\n    }\n\n    /**\n     * Returns number of hits.\n     */\n  }, {\n    key: \"numhits\",\n    value: function numhits() {\n      return this.props.query.hits.length;\n    }\n  }, {\n    key: \"headerJSX\",\n    value: function headerJSX() {\n      var meta = \"length: \".concat(this.queryLength().toLocaleString());\n      if (this.props.showQueryCrumbs) {\n        meta = \"query \".concat(this.props.query.number, \", \") + meta;\n      }\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(\"div\", {\n        className: \"section-header\",\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(\"h3\", {\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(\"strong\", {\n            children: [\"Query=\\xA0\", this.props.query.id]\n          }), \"\\xA0\", this.props.query.title]\n        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"span\", {\n          className: \"label label-reset pos-label\",\n          children: meta\n        })]\n      });\n    }\n  }, {\n    key: \"hitsListJSX\",\n    value: function hitsListJSX() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(\"div\", {\n        className: \"section-content\",\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_hits_overview__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n          query: this.props.query,\n          program: this.props.program,\n          collapsed: this.props.veryBig\n        }, 'GO_' + this.props.query.number), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_length_distribution__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n          query: this.props.query,\n          algorithm: this.props.program,\n          collapsed: \"true\"\n        }, 'LD_' + this.props.query.id), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(HitsTable, {\n          query: this.props.query,\n          imported_xml: this.props.imported_xml\n        }, 'HT_' + this.props.query.number)]\n      });\n    }\n  }, {\n    key: \"noHitsJSX\",\n    value: function noHitsJSX() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"div\", {\n        className: \"section-content\",\n        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"strong\", {\n          children: \" ****** No BLAST hits found ****** \"\n        })\n      });\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(\"div\", {\n        className: \"resultn\",\n        id: this.domID(),\n        \"data-query-len\": this.props.query.length,\n        \"data-algorithm\": this.props.program,\n        children: [this.headerJSX(), this.numhits() && this.hitsListJSX() || this.noHitsJSX()]\n      });\n    }\n  }]);\n  return ReportQuery;\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\n\n/**\n * Query widget for Search component.\n */\nvar SearchQueryWidget = /*#__PURE__*/function (_Component2) {\n  _inherits(SearchQueryWidget, _Component2);\n  var _super2 = _createSuper(SearchQueryWidget);\n  function SearchQueryWidget(props) {\n    var _this;\n    _classCallCheck(this, SearchQueryWidget);\n    _this = _super2.call(this, props);\n    _this.state = {\n      value: $('input#input_sequence').val() || ''\n    };\n    _this.value = _this.value.bind(_assertThisInitialized(_this));\n    _this.clear = _this.clear.bind(_assertThisInitialized(_this));\n    _this.focus = _this.focus.bind(_assertThisInitialized(_this));\n    _this.isEmpty = _this.isEmpty.bind(_assertThisInitialized(_this));\n    _this.textarea = _this.textarea.bind(_assertThisInitialized(_this));\n    _this.controls = _this.controls.bind(_assertThisInitialized(_this));\n    _this.handleInput = _this.handleInput.bind(_assertThisInitialized(_this));\n    _this.hideShowButton = _this.hideShowButton.bind(_assertThisInitialized(_this));\n    _this.indicateError = _this.indicateError.bind(_assertThisInitialized(_this));\n    _this.indicateNormal = _this.indicateNormal.bind(_assertThisInitialized(_this));\n    _this.type = _this.type.bind(_assertThisInitialized(_this));\n    _this.guessSequenceType = _this.guessSequenceType.bind(_assertThisInitialized(_this));\n    _this.preProcessSequence = _this.preProcessSequence.bind(_assertThisInitialized(_this));\n    _this.notify = _this.notify.bind(_assertThisInitialized(_this));\n    _this.textareaRef = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.createRef)();\n    _this.controlsRef = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.createRef)();\n    return _this;\n  }\n\n  // LIFECYCLE Methods\n  _createClass(SearchQueryWidget, [{\n    key: \"componentDidMount\",\n    value: function componentDidMount() {\n      $('body').click(function () {\n        $('.notifications .active').hide('drop', {\n          direction: 'up'\n        }).removeClass('active');\n      });\n    }\n  }, {\n    key: \"componentDidUpdate\",\n    value: function componentDidUpdate() {\n      this.hideShowButton();\n      this.preProcessSequence();\n      var type = this.type();\n      if (!type || type !== this._type) {\n        this._type = type;\n        this.notify(type);\n        this.props.onSequenceTypeChanged(type);\n      }\n    }\n\n    // Kind of public API. //\n\n    /**\n     * Returns query sequence if no argument is provided (or null or undefined\n     * is provided as argument). Otherwise, sets query sequence to the given\n     * value and returns `this`.\n     *\n     * Default/initial state of query sequence is an empty string. Caller must\n     * explicitly provide empty string as argument to \"reset\" query sequence.\n     */\n  }, {\n    key: \"value\",\n    value: function value(val) {\n      if (val == null) {\n        // i.e., val is null or undefined\n        return this.state.value;\n      } else {\n        this.setState({\n          value: val\n        });\n        return this;\n      }\n    }\n\n    /**\n     * Clears textarea. Returns `this`.\n     *\n     * Clearing textarea also causes it to be focussed.\n     */\n  }, {\n    key: \"clear\",\n    value: function clear() {\n      return this.value('').focus();\n    }\n\n    /**\n     * Focuses textarea. Returns `this`.\n     */\n  }, {\n    key: \"focus\",\n    value: function focus() {\n      this.textarea().focus();\n      return this;\n    }\n\n    /**\n     * Returns true if query is absent ('', undefined, null), false otherwise.\n     */\n  }, {\n    key: \"isEmpty\",\n    value: function isEmpty() {\n      return !this.value();\n    }\n\n    // Internal helpers. //\n  }, {\n    key: \"textarea\",\n    value: function textarea() {\n      return $(this.textareaRef.current);\n    }\n  }, {\n    key: \"controls\",\n    value: function controls() {\n      return $(this.controlsRef.current);\n    }\n  }, {\n    key: \"handleInput\",\n    value: function handleInput(evt) {\n      this.value(evt.target.value);\n    }\n\n    /**\n     * Hides or shows 'clear sequence' button.\n     *\n     * Rendering the 'clear sequence' button takes into account presence or\n     * absence of a scrollbar.\n     *\n     * Called by `componentDidUpdate`.\n     */\n  }, {\n    key: \"hideShowButton\",\n    value: function hideShowButton() {\n      if (!this.isEmpty()) {\n        // Calculation below is based on -\n        // http://chris-spittles.co.uk/jquery-calculate-scrollbar-width/\n        // FIXME: can reflow be avoided here?\n        var textareaNode = this.textarea()[0];\n        var sequenceControlsRight = textareaNode.offsetWidth - textareaNode.clientWidth;\n        this.controls().css('right', sequenceControlsRight + 17);\n        this.controls().removeClass('hidden');\n      } else {\n        // FIXME: what are lines 1, 2, & 3 doing here?\n        this.textarea().parent().removeClass('has-error');\n        this.$sequenceFile = $('#sequence-file');\n        this.$sequenceFile.empty();\n        this.controls().addClass('hidden');\n      }\n    }\n\n    /**\n     * Put red border around textarea.\n     */\n  }, {\n    key: \"indicateError\",\n    value: function indicateError() {\n      this.textarea().parent().addClass('has-error');\n    }\n\n    /**\n     * Put normal blue border around textarea.\n     */\n  }, {\n    key: \"indicateNormal\",\n    value: function indicateNormal() {\n      this.textarea().parent().removeClass('has-error');\n    }\n\n    /**\n     * Returns type of the query sequence (nucleotide, protein, mixed).\n     *\n     * Query widget supports executing a callback when the query type changes.\n     * Components interested in query type should register a callback instead\n     * of directly calling this method.\n     */\n  }, {\n    key: \"type\",\n    value: function type() {\n      var sequence = this.value().trim();\n      // FASTQ detected, but we don't know if conversion has succeeded yet\n      // will notify separately if it does\n      if (sequence.startsWith('@')) {\n        return undefined;\n      }\n      var sequences = sequence.split(/>.*/);\n      var type, tmp;\n      for (var i = 0; i < sequences.length; i++) {\n        tmp = this.guessSequenceType(sequences[i]);\n\n        // could not guess the sequence type; try the next sequence\n        if (!tmp) {\n          continue;\n        }\n        if (!type) {\n          // successfully guessed the type of atleast one sequence\n          type = tmp;\n        } else if (tmp !== type) {\n          // user has mixed different type of sequences\n          return 'mixed';\n        }\n      }\n      return type;\n    }\n  }, {\n    key: \"preProcessSequence\",\n    value: function preProcessSequence() {\n      var sequence = this.value();\n      var updatedSequence = (0,_fastq_to_fasta__WEBPACK_IMPORTED_MODULE_5__.fastqToFasta)(sequence);\n      if (sequence !== updatedSequence) {\n        this.value(updatedSequence);\n        this.notify('fastq');\n      }\n    }\n\n    /**\n     * Guesses and returns the type of the given sequence (nucleotide,\n     * protein).\n     */\n  }, {\n    key: \"guessSequenceType\",\n    value: function guessSequenceType(sequence) {\n      // remove 'noisy' characters\n      sequence = sequence.replace(/[^A-Z]/gi, ''); // non-letter characters\n      sequence = sequence.replace(/[NX]/gi, ''); // ambiguous  characters\n\n      // can't determine the type of ultrashort queries\n      if (sequence.length < 10) {\n        return undefined;\n      }\n\n      // count the number of putative NA\n      var putative_NA_count = 0;\n      for (var i = 0; i < sequence.length; i++) {\n        if (sequence[i].match(/[ACGTU]/i)) {\n          putative_NA_count += 1;\n        }\n      }\n      var threshold = 0.9 * sequence.length;\n      return putative_NA_count > threshold ? 'nucleotide' : 'protein';\n    }\n  }, {\n    key: \"notify\",\n    value: function notify(type) {\n      this.indicateNormal();\n      clearTimeout(this.notification_timeout);\n      // $('.notifications .active').hide().removeClass('active');\n\n      if (type) {\n        $('#' + type + '-sequence-notification').show('drop', {\n          direction: 'up'\n        }).addClass('active');\n        this.notification_timeout = setTimeout(function () {\n          $('.notifications .active').hide('drop', {\n            direction: 'up'\n          }).removeClass('active');\n        }, 5000);\n        if (type === 'mixed') {\n          this.indicateError();\n        }\n      }\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(\"div\", {\n        className: \"col-md-12\",\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"div\", {\n          className: \"sequence\",\n          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"textarea\", {\n            id: \"sequence\",\n            ref: this.textareaRef,\n            className: \"form-control text-monospace\",\n            name: \"sequence\",\n            value: this.state.value,\n            placeholder: \"Paste query sequence(s) or drag file containing query sequence(s) in FASTA format here ...\",\n            spellCheck: \"false\",\n            autoFocus: true,\n            onChange: this.handleInput\n          })\n        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"div\", {\n          className: \"hidden\",\n          style: {\n            position: 'absolute',\n            top: '4px',\n            right: '19px'\n          },\n          ref: this.controlsRef,\n          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(\"button\", {\n            type: \"button\",\n            className: \"btn btn-sm btn-default\",\n            id: \"btn-sequence-clear\",\n            title: \"Clear query sequence(s).\",\n            onClick: this.clear,\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"span\", {\n              id: \"sequence-file\"\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"i\", {\n              className: \"fa fa-times\"\n            })]\n          })\n        })]\n      });\n    }\n  }]);\n  return SearchQueryWidget;\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\n\n/**\n * Renders summary of all hits per query in a tabular form.\n */\nvar HitsTable = /*#__PURE__*/function (_Component3) {\n  _inherits(HitsTable, _Component3);\n  var _super3 = _createSuper(HitsTable);\n  function HitsTable(props) {\n    _classCallCheck(this, HitsTable);\n    return _super3.call(this, props);\n  }\n  _createClass(HitsTable, [{\n    key: \"render\",\n    value: function render() {\n      var hasName = underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].every(this.props.query.hits, function (hit) {\n        return hit.sciname !== '';\n      });\n\n      // Width of sequence column is 55% when species name is not shown and\n      // query coverage is.\n      var seqwidth = 55;\n      // If we are going to show species name, then reduce the width of\n      // sequence column by the width of species column.\n      if (hasName) seqwidth -= 15;\n      // If we are not going to show query coverage (i.e. for imported XML),\n      // then increase the width of sequence column by the width of coverage\n      // column.\n      if (this.props.imported_xml) seqwidth += 15;\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(\"div\", {\n        className: \"table-hit-overview\",\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(\"h4\", {\n          className: \"caption\",\n          \"data-toggle\": \"collapse\",\n          \"data-target\": '#Query_' + this.props.query.number + 'HT_' + this.props.query.number,\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"i\", {\n            className: \"fa fa-minus-square-o\"\n          }), \"\\xA0\", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"span\", {\n            children: \"Hit sequences producing significant alignments\"\n          })]\n        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"div\", {\n          className: \"collapsed in\",\n          id: 'Query_' + this.props.query.number + 'HT_' + this.props.query.number,\n          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(\"table\", {\n            className: \"table table-hover table-condensed tabular-view \",\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"thead\", {\n              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(\"tr\", {\n                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"th\", {\n                  className: \"text-left\",\n                  children: \"#\"\n                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"th\", {\n                  width: \"\".concat(seqwidth, \"%\"),\n                  children: \"Similar sequences\"\n                }), hasName && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"th\", {\n                  width: \"15%\",\n                  className: \"text-left\",\n                  children: \"Species\"\n                }), !this.props.imported_xml && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"th\", {\n                  width: \"15%\",\n                  className: \"text-right\",\n                  children: \"Query coverage (%)\"\n                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"th\", {\n                  width: \"10%\",\n                  className: \"text-right\",\n                  children: \"Total score\"\n                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"th\", {\n                  width: \"10%\",\n                  className: \"text-right\",\n                  children: \"E value\"\n                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"th\", {\n                  width: \"10%\",\n                  className: \"text-right\",\n                  children: \"Identity (%)\"\n                })]\n              })\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"tbody\", {\n              children: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].map(this.props.query.hits, underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function (hit) {\n                return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(\"tr\", {\n                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"td\", {\n                    className: \"text-left\",\n                    children: hit.number + '.'\n                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"td\", {\n                    className: \"nowrap-ellipsis\",\n                    title: \"\".concat(hit.id, \" \").concat(hit.title),\n                    \"data-toggle\": \"tooltip\",\n                    \"data-placement\": \"left\",\n                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(\"a\", {\n                      href: '#Query_' + this.props.query.number + '_hit_' + hit.number,\n                      className: \"btn-link\",\n                      children: [hit.id, \" \", hit.title]\n                    })\n                  }), hasName && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"td\", {\n                    className: \"nowrap-ellipsis\",\n                    title: hit.sciname,\n                    \"data-toggle\": \"tooltip\",\n                    \"data-placement\": \"top\",\n                    children: hit.sciname\n                  }), !this.props.imported_xml && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"td\", {\n                    className: \"text-right\",\n                    children: hit.qcovs\n                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"td\", {\n                    className: \"text-right\",\n                    children: hit.total_score\n                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"td\", {\n                    className: \"text-right\",\n                    children: _utils__WEBPACK_IMPORTED_MODULE_4__[\"default\"].inExponential(hit.hsps[0].evalue)\n                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(\"td\", {\n                    className: \"text-right\",\n                    children: _utils__WEBPACK_IMPORTED_MODULE_4__[\"default\"].inPercentage(hit.hsps[0].identity, hit.hsps[0].length)\n                  })]\n                }, hit.number);\n              }, this))\n            })]\n          })\n        })]\n      });\n    }\n  }]);\n  return HitsTable;\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\n\n//# sourceURL=webpack://SequenceServer/./public/js/query.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ReportQuery: () => (/* binding */ ReportQuery),\n/* harmony export */   SearchQueryWidget: () => (/* binding */ SearchQueryWidget)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var underscore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! underscore */ \"./node_modules/underscore/modules/index-all.js\");\n/* harmony import */ var _hits_overview__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./hits_overview */ \"./public/js/hits_overview.js\");\n/* harmony import */ var _length_distribution__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./length_distribution */ \"./public/js/length_distribution.js\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./utils */ \"./public/js/utils.js\");\n/* harmony import */ var _fastq_to_fasta__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./fastq_to_fasta */ \"./public/js/fastq_to_fasta.js\");\n/* harmony import */ var _collapse_preferences__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./collapse_preferences */ \"./public/js/collapse_preferences.js\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _callSuper(_this, derived, args) {\n  function isNativeReflectConstruct() {\n    if (typeof Reflect === \"undefined\" || !Reflect.construct) return false;\n    if (Reflect.construct.sham) return false;\n    if (typeof Proxy === \"function\") return true;\n    try {\n      return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));\n    } catch (e) {\n      return false;\n    }\n  }\n  derived = _getPrototypeOf(derived);\n  return _possibleConstructorReturn(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], _getPrototypeOf(_this).constructor) : derived.apply(_this, args));\n}\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\n\n\n // length distribution of hits\n\n\n\n\n/**\n * Query component displays query defline, graphical overview, length\n * distribution, and hits table.\n */\n\nvar ReportQuery = /*#__PURE__*/function (_Component) {\n  function ReportQuery() {\n    _classCallCheck(this, ReportQuery);\n    return _callSuper(this, ReportQuery, arguments);\n  }\n  _inherits(ReportQuery, _Component);\n  return _createClass(ReportQuery, [{\n    key: \"shouldComponentUpdate\",\n    value:\n    // Each update cycle will cause all previous queries to be re-rendered.\n    // We avoid that by implementing shouldComponentUpdate life-cycle hook.\n    // The trick is to simply check if the components has recieved props\n    // before.\n    function shouldComponentUpdate() {\n      // If the component has received props before, query property will\n      // be set on it. If it is, we return false so that the component\n      // is not re-rendered. If the query property is not set, we return\n      // true: this must be the first time react is trying to render the\n      // component.\n      return !this.props.query;\n    }\n    // Kind of public API //\n\n    /**\n     * Returns the id of query.\n     */\n  }, {\n    key: \"domID\",\n    value: function domID() {\n      return 'Query_' + this.props.query.number;\n    }\n  }, {\n    key: \"queryLength\",\n    value: function queryLength() {\n      return this.props.query.length;\n    }\n\n    /**\n     * Returns number of hits.\n     */\n  }, {\n    key: \"numhits\",\n    value: function numhits() {\n      return this.props.query.hits.length;\n    }\n  }, {\n    key: \"headerJSX\",\n    value: function headerJSX() {\n      var meta = \"length: \".concat(this.queryLength().toLocaleString());\n      if (this.props.showQueryCrumbs) {\n        meta = \"query \".concat(this.props.query.number, \", \") + meta;\n      }\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"div\", {\n        className: \"section-header\",\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"h3\", {\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"strong\", {\n            children: [\"Query=\\xA0\", this.props.query.id]\n          }), \"\\xA0\", this.props.query.title]\n        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"span\", {\n          className: \"label label-reset pos-label\",\n          children: meta\n        })]\n      });\n    }\n  }, {\n    key: \"hitsListJSX\",\n    value: function hitsListJSX() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"div\", {\n        className: \"section-content\",\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_hits_overview__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n          query: this.props.query,\n          program: this.props.program,\n          collapsed: this.props.veryBig\n        }, 'GO_' + this.props.query.number), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_length_distribution__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n          query: this.props.query,\n          algorithm: this.props.program\n        }, 'LD_' + this.props.query.id), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(HitsTable, {\n          query: this.props.query,\n          imported_xml: this.props.imported_xml\n        }, 'HT_' + this.props.query.number)]\n      });\n    }\n  }, {\n    key: \"noHitsJSX\",\n    value: function noHitsJSX() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n        className: \"section-content\",\n        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"strong\", {\n          children: \" ****** No BLAST hits found ****** \"\n        })\n      });\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"div\", {\n        className: \"resultn\",\n        id: this.domID(),\n        \"data-query-len\": this.props.query.length,\n        \"data-algorithm\": this.props.program,\n        children: [this.headerJSX(), this.numhits() && this.hitsListJSX() || this.noHitsJSX()]\n      });\n    }\n  }]);\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\n\n/**\n * Query widget for Search component.\n */\nvar SearchQueryWidget = /*#__PURE__*/function (_Component2) {\n  function SearchQueryWidget(props) {\n    var _this2;\n    _classCallCheck(this, SearchQueryWidget);\n    _this2 = _callSuper(this, SearchQueryWidget, [props]);\n    _this2.state = {\n      value: $('input#input_sequence').val() || ''\n    };\n    _this2.value = _this2.value.bind(_this2);\n    _this2.clear = _this2.clear.bind(_this2);\n    _this2.focus = _this2.focus.bind(_this2);\n    _this2.isEmpty = _this2.isEmpty.bind(_this2);\n    _this2.textarea = _this2.textarea.bind(_this2);\n    _this2.controls = _this2.controls.bind(_this2);\n    _this2.handleInput = _this2.handleInput.bind(_this2);\n    _this2.hideShowButton = _this2.hideShowButton.bind(_this2);\n    _this2.indicateError = _this2.indicateError.bind(_this2);\n    _this2.indicateNormal = _this2.indicateNormal.bind(_this2);\n    _this2.type = _this2.type.bind(_this2);\n    _this2.guessSequenceType = _this2.guessSequenceType.bind(_this2);\n    _this2.preProcessSequence = _this2.preProcessSequence.bind(_this2);\n    _this2.notify = _this2.notify.bind(_this2);\n    _this2.textareaRef = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.createRef)();\n    _this2.controlsRef = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.createRef)();\n    return _this2;\n  }\n\n  // LIFECYCLE Methods\n  _inherits(SearchQueryWidget, _Component2);\n  return _createClass(SearchQueryWidget, [{\n    key: \"componentDidMount\",\n    value: function componentDidMount() {\n      $('body').click(function () {\n        $('[data-notifications] [data-role=notification].active').hide('drop', {\n          direction: 'up'\n        }).removeClass('active');\n      });\n    }\n  }, {\n    key: \"componentDidUpdate\",\n    value: function componentDidUpdate() {\n      this.hideShowButton();\n      this.preProcessSequence();\n      this.props.onSequenceChanged(this.residuesCount());\n      var type = this.type();\n      if (!type || type !== this._type) {\n        this._type = type;\n        this.notify(type);\n        this.props.onSequenceTypeChanged(type);\n      }\n    }\n\n    // Kind of public API. //\n\n    /**\n     * Returns query sequence if no argument is provided (or null or undefined\n     * is provided as argument). Otherwise, sets query sequence to the given\n     * value and returns `this`.\n     *\n     * Default/initial state of query sequence is an empty string. Caller must\n     * explicitly provide empty string as argument to \"reset\" query sequence.\n     */\n  }, {\n    key: \"value\",\n    value: function value(val) {\n      if (val == null) {\n        // i.e., val is null or undefined\n        return this.state.value;\n      } else {\n        this.setState({\n          value: val\n        });\n        return this;\n      }\n    }\n  }, {\n    key: \"residuesCount\",\n    value: function residuesCount() {\n      var sequence = this.value();\n      var lines = sequence.split('\\n');\n      var residuesCount = lines.reduce(function (count, line) {\n        if (!line.startsWith('>')) {\n          return count + line.length;\n        }\n        return count;\n      }, 0);\n      return residuesCount;\n    }\n\n    /**\n     * Clears textarea. Returns `this`.\n     *\n     * Clearing textarea also causes it to be focussed.\n     */\n  }, {\n    key: \"clear\",\n    value: function clear() {\n      return this.value('').focus();\n    }\n\n    /**\n     * Focuses textarea. Returns `this`.\n     */\n  }, {\n    key: \"focus\",\n    value: function focus() {\n      this.textarea().focus();\n      return this;\n    }\n\n    /**\n     * Returns true if query is absent ('', undefined, null), false otherwise.\n     */\n  }, {\n    key: \"isEmpty\",\n    value: function isEmpty() {\n      return !this.value();\n    }\n\n    // Internal helpers. //\n  }, {\n    key: \"textarea\",\n    value: function textarea() {\n      return $(this.textareaRef.current);\n    }\n  }, {\n    key: \"controls\",\n    value: function controls() {\n      return $(this.controlsRef.current);\n    }\n  }, {\n    key: \"handleInput\",\n    value: function handleInput(evt) {\n      this.value(evt.target.value);\n    }\n\n    /**\n     * Hides or shows 'clear sequence' button.\n     *\n     * Rendering the 'clear sequence' button takes into account presence or\n     * absence of a scrollbar.\n     *\n     * Called by `componentDidUpdate`.\n     */\n  }, {\n    key: \"hideShowButton\",\n    value: function hideShowButton() {\n      if (!this.isEmpty()) {\n        // Calculation below is based on -\n        // http://chris-spittles.co.uk/jquery-calculate-scrollbar-width/\n        // FIXME: can reflow be avoided here?\n        var textareaNode = this.textarea()[0];\n        var sequenceControlsRight = textareaNode.offsetWidth - textareaNode.clientWidth;\n        this.controls().css('right', sequenceControlsRight + 17);\n        this.controls().removeClass('hidden');\n      } else {\n        // FIXME: what are lines 1, 2, & 3 doing here?\n        this.textarea().parent().removeClass('has-error');\n        this.$sequenceFile = $('#sequence-file');\n        this.$sequenceFile.empty();\n        this.controls().addClass('hidden');\n      }\n    }\n\n    /**\n     * Put red border around textarea.\n     */\n  }, {\n    key: \"indicateError\",\n    value: function indicateError() {\n      this.textarea().parent().addClass('has-error');\n    }\n\n    /**\n     * Put normal blue border around textarea.\n     */\n  }, {\n    key: \"indicateNormal\",\n    value: function indicateNormal() {\n      this.textarea().parent().removeClass('has-error');\n    }\n\n    /**\n     * Returns type of the query sequence (nucleotide, protein, mixed).\n     *\n     * Query widget supports executing a callback when the query type changes.\n     * Components interested in query type should register a callback instead\n     * of directly calling this method.\n     */\n  }, {\n    key: \"type\",\n    value: function type() {\n      var sequence = this.value().trim();\n      // FASTQ detected, but we don't know if conversion has succeeded yet\n      // will notify separately if it does\n      if (sequence.startsWith('@')) {\n        return undefined;\n      }\n      var sequences = sequence.split(/>.*/);\n      var type, tmp;\n      for (var i = 0; i < sequences.length; i++) {\n        tmp = this.guessSequenceType(sequences[i]);\n\n        // could not guess the sequence type; try the next sequence\n        if (!tmp) {\n          continue;\n        }\n        if (!type) {\n          // successfully guessed the type of atleast one sequence\n          type = tmp;\n        } else if (tmp !== type) {\n          // user has mixed different type of sequences\n          return 'mixed';\n        }\n      }\n      return type;\n    }\n  }, {\n    key: \"preProcessSequence\",\n    value: function preProcessSequence() {\n      var sequence = this.value();\n      var updatedSequence = (0,_fastq_to_fasta__WEBPACK_IMPORTED_MODULE_5__.fastqToFasta)(sequence);\n      if (sequence !== updatedSequence) {\n        this.value(updatedSequence);\n        this.notify('fastq');\n      }\n    }\n\n    /**\n     * Guesses and returns the type of the given sequence (nucleotide,\n     * protein).\n     */\n  }, {\n    key: \"guessSequenceType\",\n    value: function guessSequenceType(sequence) {\n      // remove 'noisy' characters\n      sequence = sequence.replace(/[^A-Z]/gi, ''); // non-letter characters\n      sequence = sequence.replace(/[NX]/gi, ''); // ambiguous  characters\n\n      // can't determine the type of ultrashort queries\n      if (sequence.length < 10) {\n        return undefined;\n      }\n\n      // count the number of putative NA\n      var putative_NA_count = 0;\n      for (var i = 0; i < sequence.length; i++) {\n        if (sequence[i].match(/[ACGTU]/i)) {\n          putative_NA_count += 1;\n        }\n      }\n      var threshold = 0.9 * sequence.length;\n      return putative_NA_count > threshold ? 'nucleotide' : 'protein';\n    }\n  }, {\n    key: \"notify\",\n    value: function notify(type) {\n      this.indicateNormal();\n      clearTimeout(this.notification_timeout);\n      // $('[data-notifications] [data-role=notification].active').hide().removeClass('active');\n\n      if (type) {\n        $('#' + type + '-sequence-notification').show('drop', {\n          direction: 'up'\n        }).addClass('active');\n        this.notification_timeout = setTimeout(function () {\n          $('[data-notifications] [data-role=notification].active').hide('drop', {\n            direction: 'up'\n          }).removeClass('active');\n        }, 5000);\n        if (type === 'mixed') {\n          this.indicateError();\n        }\n      }\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"div\", {\n        className: \"relative\",\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n          className: \"sequence\",\n          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"textarea\", {\n            id: \"sequence\",\n            ref: this.textareaRef,\n            className: \"block w-full p-4 text-gray-900 border border-gray-300 rounded-l-lg rounded-tr-lg bg-gray-50 text-base text-monospace\",\n            name: \"sequence\",\n            value: this.state.value,\n            rows: \"6\",\n            required: \"required\",\n            placeholder: \"Paste query sequence(s) or drag file containing query sequence(s) in FASTA format here ...\",\n            spellCheck: \"false\",\n            autoFocus: true,\n            onChange: this.handleInput\n          })\n        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n          className: \"hidden absolute top-2 right-2\",\n          ref: this.controlsRef,\n          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"button\", {\n            type: \"button\",\n            className: \"border border-gray-300 rounded bg-white hover:bg-gray-200\",\n            id: \"btn-sequence-clear\",\n            title: \"Clear query sequence(s).\",\n            onClick: this.clear,\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"span\", {\n              id: \"sequence-file\"\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"i\", {\n              className: \"fa fa-times w-6 h-6 p-1\"\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"span\", {\n              className: \"sr-only\",\n              children: \"Clear query sequence(s).\"\n            })]\n          })\n        })]\n      });\n    }\n  }]);\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\n\n/**\n * Renders summary of all hits per query in a tabular form.\n */\nvar HitsTable = /*#__PURE__*/function (_Component3) {\n  function HitsTable(props) {\n    var _this3;\n    _classCallCheck(this, HitsTable);\n    _this3 = _callSuper(this, HitsTable, [props]);\n    _this3.name = 'Hit sequences producing significant alignments';\n    _this3.collapsePreferences = new _collapse_preferences__WEBPACK_IMPORTED_MODULE_6__[\"default\"](_this3);\n    _this3.state = {\n      collapsed: _this3.collapsePreferences.preferenceStoredAsCollapsed()\n    };\n    return _this3;\n  }\n  _inherits(HitsTable, _Component3);\n  return _createClass(HitsTable, [{\n    key: \"tableJSX\",\n    value: function tableJSX() {\n      var hasName = underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].every(this.props.query.hits, function (hit) {\n        return hit.sciname !== '';\n      });\n\n      // Width of sequence column is 55% when species name is not shown and\n      // query coverage is.\n      var seqwidth = 55;\n      // If we are going to show species name, then reduce the width of\n      // sequence column by the width of species column.\n      if (hasName) seqwidth -= 15;\n      // If we are not going to show query coverage (i.e. for imported XML),\n      // then increase the width of sequence column by the width of coverage\n      // column.\n      if (this.props.imported_xml) seqwidth += 15;\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"table\", {\n        className: \"table table-hover table-condensed tabular-view \",\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"thead\", {\n          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"tr\", {\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"th\", {\n              className: \"text-left\",\n              children: \"#\"\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"th\", {\n              width: \"\".concat(seqwidth, \"%\"),\n              children: \"Similar sequences\"\n            }), hasName && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"th\", {\n              width: \"15%\",\n              className: \"text-left\",\n              children: \"Species\"\n            }), !this.props.imported_xml && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"th\", {\n              width: \"15%\",\n              className: \"text-right\",\n              children: \"Query coverage (%)\"\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"th\", {\n              width: \"10%\",\n              className: \"text-right\",\n              children: \"Total score\"\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"th\", {\n              width: \"10%\",\n              className: \"text-right\",\n              children: \"E value\"\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"th\", {\n              width: \"10%\",\n              className: \"text-right\",\n              children: \"Identity (%)\"\n            })]\n          })\n        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"tbody\", {\n          children: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].map(this.props.query.hits, underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function (hit) {\n            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"tr\", {\n              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"td\", {\n                className: \"text-left\",\n                children: hit.number + '.'\n              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"td\", {\n                className: \"nowrap-ellipsis\",\n                title: \"\".concat(hit.id, \" \").concat(hit.title),\n                \"data-toggle\": \"tooltip\",\n                \"data-placement\": \"left\",\n                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"a\", {\n                  href: '#Query_' + this.props.query.number + '_hit_' + hit.number,\n                  className: \"btn-link\",\n                  children: [hit.id, \" \", hit.title]\n                })\n              }), hasName && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"td\", {\n                className: \"nowrap-ellipsis\",\n                title: hit.sciname,\n                \"data-toggle\": \"tooltip\",\n                \"data-placement\": \"top\",\n                children: hit.sciname\n              }), !this.props.imported_xml && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"td\", {\n                className: \"text-right\",\n                children: hit.qcovs\n              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"td\", {\n                className: \"text-right\",\n                children: hit.total_score\n              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"td\", {\n                className: \"text-right\",\n                children: _utils__WEBPACK_IMPORTED_MODULE_4__[\"default\"].inExponential(hit.hsps[0].evalue)\n              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"td\", {\n                className: \"text-right\",\n                children: _utils__WEBPACK_IMPORTED_MODULE_4__[\"default\"].inPercentage(hit.hsps[0].identity, hit.hsps[0].length)\n              })]\n            }, hit.number);\n          }, this))\n        })]\n      });\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      var _this4 = this;\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"div\", {\n        className: \"table-hit-overview\",\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"h4\", {\n          className: \"caption\",\n          onClick: function onClick() {\n            return _this4.collapsePreferences.toggleCollapse();\n          },\n          children: [this.collapsePreferences.renderCollapseIcon(), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(\"span\", {\n            children: [\" \", this.name]\n          })]\n        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(\"div\", {\n          id: 'Query_' + this.props.query.number + 'HT_' + this.props.query.number,\n          children: !this.state.collapsed && this.tableJSX()\n        })]\n      });\n    }\n  }]);\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\n\n//# sourceURL=webpack://SequenceServer/./public/js/query.js?");
 
 /***/ }),
 
@@ -148,7 +192,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _jquery_world__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./jquery_world */ \"./public/js/jquery_world.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var react_dom_client__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-dom/client */ \"./node_modules/react-dom/client.js\");\n/* harmony import */ var _dnd__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./dnd */ \"./public/js/dnd.js\");\n/* harmony import */ var _form__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./form */ \"./public/js/form.js\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\n\n\n\n\n\n/**\n * Clear sessionStorage on reload.\n */\n\n\nif (performance.navigation.type == performance.navigation.TYPE_RELOAD) {\n  sessionStorage.clear();\n  history.replaceState(null, \"\", location.href.split(\"?\")[0]);\n}\nvar Page = /*#__PURE__*/function (_Component) {\n  _inherits(Page, _Component);\n  var _super = _createSuper(Page);\n  function Page() {\n    _classCallCheck(this, Page);\n    return _super.apply(this, arguments);\n  }\n  _createClass(Page, [{\n    key: \"componentDidMount\",\n    value: function componentDidMount() {\n      this.refs.dnd.setState({\n        query: this.refs.form.refs.query\n      });\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)(\"div\", {\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_dnd__WEBPACK_IMPORTED_MODULE_3__.DnD, {\n          ref: \"dnd\"\n        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_form__WEBPACK_IMPORTED_MODULE_4__.Form, {\n          ref: \"form\"\n        })]\n      });\n    }\n  }]);\n  return Page;\n}(react__WEBPACK_IMPORTED_MODULE_1__.Component);\nvar root = (0,react_dom_client__WEBPACK_IMPORTED_MODULE_2__.createRoot)(document.getElementById(\"view\"));\nroot.render( /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Page, {}));\n\n//# sourceURL=webpack://SequenceServer/./public/js/search.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _jquery_world__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./jquery_world */ \"./public/js/jquery_world.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var react_dom_client__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-dom/client */ \"./node_modules/react-dom/client.js\");\n/* harmony import */ var _dnd__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./dnd */ \"./public/js/dnd.js\");\n/* harmony import */ var _form__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./form */ \"./public/js/form.js\");\n/* harmony import */ var search_header_plugin__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! search_header_plugin */ \"./public/js/null_plugins/search_header_plugin.js\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _callSuper(_this, derived, args) {\n  function isNativeReflectConstruct() {\n    if (typeof Reflect === \"undefined\" || !Reflect.construct) return false;\n    if (Reflect.construct.sham) return false;\n    if (typeof Proxy === \"function\") return true;\n    try {\n      return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));\n    } catch (e) {\n      return false;\n    }\n  }\n  derived = _getPrototypeOf(derived);\n  return _possibleConstructorReturn(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], _getPrototypeOf(_this).constructor) : derived.apply(_this, args));\n}\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\n\n\n\n\n\n\n/**\n * Clear sessionStorage on reload.\n */\n\nif (performance.navigation.type == performance.navigation.TYPE_RELOAD) {\n  sessionStorage.clear();\n  history.replaceState(null, \"\", location.href.split(\"?\")[0]);\n}\nvar Page = /*#__PURE__*/function (_Component) {\n  function Page() {\n    _classCallCheck(this, Page);\n    return _callSuper(this, Page, arguments);\n  }\n  _inherits(Page, _Component);\n  return _createClass(Page, [{\n    key: \"componentDidMount\",\n    value: function componentDidMount() {\n      this.refs.dnd.setState({\n        query: this.refs.form.refs.query\n      });\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(\"div\", {\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(search_header_plugin__WEBPACK_IMPORTED_MODULE_5__.SearchHeaderPlugin, {}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_dnd__WEBPACK_IMPORTED_MODULE_3__.DnD, {\n          ref: \"dnd\"\n        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_form__WEBPACK_IMPORTED_MODULE_4__.Form, {\n          ref: \"form\"\n        })]\n      });\n    }\n  }]);\n}(react__WEBPACK_IMPORTED_MODULE_1__.Component);\nvar root = (0,react_dom_client__WEBPACK_IMPORTED_MODULE_2__.createRoot)(document.getElementById(\"view\"));\nroot.render( /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(Page, {}));\n\n//# sourceURL=webpack://SequenceServer/./public/js/search.js?");
 
 /***/ }),
 
@@ -159,7 +203,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _jqu
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   SearchButton: () => (/* binding */ SearchButton)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var underscore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! underscore */ \"./node_modules/underscore/modules/index-all.js\");\n/* harmony import */ var _jquery_world__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./jquery_world */ \"./public/js/jquery_world.js\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\nfunction _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _isNativeReflectConstruct() { if (typeof Reflect === \"undefined\" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === \"function\") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\n\n\n\n/**\n * SearchButton widget.\n */\n\n\nvar SearchButton = /*#__PURE__*/function (_Component) {\n  _inherits(SearchButton, _Component);\n  var _super = _createSuper(SearchButton);\n  function SearchButton(props) {\n    var _this;\n    _classCallCheck(this, SearchButton);\n    _this = _super.call(this, props);\n    _this.state = {\n      methods: [],\n      hasQuery: false,\n      hasDatabases: false\n    };\n    _this.inputGroup = _this.inputGroup.bind(_assertThisInitialized(_this));\n    _this.submitButton = _this.submitButton.bind(_assertThisInitialized(_this));\n    _this.initTooltip = _this.initTooltip.bind(_assertThisInitialized(_this));\n    _this.showTooltip = _this.showTooltip.bind(_assertThisInitialized(_this));\n    _this.hideTooltip = _this.hideTooltip.bind(_assertThisInitialized(_this));\n    _this.changeAlgorithm = _this.changeAlgorithm.bind(_assertThisInitialized(_this));\n    _this.decorate = _this.decorate.bind(_assertThisInitialized(_this));\n    _this.inputGroupRef = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.createRef)();\n    _this.submitButtonRef = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.createRef)();\n    return _this;\n  }\n  _createClass(SearchButton, [{\n    key: \"componentDidMount\",\n    value: function componentDidMount() {\n      this.initTooltip();\n    }\n  }, {\n    key: \"shouldComponentUpdate\",\n    value: function shouldComponentUpdate(props, state) {\n      return !underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].isEqual(state.methods, this.state.methods);\n    }\n  }, {\n    key: \"componentDidUpdate\",\n    value: function componentDidUpdate() {\n      if (this.state.methods.length > 0) {\n        this.inputGroup().wiggle();\n        this.props.onAlgoChanged(this.state.methods[0]);\n      } else {\n        this.props.onAlgoChanged('');\n      }\n    }\n    // Internal helpers. //\n\n    /**\n    * Returns jquery wrapped input group.\n    */\n  }, {\n    key: \"inputGroup\",\n    value: function inputGroup() {\n      return $(this.inputGroupRef.current);\n    }\n\n    /**\n    * Returns jquery wrapped submit button.\n    */\n  }, {\n    key: \"submitButton\",\n    value: function submitButton() {\n      return $(this.submitButtonRef.current);\n    }\n\n    /**\n    * Initialise tooltip on input group and submit button.\n    */\n  }, {\n    key: \"initTooltip\",\n    value: function initTooltip() {\n      this.inputGroup().tooltip({\n        trigger: 'manual',\n        title: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function () {\n          if (!this.state.hasQuery && !this.state.hasDatabases) {\n            return 'You must enter a query sequence and select one or more databases above before you can run a search!';\n          } else if (this.state.hasQuery && !this.state.hasDatabases) {\n            return 'You must select one or more databases above before you can run a search!';\n          } else if (!this.state.hasQuery && this.state.hasDatabases) {\n            return 'You must enter a query sequence above before you can run a search!';\n          }\n        }, this)\n      });\n      this.submitButton().tooltip({\n        title: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function () {\n          var title = 'Click to BLAST or press Ctrl+Enter.';\n          if (this.state.methods.length > 1) {\n            title += ' Click dropdown button on the right for other' + ' BLAST algorithms that can be used.';\n          }\n          return title;\n        }, this)\n      });\n    }\n\n    /**\n    * Show tooltip on input group.\n    */\n  }, {\n    key: \"showTooltip\",\n    value: function showTooltip() {\n      this.inputGroup()._tooltip('show');\n    }\n\n    /**\n    * Hide tooltip on input group.\n    */\n  }, {\n    key: \"hideTooltip\",\n    value: function hideTooltip() {\n      this.inputGroup()._tooltip('hide');\n    }\n\n    /**\n    * Change selected algorithm.\n    *\n    * NOTE: Called on click on dropdown menu items.\n    */\n  }, {\n    key: \"changeAlgorithm\",\n    value: function changeAlgorithm(method) {\n      var methods = this.state.methods.slice();\n      methods.splice(methods.indexOf(method), 1);\n      methods.unshift(method);\n      this.setState({\n        methods: methods\n      });\n    }\n\n    /**\n    * Given, for example 'blastp', returns blast<strong>p</strong>.\n    */\n  }, {\n    key: \"decorate\",\n    value: function decorate(name) {\n      return name.match(/(.?)(blast)(.?)/).slice(1).map(function (token, _) {\n        if (token) {\n          if (token !== 'blast') {\n            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"strong\", {\n              children: token\n            }, token);\n          } else {\n            return token;\n          }\n        }\n      });\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      var methods = this.state.methods;\n      var method = methods[0];\n      var multi = methods.length > 1;\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"div\", {\n        className: \"col-md-3\",\n        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"div\", {\n          className: \"form-group\",\n          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"div\", {\n            className: \"col-md-12\",\n            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"div\", {\n              className: multi ? 'input-group' : '',\n              id: \"methods\",\n              ref: this.inputGroupRef,\n              onMouseOver: this.showTooltip,\n              onMouseOut: this.hideTooltip,\n              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"button\", {\n                type: \"submit\",\n                className: \"btn btn-primary form-control text-uppercase\",\n                id: \"method\",\n                ref: this.submitButtonRef,\n                name: \"method\",\n                value: method,\n                disabled: !method,\n                children: this.decorate(method || 'blast')\n              }), multi && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"div\", {\n                className: \"input-group-btn\",\n                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"button\", {\n                  className: \"btn btn-primary dropdown-toggle\",\n                  \"data-toggle\": \"dropdown\",\n                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"span\", {\n                    className: \"caret\"\n                  })\n                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"ul\", {\n                  className: \"dropdown-menu dropdown-menu-right\",\n                  children: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].map(methods.slice(1), underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function (method) {\n                    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"li\", {\n                      className: \"text-uppercase\",\n                      onClick: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function () {\n                        this.changeAlgorithm(method);\n                      }, this),\n                      children: method\n                    }, method);\n                  }, this))\n                })]\n              })]\n            })\n          })\n        })\n      });\n    }\n  }]);\n  return SearchButton;\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\n\n//# sourceURL=webpack://SequenceServer/./public/js/search_button.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   SearchButton: () => (/* binding */ SearchButton)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var underscore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! underscore */ \"./node_modules/underscore/modules/index-all.js\");\n/* harmony import */ var _jquery_world__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./jquery_world */ \"./public/js/jquery_world.js\");\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* provided dependency */ var $ = __webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\");\nfunction _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _callSuper(_this, derived, args) {\n  function isNativeReflectConstruct() {\n    if (typeof Reflect === \"undefined\" || !Reflect.construct) return false;\n    if (Reflect.construct.sham) return false;\n    if (typeof Proxy === \"function\") return true;\n    try {\n      return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));\n    } catch (e) {\n      return false;\n    }\n  }\n  derived = _getPrototypeOf(derived);\n  return _possibleConstructorReturn(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], _getPrototypeOf(_this).constructor) : derived.apply(_this, args));\n}\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\n\n\n\n/**\n * SearchButton widget.\n */\n\nvar SearchButton = /*#__PURE__*/function (_Component) {\n  function SearchButton(props) {\n    var _this2;\n    _classCallCheck(this, SearchButton);\n    _this2 = _callSuper(this, SearchButton, [props]);\n    _defineProperty(_this2, \"toggleDropdownVisibility\", function () {\n      _this2.setState(function (prevState) {\n        return {\n          dropdownVisible: !prevState.dropdownVisible\n        };\n      });\n    });\n    _this2.state = {\n      methods: [],\n      hasQuery: false,\n      hasDatabases: false,\n      dropdownVisible: false\n    };\n    _this2.inputGroup = _this2.inputGroup.bind(_this2);\n    _this2.submitButton = _this2.submitButton.bind(_this2);\n    _this2.initTooltip = _this2.initTooltip.bind(_this2);\n    _this2.showTooltip = _this2.showTooltip.bind(_this2);\n    _this2.hideTooltip = _this2.hideTooltip.bind(_this2);\n    _this2.changeAlgorithm = _this2.changeAlgorithm.bind(_this2);\n    _this2.decorate = _this2.decorate.bind(_this2);\n    _this2.inputGroupRef = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.createRef)();\n    _this2.submitButtonRef = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.createRef)();\n    return _this2;\n  }\n  _inherits(SearchButton, _Component);\n  return _createClass(SearchButton, [{\n    key: \"componentDidMount\",\n    value: function componentDidMount() {\n      this.initTooltip();\n    }\n  }, {\n    key: \"shouldComponentUpdate\",\n    value: function shouldComponentUpdate(props, state) {\n      return !underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].isEqual(state.methods, this.state.methods) || state.dropdownVisible !== this.state.dropdownVisible;\n    }\n  }, {\n    key: \"componentDidUpdate\",\n    value: function componentDidUpdate(_prevProps, prevState) {\n      if (!underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].isEqual(prevState.methods, this.state.methods)) {\n        if (this.state.methods.length > 0) {\n          this.inputGroup().wiggle();\n          this.props.onAlgoChanged(this.state.methods[0]);\n        } else {\n          this.props.onAlgoChanged('');\n        }\n      }\n    }\n    // Internal helpers. //\n\n    /**\n    * Returns jquery wrapped input group.\n    */\n  }, {\n    key: \"inputGroup\",\n    value: function inputGroup() {\n      return $(this.inputGroupRef.current);\n    }\n\n    /**\n    * Returns jquery wrapped submit button.\n    */\n  }, {\n    key: \"submitButton\",\n    value: function submitButton() {\n      return $(this.submitButtonRef.current);\n    }\n\n    /**\n    * Initialise tooltip on input group and submit button.\n    */\n  }, {\n    key: \"initTooltip\",\n    value: function initTooltip() {\n      this.inputGroup().tooltip({\n        trigger: 'manual',\n        title: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function () {\n          if (!this.state.hasQuery && !this.state.hasDatabases) {\n            return 'You must enter a query sequence and select one or more databases above before you can run a search!';\n          } else if (this.state.hasQuery && !this.state.hasDatabases) {\n            return 'You must select one or more databases above before you can run a search!';\n          } else if (!this.state.hasQuery && this.state.hasDatabases) {\n            return 'You must enter a query sequence above before you can run a search!';\n          }\n        }, this)\n      });\n      this.submitButton().tooltip({\n        title: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function () {\n          var title = 'Click to BLAST or press Ctrl+Enter.';\n          if (this.state.methods.length > 1) {\n            title += ' Click dropdown button on the right for other' + ' BLAST algorithms that can be used.';\n          }\n          return title;\n        }, this)\n      });\n    }\n\n    /**\n    * Show tooltip on input group.\n    */\n  }, {\n    key: \"showTooltip\",\n    value: function showTooltip() {\n      this.inputGroup()._tooltip('show');\n    }\n\n    /**\n    * Hide tooltip on input group.\n    */\n  }, {\n    key: \"hideTooltip\",\n    value: function hideTooltip() {\n      this.inputGroup()._tooltip('hide');\n    }\n\n    /**\n    * Change selected algorithm.\n    *\n    * NOTE: Called on click on dropdown menu items.\n    */\n  }, {\n    key: \"changeAlgorithm\",\n    value: function changeAlgorithm(method) {\n      var methods = this.state.methods.slice();\n      methods.splice(methods.indexOf(method), 1);\n      methods.unshift(method);\n      this.setState({\n        methods: methods,\n        dropdownVisible: false\n      });\n    }\n\n    /**\n    * Given, for example 'blastp', returns blast<strong>p</strong>.\n    */\n  }, {\n    key: \"decorate\",\n    value: function decorate(name) {\n      return name.match(/(.?)(blast)(.?)/).slice(1).map(function (token, _) {\n        if (token) {\n          if (token !== 'blast') {\n            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"strong\", {\n              children: token\n            }, token);\n          } else {\n            return token;\n          }\n        }\n      });\n    }\n  }, {\n    key: \"render\",\n    value: function render() {\n      var methods = this.state.methods;\n      var method = methods[0];\n      var multi = methods.length > 1;\n      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"div\", {\n        // className={multi ? 'flex' : 'flex'}\n        className: \"my-4 md:my-2 flex justify-end w-full md:w-auto relative\",\n        id: \"methods\",\n        ref: this.inputGroupRef,\n        onMouseOver: this.showTooltip,\n        onMouseOut: this.hideTooltip,\n        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"button\", {\n          type: \"submit\",\n          className: \"uppercase w-full md:w-auto flex text-xl justify-center py-2 px-16 border border-transparent rounded-md shadow-sm text-white bg-seqblue hover:bg-seqorange focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-seqorange\",\n          id: \"method\",\n          ref: this.submitButtonRef,\n          name: \"method\",\n          value: method,\n          disabled: !method,\n          children: this.decorate(method || 'blast')\n        }), multi && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"div\", {\n          className: \"ui--multi-dropdown\",\n          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(\"button\", {\n            className: \"text-xl bg-seqblue rounded-r-md text-white p-2 border border-seqblue hover:bg-seqorange focus:outline-none focus:ring-1 focus:ring-seqorange -ml-8\",\n            type: \"button\",\n            onClick: this.toggleDropdownVisibility,\n            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"i\", {\n              className: \"fas fa-caret-down w-6 h-6 fill-current\"\n            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"span\", {\n              className: \"sr-only\",\n              children: \"Other methods\"\n            })]\n          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"div\", {\n            id: \"dropdown\",\n            className: \"z-10 my-2 uppercase bg-blue-300 divide-y divide-gray-100 rounded-lg shadow absolute left-0 bottom-12 w-full text-xl text-center \".concat(this.state.dropdownVisible ? '' : 'hidden'),\n            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"ul\", {\n              className: \"text-gray-700\",\n              \"aria-labelledby\": \"dropdownDefaultButton\",\n              children: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].map(methods.slice(1), underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function (method) {\n                return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"li\", {\n                  onClick: underscore__WEBPACK_IMPORTED_MODULE_1__[\"default\"].bind(function () {\n                    this.changeAlgorithm(method);\n                  }, this),\n                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(\"a\", {\n                    href: \"#\",\n                    className: \"block px-4 py-2 hover:bg-blue-400 rounded-lg\",\n                    children: method\n                  })\n                }, method);\n              }, this))\n            })\n          })]\n        })]\n      });\n    }\n  }]);\n}(react__WEBPACK_IMPORTED_MODULE_0__.Component);\n\n//# sourceURL=webpack://SequenceServer/./public/js/search_button.js?");
 
 /***/ }),
 
@@ -181,7 +225,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _exp
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n\n\n\nvar Utils = {\n  /***********************************\n   * Formatters for hits & hsp table *\n   ***********************************/\n\n  // Formats an array of two elements as \"first (last)\".\n  format_2_tuple: function format_2_tuple(tuple) {\n    return tuple[0] + ' (' + tuple[tuple.length - 1] + ')';\n  },\n  /**\n   * Returns fraction as percentage\n   */\n  inPercentage: function inPercentage(num, den) {\n    var x = (num * 100.0 / den).toFixed(1);\n    if (x % 1 == 0) {\n      x = parseInt(x, 10);\n      return \"\".concat(x, \"%\");\n    } else {\n      return \"\".concat(x, \"%\");\n    }\n  },\n  /**\n   * Returns fractional representation as String.\n   */\n  inFraction: function inFraction(num, den) {\n    return num + '/' + den;\n  },\n  /**\n   * Returns given Float as String formatted to two decimal places.\n   */\n  inTwoDecimal: function inTwoDecimal(num) {\n    return num.toFixed(2);\n  },\n  /**\n   * Returns zero if num is zero. Returns two decimal representation of num\n   * if num is between [1..10). Returns num in scientific notation otherwise.\n   */\n  inExponential: function inExponential(num) {\n    // Nothing to do if num is 0.\n    if (num === 0) {\n      return 0;\n    }\n\n    // Round to two decimal places if in the rane [1..10).\n    if (num >= 1 && num < 10) {\n      return this.inTwoDecimal(num);\n    }\n\n    // Return numbers in the range [0..1) and [10..Inf] in\n    // scientific format.\n    var exp = num.toExponential(2);\n    var parts = exp.split('e');\n    var base = parts[0];\n    var power = parts[1];\n    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"span\", {\n      children: [base, \"\\xD710\", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"sup\", {\n        children: power\n      })]\n    });\n  }\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Utils);\n\n//# sourceURL=webpack://SequenceServer/./public/js/utils.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n\n\nvar Utils = {\n  /***********************************\n   * Formatters for hits & hsp table *\n   ***********************************/\n\n  // Formats an array of two elements as \"first (last)\".\n  format_2_tuple: function format_2_tuple(tuple) {\n    return tuple[0] + ' (' + tuple[tuple.length - 1] + ')';\n  },\n  /**\n   * Returns fraction as percentage\n   */\n  inPercentage: function inPercentage(num, den) {\n    var x = (num * 100.0 / den).toFixed(1);\n    if (x % 1 == 0) {\n      x = parseInt(x, 10);\n      return \"\".concat(x, \"%\");\n    } else {\n      return \"\".concat(x, \"%\");\n    }\n  },\n  /**\n   * Returns fractional representation as String.\n   */\n  inFraction: function inFraction(num, den) {\n    return num + '/' + den;\n  },\n  /**\n   * Returns given Float as String formatted to two decimal places.\n   */\n  inTwoDecimal: function inTwoDecimal(num) {\n    return num.toFixed(2);\n  },\n  /**\n   * Returns zero if num is zero. Returns two decimal representation of num\n   * if num is between [1..10). Returns num in scientific notation otherwise.\n   */\n  inExponential: function inExponential(num) {\n    // Nothing to do if num is 0.\n    if (num === 0) {\n      return 0;\n    }\n\n    // Round to two decimal places if in the rane [1..10).\n    if (num >= 1 && num < 10) {\n      return this.inTwoDecimal(num);\n    }\n\n    // Return numbers in the range [0..1) and [10..Inf] in\n    // scientific format.\n    var exp = num.toExponential(2);\n    var parts = exp.split('e');\n    var base = parts[0];\n    var power = parts[1];\n    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(\"span\", {\n      children: [base, \"\\xD710\", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(\"sup\", {\n        children: power\n      })]\n    });\n  }\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Utils);\n\n//# sourceURL=webpack://SequenceServer/./public/js/utils.js?");
 
 /***/ }),