]> git.evergreen-ils.org Git - working/Evergreen.git/blob - Open-ILS/src/extras/opensearchportal.html
UI fixes
[working/Evergreen.git] / 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         font-size: small;
9 }
10
11 #result_sources a {
12         font-size: 8px;
13         color: grey;
14         text-decoration: none;
15 }
16
17 td {
18         vertical-align: top;
19 }
20
21 caption {
22         border: solid black 1px;
23 }
24
25 .header {
26         border: solid lightblue 1px;
27         background-color: lightblue;
28 }
29
30 a {
31         color: blue;
32         text-decoration: none;
33 }
34
35 a:hover {
36         color: blue;
37         text-decoration: underline;
38 }
39
40 a:active {
41         color: red;
42         text-decoration: underline;
43 }
44
45 a:visited {
46         color: blue;
47         text-decoration: none;
48 }
49
50 .title_link {
51         font-size: medium;
52         font-weight: bold;
53 }
54
55 .desc_text {
56         font-size: small;
57 }
58
59 .hide {
60         color: lightgray;
61 }
62
63 .col_tab {
64         border-collapse: collapse;
65         border: solid gray 1px;
66 }
67
68 .res_table {
69         border-collapse: collapse;
70 }
71
72 #col_res {
73         max-width: 300px !important;
74         min-width: 200px !important;
75 }
76
77 #int_res {
78         max-width: 100% !important;
79 }
80
81 #int_res_hide {
82         max-width: 100% !important;
83         min-width: 400px !important;
84 }
85
86 .res_tr {
87         border-bottom: 1px dashed darkgrey;
88 }
89
90 .noshow {
91         display: none;
92         visibility: hidden;
93 }
94
95                 </style>
96                 <script>
97
98 var isIE = false;
99
100 function create_requestor () {
101         var req;
102         try { 
103                 req = new ActiveXObject("Msxml2.XMLHTTP");
104                 isIE = true;
105         } catch (e) {
106                 try { 
107                         req = new ActiveXObject("Microsoft.XMLHTTP");
108                         isIE = true;
109                 } catch (E) {
110                         req = false;
111                 }
112         }
113
114         if (!req && typeof XMLHttpRequest!='undefined') {
115                 req = new XMLHttpRequest();
116         }
117         
118         if(!req) {
119                 alert("NEEDS NEWER JAVASCRIPT for XMLHTTPRequest()");
120                 return null;
121         }
122
123         return req;
124 }
125
126 var proxy = 'http://gapines.org/opensearch/?fetch=';
127
128 var images = [];
129 var search_templates = [];
130 var search_urls = {};
131 var rel_scales = {};
132
133 var current_startPage = 1;
134 var current_startIndex = 1;
135 var current_count = 5;
136
137 function opensearch ( term, reset ) {
138
139         if (reset) {
140                 current_startPage = 1;
141                 rel_scales = {};
142         }
143
144         document.getElementById('next_button').className = 'hide';
145
146         if (current_startPage == 1)
147                 document.getElementById('prev_button').className = 'hide';
148         else 
149                 document.getElementById('prev_button').className = '';
150
151         var tot = document.getElementById('total');
152         while (tot.lastChild)
153                         tot.removeChild(tot.lastChild);
154
155         var src = document.getElementById('result_sources');
156         while (src.lastChild)
157                         src.removeChild(src.lastChild);
158
159         document.getElementById('int_res_hide').className = 'noshow';
160         document.getElementById('col_res_hide').className = 'noshow';
161
162         var tab = document.getElementById('int_res');
163         while (tab.lastChild)
164                         tab.removeChild(tab.lastChild);
165
166         tab = document.getElementById('col_res');
167         while (tab.lastChild)
168                         tab.removeChild(tab.lastChild);
169
170         search_count = 0;
171
172         var sources = new Array();
173         var selector = document.getElementsByName('source');
174         for (var i = 0; i < selector.length; i++) {
175                 if (selector[i].checked) {
176                         sources.push(selector[i].value);
177                 }
178         }
179
180         search_templates = [];
181         for (var i in sources) {
182                 create_search( sources[i] );
183         }
184
185         current_startIndex = (current_count * (current_startPage - 1)) + 1; 
186
187         search_urls = [];
188         for (var i in search_templates) {
189                 if (!search_templates[i])
190                         continue;
191
192                 if (!rel_scales[i])
193                         rel_scales[i] = 0;
194
195                 var url = search_templates[i].replace(/\{searchTerms\}/,encodeURIComponent(term));
196                 url = url.replace(/\{startPage\}/,current_startPage);
197                 url = url.replace(/\{startIndex\}/,current_startIndex);
198                 url = url.replace(/\{count\}/,current_count);
199                 url = url.replace(/\{relevanceScale}/,rel_scales[i]);
200                 search_urls[i] = proxy + encodeURIComponent(url);
201
202                 src.innerHTML += '<a href="' + url + '">' + url + '</a><br>';
203         }
204
205         for (var i in search_urls) {
206                 if (!search_templates[i])
207                         continue;
208
209                 perform_search(i);
210         }
211
212         document.getElementById('page_label').innerHTML = current_startPage;
213 }
214
215 function perform_search ( source ) {
216         var req = create_requestor();
217
218         req.onreadystatechange = function () {
219                 if (req.readyState != 4)
220                         return;
221
222                 var xml = req.responseXML;
223
224                 var desc  = getElementTextNS('','description',xml,0);
225                 var xml_link  = getElementTextNS('','link',xml,0);
226
227                 var total  = getElementFloatNS('openSearch','totalResults',xml,0);
228                 var integratible = (getElementNS('openIll','relevance',xml,0) != null);
229                 var scale = getElementFloatNS('openIll','relevanceScale',xml,0);
230
231                 rel_scales[source]  = scale;
232                 
233                 var current_tot = getElementFloatNS('','span',document.getElementById('total').parentNode,0);
234                 var tot = document.getElementById('total');
235
236                 if (!current_tot)
237                         current_tot = 0;
238
239                 if (total > (current_startPage * current_count))
240                         document.getElementById('next_button').className = '';
241
242                 current_tot += total
243                 tot.innerHTML = current_tot;
244
245                 var list = xml.getElementsByTagName('item');
246                 for (var i = 0; i < list.length; i++) {
247
248                         if ( typeof list[i] != 'object')
249                                         continue;
250
251                         var tab;
252                         if (!integratible) {
253                                 tab = document.getElementById('col_res');
254                                 document.getElementById('col_res_hide').className = '';
255                                 var col = document.getElementById(source);
256                                 if (!col) {
257                                         var row = tab.rows[0];
258                                         if (!row)
259                                                 row = tab.insertRow(0);
260
261                                         col = document.createElement('td');
262                                         col.setAttribute('id',source);
263                                         row.appendChild(col);
264
265                                         tab = document.createElement('table');
266                                         tab.setAttribute('valign','top');
267                                         tab.setAttribute('class','col_tab');
268
269                                         var cap = document.createElement('caption');
270                                         tab.appendChild(cap);
271                                         cap.innerHTML = desc + ' -- <a href="' + xml_link + '">XML</a>';
272
273                                         col.appendChild(tab);
274
275                                         var per = parseInt(100 / (search_urls.length * 2)) - 1;
276                                         col.setAttribute('valign','top');
277                                         col.setAttribute('width', + per + '%');
278
279                                 } else {
280                                         tab = col.firstChild;
281                                 }
282                         } else {
283                                 tab = document.getElementById('int_res');
284                                 document.getElementById('int_res_hide').className = '';
285                         }
286
287                         if (!tab.rows.length) {
288                                 add_result_row(tab, 0, list[i], source);
289                         } else {
290                                 for (var j = 0; j < tab.rows.length; j++) {
291                                         if ( typeof tab.rows[j] != 'object')
292                                                 continue;
293
294                                         var rank;
295                                         try {
296                                                 rank = getElementFloatNS('openIll','relevance',list[i],0);
297                                         } catch (e) {
298                                                 alert("error getting float relevance: " + e);
299                                                 rank = 0;
300                                         }
301
302                                         if ( rank < parseFloat(tab.rows[j].firstChild.firstChild.textContent) ) {
303                                                 if ( (j + 1) == tab.rows.length) {
304                                                         add_result_row(tab, tab.rows.length, list[i], source);
305                                                         break
306                                                 }
307                                                 continue;
308                                         }
309                                         add_result_row(tab, j, list[i], source);
310                                         break;
311                                 }
312                         }
313                 }
314         };
315
316         req.open('GET', proxy + encodeURIComponent(search_urls[source]), true);
317         req.send(null);
318 }
319
320
321 // retrieve float of an XML document element, including
322 // elements using namespaces
323 function getElementFloatNS(prefix, local, parentElem, index) {
324     var result = getElementNS(prefix, local, parentElem, index);
325     if (result) {
326         // get text, accounting for possible
327         // whitespace (carriage return) text nodes 
328         if (result.childNodes.length > 1) {
329             return parseFloat(result.childNodes[1].nodeValue);
330         } else {
331             return parseFloat(result.textContent);              
332         }
333     } else {
334         return 0;
335     }
336 }
337
338 function getElementNS(prefix, local, parentElem, index) {
339     var result = "";
340     if (prefix && isIE) {
341         // IE/Windows way of handling namespaces
342         return parentElem.getElementsByTagName(prefix + ":" + local)[index];
343     } else {
344         // the namespace versions of this method 
345         // (getElementsByTagNameNS()) operate
346         // differently in Safari and Mozilla, but both
347         // return value with just local name, provided 
348         // there aren't conflicts with non-namespace element
349         // names
350         return parentElem.getElementsByTagName(local)[index];
351     }
352 }
353
354 // retrieve text of an XML document element, including
355 // elements using namespaces
356 function getElementTextNS(prefix, local, parentElem, index) {
357     var result = getElementNS(prefix, local, parentElem, index);
358     if (result) {
359         // get text, accounting for possible
360         // whitespace (carriage return) text nodes 
361         if (result.childNodes.length > 1) {
362             return result.childNodes[1].nodeValue;
363         } else {
364             return result.firstChild.nodeValue;                 
365         }
366     } else {
367         return '';
368     }
369 }
370
371 function add_result_row (tab, index, xml, source) {
372         var img = images[source];
373         var rank,title,tlink,desc;
374
375         try {
376                 rank = getElementFloatNS('openIll','relevance',xml,0);
377         } catch (e) {
378                 alert("error getting relevance: " + e);
379                 rank = '0';
380         }
381         
382         try {
383                 title = getElementTextNS('','title',xml,0);
384         } catch (e) {
385                 title = '';
386         }
387         
388         try {
389                 tlink = getElementTextNS('','link',xml,0);
390         } catch (e) {
391                 tlink = '';
392         }
393
394         try {
395                 description = getElementTextNS('','description',xml,0);
396                 if (description.length > 1024)
397                         description = description.substring(1,1024);
398         } catch (e) {
399                 description = '';
400         }
401
402         var row = tab.insertRow(index);
403         row.className = 'res_tr';
404         row.innerHTML = '<td style="padding: 4px"><div style="display: none; visibility: hidden;">' + rank +
405                                                  '</div><span class="title_link"><a href="' + tlink + '">' + title +
406                                                  '</a></span><br/><span class="desc_text">' + description + '</span></td>' +
407                                                  '<td><img title="' + parseInt(rank) + '% Relevant" width="32" height="32" src="' + img + '"></td>';
408 }
409
410 function create_search ( s ) {
411         var req = create_requestor();
412
413         req.open('GET',proxy +  encodeURIComponent(s),false);
414         req.send(null);
415
416         try {
417                 var xml = req.responseXML;
418                 search_templates[s] = xml.getElementsByTagName('Url')[0].textContent;
419                 var i =  xml.getElementsByTagName('Image');
420                 if (i.length)
421                         images[s] = i[0].textContent;
422         } catch (e) {
423                 alert('BAD XML!\n\n' + e + '\n\n' + req.responseText);
424                 search_templates[s] = null;
425                 images[s] = null;
426         }
427
428 }
429
430                 </script>
431         </head>
432         <body>
433                 <br/>
434                 <form>
435                 <table style="border-collapse: collapse; margin: 5px;" width="100%">
436                         <tr style="border-bottom: dotted black 1px;" valign="top">
437                                 <td align="right">Keyword Search: </td>
438                                 <td align="left">
439                                         <input type="text" id="term" value="javascript"/>
440                                         <input type="submit" value="Go!" onclick="opensearch(document.getElementById('term').value, true); return false;"/>
441                                 </td>
442                                 <td align="left">Hits per Source for each page: 
443                                         <select onchange="current_count=this.options[this.selectedIndex].value;">
444                                                 <option value="5" selected>5</option>
445                                                 <option value="10">10</option>
446                                                 <option value="25">25</option>
447                                         </select>
448                                 </td>
449                         </tr>
450                         <tr style="border-bottom: dotted black 1px;" valign="top">
451                                 <td align="right">Sources: </td>
452                                 <td colspan=2>
453                                         <table width="100%" style="border-collapse: collapse;">
454                                                 <tr>
455                                                         <td>
456                                                                 <label class="source_input">
457                                                                         <input
458                                                                                 name="source"
459                                                                                 type="checkbox"
460                                                                                 value="http://gapines.org/opensearch.xml"
461                                                                                 checked>GPLS Pines
462                                                                 </label>
463                                                         </td>
464                                                         <td>
465                                                                 <label class="source_input">
466                                                                         <input
467                                                                                 name="source"
468                                                                                 type="checkbox"
469                                                                                 value="http://rsinger.library.gatech.edu/opensearch/osdd-gil.xml"
470                                                                                 checked>GIL Universal Catalog
471                                                                 </label>
472                                                         </td>
473                                                         <td>
474                                                                 <label class="source_input">
475                                                                         <input
476                                                                                 name="source"
477                                                                                 type="checkbox"
478                                                                                 value="http://search.athenscounty.lib.oh.us/cgi-bin/koha/opensearchdescription">NPL/Koha
479                                                                 </label>
480                                                         </td>
481                                                         <td>
482                                                                 <label class="source_input">
483                                                                         <input
484                                                                                 name="source"
485                                                                                 type="checkbox"
486                                                                                 value="http://www.koders.com/search/KodersSourceCodeSearchDescription.xml">Koders Source Code
487                                                                 </label>
488                                                         </td>
489                                                         <td>
490                                                 </tr>
491                                                 <tr>
492                                                         <td>
493                                                                 <label class="source_input">
494                                                                         <input
495                                                                                 name="source"
496                                                                                 type="checkbox"
497                                                                                 value="http://cnx.rice.edu/content/opensearchdescription">rice.edu Connexions
498                                                                 </label>
499                                                         </td>
500                                                         <td>
501                                                                 <label class="source_input">
502                                                                         <input
503                                                                                 name="source"
504                                                                                 type="checkbox"
505                                                                                 value="http://redlightgreen.com/ucwprod/web/opensearchDescription.xml">RedLightGreen
506                                                                 </label>
507                                                         </td>
508                                                         <td>
509                                                                 <label class="source_input">
510                                                                         <input
511                                                                                 name="source"
512                                                                                 type="checkbox"
513                                                                                 value="http://www.itpapers.com/itpaperssearchdescription.xml">ITPapers
514                                                                 </label>
515                                                         </td>
516                                         <!-- <input name="source" type="checkbox" value="http://www.webdevref.com/blog/opensearchdescription.xml">WebDefRef -->
517                                                 </tr>
518                                         </table>
519                                 </td>
520                         </tr>
521                         <tr>
522                                 <td>Total results: </td>
523                                 <td colspan=2 id="total"></td>
524                         </tr>
525                         <tr>
526                                 <td>Current page: </td>
527                                 <td id="page_label"></td>
528                                 <td>
529                                         <button
530                                                 class='hide'
531                                                 id='prev_button'
532                                                 onclick="
533                                                         if (this.className != 'hide') {
534                                                                 current_startPage -= 1;
535                                                                 opensearch(document.getElementById('term').value);
536                                                         }
537                                                         return false;">Previous Page
538                                         </button> ...
539                                         <button
540                                                 class='hide'
541                                                 id='next_button'
542                                                 onclick="
543                                                         if (this.className != 'hide') {
544                                                                 current_startPage += 1;
545                                                                 opensearch(document.getElementById('term').value);
546                                                         }
547                                                         return false;">Next Page
548                                         </button>
549                                 </td>
550                         </tr>
551                 </table>
552                 </form>
553
554                 <hr/>
555                 <br/>
556                 <table id="results" width="100%">
557                         <tr>
558                                 <td id="int_res_hide" class="noshow" width="100%">
559                                         <table width="100%">
560                                                 <caption class="header">Merged search results</caption>
561                                                 <tr>
562                                                         <td width="100%">
563                                                                 <table id='int_res' class="res_table" width="100%"></table>
564                                                         </td>
565                                                 </tr>
566                                         </table>
567                                 </td>
568                                 <td id='col_res_hide' class="noshow">
569                                         <table>
570                                                 <caption class="header">Unranked search results</caption>
571                                                 <tr>
572                                                         <td>
573                                                                 <table id='col_res' class="res_table"></table>
574                                                         </td>
575                                                 </tr>
576                                         </table>
577                                 </td>
578                         </tr>
579                 </table>
580                 <div id="result_sources"></div>
581                 <br/>
582         </body>
583 </html>