templates/CRM/Admin/Page/APIExplorer.tpl

   1 {*
   2  +--------------------------------------------------------------------+
   3  | CiviCRM version 4.6                                                |
   4  +--------------------------------------------------------------------+
   5  | Copyright CiviCRM LLC (c) 2004-2015                                |
   6  +--------------------------------------------------------------------+
   7  | This file is a part of CiviCRM.                                    |
   8  |                                                                    |
   9  | CiviCRM is free software; you can copy, modify, and distribute it  |
  10  | under the terms of the GNU Affero General Public License           |
  11  | Version 3, 19 November 2007 and the CiviCRM Licensing Exception.   |
  12  |                                                                    |
  13  | CiviCRM is distributed in the hope that it will be useful, but     |
  14  | WITHOUT ANY WARRANTY; without even the implied warranty of         |
  15  | MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.               |
  16  | See the GNU Affero General Public License for more details.        |
  17  |                                                                    |
  18  | You should have received a copy of the GNU Affero General Public   |
  19  | License and the CiviCRM Licensing Exception along                  |
  20  | with this program; if not, contact CiviCRM LLC                     |
  21  | at info[AT]civicrm[DOT]org. If you have questions about the        |
  22  | GNU Affero General Public License or the licensing of CiviCRM,     |
  23  | see the CiviCRM license FAQ at http://civicrm.org/licensing        |
  24  +--------------------------------------------------------------------+
  25 *}
  26 <style>
  27   {literal}
  28   #mainTabContainer {
  29     background: transparent;
  30     border: 0 none;
  31   }
  32   #mainTabContainer pre {
  33     line-height: 14px;
  34     font-size: 11px;
  35     margin: 0;
  36     border: 0 none;
  37   }
  38   #mainTabContainer ul.ui-tabs-nav {
  39     font-size: 1.1em;
  40     margin-bottom: .6em;
  41   }
  42   pre#api-result {
  43     max-height: 50em;
  44   }
  45   pre#api-result,
  46   div#doc-result,
  47   pre#example-result {
  48     padding:1em;
  49     border: 1px solid lightgrey;
  50     margin-top: 1em;
  51     overflow: auto;
  52   }
  53   #api-params-table th:first-child,
  54   #api-params-table td:first-child {
  55     width: 35%;
  56   }
  57   #api-params-table td:first-child + td,
  58   #api-params-table th:first-child + th,
  59   #api-generated td:first-child {
  60     width: 9em;
  61   }
  62   #api-params {
  63     min-height: 1em;
  64   }
  65   #api-params .red-icon {
  66     margin-top: .5em;
  67   }
  68   #mainTabContainer label {
  69     display: inline;
  70     font-weight: bold;
  71   }
  72   #api-generated-wraper,
  73   #api-result {
  74     overflow: auto;
  75   }
  76   #api-explorer .api-options-row + .api-options-row label {
  77     display: none;
  78   }
  79   .api-options-row td:first-child {
  80     text-align: right;
  81   }
  82   .select2-choice .icon {
  83     margin-top: .2em;
  84     background-image: url("{/literal}{$config->resourceBase}{literal}/i/icons/jquery-ui-2786C2.png");
  85   }
  86   .select2-default .icon {
  87     background-image: url("{/literal}{$config->resourceBase}{literal}/i/icons/jquery-ui-52534D.png");
  88     opacity: .8;
  89   }
  90   .api-field-desc {
  91     font-size: .8em;
  92     color: #828282;
  93     line-height: 1.3em;
  94   }
  95   .select2-highlighted .api-field-desc,
  96   .select2-highlighted .crm-marker {
  97     color: #fcfcfc;
  98   }
  99   .api-param-op[readonly] {
 100     width: 4em;
 101   }
 102   pre ol.linenums li {
 103     list-style-type: decimal;
 104     color: #CFCFCF;
 105   }
 106   pre ol.linenums li:hover {
 107     color: #828282;
 108     background-color: #f2f2f2;
 109   }
 110   pre li.L1, pre li.L3, pre li.L5, pre li.L7, pre li.L9,
 111   #api-generated td + td,
 112   #mainTabContainer pre {
 113     background-color: #f9f9f9;
 114   }
 115   .api-doc-code {
 116     margin-top: 1em;
 117     border-top: 1px solid #d3d3d3;
 118   }
 119   .api-doc-code .collapsible-title {
 120     font-weight: bold;
 121     margin-top: .5em;
 122   }
 123   .doc-filename {
 124     text-align: right;
 125     font-style: italic;
 126   }
 127   {/literal}
 128 </style>
 129
 130 <div id="mainTabContainer">
 131   <ul>
 132     <li class="ui-corner-all" title="GUI to build and execute API calls">
 133       <a href="#explorer-tab">{ts}Explorer{/ts}</a>
 134     </li>
 135     <li class="ui-corner-all" title="Auto-generated examples from the test suite">
 136       <a href="#examples-tab">{ts}Examples{/ts}</a>
 137     </li>
 138     <li class="ui-corner-all" title="API source-code and code-level documentation">
 139       <a href="#docs-tab">{ts}Code Docs{/ts}</a>
 140     </li>
 141   </ul>
 142
 143   <div id="explorer-tab">
 144
 145     <form id="api-explorer">
 146       <label for="api-entity">{ts}Entity{/ts}:</label>
 147       <select class="crm-form-select big required" id="api-entity" name="entity">
 148         <option value="" selected="selected">{ts}Choose{/ts}...</option>
 149         {crmAPI entity="Entity" action="get" var="entities" version=3}
 150         {foreach from=$entities.values item=entity}
 151           <option value="{$entity}" {if !empty($entities.deprecated) && in_array($entity, $entities.deprecated)}class="strikethrough"{/if}>
 152             {$entity}
 153           </option>
 154         {/foreach}
 155       </select>
 156       &nbsp;&nbsp;
 157       <label for="api-action">{ts}Action{/ts}:</label>
 158       <input class="crm-form-text" id="api-action" name="action" value="get">
 159       &nbsp;&nbsp;
 160
 161       <label for="debug-checkbox" title="{ts}Display debug output with results.{/ts}">
 162         <input type="checkbox" class="crm-form-checkbox api-param-checkbox api-input" id="debug-checkbox" name="debug" value="1" >debug
 163       </label>
 164       &nbsp;|&nbsp;
 165
 166       <label for="sequential-checkbox" title="{ts}Sequential is more compact format, well-suited for json and smarty.{/ts}">
 167         <input type="checkbox" class="crm-form-checkbox api-param-checkbox api-input" id="sequential-checkbox" name="sequential" checked="checked" value="1">sequential
 168       </label>
 169
 170       <table id="api-params-table">
 171         <thead style="display: none;">
 172           <tr>
 173             <th>{ts}Name{/ts} {help id='param-name'}</th>
 174             <th>{ts}Operator{/ts} {help id='param-op'}</th>
 175             <th>{ts}Value{/ts} {help id='param-value'}</th>
 176           </tr>
 177         </thead>
 178         <tbody id="api-params"></tbody>
 179       </table>
 180       <div id="api-param-buttons" style="display: none;">
 181         <a href="#" class="crm-hover-button" id="api-params-add"><span class="icon ui-icon-plus"></span>{ts}Add Parameter{/ts}</a>
 182         <a href="#" class="crm-hover-button" id="api-option-add"><span class="icon ui-icon-gear"></span>{ts}Add Option{/ts}</a>
 183         <a href="#" class="crm-hover-button" id="api-chain-add"><span class="icon ui-icon-link"></span>{ts}Chain API Call{/ts}</a>
 184       </div>
 185       <div id="api-generated-wraper">
 186         <table id="api-generated" border=1>
 187           <caption>{ts}Code{/ts}</caption>
 188           <tr><td>Rest</td><td><pre id="api-rest"></pre></td></tr>
 189           <tr><td>Smarty</td><td><pre class="linenums" id="api-smarty" title='smarty syntax (for get actions)'></pre></td></tr>
 190           <tr><td>Php</td><td><pre class="linenums" id="api-php" title='php syntax'></pre></td></tr>
 191           <tr><td>Javascript</td><td><pre class="linenums" id="api-json" title='javascript syntax'></pre></td></tr>
 192           {if $config->userSystem->is_drupal}
 193             <tr><td>Drush</td><td><pre id="api-drush" title='drush syntax'></pre></td></tr>
 194           {/if}
 195           {if $config->userSystem->is_wordpress}
 196             <tr><td>WP-CLI</td><td><pre id="api-wpcli" title='wp-cli syntax'></pre></td></tr>
 197           {/if}
 198         </table>
 199       </div>
 200       <div class="crm-submit-buttons">
 201         <span class="crm-button crm-icon-button">
 202           <span class="crm-button-icon ui-icon-check"> </span> <input type="submit" value="{ts}Execute{/ts}" class="crm-form-submit" accesskey="S" title="{ts}Execute API call and display results{/ts}"/>
 203         </span>
 204       </div>
 205 <pre id="api-result" class="linenums">
 206 {ts}Results are displayed here.{/ts}
 207 </pre>
 208     </form>
 209   </div>
 210
 211   <div id="examples-tab">
 212     <form id="api-examples">
 213       <label for="example-entity">{ts}Entity{/ts}:</label>
 214       <select class="crm-form-select big required" id="example-entity" name="entity">
 215         <option value="" selected="selected">{ts}Choose{/ts}...</option>
 216         {foreach from=$examples item=entity}
 217           <option value="{$entity}" {if !empty($entities.deprecated) && in_array($entity, $entities.deprecated)}class="strikethrough"{/if}>
 218             {$entity}
 219           </option>
 220         {/foreach}
 221       </select>
 222       &nbsp;&nbsp;
 223       <label for="example-action">{ts}Example{/ts}:</label>
 224       <select class="crm-form-select big crm-select2" id="example-action" name="action">
 225         <option value="" selected="selected">{ts}Choose{/ts}...</option>
 226       </select>
 227 <pre id="example-result" class="linenums lang-php" placeholder="{ts escape='html'}Results are displayed here.{/ts}">
 228 {ts}Results are displayed here.{/ts}
 229 </pre>
 230     </form>
 231   </div>
 232
 233   <div id="docs-tab">
 234     <form id="api-docs">
 235       <label for="doc-entity">{ts}Entity{/ts}:</label>
 236       <select class="crm-form-select big required" id="doc-entity" name="entity">
 237         <option value="" selected="selected">{ts}Choose{/ts}...</option>
 238         {foreach from=$entities.values item=entity}
 239           <option value="{$entity}" {if !empty($entities.deprecated) && in_array($entity, $entities.deprecated)}class="strikethrough"{/if}>
 240             {$entity}
 241           </option>
 242         {/foreach}
 243       </select>
 244       &nbsp;&nbsp;
 245       <label for="doc-action">{ts}Action{/ts}:</label>
 246       <select class="crm-form-select big crm-select2" id="doc-action" name="action">
 247         <option value="" selected="selected">{ts}Choose{/ts}...</option>
 248       </select>
 249       <div id="doc-result">
 250         {ts}Results are displayed here.{/ts}
 251       </div>
 252     </form>
 253   </div>
 254 </div>
 255
 256 {strip}
 257 <script type="text/template" id="api-param-tpl">
 258   <tr class="api-param-row">
 259     <td><input style="width: 100%;" class="crm-form-text api-param-name api-input" value="<%= name %>" placeholder="{ts}Parameter{/ts}" /></td>
 260     <td>
 261       {literal}
 262       <% if (noOps) { %>
 263         <input class="crm-form-text api-param-op" value="=" readonly="true" title="{/literal}{ts}Other operators not available for this action.{/ts}{literal}" />
 264       <% } else { %>
 265       {/literal}
 266         <select class="crm-form-select api-param-op">
 267           {foreach from=$operators item='op'}
 268             <option value="{$op|htmlspecialchars}">{$op|htmlspecialchars}</option>
 269           {/foreach}
 270         </select>
 271       {literal}
 272       <% } %>
 273       {/literal}
 274     </td>
 275     <td>
 276       <input style="width: 85%;" class="crm-form-text api-param-value api-input" placeholder="{ts}Value{/ts}"/>
 277       <a class="crm-hover-button api-param-remove" href="#"><span class="icon ui-icon-close"></span></a>
 278     </td>
 279   </tr>
 280 </script>
 281
 282 <script type="text/template" id="api-return-tpl">
 283   <tr class="api-return-row">
 284     <td colspan="3">
 285       <label for="api-return-value">
 286         <%- title %>:
 287         <% if(required) {ldelim} %> <span class="crm-marker">*</span> <% {rdelim} %>
 288       </label> &nbsp;
 289       <input type="hidden" class="api-param-name" value="return" />
 290       <input style="width: 50%;" id="api-return-value" class="crm-form-text api-param-value api-input"/>
 291     </td>
 292   </tr>
 293 </script>
 294
 295 <script type="text/template" id="api-options-tpl">
 296   <tr class="api-options-row">
 297     <td>
 298       <label>{ts}Options{/ts}: &nbsp;</label>
 299     </td>
 300     <td>
 301       <input class="crm-form-text api-option-name api-input" style="width: 12em;" placeholder="{ts}Option{/ts}"/>
 302     </td>
 303     <td>
 304       <input style="width: 85%;" class="crm-form-text api-option-value api-input" placeholder="{ts}Value{/ts}"/>
 305       <a class="crm-hover-button api-param-remove" href="#"><span class="icon ui-icon-close"></span></a>
 306     </td>
 307   </tr>
 308 </script>
 309
 310 <script type="text/template" id="api-chain-tpl">
 311   <tr class="api-chain-row">
 312     <td>
 313       <select style="width: 100%;" class="crm-form-select api-chain-entity">
 314         <option value=""></option>
 315         {foreach from=$entities.values item=entity}
 316           <option value="{$entity}" {if !empty($entities.deprecated) && in_array($entity, $entities.deprecated)}class="strikethrough"{/if}>
 317             {$entity}
 318           </option>
 319         {/foreach}
 320       </select>
 321     </td>
 322     <td>
 323       <select class="crm-form-select api-chain-action">
 324         <option value="get">get</option>
 325       </select>
 326     </td>
 327     <td>
 328       <input style="width: 85%;" class="crm-form-text api-param-value api-input" value="{ldelim}{rdelim}" placeholder="{ts}API Params{/ts}"/>
 329       <a class="crm-hover-button api-param-remove" href="#"><span class="icon ui-icon-close"></span></a>
 330     </td>
 331   </tr>
 332 </script>
 333
 334 <script type="text/template" id="doc-code-tpl">
 335   <div class="crm-collapsible collapsed api-doc-code">
 336     <div class="collapsible-title">{ts}Source Code{/ts}</div>
 337     <div>
 338       <div class="doc-filename"><%- file %></div>
 339       <pre class="lang-php linenums"><%- code %></pre>
 340     </div>
 341   </div>
 342 </script>
 343 {/strip}