Mailing Lists: Apple Mailing Lists
 Image of Mac OS face in stamp
any Safari options for "watch" or "onpropertychanged"?
[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]

any Safari options for "watch" or "onpropertychanged"?

Hi

I'm writing an SVG Javascript library and have found that Safari doesn't scale an SVG once it has been created even if the width is defined as a percentage if it's container. As a workaround, I thought of wrapping an svg tag inside a div and having the Javascript object that references the div watch for changes to the div size. It seemed simple enough, just watch the offsetWidth and offsetHeight properties, but Safari doesn't seem to allow watching. Scoured the web looking for workarounds and found that IE uses something similar "onpropertychanged" but Safari doesn't allow that either. Is there any way to watch a property in Safari? Some custom syntax?

Thanks for any help

FWIW, here's the Javascript class I'm trying to write:

function JSSVGView(inContainer, inStyle)
{
var t = this;

t.container = inContainer;
t.id = JS_SVGVIEW_ID_COUNTER++;

// create the div node
t.node = document.createElement('div');
t.node.setAttribute('id', t.id);
t.node.setAttribute('class', inStyle);

// create the svg node
t.svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
t.svg.setAttributeNS(null, 'height', '100%');
t.svg.setAttributeNS(null, 'width', '100%');
t.svg.setAttributeNS(null, 'version', '1.1');
t.svg.setAttribute('xmlns', 'http://www.w3.org/2000/svg'); // don't use setAttributeNS, fails with this attribute
t.svg.setAttribute('id', JS_SVGVIEW_ID_COUNTER++);

// add svg node to div node
t.node.appendChild(t.svg);
t.node.__defineSetter__();

/* broken
// watch node width and height changes
t.node.watch('offsetWidth', function() { t.handleWidthChange(); });
t.node.watch('offsetHeight', function() { t.handleHeightChange(); });
*/

// add div node to container
if (inContainer == document.body)
inContainer.appendChild(t.node);
else
inContainer.appendChild(t);
}

JSSVGView.prototype.handleWidthChange = function() { this.svg.setAttributeNS(null, 'width', this.node.offsetWidth + 'px'); }
JSSVGView.prototype.handleHeightChange = function() { this.svg.setAttributeNS(null, 'height', this.node.offsetHeight + 'px'); }

JSSVGView.prototype.appendChild = function(inChild) { this.node.appendChild(inChild.node); }
JSSVGView.prototype.appendSVGChild = function(inChild) { this.svg.appendChild(inChild.node); }

_______________________________________________
Do not post admin requests to the list. They will be ignored.
Web-dev mailing list      (email@hidden)
Help/Unsubscribe/Update your Subscription:
This email sent to email@hidden






















Visit the Apple Store online or at retail locations.

1-800-MY-APPLE


Contact Apple | Terms of Use | Privacy Policy


Copyright © 2011 Apple Inc. All rights reserved.