Javascript And Xml I'm Confused About These Two Scripts

[Vertrex]

Hello everyone.

 

Long time since I entered the forums to ask a question (probably been months).

 

Anyway my question in the topic says it all.

 

This is the javascript that I'm trying to use. Open source by the game makers/coders.

 

This scripts was meant to transform MAP_CODE into IMAGE.

 

Basically it's a script that's supposed to transform the game map (xml) data into a preview. However, I don't quite know how to use it.

 

Can someone here please help me out on this.

 

Many thanks in advance!

[gridbuilder]

try to google as how to execute xml via javascript...

[Tjoene]

JavaScript is a programming language that runs in your browser.

Simply put the .js file in your site and use this to include it in the webpage:

 

<script type="text/javascript" src="YOURFILE.js"></script>

 

XML isn't a program language, but a language to store or transfer data between applications.

[Vertrex]

oh cool.

 

Thanks for the help

[Vertrex]

It became too complex for me to understand. So I scraped it and instead thought I could use php's DOMDocument function and as I've seen that you can use <svg></svg>, I thought of making a php version of it.

Is that a good choice, do you think?

[Shinryuu]

XML and HTML are similar in that you have tags with attributes, values, and tags are embedded in each other, the difference is that in HTML your stuck with a set amount of tags, in XML you make them up as you and keep track of them in your own DTD. I can explain a Wall definition as the code is expecting it to show you how to backtrace the XML structure.

var walls = document.getElementsByTagName('Wall');
for(var i = walls.length - 1; i &--#62;= 0; --i) {
	var str = '';
	var points = walls[i].getElementsByTagName('Point');
	for(var j = points.length - 1; j &--#62;= 0; --j) {
			var x = parseFloat(points[j].getAttribute('x'));
			var y = -parseFloat(points[j].getAttribute('y'));
			str += x + ',' + y + ' ';
			if(minx &--#62; x) minx = x;
			if(maxx &--#60; x) maxx = x;
			if(miny &--#62; y) miny = y;
			if(maxy &--#60; y) maxy = y;
	}
	var polyline = document.createElementNS('http://www.w3.org/2000/svg', 'polyline');
	polyline.setAttribute('points', str);
	polyline.setAttribute('stroke', 'black');
	polyline.setAttribute('stroke-width', stroke);
	polyline.setAttribute('fill', 'none');
	svg.appendChild(polyline);
}

The first line creates an array of walls by scanning for &<Wall> tags, <Wall></Wall>.

The fourth line creates a point array and expects x and y attributes in the tag in the form of <Point x= y=/>.

After the inner loop finishes running you have the code making polyline elements based on w3c's 2000 svg DTD.

Because the point loop is inside the wall loop you know the point tags are embedded in wall tags

 

<Wall>

<Point x= y= />

</Wall>

 

I'm not a javascript programmer, but it's usually pretty straightforward.

[Vertrex]

Ya I'm not much into java myself. So I did this in php instead and it works

Thanks for the explanation though. The php manual wasn't that effective as an example