Multiple instances - how?

**andy_brit** · 04-27-2007, 03:14 PM

1) Script Title: Dynamic Countup script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...countingup.htm

3) Describe problem:

The listing for this script says it is possible to have multiplt instances of this sript running using, but just how do you do it? My meagre JS skills hit the brickwall of lack of knowledge when I try, thanks for your help.

**boogyman** · 04-27-2007, 03:28 PM

Code:

dcountup(startingdate, baseunit);

where starting date is in format (month day, year hour:minute:second)
--where hours are military time
--eg 1pm = 13 2pm = 14 ... 11pm = 23 12am(minight) = 00

and baseunit = (days, hours,minutes or seconds) written out

then you need to initialize it to say what you want so you edit this inside your <head> js custom script

Code:

princewedding.oncountup=function(result){
  var mycountainer=document.getElementById("cpcontainer")
  mycountainer.innerHTML="message_to_display"+ result['days']+" days "+result['hours']+" hours "+result['minutes']+" minutes "+result['seconds']+" seconds"
}

**jscheuer1** · 04-27-2007, 04:14 PM

boogyman,

That doesn't look like what it says to do on the demo page. Did you test it out?

Once you've put Step 1 from the demo page in the head of your page, it says that you can have as many of these in the body as you like:

Code:

<div id="cpcontainer">&nbsp;</div>

<script type="text/javascript">

//SYNTAX: myvariable=new dcountup(past_date_and_time_string, "baseunit")
var princewedding=new dcountup("April 9, 2005 13:30:00", "days")

princewedding.oncountup=function(result){
	//result is an object containing the current count up date/time, updated every second
	//Available properties: result["days"], result["hours"], result["minutes"], and result["seconds"]
	var mycountainer=document.getElementById("cpcontainer")
	mycountainer.innerHTML="Prince Charles and Camilla Parker have been married for: <br /><span class='dcountstyle'>"+result['days']+" <sup>days</sup> "+result['hours']+" <sup>hours</sup> "+result['minutes']+" <sup>minutes</sup> "+result['seconds']+" <sup>seconds</sup></span>"
}

</script>

Color codes:

Black - The parts of the code that must remain unchanged.

Green - These are just comments that tell you what you can do.

Blue - These are things that you will customize as you see fit.

Dark Red - These are the id of the container for the output. Each instance needs one and only one of these but, it must be unique to that instance and used in the two places shown.

Red - These are the variable name that identifies the instance. This also must be unique to the instance and used in the two places shown.

**andy_brit** · 04-30-2007, 02:23 PM

John

I really appreciate the time taken to reply.

Unfortunately I'm slightly color blind and I'm having some slight difficulty distinguishing between the dark red and black bits in your code clip. Would you mind awfully, changing the dark red bits to another colour perhaps a lurid purple, or something equally hideous!

Sorry to be a pain,
thanks
a

**boogyman** · 04-30-2007, 02:26 PM

Originally Posted by jscheuer1

boogyman,

That doesn't look like what it says to do on the demo page. Did you test it out?

Once you've put Step 1 from the demo page in the head of your page, it says that you can have as many of these in the body as you like:

Code:

<div id="cpcontainer">&nbsp;</div>

<script type="text/javascript">

//SYNTAX: myvariable=new dcountup(past_date_and_time_string, "baseunit")
var princewedding=new dcountup("April 9, 2005 13:30:00", "days")

princewedding.oncountup=function(result){
	//result is an object containing the current count up date/time, updated every second
	//Available properties: result["days"], result["hours"], result["minutes"], and result["seconds"]
	var mycountainer=document.getElementById("cpcontainer")
	mycountainer.innerHTML="Prince Charles and Camilla Parker have been married for: <br /><span class='dcountstyle'>"+result['days']+" <sup>days</sup> "+result['hours']+" <sup>hours</sup> "+result['minutes']+" <sup>minutes</sup> "+result['seconds']+" <sup>seconds</sup></span>"
}

</script>

Color codes:

Black - The parts of the code that must remain unchanged.

Green - These are just comments that tell you what you can do.

Blue - These are things that you will customize as you see fit.

Dark Red (Magenta) - These are the id of the container for the output. Each instance needs one and only one of these but, it must be unique to that instance and used in the two places shown.

Red - These are the variable name that identifies the instance. This also must be unique to the instance and used in the two places shown.

dark red changed to magenta (pink)

**Twey** · 04-30-2007, 03:04 PM

And so, the prophecy has been fulfilled.

On a more serious note, this could become a real problem. Can anyone think of a better way to highlight code than using colour?

**thetestingsite** · 04-30-2007, 03:35 PM

I have tried used colors, bold, italics (but that was hard to read the code), and even made the size of the text larger. Usually though, the best way (I find) is to use colors.

**boogyman** · 04-30-2007, 03:41 PM

how about underline / overline / ____ ? or a format could be developed for this purpose? i dunno maybe with "code" boxes around it or something?? I dunno just a thought

**andy_brit** · 05-01-2007, 10:35 AM

What have I started!

One way I use is to use a comment line (or lines) underneath
//Change this ------------^^^^^
//Dont change this --------------------^^^^^

It requires careful planning to avoid overlap and can look messy but when changed, the code can be tidied up and extraneous comments removed. Careful choice of non-proportional fonts would be needed.

I doubt that there is a perfect way for everybody but thats accessibility

Any other suggestions?

**kimberleydavid** · 06-12-2007, 02:27 AM

1) Script Title: Dynamic Countup Script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...countingup.htm

3) Describe problem:

I want to have multiple countup calculaters running on my page, its for a quit smoking website goingcoldturkey.com, where I want more than one person to pledge a quitting date.

I tried pasting the body part mulitple times, but only get some type of error NAN in the timer fields, and then will rotate to the next entry. I would like to have all entries one under another.

Can this actually be done?

Thanks

Thread: Multiple instances - how?

Thread Tools

Search Thread

Multiple instances - how?

Tried multiple pastes to no avail

Bookmarks

Bookmarks

Posting Permissions