Swap image on site every Monday

grajay155

Hello - new here so hope some kind person can help me along the way.

I've done quite a bit of trawling through this forum and have found instances that nearly match what I want to do - but not quite.

I have a village website and have been asked to put up a reminder changing every Monday morning/Sunday midnight for the forthcoming week with an image of which color refuse bin it is in the current week - ie green bin one week and black bin the next. A number of folks have already said how useful it is but the Javascript I am using currently changes the image over on Saturdays.

/* For a given date, get the ISO week number
*
* Based on information at:
*
* http://www.merlyn.demon.co.uk/weekcalc.htm#WNR
*
* Algorithm is to find nearest thursday, it's year
* is the year of the week number. Then get weeks
* between that date and the first day of that year.
*
* Note that dates in one year can be weeks of previous
* or next year, overlap is up to 3 days.
*
* e.g. 2014/12/29 is Monday in week 1 of 2015
* 2012/1/1 is Sunday in week 52 of 2011
*/
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 [d.getFullYear(), weekNo];
}

root

You subbed the wrong function, you need the one noted as being modified that returns the week number, the one you put in is the unmodified version that returns an array.

so modifying the above function c/o stackoverflow you get.
... then the code listed below that above comment.

grajay155

\\.\;1294547 wrote:

You subbed the wrong function, you need the one noted as being modified that returns the week number, the one you put in is the unmodified version that returns an array.

Once again, thanks for the help. In fact I had tried both variations and left the unmodified version on my page. I've now substituted with the modified version as you advised but sadly I get the same result.

Graham

root

The function returns the ISO week number so you might not get the result you were expecting.

I will have another look at your site code.

grajay155

\\.\;1294599 wrote:

The function returns the ISO week number so you might not get the result you were expecting.

I will have another look at your site code.

That is most kind of you. The script as it is does not change the graphic at all but leaves it permanently at the green stage, whereas the one on the home page of the same site (http://www.bedstoneandbucknell.org/) does indeed change every week as I said before (but on a Thursday). There was me thinking that I could just add 3 days onto the 'calculation' and fix it that way. I am most grateful for your assistance.

I have not test it but the above code should find the first Monday at the start of the year and start counting weeks from that date. You divide weeks with number 2 to get an even or odd number. If the number is even you set your image to the green.png, otherwise you set it theblack.png. With this method your images should get changed on every Monday.

root

You are missing </body> and </html> from the end of your page, this should be the biggest part of your problem because as far as the browser is concerned, the page is still loading and can't complete the DOM tree because it is expecting more elements.

Try adding the HTML closures to see what happens.

In the meantime I am going to have a ferret around your page code to see what improvements can be made, it is to be honest a bit of a mixed bag, iframes are deader than corduroy and people only use them as a last resort.

I suspect some of your scripts can be applied dynamically to improve the code readability, the layout took me best part of an hour to turn in to something readable. Are you using a serverside to generate the code by any chance or did you push your HTNL through a tool that removes whitespaces that help with formatting? If you do then for debugging's and trouble shooting sake, I advise you don't.

root

OK, just found them buried in the mishmash of script at the end of the page. Never mind...

grajay155

\\.\;1294611 wrote:

I suspect some of your scripts can be applied dynamically to improve the code readability, the layout took me best part of an hour to turn in to something readable. Are you using a serverside to generate the code by any chance or did you push your HTNL through a tool that removes whitespaces that help with formatting? If you do then for debugging's and trouble shooting sake, I advise you don't.

Hi again

Most of the page was constructed with Dreamweaver. It is, as you might guess a work in progress and I've not put it through any tool to remove whitespaces as I most certainly need space to see where things are when they go wrong. Yes, the ifame came as part of the mini calendar and I know I can change it which is the next on my list of worries.

Sorry you've been put to so much trouble.

Graham

root

To simplify things, I wasn't sure until I knew what black.png and green.png were but now know its a reference to a bin collection.

This modulo approach will test if a weeknumber is odd or even, then apply the image reference as appropriate, this now means that you don't need a huge reference array.

I have +1 to the output because the ISO week calc is showing today as week 44 whereas mu Excel test sheet shows we are week 45, you will need to remove the +1 from the function return if the colour bin is not correct.

I have tested this in my local web browser.

root

grajay155;1294617 wrote:

Sorry you've been put to so much trouble.

Graham

No problem, glad to help out a fellow 'shire. I used to live in Worcestershire, not too far from Bedstone and Bucknell, if memory serves me its not far from Ludlow. Only thing I can say is ... A456!

007Julien

With daylight saving times all days are not 86400 seconds ! Then all scripts which use 86400 are wrong ! And there is many, many wrong scripts on the web...

root

The difference is minimal 007Julien, whats important is that on odd weeks one image shows and on even weeks another image shows.

root

And theirs that day light savings thing, something that you do not account for, that has been taken care of in the computer for those machines that observe daylight savings, so any script that "Accounts" for day light savings in calculations is only compounding the time shift further from the correct time.

I asked Microsoft about, short answer is the time that JavaScript uses is based on the system clock, the system clock bases its time on what the system time was set to and it only looks at the clock ticks not the BIOS time that delivers the time base to the system, any sync with external references like atomic clocks is purely operating system based.

grajay155

\\.\;1294621 wrote:

I have tested this in my local web browser.

What a dramatic change from the original script I had working (after a fashion). I wonder what it is I'm doing wrong as trying the new script still stubbornly refuses to change image colour.

tech_soul8 - Thanks for trying to help, but I can't get your suggestion to work either - but thanks for trying.

007Julien - My thanks to you as well but I'm not quite sure what I have to do to incorporate your idea. I have tried it and I got the alerts which changed when the date changed.

007Julien

What minimal difference ? The result may differ a week !
The computer should be an exact science. It would be better to give reliable results ...