Как отобразить значения из массивов, расположенных внутри отдельных JSON файлов, в зависимости от дня посещения сайта - PullRequest
0 голосов
/ 15 апреля 2020

Код ниже должен загружать значения из разных файлов JSON в массив arr в зависимости от даты посещения сайта.

Ожидаемое поведение:

Если вы посещаете / обновляете sh сайт 2020-04-15, вы должны получить случайное значение, выбранное из file-1.json.

Если вы посещаете / обновляете sh сайт 2020-04-16, вы должны получить случайное значение, выбранное из file-2.json.

...

до бесконечности.

Вот мой scripts.js file:

//Populate calendar with dates
var getDaysArray = function(start, end) {
    for(var arr=[],dt=new Date(start); dt<=end; dt.setDate(dt.getDate()+1)){
        arr.push(new Date(dt));
    }
    return arr;
};
var calendar = getDaysArray(new Date("2020-04-15"),new Date("2021-01-01"));
calendar.map((v)=>v.toISOString().slice(0,10)).join("")
console.log(calendar);


var arr = [];

function isToday(dateParameter) {
        var today = new Date();
        return dateParameter.getDate() === today.getDate() && dateParameter.getMonth() === today.getMonth() && dateParameter.getFullYear() === today.getFullYear();

}

Promise.all(
calendar.filter(d=>isToday(new Date(d))).map((today,i)=>{
  return new Promise(resolve=>{
    //Get the json based on index
    $.getJSON(`file-${i+1}.json`, resolve);
  })
}))
.then(smcs=>{
  //Iterate through array of the data.. Should be two dimensional array with one array in it
  for(const array of smcs){
    // You can use $.each here but this is simpler
    arr = [...arr,...array]
  }
})
.then(()=>{
  //Random pick
  console.log(arr);
  $("#show").text(arr[Math.floor(Math.random() * arr.length)]);
})

My file-1.json:

[
"Green", 
"Aqua", 
"Blue"
]

My file-2.json:

[
"Violet", 
"Orange", 
"Pink"
]

А вот демо, которое я опубликовал на Netlify , для вашего удобства: https://bluwind.netlify.com

Вопросы:

  1. Как я могу заставить это иметь ожидаемое поведение и "ассоциировать" каждый json файл с каждым днем?
  2. Как я могу проверить его, чтобы увидеть, как он будет работать, если кто-то посетит сайт завтра?
  3. Есть ли лучший способ выполнить эту задачу? Я открыт для предложений.

Большое спасибо за прочтение, и я приветствую любые отзывы. Пожалуйста, помогите мне, прежде чем я сойду с ума с этим кодом.

Приветствия:)

1 Ответ

0 голосов
/ 15 апреля 2020

Вы можете взять разницу в днях с сегодняшней даты в качестве значения смещения для вашего json файла. Что-то вроде

// Store today's date
const today = new Date();
// Define milliseconds per day
const msPerDay = 1000*60*60*24;
// Get difference (in days) between two dates
function getDiffInDays(date1, date2){
    // `|0` is same as Math.floor(...)
    return ((date2.getTime() - date1.getTime())/msPerDay)|0;
}
// Get date by offset in days (Useful for testing tomorrow's date and so on)
function getDateByOffset(days=0){
    const today = new Date();
    return new Date((today.getTime()/msPerDay + days)*msPerDay);
}
// Get offset index for the json file
function getIndex(){
    // Define the starting date for "file-1.json"
    const startDate = new Date(Date.parse('4/15/2020'));
    // Will range from 1 instead of 0
    return getDiffInDays(startDate, today) + 1;
}
new Promise(resolve=>{
    // Get the json file based on the offset
    $.getJSON(`file-${getIndex()}.json`, resolve);
})
.then(json=>{
    // Add it to the `arr` array
    arr = [...arr,...json];
})
.then(()=>{
    console.log(arr);
    $("#show").text(arr[Math.floor(Math.random() * arr.length)]);
})
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...