We Keep Coding

Having trouble accessing the nested values of my object. JavaScript

So I am trying to create a function that will list all the stats of a specific player in below object. I am simply trying to return the nested object associated with the playerName itself. I'm guessing map isn't working for me here. Instead I am returning an array of the individual letters of the name "Jeff Adrien". Can someone help me understand where I am going wrong?
//Code in question
function playerStats(playerName) {
let specificPlayer = allPlayers().players
if (playerName === specificPlayer) {
return specificPlayer
}
const stats = Object.values(playerName).map((nums) => {
return [nums]
})
return stats.flat()
}
console.log(playerStats('Jeff Adrien'))
// details
function allPlayers() {
const everyPlayer = Object.assign(homePlayers, awayPlayers)
return everyPlayer
}
const gameObject = () => {
return {
home: {
teamName: 'Brooklyn Nets',
colors: ['black', 'white'],
players: {
'Alan Anderson': {
number: 0,
shoe: 16,
points: 22,
rebounds: 12,
assists: 12,
steals: 3,
blocks: 1,
slamDunks: 1,
},
'Reggie Evans': {
number: 30,
shoe: 14,
points: 12,
rebounds: 12,
assists: 12,
steals: 12,
blocks: 12,
slamDunks: 7,
},
'Brook Lopez': {
number: 11,
shoe: 17,
points: 17,
rebounds: 19,
assists: 10,
steals: 3,
blocks: 1,
slamDunks: 15,
},
'Mason Plumlee': {
number: 1,
shoe: 19,
points: 26,
rebounds: 12,
assists: 6,
steals: 3,
blocks: 8,
slamDunks: 5,
},
'Jason Terry': {
number: 31,
shoe: 15,
points: 19,
rebounds: 2,
assists: 2,
steals: 4,
blocks: 11,
slamDunks: 1,
},
},
},
away: {
teamName: 'Charlotte Hornets',
colors: ['turquoise', 'purple'],
players: {
'Jeff Adrien': {
number: 4,
shoe: 18,
points: 10,
rebounds: 1,
assists: 1,
steals: 2,
blocks: 7,
slamDunks: 2,
},
'Bismak Biyombo': {
number: 0,
shoe: 16,
points: 12,
rebounds: 4,
assists: 7,
steals: 7,
blocks: 15,
slamDunks: 10,
},
'DeSagna Diop': {
number: 4,
shoe: 14,
points: 24,
rebounds: 12,
assists: 12,
steals: 4,
blocks: 5,
slamDunks: 5,
},
'Ben Gordon': {
number: 8,
shoe: 15,
points: 33,
rebounds: 3,
assists: 2,
steals: 1,
blocks: 1,
slamDunks: 0,
},
'Brendan Haywood': {
number: 33,
shoe: 15,
points: 6,
rebounds: 12,
assists: 12,
steals: 22,
blocks: 5,
slamDunks: 12,
},
},
},
}
}

wow I was trying to work with an array and turn it into an object somehow.. it just clicked for me
function playerStats(playerName) {
for (const player in allPlayers()) {
if (player === playerName) {
return allPlayers()[player]
}
}
}

Create unique array when merging two array

I want to merge two arrays of objects. One key will be the same in those 2 arrays.
Here is the sample data:
var a = ['Europe', 'Africa', 'Antarctica'];
var b = [
{id: 11, warehouse_name: 'Europe', input_qty: 200, total_amt: 4000},
{id: 12, warehouse_name: 'Africa', input_qty: 150, total_amt: 3500},
{id: 13, warehouse_name: 'Africa', input_qty: 20, total_amt: 500},
{id: 14, warehouse_name: 'Antarctica', input_qty: 50, total_amt: 1500}
];
My expected output should be:
var c = [
{warehouse_name: 'Europe', pack: [{id: 11, warehouse_name: 'Europe', input_qty: 200, total_amt: 4000}]},
{warehouse_name: 'Africa', pack: [{id: 12, warehouse_name: 'Africa', input_qty: 150, total_amt: 3500}, {id: 13, warehouse_name: 'Africa', input_qty: 20, total_amt: 500}]},
{warehouse: 'Antarctica', pack: [{id: 14, warehouse_name: 'Antarctica', input_qty: 50, total_amt: 1500}]}
];
How can i achieve this in javascript using lodash or without using lodash. Any solution is appreciated.

You could do it using array Array.prototype.map() method. Traverse the a array using map and filter b array by a arrays value using Array.prototype.filter method.
const a = ['Europe', 'Africa', 'Antarctica'];
const b = [
{ id: 11, warehouse_name: 'Europe', input_qty: 200, total_amt: 4000 },
{ id: 12, warehouse_name: 'Africa', input_qty: 150, total_amt: 3500 },
{ id: 13, warehouse_name: 'Africa', input_qty: 20, total_amt: 500 },
{ id: 14, warehouse_name: 'Antarctica', input_qty: 50, total_amt: 1500 },
];
const ret = a.map((x) => ({
warehouse_name: x,
pack: b.filter((y) => y.warehouse_name === x),
}));
console.log(ret);

Use _.groupBy() create an object (byWarehouse) of items by warehouse_name from array b. Now map array a, and take the items from byWarehouse to create the object:
const a = ['Europe', 'Africa', 'Antarctica'];
const b = [
{ id: 11, warehouse_name: 'Europe', input_qty: 200, total_amt: 4000 },
{ id: 12, warehouse_name: 'Africa', input_qty: 150, total_amt: 3500 },
{ id: 13, warehouse_name: 'Africa', input_qty: 20, total_amt: 500 },
{ id: 14, warehouse_name: 'Antarctica', input_qty: 50, total_amt: 1500 },
];
const byWarehouse = _.groupBy(b, 'warehouse_name')
const result = a.map(warehouse_name => ({ warehouse_name, pack: byWarehouse[warehouse_name] }))
console.log(result);
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.20/lodash.min.js" integrity="sha512-90vH1Z83AJY9DmlWa8WkjkV79yfS2n2Oxhsi2dZbIv0nC4E6m5AbH8Nh156kkM7JePmqD6tcZsfad1ueoaovww==" crossorigin="anonymous"></script>

how would you save and read an array of arrays in firestore?

I am trying to save react-seat-picker
https://github.com/roggervalf/react-seat-picker#readme
data into firestore and read it back.
The one piece of code describing data that should be written/saved to firestore is this:
const rows = [
[{id: 1, number: 1, isSelected: true, tooltip: 'Reserved by you'}, {id: 2, number: 2, tooltip: 'Cost: 15$'}, null, {id: 3, number: '3', isReserved: true, orientation: 'east', tooltip: 'Reserved by Rogger'}, {id: 4, number: '4', orientation: 'west'}, null, {id: 5, number: 5}, {id: 6, number: 6}],
[{id: 7, number: 1, isReserved: true, tooltip: 'Reserved by Matthias Nadler'}, {id: 8, number: 2, isReserved: true}, null, {id: 9, number: '3', isReserved: true, orientation: 'east'}, {id: 10, number: '4', orientation: 'west'}, null, {id: 11, number: 5}, {id: 12, number: 6}],
[{id: 13, number: 1}, {id: 14, number: 2}, null, {id: 15, number: 3, isReserved: true, orientation: 'east'}, {id: 16, number: '4', orientation: 'west'}, null, {id: 17, number: 5}, {id: 18, number: 6}],
[{id: 19, number: 1, tooltip: 'Cost: 25$'}, {id: 20, number: 2}, null, {id: 21, number: 3, orientation: 'east'}, {id: 22, number: '4', orientation: 'west'}, null, {id: 23, number: 5}, {id: 24, number: 6}],
[{id: 25, number: 1, isReserved: true}, {id: 26, number: 2, orientation: 'east'}, null, {id: 27, number: '3', isReserved: true}, {id: 28, number: '4', orientation: 'west'}, null,{id: 29, number: 5, tooltip: 'Cost: 11$'}, {id: 30, number: 6, isReserved: true}]
]

You can stringify your nested array (JSON.stringify(rows)) before storing in firestore and parse it after getting it back.

So far firebase firestore doesn't support nested arrays,you need to change the data structure.Have a look at this solution

With the directed sortMethod, is it possible to determine relative position of nodes in the same hierarchy?

For exemple I have a simple network:
var options = {
style = {
hierarchical = {
sortMethod = 'directed'
}
}
}
var nodes = new vis.DataSet([
{id: 1, label: 'Node 1'},
{id: 2, label: 'Node 2'},
{id: 3, label: 'Node 3'},
{id: 4, label: 'Node 4'},
{id: 5, label: 'Node 5'}
]);
var edges = new vis.DataSet([
{from: 1, to: 2},
{from: 2, to: 3},
{from: 4, to: 3},
{from: 5, to: 3}
]);
Is there a way to indicate that I want the node 2 to be rendered between node 4 and 5?

I'm afraid the only way is to set coordinates of the nodes explicitly:
var nodes = new vis.DataSet([
{id: 1, label: 'Node 1', x: 0, y: -100},
{id: 2, label: 'Node 2', x: 0, y: 0},
{id: 3, label: 'Node 3', x: 0, y: 100},
{id: 4, label: 'Node 4', x: 100, y: 0},
{id: 5, label: 'Node 5', x: -100, y: 0}
]);
The point is, physics works only with existing nodes and edges. Still, you can try one of the following tricks:
add hidden edges between 2 and 4 and 2 and 5 – this way, you may hope that because nodes in those pairs are attracted to each other, node 2 ends up at least closer to both 4 and 5 than 4 to 5;
or instead of setting coordinates explicitly, use some pre-defined layout to put nodes in the desired order; however, as far as I know, no existing layout really garantees that this will be so (see these, these issues: this is vis.js-version-dependent and not reliable)

Is it possible to bind events to the recline.js slickgrid view using the "events" feature?

Using the SlickGrid view from recline.js, I've been trying to bind an click event to a row without success. It's easy enough to $('.slick-row').click(function() {...etc}), but I was hoping to use the backbone-esque view to handle my events. Nothing seems to fire. Context seems right. Is there something obvious I'm overlooking?
My HTML container:
<div id="mygrid" style="height: 400px"></div>
My JS:
$(function() {
var data = [
{id: 0, date: '2011-01-01', x: 1, y: 2, z: 3, country: 'DE', geo: {lat:52.56, lon:13.40} },
{id: 1, date: '2011-02-02', x: 2, y: 4, z: 24, country: 'UK', geo: {lat:54.97, lon:-1.60}},
{id: 2, date: '2011-03-03', x: 3, y: 6, z: 9, country: 'US', geo: {lat:40.00, lon:-75.5}},
{id: 3, date: '2011-04-04', x: 4, y: 8, z: 6, country: 'UK', geo: {lat:57.27, lon:-6.20}},
{id: 4, date: '2011-05-04', x: 5, y: 10, z: 15, country: 'UK', geo: {lat:51.58, lon:0}},
{id: 5, date: '2011-06-02', x: 6, y: 12, z: 18, country: 'DE', geo: {lat:51.04, lon:7.9}}
];
var dataset = new recline.Model.Dataset({
records: data
});
var $el = $('#mygrid');
var grid = new recline.View.SlickGrid({
model: dataset,
el: $el,
state: {
gridOptions: '',
},
// Click handler?
events: {
'click .slick-row': 'handleClick',
'click': 'handleClick',
},
handleClick: function(e) {
console.log('row clicked');
}
});
grid.visible = true;
grid.render();
});