Zooming by defining rectangle and changing viewbox atttributes

Following a few examples on this list and in other places, I have tryied to implement custom zooming functions using javascript and the DOM.
I think I am almost there, there is only one problem. When the viewbox of the main svg document is changed (after defining the first rectangle) , the references that I use in javascript to draw the rectangle don't match with the view of the document. How can I ensure that subsequent drawing occurs in the current view of the document ? I think I am forgetting something here ! Hopefully someone can help !
I have placed a version of the svg document at www.dbxgeomatics.com/zoomtest2.svg so that you can see what I am referring to.

Thanks in advance.

Dany Bouchard
DBx Geomatics
38 de l'Orbite
Hull, Québec
Canada
J9A 3C7
Téléphone/Telephone: 819.743.3870
Télécopieur/Fax: 819.775.3264
Courrier électronique/Email: db@dbxgeomatics.com
Page Web/Web site: http://www.dbxgeomatics.com/home.asp