Trying to organize data extracted from a JSON object.
The object contains a videosource: video.videodata
and the various transcoded resolutions: video.transcoded
Data:
"video": [
{
"videodata": "https://example.com/link/to/firstTestvideo.mp4",
"transcoded": [
"-360",
"-480"
]
},
{
"videodata": "https://example.com/link/to/firstTestvideo.mp4",
"transcoded": [
"-360",
"-480",
"-720"
]
}
],
Desired format:
videos: [ //global
video: [
0: [
{
src: "https://example.com/link/to/firstTestvideo-360.mp4",
resolution: "-360p",
},
{
src: "https://example.com/link/to/firstTestvideo-480.mp4",
resolution: "-480p",
},
{
src: "https://example.com/link/to/firstTestvideo.mp4",
resolution: "full",
},
],
1: [
{
src: "https://example.com/link/to/secondTestvideo-360.mp4",
resolution: "-360p",
},
{
src: "https://example.com/link/to/secondTestvideo-480.mp4",
resolution: "-480p",
},
{
src: "https://example.com/link/to/secondTestvideo-720.mp4",
resolution: "-720",
},
{
src: "https://example.com/link/to/secondTestvideo.mp4",
resolution: "full",
},
],
],
],
Current approach:
...
const filler = ajax.response;
Object.keys(filler.video).forEach((k) => {
const temp = [];
temp[{ k }] = []; // <-NOT WORKING??
this.videos[{ k }] = []; // global [].
const item = filler.video[k];
const sl = item.videodata.substring(0, item.videodata.length - 4);
Object.keys(filler.acf.video[k].transcoded).forEach((x) => {
temp[{ k }].push(
{
src: `${sl}${filler.video[k].transcoded[x]}.mp4`,
resolution: filler.video[k].transcoded[x],
},
);
});
Object.entries(temp).forEach((o) => {
this.videos[{ k }].push(o[1]);
});
});
});
Looking for suggestions on creating "Subarrays" of videos.
Due to the changing number of videos, static indexes like video[0], video[1], etc. won't work.
Any alternative ways to format the data without string concatenation?
Unfortunately, modifying the JSON layout is not an option.
Appreciate any ideas!