Log in

View Full Version : 12h to 24h clock


intakep
07-31-2010, 06:46 PM
Hello. I got this script(attached) and it's currently in a 12h format but I'd like to change it to 24h, however, I'm really not good at coding. Can anyone help me?

Thanks in advance.
djr33
07-31-2010, 06:56 PM
There is no file or text attached. We can probably help though!
intakep
08-01-2010, 07:11 PM
Oh oops. I guess it didn't upload..

Here it is
bluewalrus
08-01-2010, 10:19 PM
Nothing in the file..
intakep
08-02-2010, 03:05 AM
Oh come on really? I just downloaded it and I could see it? Weird..Anyways, here it is:



<html>
<head><title>newclock</title><base href="Private/"/></head>

<style>

SPAN#clock
{
font-family: Helvetica;
font-weight: bold;
color: #575a5b;
text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.7);
/*text-shadow: #ac7a00 0px 1px 0px;*/
font-size: 26px;


}

SPAN#ampm
{
font-family: Helvetica;
font-weight: bold;
color: #575a5b;
text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.7);
/*text-shadow: #ac7a00 0px 1px 0px;*/
font-size: 15px;

}

TD#date
{
font-family: Helvetica;
font-weight: bold;
text-align: left;
color: #575a5b;
text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.7);
/*text-shadow: #FFFFFF 0px 1px 0px;*/
font-size: 13px;
text-transform: uppercase;

}

</style>

<script type="text/javascript">
<!--
var this_weekday_name_array = new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday")
var this_month_name_array = new Array("January","February","March","April","May","June","July","August","September","October","November","December") //predefine month names


var this_date_timestamp = new Date()

var this_weekday = this_date_timestamp.getDay()
var this_date = this_date_timestamp.getDate()
var this_month = this_date_timestamp.getMonth()
var this_year = this_date_timestamp.getYear()

if (this_year < 1000)
this_year+= 1900;
if (this_year==101)
this_year=2001;

var this_date_string = this_weekday_name_array[this_weekday] + " " + this_date + " " + this_month_name_array[this_month]//concat long date string

// -->
function init ( )
{
timeDisplay = document.createTextNode ( "" );
document.getElementById("clock").appendChild ( timeDisplay );
}

function updateClock ( )
{
var currentTime = new Date ( );

var currentHours = currentTime.getHours ( );
var currentMinutes = currentTime.getMinutes ( );
var currentSeconds = currentTime.getSeconds ( );

// Pad the minutes and seconds with leading zeros, if required
currentMinutes = ( currentMinutes < 10 ? "0" : "" ) + currentMinutes;
currentSeconds = ( currentSeconds < 10 ? "0" : "" ) + currentSeconds;

// Choose either "AM" or "PM" as appropriate
var timeOfDay = ( currentHours < 12 ) ? "AM" : "PM";

// Convert the hours component to 12-hour format if needed
currentHours = ( currentHours > 12 ) ? currentHours - 12 : currentHours;

// Convert an hours component of "0" to "12"
currentHours = ( currentHours == 0 ) ? 12 : currentHours;

// Compose the string for display
var currentTimeString = currentHours + ":" + currentMinutes;

// Update the time display
document.getElementById("clock").firstChild.nodeValue = currentTimeString;
}

function init2 ( )
{
timeDisplay = document.createTextNode ( "" );
document.getElementById("ampm").appendChild ( timeDisplay );
}

function amPm ( )
{
var currentTime = new Date ( );

var currentHours = currentTime.getHours ( );

// Choose either "AM" or "PM" as appropriate
var timeOfDay = ( currentHours < 12 ) ? "AM" : "PM";

// Convert the hours component to 12-hour format if needed
currentHours = ( currentHours > 12 ) ? currentHours - 12 : currentHours;

// Convert an hours component of "0" to "12"
currentHours = ( currentHours == 0 ) ? 12 : currentHours;

// Compose the string for display
var currentTimeString = timeOfDay;

// Update the time display
document.getElementById("ampm").firstChild.nodeValue = currentTimeString;
}

function init3 ( )
{
timeDisplay = document.createTextNode ( "" );
document.getElementById("calendar").appendChild ( timeDisplay );
}

function calendarDate ( )
{
var this_weekday_name_array = new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday")
var this_month_name_array = new Array("January","February","March","April","May","June","July","August","September","October","November","December") //predefine month names

var this_date_timestamp = new Date()

var this_weekday = this_date_timestamp.getDay()
var this_date = this_date_timestamp.getDate()
var this_month = this_date_timestamp.getMonth()

//document.getElementById("calendar").firstChild.nodeValue = this_weekday_name_array[this_weekday] + " " + this_date + " " + this_month_name_array[this_month]//concat long date string

document.getElementById("calendar").firstChild.nodeValue = this_weekday_name_array[this_weekday] + "," + " " + this_month_name_array[this_month] + " " + this_date //concat long date string
}

// -->
</script>

</head>


<body >





<table style="position: absolute; top: 310px; left: 105px; width: 180px; height: 461px;" cellspacing="0" cellpadding="0" align="right">
<tr align="left" valign="top" border="0" cellpadding="0">
<td height="12" valign="top" margin-left="120" >
<span id="clock">
<script language="JavaScript">updateClock(); setInterval('updateClock()', 1000 )</script></span><span id="ampm">
<script language="JavaScript">amPm(); setInterval('amPm()', 1000 )</script>
</span>
</td>
</tr>
<tr>
<td id="date" valign="top">
<span id="calendar">
<script language="JavaScript">calendarDate(); setInterval('calendarDate()', 1000 )</script>
</span>
</td>
</tr>
</table>
<object data="WeatherWidget/WeatherWidget.html" type="text/html" height="480" width="320">
<p></p>
</object>

</body>
</html>
coothead
08-03-2010, 09:50 AM
Hi there intakep,

and a warm welcome to these forums. ;)

You seem to have a lot of code there. :D

Try this simplified example...


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="language" content="english">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">

<title>twenty four hour clock with date</title>

<style type="text/css">
body {
margin:0;
padding:0;
font-family:helvetica,sans-serif;
font-weight:bold;
color:#575a5b;
text-shadow:0 -1px 0 rgba(0,0,0,0.7);
}
#currenttime {
margin:310px 0 0 105px;
font-size:26px;
}
#currenttime span {
padding-left:5px;
font-size:15px;
}
#currentdate {
margin-left:105px;
font-size:13px;
text-transform:uppercase;
}
</style>

<script type="text/javascript">

function displayDate(){

month=['January','February','March','April','May','June','July','August','September','October','November','December'];
day=['Sunday','Monday','Tuesday','Wednsday','Thursday','Friday','Saturday'];

dte=new Date();
yy=dte.getUTCFullYear();
mm=dte.getMonth();
dd=dte.getDate();
dy=dte.getDay();
hr=dte.getHours();
mn=dte.getMinutes();

if(hr<10){
hr='0'+hr;
}
if(mn<10){
mn='0'+mn;
}
time=hr+':'+mn;
date=day[dy]+', '+month[mm]+' '+dd+', '+yy;

document.getElementById('currenttime').firstChild.nodeValue=time;
document.getElementById('currentdate').firstChild.nodeValue=date;

setTimeout(function(){displayDate()},1000);
}

if(window.addEventListener){
window.addEventListener('load',displayDate,false);
}
else {
if(window.attachEvent){
window.attachEvent('onload',displayDate);
}
}

</script>

</head>
<body>

<div id="currenttime">&nbsp;<span>HRS</span></div>
<div id="currentdate">&nbsp;</div>

</body>
</html>

coothead
intakep
09-03-2010, 02:43 AM
thanks so much! works great :)
coothead
09-03-2010, 08:18 AM
No problem, you're very welcome. ;)
rkoziol7
09-15-2010, 08:03 AM
@coothead

I am impressed by your helpful. On every other forum i (http://findsurebet.com/football-odds.html)ntakep would just get an information:

"try to use google and find the right sol (http://findsurebet.com/hockey-odds.html)ution yourself".

It is hard to find someone really helpful on forums today.