<XMLPlayground />

Hello, world

Good old lovely XML. Like HTML, but you invent your own tag names, you say? How we all rejoiced.

Bringing XML and its various related technologies together, though, such that you can play around and test things out, is not always trivial or quick to set up.

XMLPlayground is a sandbox environment for XML development, including (E)XSLT, XML validation (DTD, schema, RelaxNG) and XQuery.

Just enter your code in the various panels - whichever you need to use - and generate output. Read below for more info, or check out the example sessions.

What can I do with XMLPlayground?

XMLPlayground is a sandbox for XML development. It has five development panels into which you can either insert or upload code:

Just enter or upload code into the panels you need to use, then 'involve' them in output by selecting their 'involved' checkboxes, then hit the 'RUN' button at the top to generate output. Read more on the XMLP UI.

Sessions can be saved, resumed and shared. You can also write session notes, for the benefit of either yourself later or for developers with whom you share the session.

back to top

The XMLP UI

The XMLP UI is made up of three areas:

back to top

XMLP UI: Code panels

Each code panel (XML, CSS etc) features a textarea into which you can either enter code manually or, via the 'upload' tab, upload code from a file on your PC.

Maximise your screen space

To make best use of your available screen space, hide panels you're not working with by clicking their header bars (click them again to show them).

You can also code in full-screen mode by double-clicking a code textarea or clicking the full-screen icon in every panel.

'Involve' your panels

Code panels contribute to output only if their 'involve' checkbox is checked - see Generating output

Special panel tabs

Certain panels have other tabs specific to that panel. For example, the XML panel has a 'tree' tab that renders your current XML code as a traversable node tree, while the XSL panel has a tab for specifying XSL includes, for use with <xsl:import... commands.

back to top

XMLP UI: output panel

The right half of the screen is where your generated output is shown, once the 'RUN' button is clicked. Generated content can be styled with CSS rules specified in the CSS code panel.

The output panel has an 'options' tab that allows you to specify head content (e.g. to load in remote CSS files).

You can also set a base URL prefix for any local paths in your generated output. This is useful for ensuring the integrity of local SRCs and HREFs generated in the output isn't lost when viewed in XMLP. For example, if you specify a base path of http://www.somedomain.com/imgs/ and your output includes the string <img src='dog.jpg' />, the resultant SRC will be http://www.somedomain.com/imgs/dog.jpg.

back to top

XMLP UI: Session tools

The top bar of the XMLP UI features session tools that allow you to save your session as well as read or write session notes.

Session notes is a handy feature for saving sample code, making comments or writing more detailed explanation for those with whom you plan to share the session.

The notes facility also allows you to set a session description, which will show at the top of the screen any time someone visits or resumes the session.

back to top

Generating output

The first step to generating output from the code you have entered in the code panels is to nominate which panels should be involved in the output.

To do this, check the 'involved' checkbox to the right of each code panel you wish to involve and then hit the 'RUN' button at the top of the screen. Output will then be generated and dumped into the output panel.

Remember - output is built only from those panels whose 'involved' checkboxes are checked!

Why? Because if all panels automatically contributed to output, you would first have to empty any that should not contribute to output at the present time, but which perhaps contained test code or code intended for use later.

back to top

Saving, sharing and resuming XMLP sessions

When an XMLP session is saved for the first time a unique URL is generated for it. You can use this URL to resume the session later yourself or share the session with other developers.

This makes XMLP a handy tool for XML-based questions or answers on forums or dev community sites such as Stack Overflow, as you can link directly to a session demonstrating your problem or solution.

back to top

How do I use XSL imports with XMLP?

XMLP allows you to use up to six XSL includes - i.e. XSL scripts linked to your main XSL (or to each other).

First, set up an XSL include. To do this, hit the 'includes' tab of the XSL code panel, pick an include (1-6) and enter some code into the include's textarea.

Then, to include your include, so to speak, reference it in a <xsl:import... tag by its numerical index followed by the XSL file extension, e.g. <xsl:import href='3.xsl' />.

back to top

Sending parameters into XSL

In XSL it is common to send in parameters for use in your code. There are two ways to achieve this with XMLP. In both cases you must ensure your XSL is expecting the parameters, by declaring them, otherwise they will not be received:

<xsl:param name='param_name' />

Runtime params

These are set under the 'params' tab of the XSL panel. Simply list the params you want, each on its own line, in the following format:

param hair_colour = "blonde"

Note that, due to lack of support in PHP, you cannot stipulate an XML namespace for your param.

Reflexive params

Reflexive params are sent in via links clicked in your output. That is, your output regenerates itself, passing in certain params along the way. They are stipulated as a JavaScript object and passed to the xmlp.output() method.

javascript:parent.xmlp.output({{type: "dog", name: "Fido", age: 3}});

(Note the double braces - necessary to prevent XSL interpreting the braces as the opening of an XPath expression.)

Reflexive params are useful when you want your output to behave differently depending on user interaction. For example, in this demo session, when a table heading is clicked, output is regenerated and a param, sort_by_col, is sent in. The XSL receives it and sorts the table accordingly.

back to top

How do I reference my XML in XQuery code?

If you're working with XQuery you can reference your source XML via the [xml] token, e.g.

XML

<a><b>2</b><c>51</c></a>

XQuery

b:alert(
	let $xml := [xml]
	return xs:string($xml/b * $xml/c)
)

(Note the [xml] token)

Output

102

You can see the token used in this example session involving XQuery.

back to top

What's XMLP's technological setup?

XMLP is built on PHP and handles most parsing, validation and transformation of code on the server.

The one exception is XQuery, which is handled in-browser, client-side, via XQIB (XQuery in the Browser).

This is because PHP lacks native support for XQuery, as it does for XSL 2.0. There are third-party efforts to provide the former, but some don't work and in any case XMLP is on shared hosting so installing libraries is unfortunately not an option.

Should PHP ever implement native support for these technologies, XMLP will be upgraded to utilise them.

back to top

You made this for free? Let me give you some money

I know. Hours and hours of toil, a thankless task, nose to the grindstone, working for mankind, etc etc. If XMLPlayground helped you out in any way and you want to make a donation towards the hosting costs, my PayPal address is mitya AT mitya DOT co DOT uk - thanks a lot.

back to top

Example sessions

The following example sessions will give you a flavour of what XMLP can do and how it's used.

back to top