Using PHP to get a file location for it to be used in JavaScript

Question

I want to get an unknown number of actual .json files, retrieve a few values from within the files and input them into a webpage.

My full code is here: https://gist.github.com/anonymous/e4f4488951efbdfe3431eeabbe980d80

I cannot determine how many files/ folders there might be in my project so I'm having to use a for loop to loop through a PHP array which checks a file directory on my server and determines how many 'fields' it needs to create on the page.

Here is a screenshot of what my page looks like

On the webpage itself, there are 4 'boxes' which have the environment title, each of those environment boxes contain an undefined number of features (all of these are folder names on my server). Within each feature there are an underfined number of folders which are named as a date, each date has an undefined number of folders which are named as times, each time contains two files, the .json file which I want to read information from and an .html file which I want to provide a link to when I click the times (see screenshot).

At the moment, for 4 environment, 2 features each, 5 days in each feature and 12 time folders within each day, the webpage generates approximately 90,000 lines of code which I believe is not the best way forward as it takes around ~11s to load the page itself.

Is there a more efficient way of calling each .json file, retrieving the data and inserting it into the webpage? If so, please would someone provide me with an example as to how to do it?

Edit - if the code is difficult to follow:

The folderStructure 6 dimensional array stores values as follows:

$folderStructure[$e][$f][$d][$t][][]
$e -> Environment Name
$f -> Feature Name
$d -> Date
$t -> Time
Position 5 -> Name of .json file
Position 6 -> Name of .html file

Example of how I use the 6D array to retrieve folder & file names:
$folderStructure[0][0][0][0][0][0] = production
$folderStructure[0][1][0][0][0][0] = 2-D Compare
$folderStructure[0][1][1][0][0][0] = 2016-08-24
$folderStructure[0][1][1][1][0][0] = 12.01.47
$folderStructure[0][1][1][1][1][0] = production2-dcompare2016-08-2412-01-47.json
$folderStructure[0][1][1][1][1][1] = production2-dcompare2016-08-2412-01-47.html

And I'm using a for loop for each of those array positions to iterate through the values.

Answer 1

Depending on how fresh the results should be, you can:

1 Create a cron job to cache the php output each hour.

2 Show the results on demand, using AJAX, which means:

• on page load show the list of Environments
• on Environment click (demand), send request to get Features
• on Feature click, ask for Days list

You could also combine those two methods.