...

View Full Version : Error Creating updating clock that supports multiple instances



Trickstar
06-30-2012, 08:08 PM
OK so I created an updating clock script that works (the first set of code) but it only works for one instance so I decided to change it where it will support multiple instance so I wrote the code with embedded functions (second set of code). The first code works and the second code is pretty much just the same code but written using this.example = function() {. Can someone help me fix it? This is my first attempt designing a script using the "this" feature and I'd like to know whats wrong. I have it set up where you can choose to make the code display the servers time (by embedding server-side values for the time), using the clients (by using the JavaScript date() function) or by setting your own values into the parameters of the main function.

Original (code that works):

// v1.0
var clockElement = document.getElementById("Clock");
var clockZone = "(CST)";
var clockHours = 2;
var clockMinutes = 8;
var clockSeconds = 21;
var clockMilleseconds = 1000 - 321;
function clockDisplay() {
if (clockSeconds > 59) {
clockSeconds = 0;
if (++clockMinutes > 59) {
clockMinutes = 0;
clockHours = (clockHours + 1) % 24;
}
}
var hours = clockHours;
var ampm = (hours >= 12) ? " PM " : " AM ";
if (hours > 12) { hours -= 12; }
else if (hours == 0) { hours = 12; }
clockString = (hours < 10 ? "0" : "") + hours + ":" + (clockMinutes < 10 ? "0" : "") + clockMinutes + /*":" + (clockSeconds < 10 ? "0" : "") + clockSeconds + */ampm + clockZone;
clockElement.innerHTML = clockString;
++clockSeconds;
}
function clockUpdate() {
clockDisplay();
setInterval(clockDisplay, 1000);
}
clockDisplay();
setTimeout(clockUpdate, clockMilleseconds);

New (code that doesn't work):

(JS file)

function Clock(elementID, TimeZone, hour, minute, second, millesecond) {
var objectVar = this;
this.clockElement = document.getElementById(elementID);
this.clockZone = "(" + TimeZone + ")";
this.clockHours = hour;
this.clockSeconds = second;
this.clockMinute = minute;
this.clockMilleseconds = 1000 - millesecond;
this.firstIntervalReached = false;
this.update = false;
this.display = function() {
if (objectVar.clockSeconds > 59) {
objectVar.clockSeconds = 0;
if (++objectVar.clockMinutes > 59) {
objectVar.clockMinutes = 0;
objectVar.clockHours = (clockHours + 1) % 24;
}
}
var clockString;
var hours = objectVar.clockHours;
var ampm = (hours >= 12) ? " PM " : " AM ";
if (hours > 12) { hours -= 12; }
else if (hours == 0) { hours = 12; }
clockString = (hours < 10 ? "0" : "") + hours + ":" + (objectVar.clockMinutes < 10 ? "0" : "") + objectVar.clockMinutes + /*":" + (objectVar.clockSeconds < 10 ? "0" : "") + objectVar.clockSeconds + */ampm + objectVar.clockZone;
objectVar.clockElement.innerHTML = clockString;
if (objectVar.update == true) {
++objectVar.clockSeconds;
if (objectVar.firstIntervalReached == false) {
objectVar.firstIntervalReached = true;
setTimeout(objectVar.display, objectVar.clockMilleseconds);
}
else {
setTimeout(objectVar.display, 1000);
}
}
};

(Head script):

function initializeClock() {
var clock = new Clock("Clock", "CST", <% Response.Write(DateTime.Now.Hour.ToString()); %> + 2, <% Response.Write(DateTime.Now.Minute.ToString()); %>, <% Response.Write(DateTime.Now.Second.ToString()); %>, <% Response.Write(DateTime.Now.Millisecond.ToString()); %>);
clock.update = true;
clock.display();
}
if (document.addEventListener) {
document.addEventListener("DOMContentLoaded", initializeClock, false);
}

(Body HTML):

<div id="Clock" align="right"><span style="color: red; font-size: small;">Error running JavaScript</span></div>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum