<?xml version="1.0"?>
<!DOCTYPE doc [
<!ATTLIST mylink1
          xlink:type CDATA "simple"
>
<!ATTLIST p id ID #IMPLIED>
<!ATTLIST div id ID #IMPLIED>
]>
<doc xmlns:xlink="http://www.w3.org/1999/xlink"
    xmlns:html="http://www.w3.org/1999/xhtml">
  <html:style type="text/css">
    div {display: block; padding-left: +1em;}
    p {display: block; padding-left: +1em;}
    mylink1 {display: inline; color:blue; padding-left: +1em;}
  </html:style>
<!--  <html:h1>XPointer testcase</html:h1>-->
  <div id="id1">
    <p>First para in div="id1"</p>
    <div>
      <p>First para in div with no id</p>
      <p id="id2">Second para in div with id=id2</p>
    </div>
    <p>Second para in div="id1"</p>
    <p id="id3">Third para in div="id1", the ID of this element is id3.</p>
    <html:h2><html:span>XHTML</html:span> h2 element</html:h2>
    <html:h3>XHTML h3 element</html:h3>
    <p>Foobar</p>
    <html:h3>XHTML h3 element too</html:h3>
  </div>
  <mylink1 xlink:href="#id1">id1 - div=id1</mylink1><html:button onclick="xp('id1', event)">JS</html:button><html:br/>
  <mylink1 xlink:href="#element(id2)">element(id2) - Second para</mylink1><html:button onclick="xp('element(id2)', event)">JS</html:button><html:br/>
  <mylink1 xlink:href="#element(id1/2/1)">element(id1/2/1) - First para in second div</mylink1><html:button onclick="xp('element(id1/2/1)', event)">JS</html:button><html:br/>
  <mylink1 xlink:href="#element(/1/2)">element(/1/2) - div=id1</mylink1><html:button onclick="xp('element(/1/2)', event)">JS</html:button><html:br/>
  <mylink1 xlink:href='#xpath1(id("id3"))'>xpath1(id("id3")) - p=id3</mylink1><html:button onclick='xp("xpath1(id(\"id3\"))", event)'>JS</html:button><html:br/>
  <mylink1 xlink:href='#foobar(id("id3"))'>foobar(id("id3")) - ???</mylink1><html:button onclick='xp("foobar(id(\"id3\"))", event)'>JS</html:button><html:br/>
  <mylink1 xlink:href='#element(nothere)'>element(nothere) - ???</mylink1><html:button onclick="xp('element(nothere)', event)">JS</html:button><html:br/>
  <mylink1 xlink:href='#xmlns(foo=http://www.w3.org/1999/xhtml) xpath1(//foo:h2//foo:span)'>xmlns(foo=http://www.w3.org/1999/xhtml) xpath1(//foo:h2//foo:span) - span inside h2</mylink1><html:button onclick="xp('xmlns(foo=http://www.w3.org/1999/xhtml) xpath1(//foo:h2//foo:span)', event)">JS</html:button><html:br/>
  <mylink1 xlink:href='#xmlns(foo=http://www.w3.org/1999/xhtml) xpath1(//foo:h3)'>xmlns(foo=http://www.w3.org/1999/xhtml) xpath1(//foo:h3) - h3 elements</mylink1><html:button onclick="xp('xmlns(foo=http://www.w3.org/1999/xhtml) xpath1(//foo:h3)', event)">JS</html:button><html:br/>
  <mylink1 xlink:href='#xpath1(//html:h2)'>xpath1(//html:h2) - ???</mylink1><html:button onclick='xp("xpath1(//html:h2)", event)'>JS</html:button><html:br/>
  <mylink1 xlink:href='#foobar(^^foo^))'>foobar(^^foo^)) - ???</mylink1><html:button onclick="xp('foobar(^^foo^))', event)">JS</html:button><html:br/>
  <mylink1 xlink:href='#foobar(^foo)'>foobar(^foo) - ??? [error]</mylink1><html:button onclick="xp('foobar(^foo)', event)">JS</html:button><html:br/>
  <mylink1 xlink:href='#foobar()'>foobar() - ???</mylink1><html:button onclick="xp('foobar()', event)">JS</html:button><html:br/>
  <mylink1 xlink:href='#foo bar(foo)'>foo bar(foo) - ??? [error]</mylink1><html:button onclick="xp('foo bar(foo)', event)">JS</html:button><html:br/>
  <mylink1 xlink:href='#foobar((foo)'>foobar((foo) - ??? [error]</mylink1><html:button onclick="xp('foobar((foo)', event)">JS</html:button><html:br/>
  <mylink1 xlink:href='#foobar)(foo'>foobar)(foo - ??? [error]</mylink1><html:button onclick="xp('foobar)(foo', event)">JS</html:button><html:br/>
  <mylink1 xlink:href='#xpath1(//foo:h3)'>xpath1(//foo:h3) - ???</mylink1><html:button onclick="xp('xpath1(//foo:h3)', event)">JS</html:button><html:br/>

<html:script type="text/javascript">
<![CDATA[
function xp(str, event)
{
  var elem = document.createElementNS("http://www.w3.org/1999/xhtml", "html:span");
  elem.setAttribute("style", "color: red;");

  try {
    var result = document.evaluateXPointer(str);
    if (result) {
      var count = result.length;
      var i;
      for (i = 0; i < count; i++) {
        var range = result.item(i);
        var text = document.createTextNode(range.toString());
        elem.appendChild(text);
      }
    } else {
      var text = document.createTextNode("@@no result@@");
      elem.appendChild(text);
    }

    event.target.parentNode.insertBefore(elem, event.target.nextSibling);
  } catch (e) {
    var text = document.createTextNode(e.toString());
    elem.appendChild(text);
    event.target.parentNode.insertBefore(elem, event.target.nextSibling);
  }
}
]]>
</html:script>
</doc>
