Control traffic lights with model CPU

**David77** · 05-16-2012 05:47 AM

When I was teaching 25 years ago, I wrote a program in Turbo Pascal to represent an on-screen microprocessor so that students could see their programs working. I am now trying to get these working on the web.

I've now got the CPU working slowly (although not fully tested). I now want the CPU to control the traffic lights.

see http://homepage.ntlworld.com/stoneba...ndtraffic3.htm

I have a parent page cpuandtraffic3.htm which is simply:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

<html>
<head><title>CPU and Traffic Lights</title>
</head>

<frameset cols="50%, 50%">
<frame src="cpu14.svg" align="top" name="cpudoc">
<frame src="traffic14.svg" align="top" name="trafficdoc">
</frameset>

</html>

My CPU fnlights() code is triggered by onclick on the 'L' button

function fnlights() {
var lite, attr
goslow=false;
var traffic = parent.document.getElementById('trafficdoc');
var doc = traffic.document;
lite = doc.getElementById("x1red");
attr = lite.getAttribute("fill");
if (attr == "red") { x1red.setAttribute("fill", "black"); }
else { x1red.setAttribute("fill", "red"); }
}

and I am trying to change the colour of the traffic light
<circle id="x1red" cx="175" cy="200" r="10" fill="red"/>

Thanks for any advice.

Opera reports

Event thread: click
Uncaught exception: TypeError: Cannot convert 'traffic' to object
Error thrown at line 780, column 0 in fnlights() in file://localhost/C:/Documents%20and%20Settings/Computer/My%20Documents/SVGexamples/cpu14.svg:
var doc = traffic.document;

**David77** · 05-17-2012 04:38 AM

The parent page can use embedded pages for each part

http://homepage.ntlworld.com/stoneba...andtraffic.htm

or iframes

http://homepage.ntlworld.com/stoneba...ndtraffic2.htm

or a frameset

http://homepage.ntlworld.com/stoneba...ndtraffic3.htm

I want to keep each part separate 'cos if I get this working, then I have other models that I would like to translate from Pascal to javascript.

Thanks for any advice.

**Padonak** · 05-17-2012 01:15 PM

i suppose (based on the markup you posted in the 1st post) you got this error because there is no element having it's attribute id="trafficdoc" in the parent document.

**David77** · 05-18-2012 04:23 AM

You remind me that I had read somewhere that I should declare both id and name to be "trafficdoc"

It works on Opera - I haven't tried other browsers yet.

**David77** · 05-18-2012 06:01 AM

The iframes version http://homepage.ntlworld.com/stoneba...ndtraffic2.htm works with Opera, Firefox, and Chrome with either
var doc = top.trafficdoc.document;
or var doc = parent.trafficdoc.document;

IE8 won't work with either of them. It reports
top.traffic.document is null or not an object

**Padonak** · 05-18-2012 11:19 AM

try contentDocument

**David77** · 05-21-2012 02:18 AM

That works with Opera, Firefox, and Chrome. I'll give up with IE8 and worry about that later.

Thread: Control traffic lights with model CPU

Thread Tools

Display

Control traffic lights with model CPU

Alternative parent pages

Thanks Padonak

Thanks again Padonak

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions