XML and drawing API

[Gloo pot]

Lets say I have an xml file in which i want to keep coordinates to be used by AS2's drawing API. The idea of it is that i want to be able to draw objects to stage with these coordinates but be able to store them all in an xml file.

In the xml file I would like to be able to select starting point, coordinates to draw to, and a finishing point if thats even necessery. For a simple space ship as an example ill use this char to represent what i wish to draw. "^"

Starting = 0,2
Drawto = 1,0
Drawto = 2,2

Simply, its the coordinated to draw an upside down V shape.

In the flash file, i need be able to go thought the xml file sort all the objects which will be in seperate child nodes and there coordinates for each objects. Draw them some were in an empty mc.

I have a solid understanding of XML, Drawing API, arrays, and all that jaz. What im asking for here is a coding concept, an idea, anything that can help me to figure out how to put it together. How to structure my XML files and thoery's on how to use it all together.

Thanks for any advice.
Aaron

[renderhjs]

i´d just store lines as complete vector path´s. E.g your example would be
0,2/1,0/2,2
and that´s the way I´d basicly store it together with an offset value (if grouped in another object), and perhaps a line color.
Wich I would propably write like:

<xml>
    <id="^" p pos="0,0" c="ff0000">0,2/1,0/2,2</p>
    <id="shape1" p pos="0,0" c="0044ff">0,8/4,8/0,0</p>
</xml> 

and all you´d do in as would be to run through the xml elemets and draw each element, e.g

_root.createEmptyMovieClip("mc_lines",1);
var node = xml.firstChild.childNodes;
for (var i=0;i<node.length;i++){
    mc_lines.lineStyle(0,Number("0x"+node[i].attributes.c),100);
    var array = node[i].firstChild.nodeValue.split("/");//split into coordinate elements
    for (var j=0;i<array.length;j++){
        
        var x = Number(array[j].split(",")[0]) + Number(node[i].attributes.pos.split(",")[0]);
        var y = Number(array[j].split(",")[1]) + Number(node[i].attributes.pos.split(",")[1]);

        if (j==0){
            mc_lines.moveTo(x,y);    
        }else{
            mc_lines.lineTo(x,y);    
        }
    }
} 

[Gloo pot]

I didnt expect such a responce but let me break this down and hopefully you can give me the run down of what i did and didnt get right.

i dont know what id and p pos is used for in the xml files

//Creates an empty MC for it all called mc_line
_root.createEmptyMovieClip("mc_lines", 1);
// childNodes are the nodes we are storing all the data in? 
var node = xml.firstChild.childNodes;
onEnterFrame = function () {
             // Look though them, there are 2 in the xml file?
    for (var i = 0; i<node.length; i++) {
                          //defines the drawing line, the colour is from node[i] and use attributes to locate c in the node which hold the hex number for it, alpha
        mc_lines.lineStyle(0, Number("0x"+node[i].attributes.c), 100);
        var array = node[i].firstChild.nodeValue.split("/");
        //split into coordinate elements 


                         // This gets confusing realy quickly
        for (var j = 0; i<array.length; j++) {
            var x = Number(array[j].split(",")[0])+Number(node[i].attributes.pos.split(",")[0]);
            var y = Number(array[j].split(",")[1])+Number(node[i].attributes.pos.split(",")[1]);
            if (j == 0) {
                mc_lines.moveTo(x, y);
            } else {
                mc_lines.lineTo(x, y);
            }
        }
    }
}; 

[Gloo pot]

Bed time, sorry. ZzZzZzzz

[renderhjs]

id is something you suggesed. It´s not used now but very common in using tags for certain elements rather by searching child nodes by numbers or orders. E.g you could create an interface where you can draw a shape/stroke by id- like drawing the spaceship could be a function like drawShape("^");. But that´s future stuff first try to code the basics.

pos stands short for position and basicly is an offset value that is added to the coordinates. That way it´s so much easier to move the shape without recalculating all the stroke coordinates. Imagine the ship needs to be centered on you Stage wich is 600*400 in the xml child you then would write:

<id="^" p pos="300,200" c="ff0000">0,2/1,0/2,2</p> 

wich is half of the stage size - and that way it would be centered (the orgin that is).

so to repeat a little:

for (var j = 0; i<array.length; j++) { 

run through all coordinates there are e.g [1,2],[4,6],[6,2],...

var x = Number(array[j].split(",")[0])+Number(node[i].attributes.pos.split(",")[0]); 

first we split out the first Value of the 2 wich are splited by an ",". To do so split it with the split(",") command, wich will create an array of 2 elements the first a String with the x- coordinate, the 2nd another String with the y coordinate. To convert them to a number I used the Number() method wich converts strings e.g "516" to 516 as number.
Now the position (pos) offset value needs to be added otherwise only fixed coordinates are used (aka. the ones that are hard to edit). It basicly follows the same pattern split the attribute pos use either the 1st or 2nd value (x or y coordinate) and convert it to number.

if (j == 0) { 
        mc_lines.moveTo(x, y); 
    } else { 
        mc_lines.lineTo(x, y); 
    } 
} 

if j (the loop that draws/moves coordinate by coordniate) is the first (==0) then move the drawAPI otherwise draw a stroke/line towards the coordinate

hope that clarifies some

[Gloo pot]

Thanks, yes that helped alot, very clever thinking indeed.

[Alluvian]

In the optimization thread I seem to recall someone saying that for...in was faster than while which is faster than for...

Is that true?

If it is true, why isnt this line:
for (var j = 0; i<array.length; j++) { }

Written as this:
for (var j in array) { }

The latter would go through the array backwards, but wouldn't that be fine in this situation? Or is the latter really not any faster than the former?

[renderhjs]

...If it is true, why isnt this line:
for (var j = 0; i<array.length; j++) { }

Written as this:
for (var j in array) { }

dont know at least in AS3 performance tests people claim that for (var i=....) is faster.
Personally I never liked the for (var i in...) method it´s appearence is just not to my liking - propably a matter of personal expierence

Still I can´t be that wrong usually I dont have any performance issues,- and if you write something that slows down then you did propably something else wrong as in most cases it works very fast.

[Alluvian]

Maybe just out of date or I read it wrong then. It was from the optimization thread in the sticky, but the date was in or before 2005 I think. So much wrong information out there on the web, some of it just plain wrong, some just not as important as it the authors seem to think, and some just out of date.

My rule of thumb? If it works good enough for you, it will work just fine for my clunky code, heh.