ujjwalguptaofficial / JsStore

Simplifying IndexedDB with SQL like syntax and promises
http://jsstore.net/
MIT License
858 stars 110 forks source link

Select returning a multi dimensional Map() object based on given fields? #223

Closed nielsnl68 closed 3 years ago

nielsnl68 commented 3 years ago

Summary

I could be benefit of an option like this.

Basic example

i have a table with dates and times that i need to place inside a table, now i need to sequential loop to the table to get all the records for the a date using a map() object could make that easier, i think. But an normal object structure is also fine by me.

Include a basic example or links here.

   let measures = connection.select({from: "measures",
            order: [{  by: 'date',  type: "desc"  },
                       {  by: 'time',  type: "esc"  }]
        });
// returns an array with date, time, value

   let rows = "";
   for (let x=0; x<15;x++) {
      let day = dayjs().substract(x);
      rows += `<tr id='row_${day}'>`;
      rows += `<th>${day.format()}</th>`;
      rows += '<td></td><td></td><td></td><td></td><td></td><td></td>";
      row  += '</tr>';
   }
   document.getElementAtId('table-tbody').innerHTML = rows;
   for (const elem of measures) {
            let tr = document.getElementById("ddag_" + elem.datum);
            if (tr == null) continue;
            let time = dayjs(elem.time,"HHMM");
            let waarde = elem.value.toFixed(2);
            let column = 0;
            if (elem.time < "1000") { column = 1; }
            if (elem.time > "2200") { column = 4; }
            if (elem.time > "1700") { column = 3; }
            if (elem.time >= "1000") { column = 2; }

            tr.childNodes[column].innerHTML += ` ${waarde}`;
            tr.childNodes[column].title += time.format("HH:MM") + " ";
   }

It would be, i think much faster when i could do something like :

   let measures = connection.select({from: "measures",
            order: [{  by: 'date',  type: "desc"  },
                       {  by: 'time',  type: "esc"  }],
            mappedBy: ['date','time'] 
        });
// returns an map object with date, time, value. Every element just returns the same object as before.

   for (let x=0; x<15;x++) {
      let day = dayjs().substract(x);
      const tr = document.createElement('tr');
      tr.id = `row_${day}`;
      let rows = `<th>${day.format()}</th>`;
      rows += '<td></td><td></td><td></td><td></td><td></td><td></td>";
      row  += '</tr>';
      if {measures.has(day.format("YYYYMMDD"))} {
          let times = measures[day.format("YYYYMMDD")];
          for (elem of times) {
              let time = dayjs(elem.time,"HHMM");
              let waarde = elem.value.toFixed(2);
              let column = 0;
              if (elem.time < "1000") { column = 1; }
              if (elem.time > "2200") { column = 4; }
              if (elem.time > "1700") { column = 3; }
              if (elem.time >= "1000") { column = 2; }
              tr.childNodes[column].innerHTML += ` ${waarde}`;
              tr.childNodes[column].title += time.format("HH:MM") + " ";
           }
       }
   }

Motivation

I'm sure the table is build much faster then the first solution, and filling an array or the map should not be a big issue, i hope.

ujjwalguptaofficial commented 3 years ago

unable to understand @nielsnl68 . Could you explain in terms of what is the current output and what is expected output ? Please include the datas, so that i can visualize.

nielsnl68 commented 3 years ago

the current select function output is just an array of row-objects. like :


let result = [
   {datum:"20210605",tijd:"1250", value:59.9},
   {datum:"20210515",tijd:"1340", value:49.9},
   {datum:"20210515",tijd:"1130", value:39.9},
   {datum:"20210510",tijd:"1215", value:29.9},
   {datum:"20210509",tijd:"1010", value:19.9}
];

let metingen = new Map();
for (let elem of result) {
    if (!metingen.has(elem.datum)) { metingen.set(elem.datum, new Map()); }
    metingen.get(elem.datum).set(pos, elem); 
}

would return simply :

{"20210605": {"1250": {datum:"20210605",tijd:"1250", value:59.9}},
 "20210515": {"1340": {datum:"20210515",tijd:"1340", value:49.9},
                     {"1130": {datum:"20210515",tijd:"1130", value:39.9}},
"20210510": {"1215": {datum:"20210510",tijd:"1215", value:29.9}}.
"20210509": {"1010": {datum:"20210509",tijd:"1010", value:19.9}}};

I hope this makes more sense then my original examples above,

ujjwalguptaofficial commented 3 years ago

You can use middleware for this - https://jsstore.net/tutorial/middleware/ . If you feel it can be used by other people, you can make it a plugin and provide it as package similar to jsstore-encrypt