Weird date in an HTML file update question

MarcLister

MarcLister

MarcLister

Soldato
Joined
7 Mar 2005
Posts
19,623
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. :)
 
JavaScript and Java are different. You shouldn't need anything bar a browser as JavaScript should work out the box.

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.
 
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?
 
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>
 
To make the page reload automatically every 24 hours:

Code: 
<script type="text/javascript">setInterval(function () { window.location.reload() }, 86400000);</script>
 
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?
 
MarcLister said:
Thanks. :) I've done a bit of web design but not much messing with declaring Javascript in the head. :)

Sweet. So we could just have the computer put on hibernate or sleep mode and resume it every morning?
Click to expand...

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.
 
jack.mitchell said:
Hmmm, maybe not as the countdown would pause during hibernate I reckon.
Click to expand...

Depends how you calculate the countdown there is no reason why you couldn't automate the process by calculating the time differnce yourself.

I've not looked through the docs but i'm pretty sure datejs.com offers functionality to do this kinda thing and will solve your first problem too.
 
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>
 
It's because your using an alert() to display the string, you need to select the element you wish to replace and then update it like so

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></body>
</html>
 
Last edited:
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>
 
You must log in or register to reply here.
Back
Top Bottom