FAYT pouchdb.find

Find as you type with Pouchdb on multiple fields.

by Erik

HTML

<script src="https://crm.windsurfschool.nl/plugins/pouchdb-6.4.3.min.js"></script>
<script src="https://crm.windsurfschool.nl/plugins/pouchdb.find-6.2.0.js"></script>
<input type='text' id='search'>
<div id='status'></div>
<div id='result'></div>

JavaScript

PouchDB.debug.enable('pouchdb:find');

const db = new PouchDB('test')

db.createIndex({
  index: {
    fields: ['firstname', 'lastname', 'email'],
    ddoc: 'find-as-you-type-ddoc',
    name: 'fayt'
  }
}).catch(function(e){console.log(e)});

const search = document.getElementById('search');
const result = document.getElementById('result');
let query = search.value;

search.addEventListener('keyup',find);

db.info().then(function(res){
  if (res.doc_count === 0 ) {
    fillDB();
  }
}).catch(function (err) {
  console.log(err);
})

function fillDB(){
  let docs = [{firstname: 'eric', lastname: 'johnson', email:'[email protected]'},{firstname: 'john', lastname: 'ericson', email:'[email protected]'},{firstname: 'jane', lastname: 'johnson', email:'[email protected]'},{firstname: 'erik', lastname: 'hill', email:'[email protected]'},{firstname: 'marc', lastname: 'marcussen', email:'[email protected]'},{firstname: 'hilda', lastname: 'hill', email:'[email protected]'}];
  
  db.bulkDocs(docs).then(function(result){
  // database is filled
  }).catch(function(e){console.log(e)})
  
/*   for (let i=0; i < 1000; i++){
    let j = Math.floor(Math.random() * Math.floor(5));
    let doc=docs[j];
    doc._id = 'doc'+i;
    db.put(doc)
  } */
}

db.explain({
  selector: {
    $or: [
      {firstname: {$gte: query, $lt: query+'\uffff'}},
      {lastname: {$gte: query, $lt: query+'\uffff'}},
      {email: {$gte: query, $lt: query+'\uffff'}}
    ]
  },
  use_index: 'find-as-you-type-ddoc'
})
.then(function (explained) {
  console.log(explained)
}).catch(function(e){console.log(e)});


/* db.getIndexes().then(function (result) {
  console.log(result)
}).catch(function (err) {
  console.log(err);
}); */

function find() {
  status.innerHTML = 'status: starting query'
  result.innerHTML = '';
  let query = search.value;
  
  db.find({
    selector: {
      $or: [
        {firstname: {$gte: query, $lt: query+'\uffff'}},
        {lastname: {$gte: query, $lt: query+'\uffff'}},
        {email: {$gte:...