<!DOCTYPE HTML>
<html lang="en">
  <head>
    <title>RESTful API Documentation</title>
    <meta name="viewport" content="Width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/bootstrap.css" />
    <link rel="stylesheet" href="css/bootstrap-responsive.css" />
    <script src="js/jquery.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script>_csrf=<%=JSON.stringify(_csrf)%>;</script>
    <% if(Hop.enableUnitTests) { %>
    <script src="apitest.js"></script>
    <% } %>
    <script src="<%=Hop.hopjsURL%>"></script>
    <script src="<%=Hop.apiURL%>"></script>
    <% if(Hop.enableUnitTests) { %>
    <script src="<%=Hop.testURL%>"></script>
    <% } %>
  </head>
  <body>
    <div class="navbar navbar-inverse navbar-fixed-top">
      <div class="navbar-inner">
        <a class="brand" href="#">&nbsp;Restful API</a>
        <ul class="nav">
          <li><a href="#introduction">Introduction</a></li>
          <li><a href="#notes">Notes</a></li>
          <li><a href="#api">API</a></li>
        </ul>
      </div>
    </div>
    <div class="container" style="padding-top: 50px;">
      <!-- Introduction --> 
      <div id="introduction" class="row">
        <div class="span9">
          <h2>Introduction</h2>
          <hr>
          <div>
            The API documented below is a RESTful API for use with this website. 
          </div>
          <h4>Calling methodology</h4>
            <p>This API is focused on ease of integration with existing browsers and expects parameters to either be passed
            as regular HTTP query parameters in the case of GET based queries, and form encoding in the case of PUT and POST 
            parameters. Responses to API calls are provided in JSON.</p>
            <p>Each call documented below has some number of required or optional parameters, they are noted as such.</p>
          <h4>Client side JavaScript API</h4>
          There is a generated client-side API for use in the browser available at <a href="<%=Hop.apiURL%>"><%=Hop.apiURL%></a>
          <h4>Authentication</h4>
          Authentication is managed via cookie based sessions upon authentication.
        </div>
      </div>
      <!-- Notes --> 
      <div id="notes" class="row">
        <div class="span9">
          <br><br>
          <h2>Notes</h2>
          <hr>
          <%if(typeof _csrf!="undefined"){%>
            <h2>Cross Site Request Forgery</h2>
              <div>
                This site utilizies CSRF protection and requires a special field called _csrf to be included in
                all POST and PUT queries. This is handled by default in the JavaScript API, but the field still must be defined in client
                side pages that use the JavaScript API.  
            <div>
          <%}%>
        </div>
      </div>
      <!-- API -->
      <div id="api" class="row">
        <%= Hop.renderBeforeTemplates("Doc") %>  
        <div class="span9">
          <br><br>
          <h2>API</h2>
          <hr>
          <% for(var objName in Hop.Objects){ 
              var obj = Hop.Objects[objName];
          %>

            <!-- Object name --> 
            <div class="row">
                <div class="span4">
                  <h3><%=obj.name%></h3>
                  <%=(obj.desc?obj.desc:"")%>
                </div> 
                <%= obj.renderBeforeTemplates("Doc", { object: obj }) %>  
            </div> 
            <!-- Methods -->
            <div class="row">
              <div class="span9">
                <% for(var methodName in obj.methods){ 
                  var method = obj.methods[methodName]; 
                  var params = Object.keys(method.params).map(function(paramName){ return method.params[paramName].demand?paramName+"*":paramName; });
                %>
                  <div class="row">
                    <div class="span9">
                    <h4>
                    <b><%=obj.name%>.<%=method.name%></b>(<%=params.join(", ")%>)<br><br>
                    </h4>
                    </div>
                    <div class="row">
                       <%= method.renderBeforeTemplates("Doc", { method: method}) %> 
                    </div>
                    <div class="offset1 span8" id="<%=obj.name%>.<%=method.name%>.method">
                      <% if(method.desc){ %>
                        <u>Overview</u>
                        <p><%=(method.desc?method.desc:"")%></p>
                      <% } %>
                      <% if(params.length>0){ %>
                      <u>Parameters</u>
                      <table class="table">
                        <%for(var paramName in method.params){
                          var param = method.params[paramName];
                        %>
                          <tr><td><%=paramName%></td><td width="80%"><%=(param.desc?param.desc:"")%></td><td><%if(param.demand){ %><span class="label label-info">Required</span><%}%></td><td><td><tr>
                        <%}%>
                      </table>
                      <%}%>
                    </div>
                    <div class="offset1 span8" id="<%=obj.name%>.<%=method.name%>.usage">
                      <h5>Javascript</h5>
                      <div class="well well-small">
                        <%=obj.name%>.<%=method.name%>(input,onComplete)
                      </div>
                      <h5>HTTP</h5>
                      <div class="well well-small">
                        <span class="label"><%=method.method%></span>&nbsp;<%=method.fullPath%></p>
                      </div>
                      <%if(method.secore){%><span class="label label-important">secure</span><% } %>
                    </div>
                  </div>
                  <div class="row">
                     <%= method.renderAfterTemplates("Doc", { method: method}) %> 
                  </div>
                  <br><br>
                <% } %>
              </div>
            </div>
            <div class="row">  
              <%= obj.renderAfterTemplates("Doc", { object: obj }) %>  
            </div>
          <% } %>  
        </div>
        <%= Hop.renderAfterTemplates("Doc") %>  
      </div>
      <br>
      <br>  
      <br>
      <br>
    </div>
  </body>
</html>
