Test DOM structure of Selectors

git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1876 eee81c28-f429-11dd-99c0-75d572ba1ddd
master
Jeff Schiller 2010-11-17 16:48:28 +00:00
parent 8bf4dfbe7a
commit f77d832c25
2 changed files with 128 additions and 32 deletions

View File

@ -123,8 +123,8 @@ svgedit.select.Selector.prototype.updateGripCursors = function(angle) {
// show - boolean indicating whether grips should be shown or not
svgedit.select.Selector.prototype.showGrips = function(show) {
// TODO: use suspendRedraw() here
var bShow = show ? "inline" : "none";
selectorManager_.selectorGripsGroup.setAttribute("display", bShow);
var bShow = show ? 'inline' : 'none';
selectorManager_.selectorGripsGroup.setAttribute('display', bShow);
var elem = this.selectedElement;
this.hasGrips = show;
if(elem && show) {
@ -140,15 +140,15 @@ svgedit.select.Selector.prototype.resize = function() {
mgr = selectorManager_,
selectedGrips = mgr.selectorGrips,
selected = this.selectedElement,
sw = selected.getAttribute("stroke-width"),
sw = selected.getAttribute('stroke-width'),
current_zoom = svgFactory_.currentZoom();
var offset = 1/current_zoom;
if (selected.getAttribute("stroke") !== "none" && !isNaN(sw)) {
if (selected.getAttribute('stroke') !== 'none' && !isNaN(sw)) {
offset += (sw/2);
}
var tagName = selected.tagName;
if (tagName === "text") {
if (tagName === 'text') {
offset += 2/current_zoom;
}
@ -223,26 +223,26 @@ svgedit.select.Selector.prototype.resize = function() {
}
var sr_handle = svgFactory_.svgRoot().suspendRedraw(100);
var dstr = "M" + nbax + "," + nbay
+ " L" + (nbax+nbaw) + "," + nbay
+ " " + (nbax+nbaw) + "," + (nbay+nbah)
+ " " + nbax + "," + (nbay+nbah) + "z";
var dstr = 'M' + nbax + ',' + nbay
+ ' L' + (nbax+nbaw) + ',' + nbay
+ ' ' + (nbax+nbaw) + ',' + (nbay+nbah)
+ ' ' + nbax + ',' + (nbay+nbah) + 'z';
selectedBox.setAttribute('d', dstr);
var xform = angle ? "rotate(" + [angle,cx,cy].join(",") + ")" : "";
this.selectorGroup.setAttribute("transform", xform);
var xform = angle ? 'rotate(' + [angle,cx,cy].join(',') + ')' : '';
this.selectorGroup.setAttribute('transform', xform);
// TODO(codedread): Is this if needed?
// if(selected === selectedElements[0]) {
this.gripCoords = {
nw: [nbax, nbay],
ne: [nbax+nbaw, nbay],
sw: [nbax, nbay+nbah],
se: [nbax+nbaw, nbay+nbah],
n: [nbax + (nbaw)/2, nbay],
w: [nbax, nbay + (nbah)/2],
e: [nbax + nbaw, nbay + (nbah)/2],
s: [nbax + (nbaw)/2, nbay + nbah]
'nw': [nbax, nbay],
'ne': [nbax+nbaw, nbay],
'sw': [nbax, nbay+nbah],
'se': [nbax+nbaw, nbay+nbah],
'n': [nbax + (nbaw)/2, nbay],
'w': [nbax, nbay + (nbah)/2],
'e': [nbax + nbaw, nbay + (nbah)/2],
's': [nbax + (nbaw)/2, nbay + nbah]
};
for(var dir in this.gripCoords) {
@ -370,9 +370,9 @@ svgedit.select.SelectorManager.prototype.initGroup = function() {
}
})
);
$.data(this.rotateGrip, "type", "rotate");
$.data(this.rotateGrip, 'type', 'rotate');
if($("#canvasBackground").length) return;
if($('#canvasBackground').length) return;
var dims = config_.dimensions;
var canvasbg = svgFactory_.createSVGElement({
@ -450,7 +450,7 @@ svgedit.select.SelectorManager.prototype.releaseSelector = function(elem) {
if (this.selectors[i] && this.selectors[i] == sel) {
if (sel.locked == false) {
// TODO(codedread): Ensure this exists in this module.
console.log("WARNING! selector was released but was already unlocked");
console.log('WARNING! selector was released but was already unlocked');
}
delete this.selectorMap[elem.id];
sel.locked = false;
@ -459,7 +459,7 @@ svgedit.select.SelectorManager.prototype.releaseSelector = function(elem) {
// remove from DOM and store reference in JS but only if it exists in the DOM
try {
sel.selectorGroup.setAttribute("display", "none");
sel.selectorGroup.setAttribute('display', 'none');
} catch(e) { }
break;
@ -474,14 +474,14 @@ svgedit.select.SelectorManager.prototype.getRubberBandBox = function() {
this.rubberBandBox = this.selectorParentGroup.appendChild(
svgFactory_.createSVGElement({
'element': 'rect',
"attr": {
"id": "selectorRubberBand",
"fill": "#22C",
"fill-opacity": 0.15,
"stroke": "#22C",
"stroke-width": 0.5,
"display": "none",
"style": "pointer-events:none"
'attr': {
'id': 'selectorRubberBand',
'fill': '#22C',
'fill-opacity': 0.15,
'stroke': '#22C',
'stroke-width': 0.5,
'display': 'none',
'style': 'pointer-events:none'
}
})
);
@ -499,7 +499,7 @@ svgedit.select.SelectorManager.prototype.getRubberBandBox = function() {
* SVGSVGElement svgRoot();
* SVGSVGElement svgContent();
*
* Number: currentZoom();
* Number currentZoom();
* Object getStrokedBBox(Element[]); // TODO(codedread): Remove when getStrokedBBox() has been put into svgutils.js
* }
*/

View File

@ -3,6 +3,9 @@
<head>
<link rel='stylesheet' href='qunit/qunit.css' type='text/css'/>
<script src='../editor/jquery.js'></script>
<script type='text/javascript' src='../editor/browsersupport.js'></script>
<script type='text/javascript' src='../editor/math.js'></script>
<script type='text/javascript' src='../editor/svgutils.js'></script>
<script type='text/javascript' src='../editor/select.js'></script>
<script type='text/javascript' src='qunit/qunit.js'></script>
<script type='text/javascript'>
@ -16,6 +19,60 @@
module('svgedit.select');
var svgns = 'http://www.w3.org/2000/svg';
var sandbox = document.getElementById('sandbox');
var svgroot;
var svgcontent;
var rect;
var mockConfig = {
dimensions: [640,480]
};
var mockFactory = {
createSVGElement: function(jsonMap) {
var elem = document.createElementNS(svgns, jsonMap['element']);
for (var attr in jsonMap['attr']) {
elem.setAttribute(attr, jsonMap['attr'][attr]);
}
return elem;
},
svgRoot: function() { return svgroot; },
svgContent: function() { return svgcontent; }
};
function setUp() {
svgroot = mockFactory.createSVGElement({
'element': 'svg',
'attr': {'id': 'svgroot'}
});
svgcontent = svgroot.appendChild(
mockFactory.createSVGElement({
'element': 'svg',
'attr': {'id': 'svgcontent'}
})
);
rect = svgcontent.appendChild(
mockFactory.createSVGElement({
'element': 'rect',
'attr': {
'id': 'rect',
'x': '50',
'y': '75',
'width': '200',
'height': '100'
}
})
);
sandbox.appendChild(svgroot);
svgedit.select.init(mockConfig, mockFactory);
}
function tearDown() {
while (sandbox.hasChildNodes()) {
sandbox.removeChild(sandbox.firstChild);
}
}
test('Test svgedit.select package', function() {
expect(10);
@ -31,6 +88,44 @@
equals(typeof svgedit.select.getSelectorManager, typeof function(){});
});
test('Test Selector DOM structure', function() {
expect(20);
setUp();
ok(svgroot);
ok(svgroot.hasChildNodes());
equals(svgroot.childNodes.length, 3);
// Verify existence of canvas background.
var cb = svgroot.childNodes.item(0);
ok(cb);
equals(cb.id, 'canvasBackground');
ok(svgroot.childNodes.item(1));
equals(svgroot.childNodes.item(1), svgcontent);
// Verify existence of selectorParentGroup.
var spg = svgroot.childNodes.item(2);
ok(spg);
equals(spg.id, 'selectorParentGroup');
equals(spg.tagName, 'g');
// Verify existence of all grip elements.
ok(spg.querySelector('#selectorGrip_resize_nw'));
ok(spg.querySelector('#selectorGrip_resize_n'));
ok(spg.querySelector('#selectorGrip_resize_ne'));
ok(spg.querySelector('#selectorGrip_resize_e'));
ok(spg.querySelector('#selectorGrip_resize_se'));
ok(spg.querySelector('#selectorGrip_resize_s'));
ok(spg.querySelector('#selectorGrip_resize_sw'));
ok(spg.querySelector('#selectorGrip_resize_w'));
ok(spg.querySelector('#selectorGrip_rotateconnector'));
ok(spg.querySelector('#selectorGrip_rotate'));
tearDown();
});
});
</script>
</head>
@ -40,5 +135,6 @@
<h2 id='qunit-userAgent'></h2>
<ol id='qunit-tests'>
</ol>
<div id='sandbox'></div>
</body>
</html>