XMLParser

XMLParser

Parses xml/html content exposing proxies to offer maximum fleixibility

This module classifies tags in two Types, TEXT and CUSTOM. Each tag corresponds to a proxy. If you have a tag <br /> the module will look for a proxy named br and will call it's "handler". Proxies are described below.

Using the module is fairily easy

var Parse 	= T("xmlparser");
var view 	= Parse("<xml></xml>");

$.index.add(view);

The module comes with some predefined proxies such as "p", "br", "a", "i", "strong" but you can override these or add others by calling the method below.

Override existing proxies

Parse.overrideProxies({
	br: {
		type: Parse.TYPE_TEXT,
		handler: function(e, container) {
			return { text: e.text + "\n\n", attributes: [] };
		}
	},
	customTag: {
		type: Parse.TYPE_CUSTOM,
		handler: function(e, container) {
			var sampleView = Ti.UI.createView({
				width: 100,
				height: 100,
				backgroundColor: "red"
			});
			container.add(sampleView);
		}
	}
});

As you can see, a proxy is an object which has an attribute type and a method handler. What happens is that if a proxy is of type Parse.TYPE_TEXT the module expects it to return an object as the following

{
	text: "Some string",
	attributes: [
		{
			type: Ti.UI.ATTRIBUTE_LINK,
			value: "http://google.com"
		},
		{
			type: Ti.UI.ATTRIBUTE_FONT,
			value: {
				fontWeight: "bold"
			}
		}
	]
}

This way all the text is handled within one single Label view to helo maintain a low memory footprint. If you've used Ti.UI.attributedString this structure is might be familiar to you. Using this module you don't have to worry about text ranges.

The type Parse.TYPE_CUSTOM instead isn't expected to return anything, rather it should manage itself, adding a view to the main container view.

The handler function is passed two arguments.

• The first argument is an object representation of the tag corresponding to that proxy. The object is structured as follows.

var e = {
	name: "span",
	attributes: {
		attribute: "value"
	},
	start: 0,
	end: 6,
	text: "",
	content: ""
};

As you might imagine, the name of the object is the name of the tag, then the attributes property has an object of all the attributes of the tag simply as attribute => value. The start and end properties are used internally, they don't say much except the length of the tag. The text property contains the string that starts with the opening tag and ends at the next child tag. The content instead contains all the text and the tags children as string thus the sub xml. You don't have to parse the content property yourself as it is handled automatically

• The second argument has a refference to the main container view.

Set a container (Optional)

There's a preset container as for the proxies but you can use your own. The preset container is as follows:

container = Ti.UI.createScrollView({
	layout: "vertical",
	width: Ti.UI.SIZE,
	height: Ti.UI.SIZE
});

To set your own use the setContainer() method which requires an argument of type Object that inherits from Ti.UI.View

var view = Ti.UI.createView();
Parse.setContainer(view);

You can further customize the module by passing a second argument to the constructor

The constructor receive a second optional argument of type Object that has the following structure.

var opts = {
	font: {fontFamily: "Times", fontSize: "18"},
	textStyle: {width: "80%", color: "#ccc", },
	container: Ti.UI.createView(),
	proxies: {

	}
};

Therefore you call the constructor

var opts = {
	font: {fontFamily: "Times", fontSize: "18"},
	textStyle: {width: "80%", color: "#ccc", },
	container: Ti.UI.createView(),
	proxies: {

	}
};
Parse("<span></span>", opts);

Analyzing one by one the properties:

• «font» represents the base font property of the text. This is applied to the main label(s) before the different attributes are added to the text portions
• «textStyle» the properties of the labels. This property mirrors the Ti.UI.Label object.
• «conainer» the main view that will be returned by the parser. It is optional as mentioned above. It must inherit Ti.UI.View and support the method .add()
• «proxies» also optional, can be used to extend the main proxies. It accepts the same structure as described above in overrideProxies. It has priority over the overrideProxies which in turn has priority over the defaultProxies

Enjoy :)