Open-ILS/src/extras/opensearchportal.html

   1 <html>
   2         <head>
   3                 <title>mikers experimental opensearch portal</title>
   4                 <style>
   5
   6 * {
   7         font-family: verdana,arial,helvetica,sans-serif;
   8 }
   9
  10 #result_sources a {
  11         font-size: 8px;
  12         color: grey;
  13         text-decoration: none;
  14 }
  15
  16 .data_table {
  17         max-width: 200px;
  18 }
  19
  20 caption {
  21         border: solid lightblue 1px;
  22 }
  23
  24 a {
  25         color: blue;
  26         text-decoration: none;
  27 }
  28
  29 a:hover {
  30         color: blue;
  31         text-decoration: underline;
  32 }
  33
  34 a:active {
  35         color: red;
  36         text-decoration: underline;
  37 }
  38
  39 a:visited {
  40         color: blue;
  41         text-decoration: none;
  42 }
  43
  44 .title_link {
  45         font-size: medium;
  46         font-weight: bold;
  47 }
  48
  49 .desc_text {
  50         font-size: small;
  51 }
  52
  53 .hide {
  54         color: lightgray;
  55 }
  56
  57 .col_tab {
  58         border-collapse: collapse;
  59         border: solid gray 1px;
  60 }
  61
  62 .res_table {
  63         border-collapse: collapse;
  64         width: 100%;
  65 }
  66
  67 .res_tr {
  68         border-bottom: 1px dashed darkgrey;
  69 }
  70
  71                 </style>
  72                 <script>
  73
  74 var isIE = false;
  75
  76 function create_requestor () {
  77         var req;
  78         try {
  79                 req = new ActiveXObject("Msxml2.XMLHTTP");
  80                 isIE = true;
  81         } catch (e) {
  82                 try {
  83                         req = new ActiveXObject("Microsoft.XMLHTTP");
  84                         isIE = true;
  85                 } catch (E) {
  86                         req = false;
  87                 }
  88         }
  89
  90         if (!req && typeof XMLHttpRequest!='undefined') {
  91                 req = new XMLHttpRequest();
  92         }
  93
  94         if(!req) {
  95                 alert("NEEDS NEWER JAVASCRIPT for XMLHTTPRequest()");
  96                 return null;
  97         }
  98
  99         return req;
 100 }
 101
 102 var proxy = 'http://gapines.org/opensearch/?fetch=';
 103
 104 var images = [];
 105 var search_templates = [];
 106 var search_urls = {};
 107 var rel_scales = {};
 108
 109 var display_mode = 'col';
 110 var current_startPage = 1;
 111 var current_startIndex = 1;
 112 var current_count = 5;
 113
 114 function opensearch ( term, reset ) {
 115
 116         if (reset) {
 117                 current_startPage = 1;
 118                 rel_scales = {};
 119         }
 120
 121         document.getElementById('next_button').className = 'hide';
 122
 123         if (current_startPage == 1)
 124                 document.getElementById('prev_button').className = 'hide';
 125         else
 126                 document.getElementById('prev_button').className = '';
 127
 128         var tot = document.getElementById('total');
 129         while (tot.lastChild)
 130                         tot.removeChild(tot.lastChild);
 131
 132         var src = document.getElementById('result_sources');
 133         while (src.lastChild)
 134                         src.removeChild(src.lastChild);
 135
 136         var tab = document.getElementById('results');
 137         while (tab.lastChild)
 138                         tab.removeChild(tab.lastChild);
 139
 140         search_count = 0;
 141
 142         var sources = new Array();
 143         var selector = document.getElementById('sources');
 144         for (var i = 0; i < selector.options.length; i++) {
 145                 if (selector.options[i].selected) {
 146                         sources.push(selector.options[i].value);
 147                 }
 148         }
 149
 150         search_templates = [];
 151         for (var i in sources) {
 152                 create_search( sources[i] );
 153         }
 154
 155         current_startIndex = (current_count * (current_startPage - 1)) + 1;
 156
 157         search_urls = [];
 158         for (var i in search_templates) {
 159                 if (!search_templates[i])
 160                         continue;
 161
 162                 if (!rel_scales[i])
 163                         rel_scales[i] = 0;
 164
 165                 var url = search_templates[i].replace(/\{searchTerms\}/,encodeURIComponent(term));
 166                 url = url.replace(/\{startPage\}/,current_startPage);
 167                 url = url.replace(/\{startIndex\}/,current_startIndex);
 168                 url = url.replace(/\{count\}/,current_count);
 169                 url = url.replace(/\{relevanceScale}/,rel_scales[i]);
 170                 search_urls[i] = proxy + encodeURIComponent(url);
 171
 172                 src.innerHTML += '<a href="' + url + '">' + url + '</a><br>';
 173         }
 174
 175         for (var i in search_urls) {
 176                 if (!search_templates[i])
 177                         continue;
 178
 179                 perform_search(i);
 180         }
 181
 182         document.getElementById('page_label').innerHTML = current_startPage;
 183 }
 184
 185 function perform_search ( source ) {
 186         var req = create_requestor();
 187
 188         req.onreadystatechange = function () {
 189                 if (req.readyState != 4)
 190                         return;
 191
 192                 var xml = req.responseXML;
 193
 194                 var desc  = getElementTextNS('','description',xml,0);
 195                 var xml_link  = getElementTextNS('','link',xml,0);
 196
 197                 var total  = getElementFloatNS('openSearch','totalResults',xml,0);
 198                 var scale = getElementFloatNS('openIll','relevanceScale',xml,0);
 199
 200                 rel_scales[source]  = scale
 201
 202                 var current_tot = getElementFloatNS('','span',document.getElementById('total').parentNode,0);
 203                 var tot = document.getElementById('total');
 204
 205                 if (!current_tot)
 206                         current_tot = 0;
 207
 208                 if (total > (current_startPage * current_count))
 209                         document.getElementById('next_button').className = '';
 210
 211                 current_tot += total
 212                 tot.innerHTML = current_tot;
 213
 214                 var list = xml.getElementsByTagName('item');
 215                 for (var i = 0; i < list.length; i++) {
 216
 217                         if ( typeof list[i] != 'object')
 218                                         continue;
 219
 220                         var tab = document.getElementById('results');
 221                         if (display_mode == 'col') {
 222                                 var col = document.getElementById(source);
 223                                 if (!col) {
 224                                         var row = tab.rows[0];
 225                                         if (!row)
 226                                                 row = tab.insertRow(0);
 227
 228                                         col = document.createElement('td');
 229                                         col.setAttribute('id',source);
 230                                         row.appendChild(col);
 231
 232                                         tab = document.createElement('table');
 233                                         tab.setAttribute('valign','top');
 234                                         tab.setAttribute('class','col_tab');
 235
 236                                         var cap = document.createElement('caption');
 237                                         tab.appendChild(cap);
 238                                         cap.innerHTML = desc + ' -- <a href="' + xml_link + '">XML</a>';
 239
 240                                         col.appendChild(tab);
 241
 242                                         var per = parseInt(100 / search_urls.length);
 243                                         col.setAttribute('valign','top');
 244                                         col.setAttribute('width', + per + '%');
 245
 246                                 } else {
 247                                         tab = col.firstChild;
 248                                 }
 249                         }
 250
 251                         if (!tab.rows.length) {
 252                                 add_result_row(tab, 0, list[i], source);
 253                         } else {
 254                                 for (var j = 0; j < tab.rows.length; j++) {
 255                                         if ( typeof tab.rows[j] != 'object')
 256                                                 continue;
 257
 258                                         var rank;
 259                                         try {
 260                                                 rank = getElementFloatNS('openIll','relevance',list[i],0);
 261                                         } catch (e) {
 262                                                 alert("error getting float relevance: " + e);
 263                                                 rank = 0;
 264                                         }
 265
 266                                         if ( rank < parseFloat(tab.rows[j].firstChild.firstChild.textContent) ) {
 267                                                 if ( (j + 1) == tab.rows.length) {
 268                                                         add_result_row(tab, tab.rows.length, list[i], source);
 269                                                         break
 270                                                 }
 271                                                 continue;
 272                                         }
 273                                         add_result_row(tab, j, list[i], source);
 274                                         break;
 275                                 }
 276                         }
 277                 }
 278         };
 279
 280         req.open('GET', proxy + encodeURIComponent(search_urls[source]), true);
 281         req.send(null);
 282 }
 283
 284
 285 // retrieve float of an XML document element, including
 286 // elements using namespaces
 287 function getElementFloatNS(prefix, local, parentElem, index) {
 288     var result = "";
 289     if (prefix && isIE) {
 290         // IE/Windows way of handling namespaces
 291         result = parentElem.getElementsByTagName(prefix + ":" + local)[index];
 292     } else {
 293         // the namespace versions of this method
 294         // (getElementsByTagNameNS()) operate
 295         // differently in Safari and Mozilla, but both
 296         // return value with just local name, provided
 297         // there aren't conflicts with non-namespace element
 298         // names
 299         result = parentElem.getElementsByTagName(local)[index];
 300     }
 301     if (result) {
 302         // get text, accounting for possible
 303         // whitespace (carriage return) text nodes
 304         if (result.childNodes.length > 1) {
 305             return parseFloat(result.childNodes[1].nodeValue);
 306         } else {
 307             return parseFloat(result.textContent);
 308         }
 309     } else {
 310         return 0;
 311     }
 312 }
 313
 314 // retrieve text of an XML document element, including
 315 // elements using namespaces
 316 function getElementTextNS(prefix, local, parentElem, index) {
 317     var result = "";
 318     if (prefix && isIE) {
 319         // IE/Windows way of handling namespaces
 320         result = parentElem.getElementsByTagName(prefix + ":" + local)[index];
 321     } else {
 322         // the namespace versions of this method
 323         // (getElementsByTagNameNS()) operate
 324         // differently in Safari and Mozilla, but both
 325         // return value with just local name, provided
 326         // there aren't conflicts with non-namespace element
 327         // names
 328         result = parentElem.getElementsByTagName(local)[index];
 329     }
 330     if (result) {
 331         // get text, accounting for possible
 332         // whitespace (carriage return) text nodes
 333         if (result.childNodes.length > 1) {
 334             return result.childNodes[1].nodeValue;
 335         } else {
 336             return result.textContent;
 337         }
 338     } else {
 339         return '';
 340     }
 341 }
 342
 343 function add_result_row (tab, index, xml, source) {
 344         var img = images[source];
 345         var rank,title,tlink,desc;
 346
 347         try {
 348                 rank = getElementFloatNS('openIll','relevance',xml,0);
 349         } catch (e) {
 350                 alert("error getting relevance: " + e);
 351                 rank = '0';
 352         }
 353
 354         try {
 355                 title = xml.getElementsByTagName('title')[0].textContent;
 356         } catch (e) {
 357                 title = '';
 358         }
 359
 360         try {
 361                 tlink = xml.getElementsByTagName('link')[0].textContent;
 362         } catch (e) {
 363                 tlink = '';
 364         }
 365
 366         try {
 367                 description = xml.getElementsByTagName('description')[0].textContent;
 368         } catch (e) {
 369                 description = '';
 370         }
 371
 372         var row = tab.insertRow(index);
 373         row.className = 'res_tr';
 374         row.innerHTML = '<td style="padding: 4px"><div style="display: none; visibility: hidden;">' + rank +
 375                                                  '</div><span class="title_link"><a href="' + tlink + '">' + title +
 376                                                  '</a></span><br/><span class="desc_text">' + description + '</span></td>' +
 377                                                  '<td><img title="' + parseInt(rank) + '% Relevant" width="32" height="32" src="' + img + '"></td>';
 378 }
 379
 380 function create_search ( s ) {
 381         var req = create_requestor();
 382
 383         req.open('GET',proxy +  encodeURIComponent(s),false);
 384         req.send(null);
 385
 386         try {
 387                 var xml = req.responseXML;
 388                 search_templates[s] = xml.getElementsByTagName('Url')[0].textContent;
 389                 var i =  xml.getElementsByTagName('Image');
 390                 if (i.length)
 391                         images[s] = i[0].textContent;
 392         } catch (e) {
 393                 alert('BAD XML!\n\n' + e + '\n\n' + req.responseText);
 394                 search_templates[s] = null;
 395                 images[s] = null;
 396         }
 397
 398 }
 399
 400                 </script>
 401         </head>
 402         <body>
 403                 <br/>
 404                 <form onsubmit="opensearch(document.getElementById('term').value, true); return false;">
 405                 <table>
 406                         <tr valign="top">
 407                                 <td>Keyword Search: </td>
 408                                 <td><input type="text" id="term" value="javascript"/></td>
 409                         </tr>
 410                         <tr valign="top">
 411                                 <td>Sources: </td>
 412                                 <td>
 413                                         <select id="sources" multiple="multiple" size=5>
 414                                                 <option value="http://gapines.org/opensearch.xml" selected>GPLS Pines</option>
 415                                                 <option value="http://rsinger.library.gatech.edu/opensearch/osdd-gil.xml" selected>GIL Universal Catalog</option>
 416                                                 <option value="http://search.athenscounty.lib.oh.us/cgi-bin/koha/opensearchdescription">NPL/Koha</option>
 417                                                 <option value="http://www.webdevref.com/blog/opensearchdescription.xml">WebDefRef</option>
 418                                         </select>
 419                         </tr>
 420                         <tr valign="top">
 421                                 <td>Hits per Source: </td>
 422                                 <td>
 423                                         <select onchange="current_count=this.options[this.selectedIndex].value;">
 424                                                 <option value="5" selected>5</option>
 425                                                 <option value="10">10</option>
 426                                                 <option value="25">25</option>
 427                                         </select>
 428                         </tr>
 429                         <tr valign="top">
 430                                 <td>Display mode: </td>
 431                                 <td>
 432                                         <select onchange="display_mode=this.options[this.selectedIndex].value;">
 433                                                 <option value="int">Integrated</option>
 434                                                 <option value="col" selected>Columns</option>
 435                                         </select> (Use "Columns" when searching unranked sources)
 436                         </tr>
 437                         <tr valign="top">
 438                                 <td colspan="2"><input type="submit" value="Go!"/></td>
 439                         </tr>
 440                 </table>
 441                 </form>
 442
 443                 <div id="result_sources"></div>
 444                 <br/>
 445                 <div>Current page: <span id="page_label"></span> --
 446                         <button class='hide' id='prev_button' onclick="if (this.className != 'hide') {current_startPage -= 1; opensearch(document.getElementById('term').value);}">Previous Page</button>
 447                         ...
 448                         <button class='hide' id='next_button' onclick="if (this.className != 'hide') {current_startPage += 1; opensearch(document.getElementById('term').value);}">Next Page</button>
 449                 </div>
 450                 <div>Total results: <span id="total"/></div>
 451                 <h1>Search Results</h1>
 452                 <hr/>
 453                 <br/>
 454                 <br/>
 455                 <table class="res_table" id="results"></table>
 456         </body>
 457 </html>