Help with XML+CSS in FlashMX

[zoddo]

Hi everyone!
I have a little problem dealing with XML+CSS in flash. So here what i want to do:
1- ideally, i want to have only one xml with all my texts inside
2- i want that xml being formatted in flash using my css (fonts/colors etc...)
3- in my flash MC, i have multiple (say 3 for ex.) textfields, each textfields will have to display a specific ChildNode from my xml file.

I've done the tutorials from Neil ("Loading External XML formatted Content" and "CSS for Flash MX 2k4") everything work perfect when you want to display all the data inside the xml in your textfield, but what about multiple textfields, displaying different nodes?

anyone can help me with that? :confused:

- zoddo

p.s.: please forgive my bad english... :(

[snapple]

zoddo,

The way i do it is to have one mc with a textfield in it. Duplicate that mc depending on how many times you need to, it might look something like this:


function createClip ()
{
numberOfNodes = portfolioXML.firstChild.childNodes.length;
var myHeight = 30;
for(var g=0; g<numberOfNodes; g++)
{
_root.contentHolder.portArea.duplicateMovieClip("portArea"+g, g);
_root.contentHolder["portArea"+g]._y = myHeight;
myHeight +=21.5;
}
}


This duplicates an mc called "portArea" as many times as it is less the length of my XML document. Then you want to list each node in a seperate textfield.

function listPortfolio(portfolioXML)
{
numberOfNodes = _root.portfolioXML.firstChild.childNodes.length;
for (var i = 0; i<numberOfNodes; i++)
{
_root.contentHolder["portArea"+i]["displayArea"] += portfolioXML.firstChild.childNodes[i].attributes["area"];
}
}


So this counts throught the duplicated mc's and the XML nodes using "i" as the counter, to make it childNode1, childNode2, childNode3 matched with mc1, mc2, mc3 etc etc.

My XML document (shortened and with CDATA, which means you might not need CSS) looks like this:

<PORTFOLIO>
<PORTFOLIO_AREA_ONE area="Car manafacturers and suppliers">
<CUSTOMER_ONE company="Volkswagen"><![CDATA[<font color="#FF2492">Merchandising</font><br>]]></CUSTOMER_ONE>
<CUSTOMER_TWO company="Mercedes"><![CDATA[<font color="#FF2492">Mystery shopping</font><br>]]></CUSTOMER_TWO>
<CUSTOMER_THREE company="Seat"><![CDATA[<font color="#FF2492">Merchandising</font><br>]]></CUSTOMER_THREE>
<CUSTOMER_FOUR company="Mazda"><![CDATA[<font color="#FF2492">Corporate hospitality and events</font><br>]]></CUSTOMER_FOUR>
<CUSTOMER_FIVE company="Carland"><![CDATA[<font color="#FF2492">Hospitality and canvassing</font><br>]]></CUSTOMER_FIVE>
<CUSTOMER_SIX company="Lex"><![CDATA[<font color="#FF2492">Canvassing</font><br>]]></CUSTOMER_SIX>
</PORTFOLIO_AREA_ONE>
<PORTFOLIO_AREA_TWO area="Confectionary">
<CUSTOMER_ONE company="Chupa Chups"><![CDATA[<font color="#FF2492">Ex car sales</font><br>]]></CUSTOMER_ONE>
<CUSTOMER_TWO company="Smint"><![CDATA[<font color="#FF2492">Merchandising and POS placement</font><br>]]></CUSTOMER_TWO>
<CUSTOMER_THREE company="Kinder Beuno"><![CDATA[<font color="#FF2492">Sampling</font><br>]]></CUSTOMER_THREE>
<CUSTOMER_FOUR company="Ferrero"><![CDATA[<font color="#FF2492">Sampling</font><br>]]></CUSTOMER_FOUR>
</PORTFOLIO_AREA_TWO>
</PORTFOLIO>


Hope this has helped.

Regards, snapple :)

[zoddo]

Hi Snapple,
first of all, thanks for your reply. I really appreciated. :)

I hadn't think about loading the text in a MC, seems a good idea to me.

Now, I understand the global idea of your script but there few things that are still blurred in my mind. That might explain why when I tried your code I can't get it display properly...I was wondering if you have an fla file to see what I am doing wrong? :confused:

thanks a lot,
- zodd

[snapple]

I can have a look at your fla - but you might want to try some debugging fisrt, tell me whats happening:

1) Are the mc's being duplicated (try tracing the variable numberOfNodes)
2) Can you even see the XML document?
3) Is your XML doc the same?
4) Is your path to the mc effecting the ability to read in the XML document
5) Are you refering to te instance name of your textfield correctly i.e. textfield1, tectfield2, tectfield3

etc etc

Just spend a bit of time debugging.

Regards, Snapple :)

[zoddo]

Bonjour snapple,
ok, the zip file contains the fla and xml files.

1) Are the mc's being duplicated (try tracing the variable numberOfNodes)
numberOfNodes tracing result is "undefined"
2)Can you even see the XML document?
hmm, yes and no, I can only see the XML document in the 'variable window' but i can't see it in the MCs.
3)Is your XML doc the same?
yes it is, i cut & paste it from your xml example.

I believe where I am wrong is with point 4 and 5. I don't know how point to textfield instance name
also:
_root.contentHolder["portArea"+i]["displayArea"] += portfolioXML.firstChild.childNodes[i].attributes["area"];
what displayarea and area refer to? this line is a puzzle for me.

again, sorry to bother you with my newbie question. :(

- zod

[snapple]

displayArea is the name of the textfield - you can call it what you want.

All the names in my example can be changed depending on what instance name you have given things.

I dont have Flash MX 2004

[zoddo]

ok. i made the correction i.e. putting the good instance name...there's still xml file that is 'undefined'

have an idea?

- zod

[snapple]

error - still says "unexpected file format"

[zoddo]

sorry, i saved it in MX, that should be ok.

[snapple]

I don't understand - nothing was set-up on the stage, you had not named your movieClip, you were using the pathing i gave in my example (which did not even exist in your fla) - you gotta be careful if you're gonna cut and paste code.

The following code outputs:


<CUSTOMER_ONE company="Volkswagen">Merchandising</CUSTOMER_ONE>
Car manafacturers and suppliers
<CUSTOMER_TWO company="Smint">Merchandising and POS placement</CUSTOMER_TWO>
Confectionary



portfolioXML = new XML();
portfolioXML.onLoad = function(success)
{
if(success)
{
portfolioXML.ignoreWhite = true;
createClip ();
listPortfolio(portfolioXML);
}
};
portfolioXML.load("portfolio.xml");
portfolioXML.ignoreWhite = true;

function createClip()
{
numberOfNodes = portfolioXML.firstChild.childNodes.length;
var myHeight = 0;
for (var g = 0; g<numberOfNodes; g++)
{
_root.container.duplicateMovieClip("container"+g, g);
_root["container"+g]._y = myHeight;
myHeight += 30;
}
}
function listPortfolio(portfolioXML)
{

numberOfNodes = _root.portfolioXML.firstChild.childNodes.length;
for (var i = 0; i<numberOfNodes; i++)
{
trace(_root.portfolioXML.firstChild.childNodes[i].childNodes[i]);
trace(_root.portfolioXML.firstChild.childNodes[i].attributes["area"]);
}
}


Hope this helps.

Oh - i'd get rid of the CDATA in your XML - it mkaes it easier to read.

Regards, snapple :)