openjpa-jest/src/main/resources/org/apache/openjpa/persistence/jest/jest.html - openjpa - Git at Google

 <!--
 Licensed to the Apache Software Foundation (ASF) under one
 or more contributor license agreements.  See the NOTICE file
 distributed with this work for additional information
 regarding copyright ownership.  The ASF licenses this file
 to you under the Apache License, Version 2.0 (the
 "License"); you may not use this file except in compliance
 with the License.  You may obtain a copy of the License at

  http://www.apache.org/licenses/LICENSE-2.0

 Unless required by applicable law or agreed to in writing,
 software distributed under the License is distributed on an
 "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 KIND, either express or implied.  See the License for the
 specific language governing permissions and limitations
 under the License.
 -->

 <!--
    The single web page for JEST is a templated HTML. This page consists of three major divisions
    a) a section holds the menu items for available commands
    b) a section for the command window where user enters command specifications
    c) a section displays the server response of the command execution

    This templated file contains replaceable tokens in ${token} form.  JEST servlet replaces the tokens with
    actual deployment values on initialization.

    The menu navigation and command window are managed by jest.js script.
    The rendition of server response is managed by dojo script.

    All hyperlinks in this page are relative to the base URI of this page to prevent
    any cross-domain scripting.

  -->
 <html>
 <head>
 <!-- ==================================================================================== -->
 <!-- Base URI is replaced with actual deployment data on initialization                   -->
 <!-- ==================================================================================== -->
 <base href="${jest.uri}">
 <!-- base href="http://localhost:8080/demo/jest/" -->
 <title>JEST: REST on OpenJPA</title>

 <link   type="text/css" rel="stylesheet" href="${dojo.base}/dijit/themes/${dojo.theme}/${dojo.theme}.css">
 <!-- link   type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dijit/themes/claro/claro.css" -->
 <link   type="text/css" rel="stylesheet" href="jest.css">
 <script type="text/javascript" language="javascript" djConfig="parseOnLoad: true, isDebug: true"
         src="${dojo.base}/dojo/dojo.xd.js">
 </script>
 <!-- script type="text/javascript" djConfig="parseOnLoad:true;isDebug=true" src="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js"></script -->
 <script type="text/javascript" language="javascript" src="jest.js">
 </script>

 <meta content="REST,OpenJPA,JPA,JEST">
 </head>


 <body class=" ${dojo.theme} ">
 <!-- body class=" claro " -->
 <a name="top"></a>
 <img src="images/jest.jpg" width="63px" height="69px" alt="JEST logo" align="middle">
 <span class="logo">JEST: REST on OpenJPA</span>
 <hr>
 <!-- ==================================================================================== -->
 <!--                     Section for menu based commands.                                 -->
 <!--                                                                                      -->
 <!-- Each menu opens a command window by making a menu section visible                    -->
 <!-- ==================================================================================== -->
 <div id="menu" class="menu">
 <table cellspacing="1em">
  <tr><td><img alt="Home" src="images/home.jpg" width="100" height="100"></td></tr>
  <tr><td style="text-align:center"><a href="javascript:openMenu('home');">Info</a></td></tr>
  <tr><td><img alt="Domain" src="images/domain.jpg" width="100" height="100"></td></tr>
  <tr><td style="text-align:center"><a href="javascript:openMenu('domain');">browse domain</a></td></tr>
  <tr><td><img alt="Find"   src="images/find.jpg" width="100" height="100"></td></tr>
  <tr><td style="text-align:center"><a href="javascript:openMenu('find');">find instances</a></td></tr>
  <tr><td><img alt="Query"  src="images/query2.png" width="100" height="100"></td></tr>
  <tr><td style="text-align:center"><a href="javascript:openMenu('query');">query objects</a></td></tr>
  <tr><td><img alt="View" src="images/properties.jpg"  width="100" height="100"></td></tr>
  <tr><td style="text-align: center"><a href="javascript:openMenu('properties');">view properties</a></td></tr>
  <tr><td><img alt="Deploy" src="images/monitor.jpg" width="100" height="100"></td></tr>
  <tr><td style="text-align:center"><a href="javascript:openMenu('deploy');">deploy</a></td></tr>
 </table>
 </div>

 <!-- ==================================================================================== -->
 <!--                        Section for each command specification                        -->
 <!--                                                                                      -->
 <!-- Contains a set of div sub-sections each for a single command. A command window       -->
 <!-- consists of a brief description of the command and set of input elements where user  -->
 <!-- can enter command qualifiers and arguments.                                          -->
 <!-- The URI for the command is updated as user entry changes. If the user clicks on the  -->
 <!-- URI hyperlink, then a request with the URI is sent to the server.                    -->
 <!-- ==================================================================================== -->
 <!--                   Introduces basic information about JEST                            -->
 <!-- ==================================================================================== -->
 <div id="home" class="highlight" dojoType="dijit.TitlePane"
 title="<a href='http://openjpa.apache.org/jest-usage.html' target='_blank'>JEST</a>
       <b>facilitates RESTful interaction with OpenJPA</b>">


 <UL>
 <LI>Deployed as a HTTP servlet in <b>any</b> web or enterprise application module using
 OpenJPA as its JPA persistence provider.
 </LI>

 <LI>Completely <b>metadata-driven</b> and hence <b>generic</b> as opposed to specific to any
 application domain.
 </LI>

 <LI>Introduces a <b>URI syntax</b>. Interprets the HTTP request as a JPA resource based on
 that syntax. The response is in <tt>XML</tt> or <tt>JSON</tt> format. </LI>

 <LI>Representational state for persistent instances is <b>coherent</b>.
 The response always contains the <em>closure</em> of the persistent instances.
 </LI>

 <LI>Connects to the <b>persistent unit</b> of an application in the same module. Or
     instantiates its own persistence unit.
 </LI>
 </UL>
 </div>

 <!-- ==================================================================================== -->
 <!--        Describes deployment details                                                  -->
 <!-- ==================================================================================== -->
 <div id="deploy" class="highlight" style="display:none;" dojoType="dijit.TitlePane"
 	title='<a href="http://openjpa.apache.org/jest-usage.html" target="_blank">Deploy JEST</a>
 	<b>as a servlet in a web application.</b>'>


 	Following <code>WEB-INF/web.xml</code> descriptor will enable JEST to
 	operate on a persistence unit named <code>${persistence.unit}</code>. Of course, JEST
 	servlet must be in the same module scope of the application that is using using
 	<code>${persistence.unit}</code> as its persistence unit.
 	<br>
 <pre>
 <code class="tag">&lt;servlet&gt;</code>
   <code class="tag">&lt;servlet-name&gt;</code>${servlet.name}<code class="tag">&lt;/servlet-name&gt;</code>
   <code class="tag">&lt;servlet-class&gt;</code><span style="color:blue">org.apache.openjpa.persistence.jest.JESTServlet</span><code class="tag">&lt;/servlet-class&gt;</code>
 	<code class="tag">&lt;init-param&gt;</code>
 	  <code class="tag">&lt;param-name&gt;</code><span style="color:red;">persistence.unit</span><code class="tag">&lt;/param-name&gt;</code>
 	  <code class="tag">&lt;param-value&gt;</code><span style="color:red">${persistence.unit}</span><code class="tag">&lt;/param-value&gt;</code>
 	<code class="tag">&lt;/init-param&gt;</code>
 <code class="tag">&lt;/servlet&gt;</code>
 <code class="tag">&lt;servlet-mapping&gt;</code>
   <code class="tag">&lt;servlet-name&gt;</code>${servlet.name}<code class="tag">&lt;/servlet-name&gt;</code>
   <code class="tag">&lt;url-pattern&gt;</code><span style="color:red">/${servlet.name}/*</span><code class="tag">&lt;/url-pattern&gt;</code>
 <code class="tag">&lt;/servlet-mapping&gt;</code>

 </pre>
 	When an web application module named <code>${webapp.name}</code> containing the above JEST servlet
 	in a servlet container runs on <code>${server.name}</code> at port ${server.port}, then the JEST servlet
 	can be accessed at <br>
 	<code class="url">http://${server.name}:${server.port}/${webapp.name}/${servlet.name}/</code>
 	<br>
 	(<span style="color:red">do not miss the the trailing forward-slash / character</span>)
 	<p>
 </div>

 <!-- ==================================================================================== -->
 <!--        Command window for find                                                       -->
 <!--                                                                                      -->
 <!-- The div element contains a table and some of the table columns hold the input        -->
 <!-- elements. The div, table and input elements are all identified with following        -->
 <!-- naming convention:                                                                   -->
 <!-- the main div section identifier is the moniker of the command itself i.e. 'find'     -->
 <!-- the table identifier is 'find.command'                                               -->
 <!-- the input element identifiers are 'find.{qualifier or argument name}' e.g.           -->
 <!-- 'find.type' or 'find.format'. The qualifier or argument name must be the same as     -->
 <!--  specified in jest.js JavaScript.                                                    -->
 <!--                                                                                      -->
 <!-- The naming convention is crucial because the JavaScript jest.js identifies these     -->
 <!-- elements by this implicit naming conventions.                                        -->
 <!--                                                                                      -->
 <!-- The user entries result in a relative URI displayed in this section itself.          -->
 <!-- The event handlers on the input elements update the URI on change.                   -->
 <!-- The user can click the hyperlink to send the request to the server.                  -->
 <!-- ==================================================================================== -->
 <div id="find"  class="highlight" style="display:none;" dojoType="dijit.TitlePane"
   title='<a href="http://openjpa.apache.org/jest-syntax.html" target="_blank">Find</a>
 	<b>persistent objects by primary identifier.</b>'>

 	<!-- a form for user to fill in the find specifications. Script uses these entries to -->
 	<!-- build up a request URI for JEST server                                           -->
 	<table id="find.command">
 <tr>
   <th width="30%" class="mandatory" title="Name of a persistent entity to find.">Entity Name
     <span class="help">
   	  <img src="images/help.jpg"  width="8px" height="8px" onclick="showHelp('Entity', 'help/entity-name.html');">
     </span>
   </th>
   <th width="30%" class="mandatory" title="Primary Key of the entity.">Identifier</th>
   <th width="30%" title="Fetch Plan(s) to use. Separate each plan with comma.">Fetch Plan
     <span class="help">
       <img src="images/help.jpg"   width="8px" height="8px"
           onclick="showHelp('Fetch Plan', 'help/fetch-plan.html');">
     </span>
   </th>
   <th width="10%" title="Format of the response.">Format
     <span class="help">
       <img src="images/help.jpg"   width="8px" height="8px"
          onclick="showHelp('Response Format', 'help/response-format.html');"></img>
     </span>
   </th>
 </tr>
 	<tr>
 	  <td><input id="find.type"  onblur="javascript:toURI('find');"></td>
 	  <td><input id="find.pk"    onblur="javascript:toURI('find');"></td>
 	  <td><input id="find.plan"  onblur="javascript:toURI('find');" ></td>
 	  <td>
 	    <select id="find.format" onchange="javascript:toURI('find');" >
 	    <option value=""></option>
 	    <option value="xml">XML</option>
 	    <option value="json">JSON</option>
 	    </select>
 	  </td>
 	</tr>
 	</table>
 	<p>
 	<!-- Script will fill in the URI in this element based on user entries from the above -->
 	<!-- The element is made to look like a hyperlink but actually a span to omit the     -->
 	<!-- associated complexity of preventing the browser's default handling of hyperlink  -->
 	<!-- click events.                                                                    -->
 	<b>URI: </b><span id="find.uri" class="url-invalid">filling the form will update
 	this hyperlink.</span>
 	<button id="find.execute" style="display:none;">
 	<img src="images/arrow_right.jpg" width="12px" height="12px"></button>
 </div>

 <!-- ==================================================================================== -->
 <!--                      Command window for Query                                        -->
 <!--                                                                                      -->
 <!-- Similar to window for 'find' command. The added complexity is variable number of     -->
 <!-- query binding parameters that the user may enter for a query.                        -->
 <!-- Each query binding parameter is accepted via two inputs on a dynamically created row -->
 <!-- The dynamic row is identified as 'query.vararg.{n}' and the pair of input elements   -->
 <!-- 'query.vararg.{n}.key' and 'query.vararg.{n}.value' respectively. {n} is a monotonic -->
 <!-- integer. If a dynamically created row is removed by the user, the index {n} does not -->
 <!-- decrement.                                                                           -->
 <!-- ==================================================================================== -->
 <div id="query"  class="highlight" style="display:none;" dojoType="dijit.TitlePane"
 	title='<a href="http://openjpa.apache.org/jest-syntax.html" target="_blank">Query</a>
 	<b>with JPQL or named query and binding parameters.</b>'>

 	<!-- a form for user to fill in the find specifications. Script uses these entries to -->
 	<!-- build up a request URI for JEST server. This form is more complicated than that  -->
 	<!-- of find, because a query can accept variable number of binding parameters        -->
 	<table id="query.command">
 	<tr>
 	  <th width="20%" class="mandatory" title="JPQL query or a named query">Query
 	  <span class="help"><img src="images/help.jpg"   width="8px" height="8px"
 	  onclick="showHelp('Query', 'help/query.html');"></img></span></th>
       <th width="10%"style="display: hidden"></th>
       <th width="10%"style="display: hidden"></th>
       <th width="10%"style="display: hidden"></th>
 	  <th width="5%" title="Is it a named query?">Single</th>
 	  <th width="5%" title="Returns single result?">Named</th>
 	  <th width="30%" title="Fetch Plan(s) to use. Separate each plan with comma.">Fetch Plan
 	  <span class="help"><img src="images/help.jpg"   width="8px" height="8px"
 	  onclick="showHelp('Fetch Plan', 'help/fetch-plan.html');"></img></span></th>
 	  <th width="10%" title="Format of the response.">Format
 	</tr>
 	<tr>
 	  <td colspan="4"><input id="query.q"                         onblur="javascript:toURI('query');"></td>
 	  <td><input id="query.single" type="checkbox" value="true"   onchange="javascript:toURI('query');"></td>
 	  <td><input id="query.named"  type="checkbox" value="true"   onchange="javascript:toURI('query');"></td>
 	  <td><input id="query.plan"                                  onblur="javascript:toURI('query');" ></td>
 	  <td>
 	    <select id="query.format"                                 onchange="javascript:toURI('query');" >
 	    <option value=""></option>
 	    <option value="xml">XML</option>
 	    <option value="json">JSON</option>
 	    </select>
 	  </td>
 	</tr>
 	<tr id="query.vararg.0">
 	  <td>
 	    <button onclick="javascript:addVarArgRow('query.vararg',0,'Bind Query Parameter');">Bind Parameter</button>
 	  </td>
 	</tr>
 	</table>
 	<p>
 	<!-- Script will fill in the URI in this element based on user entries from the above -->
 	<!-- The element is made to look like a hyperlink but actually a span to omit the     -->
 	<!-- associated complexity of preventing the browser's default handling of hyperlink  -->
 	<!-- click events.                                                                    -->
 	<b>URI: </b><span id="query.uri" class="url-invalid">filling the form will update
 	this hyperlink.</span> <button id="query.execute" style="display:none;">
 	<img src="images/arrow_right.jpg" width="12px" height="12px"></button>

 </div>

 <!-- ==================================================================================== -->
 <!--    Command window for browsing persistent domain model                               -->
 <!-- ==================================================================================== -->
 <div id="domain"  class="highlight" style="display:none;" dojoType="dijit.TitlePane"
   title='<a href="http://openjpa.apache.org/jest-syntax.html" target="_blank">Browse</a>
   <b>persistent domain model.</b>'>

 	This command accepts no qualifier or arguments.	 <br>

 	<b>JEST URI: </b><span id="domain.uri" class="url"
 	onclick="javascript:render('domain','canvas', 'domain', 'xml');">domain</span>
 </div>

 <!-- ==================================================================================== -->
 <!--    Command window for viewing configuration of the persistence unit.                 -->
 <!-- ==================================================================================== -->
 <div id="properties"  class="highlight" style="display:none;" dojoType="dijit.TitlePane"
  title='<a href="http://openjpa.apache.org/jest-syntax.html" target="_blank">View</a>
  <b>configuration properties of the persistence unit.</b>'>

 	This command accepts no qualifier or arguments	 <br>

 	<b>URI: </b><span id="properties.uri" class="url"
 	onclick="javascript:render('properties','canvas', 'properties', 'xml');">properties</span>
 </div>

 <!-- ==================================================================================== -->
 <!-- This empty section will be filled in by server response                              -->
 <!-- ==================================================================================== -->
 <div id="canvas" class="canvas">
 </div>


 </body>
 </html>
	<!--
	Licensed to the Apache Software Foundation (ASF) under one
	or more contributor license agreements. See the NOTICE file
	distributed with this work for additional information
	regarding copyright ownership. The ASF licenses this file
	to you under the Apache License, Version 2.0 (the
	"License"); you may not use this file except in compliance
	with the License. You may obtain a copy of the License at

	http://www.apache.org/licenses/LICENSE-2.0

	Unless required by applicable law or agreed to in writing,
	software distributed under the License is distributed on an
	"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
	KIND, either express or implied. See the License for the
	specific language governing permissions and limitations
	under the License.
	-->

	<!--
	The single web page for JEST is a templated HTML. This page consists of three major divisions
	a) a section holds the menu items for available commands
	b) a section for the command window where user enters command specifications
	c) a section displays the server response of the command execution

	This templated file contains replaceable tokens in ${token} form. JEST servlet replaces the tokens with
	actual deployment values on initialization.

	The menu navigation and command window are managed by jest.js script.
	The rendition of server response is managed by dojo script.

	All hyperlinks in this page are relative to the base URI of this page to prevent
	any cross-domain scripting.

	-->
	<html>
	<head>
	<!-- ==================================================================================== -->
	<!-- Base URI is replaced with actual deployment data on initialization -->
	<!-- ==================================================================================== -->
	<base href="${jest.uri}">
	<!-- base href="http://localhost:8080/demo/jest/" -->
	<title>JEST: REST on OpenJPA</title>

	<link type="text/css" rel="stylesheet" href="${dojo.base}/dijit/themes/${dojo.theme}/${dojo.theme}.css">
	<!-- link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dijit/themes/claro/claro.css" -->
	<link type="text/css" rel="stylesheet" href="jest.css">
	<script type="text/javascript" language="javascript" djConfig="parseOnLoad: true, isDebug: true"
	src="${dojo.base}/dojo/dojo.xd.js">
	</script>
	<!-- script type="text/javascript" djConfig="parseOnLoad:true;isDebug=true" src="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js"></script -->
	<script type="text/javascript" language="javascript" src="jest.js">
	</script>

	<meta content="REST,OpenJPA,JPA,JEST">
	</head>


	<body class=" ${dojo.theme} ">
	<!-- body class=" claro " -->
	<a name="top"></a>
	<img src="images/jest.jpg" width="63px" height="69px" alt="JEST logo" align="middle">
	<span class="logo">JEST: REST on OpenJPA</span>
	<hr>
	<!-- ==================================================================================== -->
	<!-- Section for menu based commands. -->
	<!-- -->
	<!-- Each menu opens a command window by making a menu section visible -->
	<!-- ==================================================================================== -->
	<div id="menu" class="menu">
	<table cellspacing="1em">
	<tr><td><img alt="Home" src="images/home.jpg" width="100" height="100"></td></tr>
	<tr><td style="text-align:center"><a href="javascript:openMenu('home');">Info</a></td></tr>
	<tr><td><img alt="Domain" src="images/domain.jpg" width="100" height="100"></td></tr>
	<tr><td style="text-align:center"><a href="javascript:openMenu('domain');">browse domain</a></td></tr>
	<tr><td><img alt="Find" src="images/find.jpg" width="100" height="100"></td></tr>
	<tr><td style="text-align:center"><a href="javascript:openMenu('find');">find instances</a></td></tr>
	<tr><td><img alt="Query" src="images/query2.png" width="100" height="100"></td></tr>
	<tr><td style="text-align:center"><a href="javascript:openMenu('query');">query objects</a></td></tr>
	<tr><td><img alt="View" src="images/properties.jpg" width="100" height="100"></td></tr>
	<tr><td style="text-align: center"><a href="javascript:openMenu('properties');">view properties</a></td></tr>
	<tr><td><img alt="Deploy" src="images/monitor.jpg" width="100" height="100"></td></tr>
	<tr><td style="text-align:center"><a href="javascript:openMenu('deploy');">deploy</a></td></tr>
	</table>
	</div>

	<!-- ==================================================================================== -->
	<!-- Section for each command specification -->
	<!-- -->
	<!-- Contains a set of div sub-sections each for a single command. A command window -->
	<!-- consists of a brief description of the command and set of input elements where user -->
	<!-- can enter command qualifiers and arguments. -->
	<!-- The URI for the command is updated as user entry changes. If the user clicks on the -->
	<!-- URI hyperlink, then a request with the URI is sent to the server. -->
	<!-- ==================================================================================== -->
	<!-- Introduces basic information about JEST -->
	<!-- ==================================================================================== -->
	<div id="home" class="highlight" dojoType="dijit.TitlePane"
	title="<a href='http://openjpa.apache.org/jest-usage.html' target='_blank'>JEST</a>
	<b>facilitates RESTful interaction with OpenJPA</b>">


	<UL>
	<LI>Deployed as a HTTP servlet in <b>any</b> web or enterprise application module using
	OpenJPA as its JPA persistence provider.
	</LI>

	<LI>Completely <b>metadata-driven</b> and hence <b>generic</b> as opposed to specific to any
	application domain.
	</LI>

	<LI>Introduces a <b>URI syntax</b>. Interprets the HTTP request as a JPA resource based on
	that syntax. The response is in <tt>XML</tt> or <tt>JSON</tt> format. </LI>

	<LI>Representational state for persistent instances is <b>coherent</b>.
	The response always contains the <em>closure</em> of the persistent instances.
	</LI>

	<LI>Connects to the <b>persistent unit</b> of an application in the same module. Or
	instantiates its own persistence unit.
	</LI>
	</UL>
	</div>

	<!-- ==================================================================================== -->
	<!-- Describes deployment details -->
	<!-- ==================================================================================== -->
	<div id="deploy" class="highlight" style="display:none;" dojoType="dijit.TitlePane"
	title='<a href="http://openjpa.apache.org/jest-usage.html" target="_blank">Deploy JEST</a>
	<b>as a servlet in a web application.</b>'>


	Following <code>WEB-INF/web.xml</code> descriptor will enable JEST to
	operate on a persistence unit named <code>${persistence.unit}</code>. Of course, JEST
	servlet must be in the same module scope of the application that is using using
	<code>${persistence.unit}</code> as its persistence unit.
	<br>
	<pre>
	<code class="tag"><servlet></code>
	<code class="tag"><servlet-name></code>${servlet.name}<code class="tag"></servlet-name></code>
	<code class="tag"><servlet-class></code><span style="color:blue">org.apache.openjpa.persistence.jest.JESTServlet</span><code class="tag"></servlet-class></code>
	<code class="tag"><init-param></code>
	<code class="tag"><param-name></code><span style="color:red;">persistence.unit</span><code class="tag"></param-name></code>
	<code class="tag"><param-value></code><span style="color:red">${persistence.unit}</span><code class="tag"></param-value></code>
	<code class="tag"></init-param></code>
	<code class="tag"></servlet></code>
	<code class="tag"><servlet-mapping></code>
	<code class="tag"><servlet-name></code>${servlet.name}<code class="tag"></servlet-name></code>
	<code class="tag"><url-pattern></code><span style="color:red">/${servlet.name}/*</span><code class="tag"></url-pattern></code>
	<code class="tag"></servlet-mapping></code>

	</pre>
	When an web application module named <code>${webapp.name}</code> containing the above JEST servlet
	in a servlet container runs on <code>${server.name}</code> at port ${server.port}, then the JEST servlet
	can be accessed at <br>
	<code class="url">http://${server.name}:${server.port}/${webapp.name}/${servlet.name}/</code>
	<br>
	(<span style="color:red">do not miss the the trailing forward-slash / character</span>)
	<p>
	</div>

	<!-- ==================================================================================== -->
	<!-- Command window for find -->
	<!-- -->
	<!-- The div element contains a table and some of the table columns hold the input -->
	<!-- elements. The div, table and input elements are all identified with following -->
	<!-- naming convention: -->
	<!-- the main div section identifier is the moniker of the command itself i.e. 'find' -->
	<!-- the table identifier is 'find.command' -->
	<!-- the input element identifiers are 'find.{qualifier or argument name}' e.g. -->
	<!-- 'find.type' or 'find.format'. The qualifier or argument name must be the same as -->
	<!-- specified in jest.js JavaScript. -->
	<!-- -->
	<!-- The naming convention is crucial because the JavaScript jest.js identifies these -->
	<!-- elements by this implicit naming conventions. -->
	<!-- -->
	<!-- The user entries result in a relative URI displayed in this section itself. -->
	<!-- The event handlers on the input elements update the URI on change. -->
	<!-- The user can click the hyperlink to send the request to the server. -->
	<!-- ==================================================================================== -->
	<div id="find" class="highlight" style="display:none;" dojoType="dijit.TitlePane"
	title='<a href="http://openjpa.apache.org/jest-syntax.html" target="_blank">Find</a>
	<b>persistent objects by primary identifier.</b>'>

	<!-- a form for user to fill in the find specifications. Script uses these entries to -->
	<!-- build up a request URI for JEST server -->
	<table id="find.command">
	<tr>
	<th width="30%" class="mandatory" title="Name of a persistent entity to find.">Entity Name
	<span class="help">
	<img src="images/help.jpg" width="8px" height="8px" onclick="showHelp('Entity', 'help/entity-name.html');">
	</span>
	</th>
	<th width="30%" class="mandatory" title="Primary Key of the entity.">Identifier</th>
	<th width="30%" title="Fetch Plan(s) to use. Separate each plan with comma.">Fetch Plan
	<span class="help">
	<img src="images/help.jpg" width="8px" height="8px"
	onclick="showHelp('Fetch Plan', 'help/fetch-plan.html');">
	</span>
	</th>
	<th width="10%" title="Format of the response.">Format
	<span class="help">
	<img src="images/help.jpg" width="8px" height="8px"
	onclick="showHelp('Response Format', 'help/response-format.html');"></img>
	</span>
	</th>
	</tr>
	<tr>
	<td><input id="find.type" onblur="javascript:toURI('find');"></td>
	<td><input id="find.pk" onblur="javascript:toURI('find');"></td>
	<td><input id="find.plan" onblur="javascript:toURI('find');" ></td>
	<td>
	<select id="find.format" onchange="javascript:toURI('find');" >
	<option value=""></option>
	<option value="xml">XML</option>
	<option value="json">JSON</option>
	</select>
	</td>
	</tr>
	</table>
	<p>
	<!-- Script will fill in the URI in this element based on user entries from the above -->
	<!-- The element is made to look like a hyperlink but actually a span to omit the -->
	<!-- associated complexity of preventing the browser's default handling of hyperlink -->
	<!-- click events. -->
	<b>URI: </b><span id="find.uri" class="url-invalid">filling the form will update
	this hyperlink.</span>
	<button id="find.execute" style="display:none;">
	<img src="images/arrow_right.jpg" width="12px" height="12px"></button>
	</div>

	<!-- ==================================================================================== -->
	<!-- Command window for Query -->
	<!-- -->
	<!-- Similar to window for 'find' command. The added complexity is variable number of -->
	<!-- query binding parameters that the user may enter for a query. -->
	<!-- Each query binding parameter is accepted via two inputs on a dynamically created row -->
	<!-- The dynamic row is identified as 'query.vararg.{n}' and the pair of input elements -->
	<!-- 'query.vararg.{n}.key' and 'query.vararg.{n}.value' respectively. {n} is a monotonic -->
	<!-- integer. If a dynamically created row is removed by the user, the index {n} does not -->
	<!-- decrement. -->
	<!-- ==================================================================================== -->
	<div id="query" class="highlight" style="display:none;" dojoType="dijit.TitlePane"
	title='<a href="http://openjpa.apache.org/jest-syntax.html" target="_blank">Query</a>
	<b>with JPQL or named query and binding parameters.</b>'>

	<!-- a form for user to fill in the find specifications. Script uses these entries to -->
	<!-- build up a request URI for JEST server. This form is more complicated than that -->
	<!-- of find, because a query can accept variable number of binding parameters -->
	<table id="query.command">
	<tr>
	<th width="20%" class="mandatory" title="JPQL query or a named query">Query
	<span class="help"><img src="images/help.jpg" width="8px" height="8px"
	onclick="showHelp('Query', 'help/query.html');"></img></span></th>
	<th width="10%"style="display: hidden"></th>
	<th width="10%"style="display: hidden"></th>
	<th width="10%"style="display: hidden"></th>
	<th width="5%" title="Is it a named query?">Single</th>
	<th width="5%" title="Returns single result?">Named</th>
	<th width="30%" title="Fetch Plan(s) to use. Separate each plan with comma.">Fetch Plan
	<span class="help"><img src="images/help.jpg" width="8px" height="8px"
	onclick="showHelp('Fetch Plan', 'help/fetch-plan.html');"></img></span></th>
	<th width="10%" title="Format of the response.">Format
	</tr>
	<tr>
	<td colspan="4"><input id="query.q" onblur="javascript:toURI('query');"></td>
	<td><input id="query.single" type="checkbox" value="true" onchange="javascript:toURI('query');"></td>
	<td><input id="query.named" type="checkbox" value="true" onchange="javascript:toURI('query');"></td>
	<td><input id="query.plan" onblur="javascript:toURI('query');" ></td>
	<td>
	<select id="query.format" onchange="javascript:toURI('query');" >
	<option value=""></option>
	<option value="xml">XML</option>
	<option value="json">JSON</option>
	</select>
	</td>
	</tr>
	<tr id="query.vararg.0">
	<td>
	<button onclick="javascript:addVarArgRow('query.vararg',0,'Bind Query Parameter');">Bind Parameter</button>
	</td>
	</tr>
	</table>
	<p>
	<!-- Script will fill in the URI in this element based on user entries from the above -->
	<!-- The element is made to look like a hyperlink but actually a span to omit the -->
	<!-- associated complexity of preventing the browser's default handling of hyperlink -->
	<!-- click events. -->
	<b>URI: </b><span id="query.uri" class="url-invalid">filling the form will update
	this hyperlink.</span> <button id="query.execute" style="display:none;">
	<img src="images/arrow_right.jpg" width="12px" height="12px"></button>

	</div>

	<!-- ==================================================================================== -->
	<!-- Command window for browsing persistent domain model -->
	<!-- ==================================================================================== -->
	<div id="domain" class="highlight" style="display:none;" dojoType="dijit.TitlePane"
	title='<a href="http://openjpa.apache.org/jest-syntax.html" target="_blank">Browse</a>
	<b>persistent domain model.</b>'>

	This command accepts no qualifier or arguments. <br>

	<b>JEST URI: </b><span id="domain.uri" class="url"
	onclick="javascript:render('domain','canvas', 'domain', 'xml');">domain</span>
	</div>

	<!-- ==================================================================================== -->
	<!-- Command window for viewing configuration of the persistence unit. -->
	<!-- ==================================================================================== -->
	<div id="properties" class="highlight" style="display:none;" dojoType="dijit.TitlePane"
	title='<a href="http://openjpa.apache.org/jest-syntax.html" target="_blank">View</a>
	<b>configuration properties of the persistence unit.</b>'>

	This command accepts no qualifier or arguments <br>

	<b>URI: </b><span id="properties.uri" class="url"
	onclick="javascript:render('properties','canvas', 'properties', 'xml');">properties</span>
	</div>

	<!-- ==================================================================================== -->
	<!-- This empty section will be filled in by server response -->
	<!-- ==================================================================================== -->
	<div id="canvas" class="canvas">
	</div>


	</body>
	</html>