Weird date in an HTML file update question

MarcLister

MarcLister

MarcLister

Soldato
Joined
7 Mar 2005
Posts
19,613
Location
LU7
I work in a school as an IT technician. We have a plasma screen at the reception area showing pictures from school trips, a picture of the tree in the school playground, the BBC News RSS feed and the date in a red box.

The date is shown as "Tuesday 8th November 2011" format. We use a program called Sedao ImageFlyer. I've developed our current plasma screen setup and I use an HTML file called "message.html". It has some basic HTML formatting to control the size and colour of the text and the colour of the box its in for good contrast.

Since it is a static HTML file my boss and I have to change the date every day by changing the date line in the code. If there was a way to leave the file alone but have it automatically change the code for the date I'd be very happy. I did try initially using a PHP file but we'd have to install something like XAMPP and have that working at the same time.

Is there anyway I can keep the HTML file but have something change the date in message.html automatically when the computer is turned on in the morning? I'd want to keep the format of "Tuesday 8th November 2011" but have it changed to "Wednesday 9th November 2011" for tomorrow's date for example.
 
jack.mitchell said:
This should get you started:

http://www.tizag.com/javascriptT/javascriptdate.php

You will also need to refresh the page everyday to update using this method.
Click to expand...
Ah Javascript. Nice one. :) We'd just need Java Runtime installed on that machine yes?

And we shut down the PC every day at about 3.20pm (once children have gone home) and it gets turned on in the morning, we 'login' to my area on the network (where the files for the screen display are stored) and open up the Sedao file so refreshing the page everyday is done. :)
 
Pho said:
JavaScript and Java are different. You shouldn't need anything bar a browser as JavaScript should work out the box.
Click to expand...
Ok, thanks. :)

Pho said:
edit: can't you get it to launch the site automatically when the PC comes online? Sounds like a pain to have to do it manually every day.
Click to expand...
No. The source files are stored on a network drive and we have to sign in to it, I use my username and password or my boss uses his if he turns the PC on in the morning. It might be possible to use some kind of macro program to run the program in the morning if it allows us to enter a username and password for the network share.
 
I had a go with this today but I couldn't get the following link to give me an ordinal after the date, i.e. 'th' or 'st'. http://www.elated.com/articles/working-with-dates/ I just get 'Thursday, 10th November 2011".

I've found another Javascript link which seems to do what I want but I think I need to declare the js script in the HTML. http://blog.stevenlevithan.com/archives/date-time-format.

Code: 
// Can also be used as a standalone function
dateFormat(now, "dddd, mmmm dS, yyyy, h:MM:ss TT");
// Saturday, June 9th, 2007, 5:46:21 PM
It has the ordinal after the date but there's a download link to the js file. So do I need to declare the Javascript file in the same way that a CSS file gets declared?
 
Spunkey said:
Yep, you'll need to download the javascript of the plugin, and then add it to your page. You'll then be able to use the .format method on your dates, like this:

Code: 
<head>
    <script type="text/javascript" src="/path-to/plugin/date.format.js"></script>
    <script type="text/javascript">
        var now = new Date();
        alert(now.format("yyyy-mm-dd"));
    </script>
</head>
Click to expand...
Thanks. :) I've done a bit of web design but not much messing with declaring Javascript in the head. :)

st00dent said:
To make the page reload automatically every 24 hours:

Code: 
<script type="text/javascript">setInterval(function () { window.location.reload() }, 86400000);</script>
Click to expand...
Sweet. So we could just have the computer put on hibernate or sleep mode and resume it every morning?
 
jack.mitchell said:
Hmmm, maybe not as the countdown would pause during hibernate I reckon. If you wanted to delve a bit deeper and learn some more, you could have just the time text auto refreshing every x minutes which would do the trick.
Click to expand...
So if we told it to refresh every 60 minutes say it'd still keep the date because its checking during the day?
 
Just working on this now. I've got it working in the way that I want BUT instead of showing the text in the HTML file it is showing a message box (in Opera and IE) saying "<localhost> Monday, 14th November 2011".

The code I'm using is below. What am I doing wrong that its showing the date not in the HTML file but in a message box? Javascript is not my forte so I'm sure it'll be a simple, easy fix but I can't see it. I'm at work so I can't upload pics but I'll do a quick pic when I get home. :)
Code: 
<html>
<head>
 <script type="text/javascript" src="date.format.js"></script>
 <style type="text/css">
*, html {background-color: red;}
h1, *{color: white; font: bold 300% georgia;}
</style>
<body>
<div align="center">
<script type="text/javascript">
        var now = new Date();
        alert(now.format("dddd, dS mmmm yyyy"));
		//dateFormat(now, "dddd, mmmm dS, yyyy, h:MM:ss TT");
		//var now = new Date();

// Can also be used as a standalone function
//dateFormat(now, "dddd, mmmm dS, yyyy, h:MM:ss TT");
// Saturday, June 9th, 2007, 5:46:21 PM
    </script>
</div>
</body>
</html>
 
Haha. :p

Like this? All I get on screen is, no date.
onload="load"
Click to expand...
Code: 
<html>
    <head>
        <script type="text/javascript" src="date.format.js"></script>
        <style type="text/css">
             * {background-color: red; color: white; font: bold 300% georgia;}
        </style> 
        <script type="text/javascript">
            function load(){
                var now = new Date();
                document.body.innerHTML = now.format("dddd, dS mmmm yyyy");
            }
        </script>
    </head>
    <body>onLoad="load"</body>
</html>
 
OK. Done that. Still nothing. :(

Code: 
<html>
    <head>
        <script type="text/javascript" src="date.format.js"></script>
        <style type="text/css">
             * {background-color: red; color: white; font: bold 300% georgia;}
        </style> 
        <script type="text/javascript">
            function load(){
                var now = new Date();
                document.body.innerHTML = now.format("dddd, dS mmmm yyyy");
            }
        </script>
    </head>
    <body onLoad="load"></body>
</html>
 
lookitsjonno said:
<body onLoad="load()"></body>
Click to expand...
Woo. We have a winner. :)

I just changed the date on my PC to November 15th (tomorrow) and refreshed the HTML file. The date changed brilliantly. :) Changed it back to today's date and on refresh, all correct again. :)

Thanks to everyone for their help. We got there in the end eh. :p

I'll mention this to boss tomorrow and see if I can demo it. It's not the biggest job in the world changing the date every night ready for the next day but if there's a way to automate it so we can leave it then I'm all for that.
 
fez said:
As long as you know what time you will be turning the PC off each afternoon you could set it to automatically show the next days date when the current time is later than 3.30 or whatever would guarantee that the date would always be changed before the computer goes off.
Click to expand...
Different time each day. It could be around 3pm when my boss leaves or anytime between 3pm and 4pm when I leave. :p

I tried the file with the display computer and it works. The font is a bit big at 300% but way too small at 200%. The problem is that the text tries to keep itself in one line. I need to be able to break the date over 3 lines if possible like so:

Code: 
Monday 14th
November
2011

I've googled new lines in Javascript but nothing's working. I might have to have three html files replace the current single html file and layer them on top of each other to look like its still one single red box with the date in it. The top box would be its own file covering the day and its ordinal. The middle box would return the month and the bottom box would return the year.

At Uni I found I had problems in my programming workshops; when given a problem to solve I would always find a more complicated solution that was needed to answer the question. I've probably done that again here. Can anyone enlighten me? :)
 
You must log in or register to reply here.
Back
Top Bottom