jinabox
Version:
A lightweight, customizable omnibox. Useful for searching text, images, videos, audios or all other kinds data with a Jina backend.
805 lines (643 loc) • 91.9 kB
JavaScript
(function (factory) {
typeof define === 'function' && define.amd ? define(factory) :
factory();
}((function () { 'use strict';
function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
}
function _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);
}
}
function _createClass(Constructor, protoProps, staticProps) {
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
if (staticProps) _defineProperties(Constructor, staticProps);
return Constructor;
}
function _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;
}
function ownKeys(object, enumerableOnly) {
var keys = Object.keys(object);
if (Object.getOwnPropertySymbols) {
var symbols = Object.getOwnPropertySymbols(object);
if (enumerableOnly) symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
keys.push.apply(keys, symbols);
}
return keys;
}
function _objectSpread2(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i] != null ? arguments[i] : {};
if (i % 2) {
ownKeys(Object(source), true).forEach(function (key) {
_defineProperty(target, key, source[key]);
});
} else if (Object.getOwnPropertyDescriptors) {
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
} else {
ownKeys(Object(source)).forEach(function (key) {
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
});
}
}
return target;
}
function _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
}
});
if (superClass) _setPrototypeOf(subClass, superClass);
}
function _getPrototypeOf(o) {
_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
return o.__proto__ || Object.getPrototypeOf(o);
};
return _getPrototypeOf(o);
}
function _setPrototypeOf(o, p) {
_setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
o.__proto__ = p;
return o;
};
return _setPrototypeOf(o, p);
}
function _isNativeReflectConstruct() {
if (typeof Reflect === "undefined" || !Reflect.construct) return false;
if (Reflect.construct.sham) return false;
if (typeof Proxy === "function") return true;
try {
Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
return true;
} catch (e) {
return false;
}
}
function _construct(Parent, args, Class) {
if (_isNativeReflectConstruct()) {
_construct = Reflect.construct;
} else {
_construct = function _construct(Parent, args, Class) {
var a = [null];
a.push.apply(a, args);
var Constructor = Function.bind.apply(Parent, a);
var instance = new Constructor();
if (Class) _setPrototypeOf(instance, Class.prototype);
return instance;
};
}
return _construct.apply(null, arguments);
}
function _isNativeFunction(fn) {
return Function.toString.call(fn).indexOf("[native code]") !== -1;
}
function _wrapNativeSuper(Class) {
var _cache = typeof Map === "function" ? new Map() : undefined;
_wrapNativeSuper = function _wrapNativeSuper(Class) {
if (Class === null || !_isNativeFunction(Class)) return Class;
if (typeof Class !== "function") {
throw new TypeError("Super expression must either be null or a function");
}
if (typeof _cache !== "undefined") {
if (_cache.has(Class)) return _cache.get(Class);
_cache.set(Class, Wrapper);
}
function Wrapper() {
return _construct(Class, arguments, _getPrototypeOf(this).constructor);
}
Wrapper.prototype = Object.create(Class.prototype, {
constructor: {
value: Wrapper,
enumerable: false,
writable: true,
configurable: true
}
});
return _setPrototypeOf(Wrapper, Class);
};
return _wrapNativeSuper(Class);
}
function _assertThisInitialized(self) {
if (self === void 0) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return self;
}
function _possibleConstructorReturn(self, call) {
if (call && (typeof call === "object" || typeof call === "function")) {
return call;
}
return _assertThisInitialized(self);
}
function _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);
};
}
function _toConsumableArray(arr) {
return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
}
function _arrayWithoutHoles(arr) {
if (Array.isArray(arr)) return _arrayLikeToArray(arr);
}
function _iterableToArray(iter) {
if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter);
}
function _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);
}
function _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;
}
function _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.");
}
var defaultPlaceholders = ['type or drag anything to search', 'powered by Jina', 'unleash your curiosity and happy searching'];
var defaultSettings = {
resultsLocation: 'dropdown',
typewriterEffect: false,
typewriterDelayCharacter: 50,
typewriterDelayItem: 1000,
userMediaHeight: 500,
userMediaWidth: 300,
theme: 'default',
searchIcon: 'color',
floaterIcon: 'color',
showDropzone: true,
acceptAudio: true,
acceptVideo: true,
acceptText: true,
acceptImage: true
};
function getDataUri(url) {
return new Promise(function (resolve, reject) {
var xhr = new XMLHttpRequest();
xhr.responseType = "arraybuffer";
xhr.open("GET", "".concat(url));
xhr.onload = function () {
var base64, binary, bytes, mediaType;
bytes = new Uint8Array(xhr.response); //NOTE String.fromCharCode.apply(String, ...
//may cause "Maximum call stack size exceeded"
binary = [].map.call(bytes, function (_byte) {
return String.fromCharCode(_byte);
}).join('');
mediaType = xhr.getResponseHeader('content-type');
base64 = ['data:', mediaType ? mediaType + ';' : '', 'base64,', btoa(binary)].join('');
resolve(base64);
};
xhr.onerror = function (e) {
console.log('xhr error:', e);
reject(e);
};
xhr.send();
});
}
function waitFor(seconds) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
return resolve();
}, seconds * 1000);
});
}
function parseBool(x) {
if (String(x).toLowerCase() === 'true') return true;
return false;
}
var _icons = {
color: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iNDEwcHgiIGhlaWdodD0iNDEwcHgiIHZpZXdCb3g9IjAgMCA0MTAgNDEwIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPCEtLSBHZW5lcmF0b3I6IFNrZXRjaCA2NCAoOTM1MzcpIC0gaHR0cHM6Ly9za2V0Y2guY29tIC0tPgogICAgPHRpdGxlPlByb2R1Y3QgbG9nb19Db3JlX0NvbG9yZnVsPC90aXRsZT4KICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPgogICAgPGcgaWQ9Iumhtemdoi0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyBpZD0iUHJvZHVjdC1sb2dvX0NvcmVfQ29sb3JmdWwiIGZpbGwtcnVsZT0ibm9uemVybyI+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0yNDcuODE2MjczLDE1My4yMTczNjggTDI0OS43MzA4MzIsMTUzLjI0MDUzMSBDMjg4LjIwODk3NCwxNTQuNjgzMDI3IDMwOS44NjQ2OSwxNzAuMzE1MTY2IDMyNy4xMDg5ODUsMTkzLjE1Nzg2MyBDMzE5LjIxNDY0MywyNzIuMzU1NTEyIDI1MC4wNjA3MTEsMzMwLjIwNTg3NSAxNzEuNTI0MjQzLDMyNi45OTY0NTIgQzEzMS41NjU5NzcsMzI0LjU5NjA3NCA5Ni42NjE3MDc5LDMwNi42MjYyNDMgNzEuNzI4NjYwMywyNzkuNTI0OTA0IEMxMTQuMzYxOTczLDIyMC43NDU5NzUgMTgzLjM2OTk5NCwxNTQuNDg2NTY3IDI0NS45MTAyLDE1My4yMzUyOTcgTDI0Ny44MTYyNzMsMTUzLjIxNzM2OCBaIiBpZD0i6Lev5b6EIiBmaWxsPSIjRkZDQzY2Ij48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0zOC42MTYzNTQ5LDIyMi4wNjY3MTkgTDM4LjY0NTc3OTQsMjIyLjAyNTkxMSBDNTMuNTM5MzMwNiwyMDAuMDk3NjYyIDc3LjM5NzEwMiwxNzguMzEwNzk4IDEwOS4zNTcxNzUsMTg3LjA3OTMzOSBDMTcwLjEzNDY3OCwyMDQuOTc0MzIxIDIyNy4xODU1MTcsMjQxLjYzMjY1IDI2MS45Njk5NDQsMjQwLjU5NzMzNyBDMjk1LjA3NDUxOSwyMzkuNjEyMDI0IDMwOC40NDI4MzEsMjI5Ljc2ODUyNCAzMjIuOTQ3NzU1LDIxNi4yNjU1MTkgQzMwNS4yNzE4OTgsMjgzLjMyODM3MiAyNDIuMTk2OTA1LDMyOS44ODQ1MTggMTcxLjUyNDI0MywzMjYuOTk2NDUyIEMxMDcuNTE0ODg4LDMyMy4xNTEyNzQgNTYuNDc0NTk3NCwyNzkuMzUzMzE3IDM4LjYxNjM1NDksMjIyLjA2NjcxOSBaIiBpZD0i6Lev5b6EIiBmaWxsPSIjRkY3NjczIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0xNDQuMTIxOTYsMjAwLjcwMDUzMyBMMTQ1LjM5NDI1OCwxOTkuNjI5NTA3IEwxNDguMDE3NTk3LDIwMC42Mjk1MzIgQzE5MC42ODcwNTMsMjE2Ljk5MTg4OSAyMjQuNjI0ODg1LDIzNC42NTgzNDggMjUxLjM5MjkzNywyMzkuMjE4NTM1IEMyODQuODcxNTU1LDI0NC45MjE5MyAzMDYuOTExMzA5LDIyOS4wODI2NDkgMzIzLjA5MDg3NiwyMTUuNzI3ODAyIEMzMDUuNjEwNzkxLDI4My4wNzc4MzUgMjQyLjM4Njc5MywzMjkuODkyMjc4IDE3MS41MjQyNDMsMzI2Ljk5NjQ1MiBDMTMyLjI5MjA2LDMyNC42Mzk2OTEgOTcuOTMxODcwNiwzMDcuMjc0MTYzIDczLjA5NzY4NjMsMjgwLjk5MzE5OCBDOTEuODQzMzY1MSwyNTIuODc3MjA0IDExNi43MjExNDQsMjIzLjkyMTM2OSAxNDQuMTIxOTYsMjAwLjcwMDUzMyBaIiBpZD0i6Lev5b6EIiBmaWxsPSIjRkY5RjczIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0zMzkuODExMzg4LDMwMy41MjA0NjEgTDM5OS42MTMyOTksMzU3LjI2ODUzOCBDNDEyLjAwNDI4NSwzNjguNDA1MjQgNDEzLjAwNzA4OCwzODcuNDM2NCA0MDEuODU0NjU4LDM5OS44MDQ5NjcgQzM5MC44NDA4MDUsNDEyLjAxOTg0NiAzNzIuMDUzODAyLDQxMy4xMzY5MzcgMzU5LjY2NTE1Miw0MDIuNDAxMzA2IEwzNTkuMjQ5MTk3LDQwMi4wMzQyMTcgTDI5Ni4wOTAyNzQsMzQ1LjI2ODM1NSBDMzEyLjY3NTc1MSwzMzMuNjA4MDA1IDMyNy40MjI1NzcsMzE5LjUxOTIxOCAzMzkuODExMzg4LDMwMy41MjA0NjEgWiBNMC41NTAwMzIxOTIsMTY4LjQ4MjU2OCBDNS45MTU2MzY4OCw3MC4wNjA2NjE5IDkxLjc2NTMxMTksLTUuMDk3ODg0NzQgMTkwLjEzNDczMSwwLjI3MDU4Mjg4MSBDMjg4LjUwNDE1LDcuNDI4NTM5ODQgMzY1LjQxMTE1MSw5MS41MzQ1MzI4IDM1OC4yNTcwMTEsMTg5Ljk1NjQzOSBDMzUxLjEwMjg3MiwyODguMzc4MzQ1IDI2Ny4wNDE3MzIsMzYzLjUzNjg5MSAxNjguNjcyMzEzLDM1OC4xNjg0MjQgQzcwLjMwMjg5MzEsMzUyLjc5OTk1NiAtNC44MTU1NzI1LDI2Ni45MDQ0NzUgMC41NTAwMzIxOTIsMTY4LjQ4MjU2OCBaIE0xODcuOTUyMTI3LDMwLjkzOTA5ODEgQzEwNy40NTU0OTcsMjcuNjQ5NTcxNyAzNS4xNzI4MDk1LDkwLjE1MDU2ODUgMzEuODg3MjMyNSwxNzAuNzQzOTU5IEMyOC42MDE2NTU1LDI1MS4zMzczNSA4OS4zODQ4MjUxLDMyMi4wNjIxNjMgMTcxLjUyNDI0MywzMjYuOTk2NDUyIEMyNTIuMDIwODczLDMzMC4yODU5NzggMzIyLjY2MDc3MywyNjkuNDI5NzQ0IDMyNy41ODkxMzgsMTg3LjE5MTU5IEMzMzAuODQxODU5LDEwNy40MDQxMzQgMjcxLjMwMDgwMSwzNy4yODg4NzA1IDE5MC40MDk4NiwzMS4xMDY4MDggTDE4Ny45NTIxMjcsMzAuOTM5MDk4MSBaIiBpZD0i5b2i54q2IiBmaWxsPSIjMDA5OTk5Ij48L3BhdGg+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=',
mono: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iODJweCIgaGVpZ2h0PSI4MnB4IiB2aWV3Qm94PSIwIDAgODIgODIiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDY0ICg5MzUzNykgLSBodHRwczovL3NrZXRjaC5jb20gLS0+CiAgICA8dGl0bGU+UHJvZHVjdCBsb2dvL0NvcmUvbGlnaHQvUHJvZHVjdCBsb2dvX0NvcmVfbGlnaHQ8L3RpdGxlPgogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+CiAgICA8ZyBpZD0i6aG16Z2iLTIiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJQcm9kdWN0LWxvZ28vQ29yZS9saWdodC9Qcm9kdWN0LWxvZ29fQ29yZV9saWdodCIgZmlsbD0iIzAwOTk5OSIgZmlsbC1ydWxlPSJub256ZXJvIj4KICAgICAgICAgICAgPHBhdGggZD0iTTQ5LjcwMjM4OTQsMzAuNTM0Mzc1NyBDMzYuOTc5Mjk1OCwzMC4yNDIwMTQ0IDIyLjc2MjgzNzUsNDMuODQ0MDgyNSAxNC4wODgwMDA5LDU1LjgzMDg5NDIgQzE5LjAwMzc0MTYsNjAuODAxMDM1NiAyNy4yNjU4Mjk3LDY1LjE5OTI3NTEgMzQuNzg0MDIxNCw2NS40OTE2MzY0IEM1MC4zOTg3MjcyLDY2LjM2ODcyMDIgNjMuODcxMjg5MSw1NC4yMTU2Mzc5IDY1LjMxNzA5NTIsMzguNzIwNDkxIEM2MS44NDcxNjA2LDM0LjA0MjcxMDggNTcuNTA5NzQyMywzMC44MjY3MzcgNDkuNzAyMzg5NCwzMC41MzQzNzU3IFoiIGlkPSLot6/lvoQiIGZpbGwtb3BhY2l0eT0iMC43OTU3ODIzNDMiPjwvcGF0aD4KICAgICAgICAgICAgPHBhdGggZD0iTTY0LjgwOTUyNDgsNDIuNzU3MTY3MiBDNjEuNzMzNjIwMSw0NS42NjYxMDA5IDU5LjE0MTM0MTUsNDcuODI2MjM1MiA1Mi4yMDIxMDQ5LDQ4LjAzMzAxNzUgQzQ1LjI2Mjg2ODIsNDguMjM5Nzk5OSAzMy44ODE2NDY2LDQwLjkxODA1MzEgMjEuNzU2OTgyOSwzNy4zNDM4OTg5IEMxNS4yNTEwNjU4LDM1LjU1NjgyMTggMTAuNDI4MTQ0Niw0MC4xMjQxOTQxIDcuNDcwOTA5NTgsNDQuNTkxODg2OSBDMTEuMDE5NTkxNiw1Ni4yMDc4ODgxIDIxLjM2OTkxNDMsNjQuODQ1NDI3NSAzNC4wODYwMjUsNjUuNDQxMTE5OSBDNDguNTc2NDc2Nyw2Ni42MzI1MDQ3IDYxLjg1MjI4OTcsNTYuNzU1OTM4IDY0LjgwOTUyNDgsNDIuNzU3MTY3MiBaIiBpZD0i6Lev5b6EIiBmaWxsLW9wYWNpdHk9IjAuNzk1NzgyMzQzIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik02Ny43MzQ3ODc3LDYwLjMwNjg1NTUgTDc5LjY1NDg3MDMsNzAuOTk3MDA0NiBDODIuMTI0NjcyOCw3My4yMTIwODA5IDgyLjMyNDU1NDEsNzYuOTk3MzU1IDgwLjEwMTYyMzcsNzkuNDU3NDQ3NiBDNzcuOTA2MzE0Nyw4MS44ODY5NzE4IDc0LjE2MTY0MTksODIuMTA5MTU5OSA3MS42OTIzMDQ4LDc5Ljk3Mzg1NjEgTDcxLjYwOTM5NTYsNzkuOTAwODQyNiBMNTkuMDIwODA0LDY4LjYwOTg5OTUgQzYyLjMyNjQwMjcsNjYuMjkwNzkyOCA2NS4yNjU1NjM2LDYzLjQ4ODc0NDUgNjcuNzM0Nzg3Nyw2MC4zMDY4NTU1IFoiIGlkPSLlvaLnirbnu5PlkIgiPjwvcGF0aD4KICAgICAgICAgICAgPHBhdGggZD0iTTM3LjQzOTk4NzQsNi4xNzc5NzkxNCBDNTMuODI2NTAyNCw3LjE2MjM1MTg5IDY1Ljk1MjUyMzUsMjEuMjcxNjk0NiA2NS4yOTcwNjMsMzcuMzQ5NzgyNyBDNjQuMzEzODcyMSw1My43NTU5OTUxIDUwLjIyMTQ2OTEsNjUuODk2NTkyMyAzNC4xNjI2ODQ0LDY1LjI0MDM0MzkgQzE3Ljc3NjE2OTQsNjQuMjU1OTcxMSA1LjY1MDE0ODI5LDUwLjE0NjYyODQgNi4zMDU2MDg5NCwzNC4wNjg1NDAyIEM2Ljk2MTA2OTU5LDE3Ljk5MDQ1MiAyMS4zODEyMDI4LDUuNTIxNzMwNiAzNy40Mzk5ODc0LDYuMTc3OTc5MTQgTTM3Ljg3NTQwOTEsMC4wNTk3MjE5NTc1IEMxOC4yNTEwNjc5LC0xLjAxMTI2NzggMS4xMjQzNzAxMiwxMy45ODI1ODg3IDAuMDUzOTUxNTEzMSwzMy42MTc0MDA5IEMtMS4wMTY0NjcxLDUzLjI1MjIxMzEgMTMuOTY5MzkzNCw3MC4zODgwNDkgMzMuNTkzNzM0Niw3MS40NTkwMzg4IEM1My4yMTgwNzU4LDcyLjUzMDAyODUgNjkuOTg3OTY3Myw1Ny41MzYxNzIgNzEuNDE1MTkyMSwzNy45MDEzNTk5IEM3Mi44NDI0MTY5LDE4LjI2NjU0NzggNTcuNDk5NzUwMiwxLjQ4NzcwODMyIDM3Ljg3NTQwOTEsMC4wNTk3MjE5NTc1IFoiIGlkPSLlvaLnirYiPjwvcGF0aD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==',
inverse: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iNDIwcHgiIGhlaWdodD0iNDIwcHgiIHZpZXdCb3g9IjAgMCA0MjAgNDIwIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPCEtLSBHZW5lcmF0b3I6IFNrZXRjaCA2NCAoOTM1MzcpIC0gaHR0cHM6Ly9za2V0Y2guY29tIC0tPgogICAgPHRpdGxlPlByb2R1Y3QgbG9nb19Db3JlX0Rhcms8L3RpdGxlPgogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+CiAgICA8ZyBpZD0i6aG16Z2iLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJQcm9kdWN0LWxvZ29fQ29yZV9EYXJrIiBmaWxsPSIjRkZGRkZGIiBmaWxsLXJ1bGU9Im5vbnplcm8iPgogICAgICAgICAgICA8cGF0aCBkPSJNMjUzLjg2MDU3MywxNTYuOTU0Mzc3IEwyNTUuODIxODI4LDE1Ni45NzgxMDUgQzI5NS4yMzg0NjEsMTU4LjQ1NTc4MyAzMTcuNDIyMzY1LDE3NC40NjkxOTQgMzM1LjA4NzI1MywxOTcuODY5MDMxIEMzMjcuMDAwMzY2LDI3OC45OTgzMjkgMjU2LjE1OTc1MiwzMzguMjU5Njc3IDE3NS43MDc3NjEsMzM0Ljk3MTk3NSBDMTM0Ljc3NDkwMywzMzIuNTEzMDUyIDk5LjAxOTMxMDYsMzE0LjEwNDkzMiA3My40NzgxMzk4LDI4Ni4zNDI1ODQgQzExNy4xNTEyOSwyMjYuMTMwMDIzIDE4Ny44NDI0MzMsMTU4LjI1NDUzMiAyNTEuOTA4MDEsMTU2Ljk3Mjc0MyBMMjUzLjg2MDU3MywxNTYuOTU0Mzc3IFoiIGlkPSLot6/lvoQiIGZpbGwtb3BhY2l0eT0iMC44MDI5MzkyNDgiPjwvcGF0aD4KICAgICAgICAgICAgPHBhdGggZD0iTTM5LjU1ODIxNzIsMjI3LjQ4Mjk4IEwzOS41ODgzNTkzLDIyNy40NDExNzcgQzU0Ljg0NTE2OCwyMDQuOTc4MDkzIDc5LjI4NDgzNjEsMTgyLjY1OTg0MiAxMTIuMDI0NDIzLDE5MS42NDIyNSBDMTc0LjI4NDMwNCwyMDkuOTczNjk0IDIzMi43MjY2MjcsMjQ3LjUyNjEyOSAyNjguMzU5NDU0LDI0Ni40NjU1NjUgQzMwMi4yNzE0NTgsMjQ1LjQ1NjIxOSAzMTUuOTY1ODI2LDIzNS4zNzI2MzQgMzMwLjgyNDUyOSwyMjEuNTQwMjg4IEMzMTIuNzE3NTU0LDI5MC4yMzg4MiAyNDguMTA0MTQ3LDMzNy45MzA0ODIgMTc1LjcwNzc2MSwzMzQuOTcxOTc1IEMxMTAuMTM3MjAzLDMzMS4wMzMwMTMgNTcuODUyMDI2NiwyODYuMTY2ODEzIDM5LjU1ODIxNzIsMjI3LjQ4Mjk4IFoiIGlkPSLot6/lvoQiIGZpbGwtb3BhY2l0eT0iMC44MDI5MzkyNDgiPjwvcGF0aD4KICAgICAgICAgICAgPHBhdGggZD0iTTM0OC4wOTk0NzEsMzEwLjkyMzM5OSBMNDA5LjM1OTk2NSwzNjUuOTgyNDA1IEM0MjIuMDUzMTcsMzc3LjM5MDczNCA0MjMuMDgwNDMyLDM5Ni44ODYwNjkgNDExLjY1NTk5MSw0MDkuNTU2MzA4IEM0MDAuMzczNTA4LDQyMi4wNjkxMSAzODEuMTI4Mjg1LDQyMy4yMTM0NDggMzY4LjQzNzQ3Myw0MTIuMjE1OTcyIEwzNjguMDExMzcyLDQxMS44Mzk5MjkgTDMwMy4zMTE5ODgsMzUzLjY4OTUzNSBDMzIwLjMwMTk4OSwzNDEuNzQ0Nzg2IDMzNS40MDg0OTMsMzI3LjMxMjM3IDM0OC4wOTk0NzEsMzEwLjkyMzM5OSBaIE0wLjU2MzQ0NzYxMSwxNzIuNTkxODk5IEM2LjA1OTkyMDcxLDcxLjc2OTQ1ODUgOTQuMDAzNDkwMiwtNS4yMjIyMjMzOSAxOTQuNzcyMTY0LDAuMjc3MTgyNDYzIEMyOTUuNTQwODM3LDcuNjA5NzIzNzQgMzc0LjMyMzYxOCw5My43NjcwODI0IDM2Ni45OTQ5ODcsMTk0LjU4OTUyMyBDMzU5LjY2NjM1NywyOTUuNDExOTYzIDI3My41NTQ5NDUsMzcyLjQwMzY0NSAxNzIuNzg2MjcxLDM2Ni45MDQyMzkgQzcyLjAxNzU5NzgsMzYxLjQwNDgzMyAtNC45MzMwMjU0OCwyNzMuNDE0MzQgMC41NjM0NDc2MTEsMTcyLjU5MTg5OSBaIE0xOTIuNTM2MzI1LDMxLjY5MzcxMDMgQzExMC4wNzYzNjMsMjguMzIzOTUxNSAzNi4wMzA2ODI5LDkyLjM0OTM2MjkgMzIuNjY0OTY5OSwxNzQuOTA4NDQ2IEMyOS4yOTkyNTY5LDI1Ny40Njc1MyA5MS41NjQ5NDI4LDMyOS45MTczMzcgMTc1LjcwNzc2MSwzMzQuOTcxOTc1IEMyNTguMTY3NzI0LDMzOC4zNDE3MzQgMzMwLjUzMDU0OCwyNzYuMDAxMjAxIDMzNS41NzkxMTcsMTkxLjc1NzIzOSBDMzM4LjkxMTE3MiwxMTAuMDIzNzQ3IDI3Ny45MTc4OTQsMzguMTk4MzU1MSAxOTUuMDU0MDAzLDMxLjg2NTUxMDcgTDE5Mi41MzYzMjUsMzEuNjkzNzEwMyBaIiBpZD0i5b2i54q2Ij48L3BhdGg+CiAgICAgICAgPC9nPgogICAgPC9nPgo8L3N2Zz4=',
closeLight: 'data:image/svg+xml;utf8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDQ5Ni4wOTYgNDk2LjA5NjsiIHhtbDpzcGFjZT0icHJlc2VydmUiIHdpZHRoPSI0OTYuMDk2IiBoZWlnaHQ9IjQ5Ni4wOTYiPjxyZWN0IGlkPSJiYWNrZ3JvdW5kcmVjdCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgeD0iMCIgeT0iMCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJub25lIi8+CgoKCgoKCgoKCgoKCgoKCgo8ZyBjbGFzcz0iY3VycmVudExheWVyIiBzdHlsZT0iIj48dGl0bGU+TGF5ZXIgMTwvdGl0bGU+PGcgaWQ9InN2Z18xIiBjbGFzcz0ic2VsZWN0ZWQiIGZpbGw9IiNmZmZmZmYiIGZpbGwtb3BhY2l0eT0iMSI+Cgk8ZyBpZD0ic3ZnXzIiIGZpbGw9IiNmZmZmZmYiIGZpbGwtb3BhY2l0eT0iMSI+CgkJPHBhdGggZD0iTTI1OS40MSwyNDcuOTk4TDQ5My43NTQsMTMuNjU0YzMuMTIzLTMuMTI0LDMuMTIzLTguMTg4LDAtMTEuMzEyYy0zLjEyNC0zLjEyMy04LjE4OC0zLjEyMy0xMS4zMTIsMEwyNDguMDk4LDIzNi42ODYgICAgTDEzLjc1NCwyLjM0MkMxMC41NzYtMC43MjcsNS41MTItMC42MzksMi40NDIsMi41MzljLTIuOTk0LDMuMS0yLjk5NCw4LjAxNSwwLDExLjExNWwyMzQuMzQ0LDIzNC4zNDRMMi40NDIsNDgyLjM0MiAgICBjLTMuMTc4LDMuMDctMy4yNjYsOC4xMzQtMC4xOTYsMTEuMzEyczguMTM0LDMuMjY2LDExLjMxMiwwLjE5NmMwLjA2Ny0wLjA2NCwwLjEzMi0wLjEzLDAuMTk2LTAuMTk2TDI0OC4wOTgsMjU5LjMxICAgIGwyMzQuMzQ0LDIzNC4zNDRjMy4xNzgsMy4wNyw4LjI0MiwyLjk4MiwxMS4zMTItMC4xOTZjMi45OTUtMy4xLDIuOTk1LTguMDE2LDAtMTEuMTE2TDI1OS40MSwyNDcuOTk4eiIgZmlsbD0iI2ZmZmZmZiIgaWQ9InN2Z18zIiBmaWxsLW9wYWNpdHk9IjEiLz4KCTwvZz4KPC9nPjxnIGlkPSJzdmdfNCI+CjwvZz48ZyBpZD0ic3ZnXzUiPgo8L2c+PGcgaWQ9InN2Z182Ij4KPC9nPjxnIGlkPSJzdmdfNyI+CjwvZz48ZyBpZD0ic3ZnXzgiPgo8L2c+PGcgaWQ9InN2Z185Ij4KPC9nPjxnIGlkPSJzdmdfMTAiPgo8L2c+PGcgaWQ9InN2Z18xMSI+CjwvZz48ZyBpZD0ic3ZnXzEyIj4KPC9nPjxnIGlkPSJzdmdfMTMiPgo8L2c+PGcgaWQ9InN2Z18xNCI+CjwvZz48ZyBpZD0ic3ZnXzE1Ij4KPC9nPjxnIGlkPSJzdmdfMTYiPgo8L2c+PGcgaWQ9InN2Z18xNyI+CjwvZz48ZyBpZD0ic3ZnXzE4Ij4KPC9nPjwvZz48L3N2Zz4=',
closeDark: 'data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTkuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDQ5Ni4wOTYgNDk2LjA5NiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDk2LjA5NiA0OTYuMDk2OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgd2lkdGg9IjUxMnB4IiBoZWlnaHQ9IjUxMnB4Ij4KPGc+Cgk8Zz4KCQk8cGF0aCBkPSJNMjU5LjQxLDI0Ny45OThMNDkzLjc1NCwxMy42NTRjMy4xMjMtMy4xMjQsMy4xMjMtOC4xODgsMC0xMS4zMTJjLTMuMTI0LTMuMTIzLTguMTg4LTMuMTIzLTExLjMxMiwwTDI0OC4wOTgsMjM2LjY4NiAgICBMMTMuNzU0LDIuMzQyQzEwLjU3Ni0wLjcyNyw1LjUxMi0wLjYzOSwyLjQ0MiwyLjUzOWMtMi45OTQsMy4xLTIuOTk0LDguMDE1LDAsMTEuMTE1bDIzNC4zNDQsMjM0LjM0NEwyLjQ0Miw0ODIuMzQyICAgIGMtMy4xNzgsMy4wNy0zLjI2Niw4LjEzNC0wLjE5NiwxMS4zMTJzOC4xMzQsMy4yNjYsMTEuMzEyLDAuMTk2YzAuMDY3LTAuMDY0LDAuMTMyLTAuMTMsMC4xOTYtMC4xOTZMMjQ4LjA5OCwyNTkuMzEgICAgbDIzNC4zNDQsMjM0LjM0NGMzLjE3OCwzLjA3LDguMjQyLDIuOTgyLDExLjMxMi0wLjE5NmMyLjk5NS0zLjEsMi45OTUtOC4wMTYsMC0xMS4xMTZMMjU5LjQxLDI0Ny45OTh6IiBmaWxsPSIjMDAwMDAwIi8+Cgk8L2c+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPC9zdmc+Cg==',
gridView: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-grid'%3E%3Crect x='3' y='3' width='7' height='7'%3E%3C/rect%3E%3Crect x='14' y='3' width='7' height='7'%3E%3C/rect%3E%3Crect x='14' y='14' width='7' height='7'%3E%3C/rect%3E%3Crect x='3' y='14' width='7' height='7'%3E%3C/rect%3E%3C/svg%3E",
listView: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-list'%3E%3Cline x1='8' y1='6' x2='21' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='12' x2='21' y2='12'%3E%3C/line%3E%3Cline x1='8' y1='18' x2='21' y2='18'%3E%3C/line%3E%3Cline x1='3' y1='6' x2='3.01' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='12' x2='3.01' y2='12'%3E%3C/line%3E%3Cline x1='3' y1='18' x2='3.01' y2='18'%3E%3C/line%3E%3C/svg%3E",
arrow_right: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-arrow-right'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3Cpolyline points='12 5 19 12 12 19'%3E%3C/polyline%3E%3C/svg%3E",
camera: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-camera'%3E%3Cpath d='M23 19a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h4l2-3h6l2 3h4a2 2 0 0 1 2 2z'%3E%3C/path%3E%3Ccircle cx='12' cy='13' r='4'%3E%3C/circle%3E%3C/svg%3E",
camera_off: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-camera-off'%3E%3Cline x1='1' y1='1' x2='23' y2='23'%3E%3C/line%3E%3Cpath d='M21 21H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h3m3-3h6l2 3h4a2 2 0 0 1 2 2v9.34m-7.72-2.06a4 4 0 1 1-5.56-5.56'%3E%3C/path%3E%3C/svg%3E",
mic: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-mic'%3E%3Cpath d='M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z'%3E%3C/path%3E%3Cpath d='M19 10v2a7 7 0 0 1-14 0v-2'%3E%3C/path%3E%3Cline x1='12' y1='19' x2='12' y2='23'%3E%3C/line%3E%3Cline x1='8' y1='23' x2='16' y2='23'%3E%3C/line%3E%3C/svg%3E",
pause: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-pause'%3E%3Crect x='6' y='4' width='4' height='16'%3E%3C/rect%3E%3Crect x='14' y='4' width='4' height='16'%3E%3C/rect%3E%3C/svg%3E",
play: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-play'%3E%3Cpolygon points='5 3 19 12 5 21 5 3'%3E%3C/polygon%3E%3C/svg%3E",
stop: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-square'%3E%3Crect x='3' y='3' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3C/svg%3E",
video: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-video'%3E%3Cpolygon points='23 7 16 12 23 17 23 7'%3E%3C/polygon%3E%3Crect x='1' y='5' width='15' height='14' rx='2' ry='2'%3E%3C/rect%3E%3C/svg%3E",
close: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-x'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E",
filePlus: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-file-plus'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'%3E%3C/path%3E%3Cpolyline points='14 2 14 8 20 8'%3E%3C/polyline%3E%3Cline x1='12' y1='18' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='9' y1='15' x2='15' y2='15'%3E%3C/line%3E%3C/svg%3E",
monitor: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-monitor'%3E%3Crect x='2' y='3' width='20' height='14' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='8' y1='21' x2='16' y2='21'%3E%3C/line%3E%3Cline x1='12' y1='17' x2='12' y2='21'%3E%3C/line%3E%3C/svg%3E",
radio: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-radio'%3E%3Ccircle cx='12' cy='12' r='2'%3E%3C/circle%3E%3Cpath d='M16.24 7.76a6 6 0 0 1 0 8.49m-8.48-.01a6 6 0 0 1 0-8.49m11.31-2.82a10 10 0 0 1 0 14.14m-14.14 0a10 10 0 0 1 0-14.14'%3E%3C/path%3E%3C/svg%3E"
};
var JinaBoxSearchComponent = /*#__PURE__*/function (_HTMLElement) {
_inherits(JinaBoxSearchComponent, _HTMLElement);
var _super = _createSuper(JinaBoxSearchComponent);
function JinaBoxSearchComponent() {
var _this;
_classCallCheck(this, JinaBoxSearchComponent);
_this = _super.call(this);
_this.typeWriter = function (text_list) {
var i = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
var text_list_i = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
var delay_next_char = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 100;
var delay_next_item = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 1000;
if (!i) {
_this.searchInput.placeholder = "";
}
var txt = text_list[text_list_i];
if (i < txt.length) {
_this.searchInput.placeholder += txt.charAt(i);
i++;
setTimeout(_this.typeWriter, delay_next_char, text_list, i, text_list_i, delay_next_char, delay_next_item);
} else {
text_list_i++;
if (typeof text_list[text_list_i] === "undefined") {
setTimeout(_this.typeWriter, delay_next_item, text_list, 0, 0, delay_next_char, delay_next_item);
} else {
i = 0;
setTimeout(_this.typeWriter, delay_next_item, text_list, i, text_list_i, delay_next_char, delay_next_item);
}
}
};
_this.search = async function () {
var query = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [_this.searchInput.value];
var inBytes = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var searchType = arguments.length > 2 ? arguments[2] : undefined;
console.log('query: ', query);
if (!inBytes || query.length > 1) {
_this.searchIcon.src = _this.defaultSearchIcon;
_this.searchIcon.classList.remove('jina-border-right');
}
for (var i = 0; i < query.length; ++i) {
console.log('acceptVideo', _this.settings.acceptVideo);
console.log('acceptImage', _this.settings.acceptImage);
console.log('acceptAudio', _this.settings.acceptAudio);
console.log('acceptText', _this.settings.acceptText);
var q = query[i];
if (q.startsWith('data:image') && !parseBool(_this.settings.acceptImage)) return _this.showError('Images are not accepted');else if (q.startsWith('data:video') && !parseBool(_this.settings.acceptVideo)) return _this.showError('Video queries are not accepted');else if (q.startsWith('data:audio') && !parseBool(_this.settings.acceptAudio)) return _this.showError('Audio queries are not accepted');else if (!q.startsWith('data') && !parseBool(_this.settings.acceptText)) return _this.showError('Text queries are not accepted');
}
if (_this.searchType !== 'live') _this.showLoading();
console.log('searching');
var response;
var startTime = new Date();
try {
response = await window.JinaBox.search(query, 16, inBytes);
} catch (e) {
console.log('error');
return _this.showError(e);
}
var endTime = new Date();
var totalTime = Math.round((endTime - startTime) / 10) / 100;
console.log('response:', response);
var results = [];
var queries = [];
var totalResults = 0;
var queriesContainMedia = false;
var resultsContainText = false;
var onlyImages = true;
var docs = response.data.docs;
var _ref = response.status || {},
code = _ref.code,
description = _ref.description;
if (code == 'ERROR') return _this.showError(description);
for (var _i = 0; _i < docs.length; ++_i) {
var docResults = docs[_i];
console.log('docResults', docResults);
var matches = docResults.matches,
uri = docResults.uri,
mime_type = docResults.mime_type;
var mimeType = mime_type;
queries.push({
uri: uri,
mimeType: mimeType
});
if (mimeType.includes("image")) queriesContainMedia = true;
var resultsArr = matches;
for (var j = 0; j < resultsArr.length; ++j) {
var res = resultsArr[j];
if (!results[_i]) results[_i] = [];
var data = void 0,
text = void 0,
_mimeType = void 0,
score = void 0;
score = res.score.value;
if (res.matchDoc) {
_mimeType = res.matchDoc.mime_type;
data = res.matchDoc.uri;
text = res.matchDoc.text;
} else {
_mimeType = res.mime_type;
data = res.uri;
text = res.text;
}
if (_mimeType.includes('text')) {
onlyImages = false;
resultsContainText = true;
}
if (!_mimeType.includes('image')) onlyImages = false;
var result = {
mimeType: _mimeType,
data: data,
text: text,
score: score
};
console.log('result', result);
results[_i].push(result);
totalResults++;
}
}
_this.queries = queries;
_this.results = results;
_this.resultsMeta = {
totalTime: totalTime,
totalResults: totalResults,
resultsContainText: resultsContainText,
queriesContainMedia: queriesContainMedia,
onlyImages: onlyImages
};
console.log('resultsMeta:', _this.resultsMeta);
_this.resultsIndex = 0;
_this.showResults(0, searchType);
};
_this.listenForEnter = function (key) {
if (key.keyCode == 13) {
_this.search();
}
};
_this.preventDefaults = function (e) {
e.preventDefault();
e.stopPropagation();
};
_this.handleDrop = async function (e) {
_this.dropped = true;
var dt = e.dataTransfer;
var text = dt.getData('Text');
var imgsrc = dt.getData('URL');
console.log('text: ', text);
console.log('imgsrc: ', imgsrc);
if (imgsrc) {
if (imgsrc.startsWith('data:')) {
_this.search([imgsrc], true);
_this.searchIcon.src = imgsrc;
_this.searchIcon.classList.add('jina-border-right');
} else {
var dataURI;
try {
dataURI = await getDataUri(imgsrc);
} catch (e) {
dataURI = imgsrc;
}
console.log('dataUri:', dataURI);
_this.searchIcon.src = dataURI;
_this.searchIcon.classList.add('jina-border-right');
_this.search([imgsrc], true);
}
} else if (text) {
_this.searchInput.value = text;
_this.search();
} else {
(function () {
var acceptedFiles = dt.files;
var processedFiles = [];
console.log('files: ', acceptedFiles);
var _loop = function _loop(i) {
var file = acceptedFiles[i];
var reader = new FileReader();
reader.addEventListener("load", function () {
var processed = reader.result;
processedFiles.push(processed);
if (processedFiles.length === acceptedFiles.length) {
_this.search(processedFiles, true);
if (processedFiles.length < 2) {
_this.searchIcon.src = processedFiles[0];
_this.searchIcon.classList.add('jina-border-right');
}
}
console.log('processed: ', processed);
}, false);
reader.readAsDataURL(file);
};
for (var i = 0; i < acceptedFiles.length; ++i) {
_loop(i);
}
})();
}
};
_this.handleUpload = function (e) {
var acceptedFiles = e.target.files;
var processedFiles = [];
console.log('files: ', acceptedFiles);
var _loop2 = function _loop2(i) {
var file = acceptedFiles[i];
var reader = new FileReader();
reader.addEventListener("load", function () {
var processed = reader.result;
processedFiles.push(processed);
if (processedFiles.length === acceptedFiles.length) {
_this.search(processedFiles, true);
if (processedFiles.length < 2) {
_this.searchIcon.src = processedFiles[0];
_this.searchIcon.classList.add('jina-border-right');
}
}
console.log('processed: ', processed);
}, false);
reader.readAsDataURL(file);
};
for (var i = 0; i < acceptedFiles.length; ++i) {
_loop2(i);
}
};
_this.showContentContainer = function () {
if (_this.overlay) {
_this.overlay.style.display = 'block';
_this.overlay.style.opacity = '1';
}
_this.contentContainer.style.height = 'auto';
_this.contentContainer.style.opacity = 1;
};
_this.clearContentContainer = function () {
_this.dropped = false;
_this.searchType = '';
if (_this.overlay) {
_this.overlay.style.display = 'none';
_this.overlay.style.opacity = '0';
}
_this.contentContainer.innerHTML = _this.defaultContent || '';
}; //TODO: replace functional parts with onDragEnter()
_this.handleDrag = function () {
_this.dragCounter++;
if (!_this.highlighted) {
if (parseBool(_this.settings.showDropzone)) _this.showContentContainer();
_this.contentContainer.innerHTML = "\n\t\t\t\t<div class=\"jina-dropdown-message jina-ready unselectable\">\n \t\t\t<div class=\"jina-face\"><div class=\"eye\"></div><div class=\"eye right\"></div><div class=\"mouth happy\"></div></div>\n \t\t\t<div class=\"jina-shadow jina-scale\"></div>\n\t\t\t\t\t<h4 class=\"alert\">Drop here</h4>\n\t\t\t\t\t<p>Drop any content here from webpage/local to search</p>\n\t\t\t\t</div>\n\t\t\t\t";
_this.highlighted = true;
}
}; //TODO: replace functional parts with onDragLeave()
_this.handleDragLeave = function () {
_this.dragCounter--;
if (_this.dragCounter < 1) {
_this.searchInput.classList.remove('jina-highlighted');
if (!_this.dropped) {
_this.clearExpander();
}
_this.dragCounter = 0;
}
};
_this.showInputOptions = async function () {
_this.clearMedia();
_this.showContentContainer();
_this.contentContainer.innerHTML = "\n\t\t\t<div class=\"jina-input-options\">\n\t\t\t\t<input type=\"file\" class=\"jina-expander-file-input\" multiple>\n\t\t\t\t<button class=\"jina-expander-file-input-trigger\"><img src=\"".concat(_icons.filePlus, "\"> Upload Files</button>\n\t\t\t\t<button class=\"jina-expander-capture-media-button\"><img src=\"").concat(_icons.camera, "\"> Camera</button>\n\t\t\t\t").concat(window.MediaRecorder ? "<button class=\"jina-expander-capture-audio-button\"><img src=\"".concat(_icons.mic, "\"> Audio</button>") : '', "\n\t\t\t\t").concat(navigator.mediaDevices && (navigator.mediaDevices.getDisplayMedia || navigator.getDisplayMedia) ? "<button class=\"jina-expander-capture-screen-button\"><img src=\"".concat(_icons.monitor, "\"> Screen Capture</button>") : '', "\n\t\t\t\t\n\t\t\t</div>\n\t\t");
_this.getElement('jina-expander-file-input-trigger').onclick = function () {
return _this.getElement('jina-expander-file-input').click();
};
_this.getElement('jina-expander-file-input').addEventListener('change', _this.handleUpload);
var captureMediaButton = _this.getElement('jina-expander-capture-media-button');
if (captureMediaButton) captureMediaButton.addEventListener('click', _this.showCaptureMedia);
var captureAudioButton = _this.getElement('jina-expander-capture-audio-button');
if (captureAudioButton) captureAudioButton.addEventListener('click', _this.showCaptureAudio);
var captureScreenButton = _this.getElement('jina-expander-capture-screen-button');
if (captureScreenButton) captureScreenButton.addEventListener('click', _this.showCaptureScreen);
};
_this.showCaptureMedia = async function (e) {
_this.searchType = 'capture';
_this.useVideo = true;
_this.useAudio = true;
try {
_this.showLoading('Accessing Device Media');
_this.mediaStream = await _this.getUserMediaStream();
} catch (e) {
console.log('error');
console.log(e);
return _this.showError('Could not access media. Please ensure permission is granted.');
}
_this.showContentContainer();
_this.contentContainer.innerHTML = "\n\t\t\t<div class=\"jina-media-container\">\n\t\t\t\t<canvas class=\"jina-media-capture-canvas\">\n\t\t\t\t</canvas>\n\t\t\t\t<div class=\"jina-input-controls\">\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<input type=\"file\" name=\"video\" accept=\"video/*\" capture style=\"display: none;\" class=\"jina-video-input-button\">\n\t\t\t\t\t\t<img src=\"".concat(_icons.camera, "\"/>\n\t\t\t\t\t\t<select class=\"jina-select jina-small jina-video-select\">\n\t\t\t\t\t\t</select>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<img src=\"").concat(_icons.mic, "\"/>\n\t\t\t\t\t\t<select class=\"jina-select jina-small jina-audio-select\">\n\t\t\t\t\t\t</select>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"jina-media-preview-container\">\n\t\t\t\t\t<button class=\"jina-media-live-button\">\n\t\t\t\t\t<div class=\"jina-live-icon\"></div> Live Search\n\t\t\t\t\t</button>\n\t\t\t\t\t<video class=\"jina-capture-preview\" width=\"100%\" style=\"display: block;\" autoplay muted playsinline></video>\n\t\t\t\t\t<button class=\"jina-media-screen-button\" style=\"display:none;\"></button>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"jina-media-controls-container jina-media-controls\">\n\t\t\t\t<button class=\"jina-media-button jina-take-photo-button\"><img src=\"").concat(_icons.camera, "\"></button>\n\t\t\t\t<button class=\"jina-media-button jina-record-video-button\"><img src=\"").concat(_icons.video, "\"></button>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t"); //TODO: hide jina-media-screen-button
_this.capturePreview = _this.getElement('jina-capture-preview');
_this.videoInputButton = _this.getElement('jina-video-input-button');
_this.videoSelect = _this.getElement('jina-video-select');
_this.audioSelect = _this.getElement('jina-audio-select');
_this.captureCanvas = _this.getElement('jina-media-capture-canvas');
_this.captureCanvas.width = 0;
_this.captureCanvas.height = 0;
_this.captureCanvas.style.display = 'none';
_this.audioSelect.onchange = function () {
return _this.updateStreamSource(_this.showCaptureMedia);
};
_this.videoSelect.onchange = function () {
return _this.updateStreamSource(_this.showCaptureMedia);
};
_this.capturePreview.srcObject = _this.mediaStream;
await _this.getMediaDevices();
if (_this.audioSource) {
_this.audioSelect.selectedIndex = _toConsumableArray(_this.audioSelect.options).findIndex(function (option) {
return option.value === _this.audioSource;
});
}
if (_this.videoSource) {
_this.videoSelect.selectedIndex = _toConsumableArray(_this.videoSelect.options).findIndex(function (option) {
return option.value === _this.videoSource;
});
}
_this.videoInputButton.addEventListener('change', _this.handleUpload);
_this.getElement('jina-take-photo-button').onclick = _this.capturePhoto;
_this.getElement('jina-record-video-button').onclick = window.MediaRecorder ? _this.startMediaRecord : function () {
return _this.videoInputButton.click();
};
_this.getElement('jina-media-live-button').onclick = _this.showLiveSearch;
_this.previousCapture = _this.showCaptureMedia;
};
_this.showCaptureScreen = async function () {
_this.searchType = 'capture';
_this.useVideo = true;
_this.useAudio = true;
try {
_this.showLoading('Accessing Screen Capture');
_this.mediaStream = await _this.getScreenMediaStream();
} catch (e) {
console.log('error');
console.log(e);
return _this.showError('Could not access screen capture. Please ensure permission is granted.');
}
_this.showContentContainer();
_this.contentContainer.innerHTML = "\n\t\t\t<div class=\"jina-media-container\">\n\t\t\t\t<canvas class=\"jina-media-capture-canvas\">\n\t\t\t\t</canvas>\n\t\t\t\t<div class=\"jina-media-preview-container\">\n\t\t\t\t\t<button class=\"jina-media-live-button\">\n\t\t\t\t\t<div class=\"jina-live-icon\"></div> Live Search\n\t\t\t\t\t</button>\n\t\t\t\t\t<video class=\"jina-capture-preview\" width=\"100%\" style=\"display: block;\" autoplay muted playsinline></video>\n\t\t\t\t\t<button class=\"jina-media-screen-button\" style=\"display:none;\"></button>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"jina-media-controls-container jina-media-controls\">\n\t\t\t\t<button class=\"jina-media-button jina-take-photo-button\"><img src=\"".concat(_icons.camera, "\"></button>\n\t\t\t\t<button class=\"jina-media-button jina-record-video-button\"><img src=\"").concat(_icons.video, "\"></button>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t");
_this.capturePreview = _this.getElement('jina-capture-preview');
_this.captureCanvas = _this.getElement('jina-media-capture-canvas');
_this.captureCanvas.width = 0;
_this.captureCanvas.height = 0;
_this.captureCanvas.style.display = 'none';
_this.capturePreview.srcObject = _this.mediaStream;
_this.getElement('jina-take-photo-button').onclick = _this.capturePhoto;
_this.getElement('jina-record-video-button').onclick = window.MediaRecorder ? _this.startMediaRecord : function () {
return _this.videoInputButton.click();
};
_this.getElement('jina-media-live-button').onclick = _this.showLiveSearch;
_this.previousCapture = _this.showCaptureScreen;
};
_this.showCaptureAudio = async function () {
_this.searchType = 'capture';
_this.useVideo = false;
_this.useAudio = true;
try {
_this.showLoading('Accessing Audio');
_this.mediaStream = await _this.getUserMediaStream();
} catch (e) {
console.log(e);
return _this.showError('Could not access audio. Please ensure permission is granted.');
}
_this.showContentContainer();
_this.contentContainer.innerHTML = "\n\t\t\t<div class=\"jina-media-container\">\n\t\t\t\t<div class=\"jina-input-controls\">\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<img src=\"".concat(_icons.mic, "\"/>\n\t\t\t\t\t\t<select class=\"jina-select jina-small jina-audio-select\">\n\t\t\t\t\t\t</select>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"jina-media-controls\" style=\"margin-top:2em; margin-bottom:2em;\">\n\t\t\t\t<button class=\"jina-media-button jina-record-audio-button\"><img src=\"").concat(_icons.mic, "\"></button>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t"); //TODO: make sure audio button not floating, change classes for jina-media-controls if necessary
_this.audioSelect = _this.getElement('jina-audio-select');
_this.audioSelect.onchange = function () {
return _this.updateStreamSource(_this.showCaptureAudio);
};
await _this.getMediaDevices();
if (_this.audioSource) {
_this.audioSelect.selectedIndex = _toConsumableArray(_this.audioSelect.options).findIndex(function (option) {
return option.value === _this.audioSource;
});
}
_this.getElement('jina-record-audio-button').onclick = function () {
return _this.startMediaRecord();
};
_this.previousCapture = _this.showCaptureAudio;
};
_this.showLiveSearch = async function () {
_this.showContentContainer();
_this.contentContainer.innerHTML = "\n\t\t\t<div class=\"jina-live-container\">\n\t\t\t\t<canvas class=\"jina-media-capture-canvas\">\n\t\t\t\t</canvas>\n\t\t\t\t<div class=\"jina-live-header\">\n\t\t\t\t\t<div class=\"jina-live-header-item\" style=\"text-align: left;\">\n\t\t\t\t\t\t<button class=\"jina-live-button jina-live-cancel-button\">\n\t\t\t\t\t\t\t<img src=\"".concat(_icons.close, "\">\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"jina-live-header-item\" style=\"margin-top: .5em;text-align:center;\">\n\t\t\t\t\t<div class=\"jina-live-icon jina-pulse\" ></div> Live Search\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"jina-live-header-item\" style=\"text-align: right;\">\n\t\t\t\t\t\t<button class=\"jina-live-button jina-live-toggle-button\">\n\t\t\t\t\t\t\t<img src=\"").concat(_icons.pause, "\">\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"jina-live-results-area\">\n\t\t\t\t\t<div class=\"jina-sea\">\n\t\t\t\t\t\t<span class=\"jina-wave\"></span>\n\t\t\t\t\t\t<span class=\"jina-wave\"></span>\n\t\t\t\t\t\t<span class=\"jina-wave\"></span>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<video class=\"jina-live-preview jina-capture-preview\" autoplay muted