<!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="utf-8">
                <title>Jaggery - Delicious Javascript</title>
                <meta name="description" content="">
                    <meta name="author" content="">

                        <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
                        <!--[if lt IE 9]>
                        <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
                        <![endif]-->

                        <!-- Le styles -->
                        <link href="../css/bootstrap.css" rel="stylesheet">
                            <style type="text/css">
                            body {
                                padding-top: 60px;
                                }
                            </style>
                            <link href="../css/prettify.css" rel="stylesheet">
                                <!-- Le fav and touch icons -->
                                <link rel="shortcut icon" href="../images/favicon.ico">
                                    <link rel="apple-touch-icon" href="../images/apple-touch-icon.png">
                                        <link rel="apple-touch-icon" sizes="72x72"
                                        href="../images/apple-touch-icon-72x72.png">
                                            <link rel="apple-touch-icon" sizes="114x114"
                                            href="../images/apple-touch-icon-114x114.png">
                                            </head>

                                            <body>

                                                <%
                                                include('/includes/topnavi.jag');
%>

<div class="container-fluid" style="width: 960px; margin: auto;">
    <div class="row">
        <div class="span16">
            <div class="page-header">
                <h1>
                    Documentation
                    <small>API documentation for Jaggery.js</small>
                </h1>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="span4">
            <div class="well">
                <%
                include('/includes/navi.jag');
                %>

            </div>

        </div>
        <div class="span12">
            <div class="content" id="xhr" name="xhr">
                <h3>XMLList</h3>

                <pre class="prettyprint linenums">
&lt%
var people= new XML("&lt;person&gt;&lt;name&gt;Tove&lt;/name&gt;&lt;age&gt;32&lt;/age&gt;&lt;/person&gt;&lt;person&gt;&lt;name&gt;Jani&lt;/name&gt;&lt;age&gt;26&lt;/age&gt;&lt;/person&gt;");

print("Number of people " + people.length());
%&gt;
</pre>
                <%

                var xhrCode = '&lt%'
+ '\n var people= new XML("&lt;person&gt;&lt;name&gt;Tove&lt;/name&gt;&lt;age&gt;32&lt;/age&gt;&lt;/person&gt;&lt;person&gt;&lt;name&gt;Jani&lt;/name&gt;&lt;age&gt;26&lt;/age&gt;&lt;/person&gt;");'
+ '\n print("Number of people " + people.length());'
+ '\n %&gt';

                var codeSnip = encodeURIComponent(xhrCode);

                var urlString = '../tryitframe.jag?code='+codeSnip;


                %>
                <div id="tryitwindow" class="modal hide fade">
                    <div class="modal-header">
                        <a href="#" class="close">&times;</a>

                        <h3>Try it now</h3>
                    </div>
                    <div class="modal-body">
                        <iframe src="<%=urlString%>" style="border: none;" width="98%"
                                height="520px" scrolling="no"></iframe>
                    </div>

                </div>

                <p align="right">
                    <button class="btn primary" data-keyboard="true" data-backdrop="true"
                            data-controls-modal="tryitwindow">Try it now
                    </button>
                </p>

                 <section id="overview">


                <h4>Overview</h4>
                <p class="description"> <code>XMLList</code> is an API class in jaggery, and it provides the fucntionality of <a href="http://www.ecma-international.org/publications/files/ECMA-ST/Ecma-357.pdf">E4X</a> for XML manipulation. more information about EX4 can be found at <a href="https://developer.mozilla.org/En/E4X/Processing_XML_with_E4X#Creating_an_XML_object">Mozilla Developer Network</a></p>

                </section>
            </div>
            <!-- /xhr div -->
            <br>
            <br>
        </div>

    </div>
    <%
    include('/includes/footer.jag');
    %>

</div>

<!-- /container -->
<%
include('/includes/scripts.jag')
%>
<script>
$(document).ready(function(){
        $('#xmllist').toggleClass('active')
        $('#docs').addClass('active')
        })

</script>
</body>
</html>
