根据日期改变图像

Question

I want to add a functionality to my site that changes the images shown depending on the day. I haven't been able to quite wrap my head around it as I'm a bit of a novice. My images are stored in images/week2/image_day_4. I am going to try to use a couple incrementing variables to access the image values, so if the day is day 4 in week 2 of membership the code should read something like

"images/week_" + week + "/image_day_" + day;

every day since membership started, i'll increment day.

Is there a better way to do this?

Answer 1

So if I understand that correctly, every day for some prolonged period of time of membership will display a different image. Why do you need week then? One solution would be to just keep track of total days and create a basic JS object of key value pairs. Keys could be the number of days, and value could be the url of the image. For example:

JS Usage:

var obj = {
    key1: value1,
    key2: value2
};

JS Example:

var membershipImages = {
    1: "images/day1.jpg",
    2: "images/thatThing.png"
};

Then after you calculate a user's day of membership, all you would need to do is pull out the url:

someObject.setSomeProperty(membershipImages.getProperty("1"));

Answer 2

According to this documentation and this thread , you could use :

function getWeekNumber(d) {
    // Copy date so don't modify original
    d = new Date(+d);
    d.setHours(0, 0, 0);
    // Set to nearest Thursday: current date + 4 - current day number
    // Make Sunday's day number 7
    d.setDate(d.getDate() + 4 - (d.getDay() || 7));
    // Get first day of year
    var yearStart = new Date(d.getFullYear(), 0, 1);
    // Calculate full weeks to nearest Thursday
    var weekNo = Math.ceil((((d - yearStart) / 86400000) + 1) / 7)
    // Return array of year and week number
    return weekNo;
}

var path = "images/week_" + getWeekNumber(new Date()) + "/image_day_" + new Date().getDay();
alert(path);

JSFiddle

EDIT : The new Date() statement can be easily converted to use the membership starting date.