www/jsdemo/index.html

   1 <!-- $Id: index.html,v 1.1 2007-06-21 09:44:17 adam Exp $ -->
   2
   3 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   4 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   5
   6 <html>
   7
   8  <head>
   9   <title>Exemplary pazpar2 client [using pz2.js]</title>
  10   <style type="text/css">
  11
  12     html {
  13         overflow-y: scroll;
  14     }
  15
  16     body {
  17         font-family: tahoma, arial, sans-serif;
  18         font-size: small;
  19     }
  20
  21     hr {
  22         border: 0;
  23         color: gray;
  24         background-color: gray;
  25         height: 1px;
  26     }
  27
  28     thead {
  29         font-weight: bold;
  30     }
  31
  32     .jslink {
  33         cursor: pointer;
  34     }
  35
  36     .jslink:hover {
  37         text-decoration: underline;
  38     }
  39
  40     #heading {
  41         background-color: #ff8c71;
  42         border-color: #ff8c71;
  43         color: #ffffff;
  44         font-size: large;
  45     }
  46
  47     input#button {
  48         border: 3px groove #3171f2;
  49         background-color: #6b9bfd;
  50         padding: 1px;
  51         width: 5em;
  52         color: #FFFFFF;
  53         font-weight: bold;
  54         font-size: 12px;
  55         margin-left: 8px;
  56         cursor: pointer;
  57     }
  58
  59     input#query {
  60         border: 2px inset #ff613c;
  61         padding: 3px;
  62         font-size: 12px;
  63     }
  64
  65     div.termtitle {
  66         margin: 4px;
  67         font-weight: bold;
  68     }
  69
  70     div.record {
  71         padding: 5px;
  72     }
  73
  74     div.details {
  75         border: 3px dashed gray;
  76         padding: 5px;
  77         margin: 4px;
  78     }
  79
  80     #targetview {
  81         padding: 6px;
  82     }
  83
  84   </style>
  85   <script type="text/javascript" src="/pazpar2/js/pz2.js"></script>
  86   <script type="text/javascript" src="example_client.js"></script>
  87  </head>
  88
  89  <body onload="domReady();">
  90
  91   <span class="jslink" onclick="switchView('recordview')">Records Browser</span>
  92   <span> | </span>
  93   <span class="jslink" onclick="switchView('targetview')">Targets Information</span>
  94
  95   <br/><br/>
  96
  97   <table id="heading" width="100%" border="0" cellpadding="6" cellspacing="0">
  98    <tr>
  99     <td width="250" height="100" align="center"><b>PazPar2</b></td>
 100     <td>
 101      <form id="searchForm" name="search">
 102       <input id="query" type="text" size="50"/>
 103       <input id="button" type="submit" value="Search"/>
 104      </form>
 105     </td>
 106    </tr>
 107   </table>
 108
 109   <div id="recordview">
 110
 111    <table width="100%" border="0" cellpadding="6" cellspacing="0">
 112     <tr>
 113      <td width="250" valign="top">
 114       <div id="termlist"></div>
 115      </td>
 116      <td valign="top">
 117       <div id="body"></div>
 118      </td>
 119     </tr>
 120    </table>
 121
 122    <br/>
 123    <hr/>
 124    <b>STATUS INFO:</b>
 125    <br/>
 126    <br/>
 127    <div id="stat"></div>
 128
 129   </div>
 130
 131   <div id="targetview" style="display: none">
 132
 133     <hr/>
 134     <b>TARGET INFO:</b>
 135     <hr/>
 136     <table id="bytarget"></table>
 137
 138   </div>
 139
 140  </body>
 141 </html>