Hi, sending again with better formatting.
I have made up a simple example of what I mean: <?xml version="1.0" standalone="no"?> <svg width="100%" height="100%" version="1.1" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:xlink="http://www.w3.org/1999/xlink" onload="ecmascript:_onload(evt)" onmousedown="ecmascript:MouseDown(evt)" onmousemove="ecmascript:MouseMove(evt)" onmouseup="ecmascript:MouseUp(evt)"> <script type="text/ecmascript"> <![CDATA[ var svgDoc=document; var svgRoot=svgDoc.documentElement; var ObjArray = new Array(); var GroupArray = new Array(); var SelectRect = null; var OrigX = 0; var OrigY = 0; var bInDrawRect = false; var bMoveObjects = false; var MyGroupObjectsObj = null; function _onload(evt) { MyGroupObjectsObj = svgDoc.getElementById("SelectGroup"); var create_bar=svgDoc.createElementNS("http://www.w3.org/2000/svg", "rect"); create_bar.setAttribute("id", "r_bar"); create_bar.setAttribute("fill", "cream"); create_bar.setAttribute("x", "300"); create_bar.setAttribute("y", "50"); create_bar.setAttribute("width", "100"); create_bar.setAttribute("height", "30"); create_bar.setAttribute("pointer-events", "inherit"); svgRoot.insertBefore(create_bar, MyGroupObjectsObj); ObjArray[ObjArray.length] = create_bar; var cir = svgDoc.createElementNS("http://www.w3.org/2000/svg", "circle"); cir.setAttribute( "id","cir"); cir.setAttribute( "cx","320"); cir.setAttribute( "cy","65"); cir.setAttribute( "r","10"); cir.setAttribute('fill', 'red'); cir.setAttribute('pointer-events', 'inherit'); svgRoot.insertBefore(cir, MyGroupObjectsObj); ObjArray[ObjArray.length] = cir; } function Obj_Clicked(objid) { } function MouseDown(evt) { if(!bInDrawRect && SelectRect == null) { OrigX = evt.clientX; OrigY = evt.clientY; SelectRect=svgDoc.createElementNS("http://www.w3.org/2000/svg", "rect"); SelectRect.setAttribute("id", "SelectRect"); SelectRect.setAttribute("fill", "white"); SelectRect.setAttribute("stroke", "black"); SelectRect.setAttribute("x", evt.clientX); SelectRect.setAttribute("y", evt.clientY); SelectRect.setAttribute("width", "1"); SelectRect.setAttribute("height", "1"); SelectRect.setAttribute("pointer-events", "inherit"); svgRoot.insertBefore(SelectRect,svgDoc.getElementById("Main_BKG").nextSiblin g); bInDrawRect = true; } else if(SelectRect != null) { var selbbox = SelectRect.getBBox(); if((evt.clientX > selbbox.x) && (evt.clientX < (selbbox.x+selbbox.width)) && (evt.clientY > selbbox.y) && (evt.clientY < (selbbox.y+selbbox.height))) { //in SelectRect bMoveObjects = true; OrigX = evt.clientX; OrigY = evt.clientY; }//if else { //ouside of SelectRect, so now we //remove all items and put them back and our rect for(var pos = 0; pos < GroupArray.length;pos++) { var obj = GroupArray[pos]; ObjArray[ObjArray.length] = obj; GroupArray.splice(pos,1); pos--; MyGroupObjectsObj.removeChild(obj); svgRoot.insertBefore(obj, MyGroupObjectsObj); //testing obj.setAttribute("stroke","none"); }//for svgRoot.removeChild(SelectRect); SelectRect = null; }//else } } function MouseMove(evt) { if(bInDrawRect) { var dx = Math.abs(evt.clientX - OrigX); var dy = Math.abs(evt.clientY - OrigY); SelectRect.setAttribute("width", dx); SelectRect.setAttribute("height", dy); } else if(bMoveObjects) { var dx = evt.clientX - OrigX; var dy = evt.clientY - OrigY; OrigX = evt.clientX; OrigY = evt.clientY; for(var pos = 0; pos < GroupArray.length;pos++) { var obj = GroupArray[pos]; switch(obj.tagName) { case "rect": var xpos = Number(obj.getAttribute("x")); var ypos = Number(obj.getAttribute("y")); xpos += dx; ypos += dy; obj.setAttribute("x", xpos); obj.setAttribute("y", ypos); break; case "circle": var xpos = Number(obj.getAttribute("cx")); var ypos = Number(obj.getAttribute("cy")); xpos += dx; ypos += dy; obj.setAttribute("cx", xpos); obj.setAttribute("cy", ypos); break; }//switch } var xpos = Number(SelectRect.getAttribute("x")); var ypos = Number(SelectRect.getAttribute("y")); xpos += dx; ypos += dy; SelectRect.setAttribute("x", xpos); SelectRect.setAttribute("y", ypos); } } function MouseUp(evt) { if(bInDrawRect) { bInDrawRect = false; var selbbox = SelectRect.getBBox(); for(var pos = 0; pos < ObjArray.length;pos++) { var objbbox = ObjArray[pos].getBBox(); if((objbbox.x > selbbox.x) && ((objbbox.x+objbbox.width) < (selbbox.x+selbbox.width)) && (objbbox.y > selbbox.y) && ((objbbox.y+objbbox.height) < (selbbox.y+selbbox.height))) { var obj = ObjArray[pos]; GroupArray[GroupArray.length] = obj; ObjArray.splice(pos,1); pos--; svgRoot.removeChild(obj); MyGroupObjectsObj.appendChild(obj); //testing obj.setAttribute("stroke","black"); } } } bMoveObjects = false; } ]]> </script> <rect id="Main_BKG" x="0" y="0" width="100%" height="100%" stroke="none" fill="rgb(255,255,255)" /> <g id="SelectGroup" ></g> </svg> ------------------------------------ ----- To unsubscribe send a message to: svg-developers-unsubscr...@yahoogroups.com -or- visit http://groups.yahoo.com/group/svg-developers and click "edit my membership" ----Yahoo! Groups Links <*> To visit your group on the web, go to: http://groups.yahoo.com/group/svg-developers/ <*> Your email settings: Individual Email | Traditional <*> To change settings online go to: http://groups.yahoo.com/group/svg-developers/join (Yahoo! ID required) <*> To change settings via email: svg-developers-dig...@yahoogroups.com svg-developers-fullfeatu...@yahoogroups.com <*> To unsubscribe from this group, send an email to: svg-developers-unsubscr...@yahoogroups.com <*> Your use of Yahoo! Groups is subject to: http://docs.yahoo.com/info/terms/