www/masterkey/js/client.js

   1 // very simple client that shows a basic usage of the pz2.js
   2
   3 // create a parameters array and pass it to the pz2's constructor
   4 // then register the form submit event with the pz2.search function
   5
   6 var my_paz = new pz2( { "onshow": my_onshow,
   7                     //"showtime": 1000,
   8                     //"onstat": my_onstat,
   9                     "onterm": my_onterm,
  10                     "termlist": "subject,author,xtargets,date",
  11                     //"onbytarget": my_onbytarget,
  12                     "onrecord": my_onrecord } );
  13
  14 var currentSort = 'relevance';
  15 var currentResultsPerPage = 20;
  16 var currentQuery = null;
  17
  18 var currentDetailedId = null;
  19 var currentDetailedData = null;
  20
  21 var termStartup = true;    //some things should be done only once
  22
  23 // wait until the DOM is ready (could have been defined in the HTML)
  24 $(document).ready( function() {
  25                     document.search.onsubmit = onFormSubmitEventHandler;
  26                     } );
  27
  28 function onFormSubmitEventHandler() {
  29     currentQuery = document.search.query.value;
  30     my_paz.search(document.search.query.value, 20, 'relevance');
  31     $('div.content').show();
  32     $("div.leftbar").show();
  33     return false;
  34 }
  35 //
  36 // pz2.js event handlers:
  37 //
  38 function my_onshow(data)
  39 {
  40     var recsBody = $('div.records');
  41     recsBody.empty();
  42
  43     for (var i = 0; i < data.hits.length; i++) {
  44         var title = data.hits[i]["md-title"] || 'N/A';
  45         var author = data.hits[i]["md-author"] || '';
  46         var id = data.hits[i].recid;
  47         var count = data.hits[i].count || 1;
  48
  49         recsBody.append('<div class="resultNum">'+(i+1)+'.</a>');
  50
  51         var recBody = $('<div class="record" id="rec_'+id+'></div>').appendTo(recsBody);
  52         var aTitle = $('<a class="recTitle">'+title+'</a>').appendTo(recBody);
  53         aTitle.click(function(){
  54                         var clickedId = this.parentNode.id.split('_')[1];
  55                         if(currentDetailedId == clickedId){
  56                             $(this.parentNode.lastChild).remove();
  57                             currentDetailedId = null;
  58                             return;
  59                         } else if (currentDetailedId != null) {
  60                             $('#rec_'+currentDetailedId).children('.detail').remove();
  61                         }
  62                         currentDetailedId = clickedId;
  63                         my_paz.record(currentDetailedId);
  64                         });
  65
  66         if( author )
  67             recBody.append('<i> by </i>');
  68             $('<a name="author" class="recAuthor">'+author+'</a>\n').click(function(){ refine(this.name, this.firstChild.nodeValue) }).appendTo(recBody);
  69
  70         if( currentDetailedId == id ){
  71             var detailBox = $('<div class="detail"></div>').appendTo(recBody);
  72             drawDetailedRec(detailBox);
  73         }
  74     }
  75 }
  76
  77 /*
  78
  79     body.innerHTML = "";
  80     for ( i = 0; i < data.hits.length; i++) {
  81         var hit = data.hits[i];
  82         body.innerHTML += '<div id="' + hit.recid + '" onclick="my_paz.record(this.id)"><span>' + i +
  83                           '. </span><span><b>' + hit["md-title"] +
  84                           ' </b></span> by <span><i>' + hit["md-author"] + '</i></span></div>';
  85     }
  86     body.innerHTML += "<hr/>";
  87     body.innerHTML += '<div>active clients: ' + data.activeclients + '</div>' +
  88                      '<div>merged: ' + data.merged + '</div>' +
  89                      '<div>total: ' + data.total + '</div>' +
  90                      '<div>start: ' + data.start + '</div>' +
  91                      '<div>num: ' + data.num + '</div>';
  92 }
  93 */
  94
  95 function my_onstat(data)
  96 {
  97 /*
  98     var stat = document.getElementById("stat");
  99     stat.innerHTML = '<div>active clients: ' + data.activeclients + '</div>' +
 100                      '<div>hits: ' + data.hits + '</div>' +
 101                      '<div>records: ' + data.records + '</div>' +
 102                      '<div>clients: ' + data.clients + '</div>' +
 103                      '<div>searching: ' + data.searching + '</div>';
 104 */
 105 }
 106
 107 function my_onterm(data)
 108 {
 109     var termLists = $("#termlists");
 110
 111     if(termStartup)
 112     {
 113         for(var key in data){
 114             if (key == "activeclients")
 115                 continue;
 116             var listName = key;
 117             if (key == "xtargets")
 118                 listName = "institution";
 119
 120             var termList = $('<div class="termlist" id="term_'+key+'"/>').appendTo(termLists);
 121             var termTitle = $('<div class="termTitle"><a class="unselected">'+listName+'</a></div>').appendTo(termList);
 122             termTitle.click(function(){
 123                                 if( this.firstChild.className == "selected" ){
 124                                     this.firstChild.className = "unselected";
 125                                     $(this.nextSibling).hide();
 126                                 } else {
 127                                     this.firstChild.className = "selected";
 128                                     $(this.nextSibling).show();
 129                                 }
 130                             });
 131
 132             listEntries = $('<div class="termEntries"></div>');
 133             listEntries.hide();
 134             listEntries.appendTo(termList);
 135
 136             for(var i = 0; i < data[key].length; i++)
 137             {
 138                 if (key == "xtargets"){
 139                     var listItem = $('<a class="sub" name="xtarget" value="'+data[key][i].id+'">'+data[key][i].name+
 140                                 '<span> ('+data[key][i].freq+')</span></a>').appendTo(listEntries);
 141                     listItem.click(function(){
 142                         refine(this.name, this.attributes[0].nodeValue) });
 143                 } else {
 144                     var listItem = $('<a class="sub" name="'+key+'">'+data[key][i].name+
 145                                     '<span> ('+data[key][i].freq+')</span></a>').appendTo(listEntries);
 146                     listItem.click(function(){ refine(this.name, this.firstChild.nodeValue) });
 147                 }
 148             }
 149             $('<hr/>').appendTo(termLists);
 150         }
 151         termStartup = false;
 152     }
 153     else
 154     {
 155         for(var key in data){
 156             if (key == "activeclients")
 157                 continue;
 158             var listEntries = $('#term_'+key).children('.termEntries');
 159             listEntries.empty()
 160
 161             for(var i = 0; i < data[key].length; i++){
 162                 if (key == "xtargets"){
 163                     var listItem = $('<a class="sub" name="xtarget" value="'+data[key][i].id+'">'+data[key][i].name+
 164                                 '<span> ('+data[key][i].freq+')</span></a>').appendTo(listEntries);
 165                     listItem.click(function(){
 166                         refine(this.name, this.attributes[0].nodeValue) });
 167                 } else {
 168                     var listItem = $('<a class="sub" name="'+key+'">'+data[key][i].name+
 169                                     '<span> ('+data[key][i].freq+')</span></a>').appendTo(listEntries);
 170                     listItem.click(function(){ refine(this.name, this.firstChild.nodeValue) });
 171                 }
 172             }
 173         }
 174     }
 175 }
 176
 177 function my_onrecord(data)
 178 {
 179     currentDetailedData = data;
 180     drawDetailedRec();
 181     /*
 182     details = data;
 183     recordDiv = document.getElementById(data.recid);
 184     recordDiv.innerHTML = "<table><tr><td><b>Ttle</b> : </td><td>" + data["md-title"] +
 185                             "</td></tr><tr><td><b>Date</b> : </td><td>" + data["md-date"] +
 186                             "</td></tr><tr><td><b>Author</b> : </td><td>" + data["md-author"] +
 187                             "</td></tr><tr><td><b>Subject</b> : </td><td>" + data["md-subject"] +
 188                             "</td></tr><tr><td><b>Location</b> : </td><td>" + data["location"][0].name + "</td></tr></table>";
 189                             */
 190
 191 }
 192
 193 function drawDetailedRec(detailBox)
 194 {
 195     if( detailBox == undefined )
 196         detailBox = $('<div class="detail"></div>').appendTo($('#rec_'+currentDetailedId));
 197
 198     detailBox.append('Details:<hr/>');
 199     var detailTable = $('<table></table>');
 200     var recDate = currentDetailedData["md-date"];
 201     var recSubject = currentDetailedData["md-subject"];
 202     var recLocation = currentDetailedData["location"];
 203
 204     if( recDate )
 205         detailTable.append('<tr><td class="item">Published:</td><td>'+recDate+'</td></tr>');
 206     if( recSubject )
 207         detailTable.append('<tr><td class="item">Subject:</td><td>'+recSubject+'</td></tr>');
 208     if( recLocation )
 209         detailTable.append('<tr><td class="item">Available at:</td><td>&nbsp;</td></tr>');
 210
 211     for(var i=0; i < recLocation.length; i++)
 212     {
 213         detailTable.append('<tr><td class="item">&nbsp;</td><td>'+recLocation[i].name+'</td></tr>');
 214     }
 215
 216     detailTable.appendTo(detailBox);
 217 }
 218
 219 function my_onbytarget(data)
 220 {
 221     /*
 222     targetDiv = document.getElementById("bytarget");
 223     targetDiv.innerHTML = "<tr><td>ID</td><td>Hits</td><td>Diag</td><td>Rec</td><td>State</td></tr>";
 224
 225     for ( i = 0; i < data.length; i++ ) {
 226         targetDiv.innerHTML += "<tr><td><b>" + data[i].id +
 227                                "</b></td><td>" + data[i].hits +
 228                                "</td><td>" + data[i].diagnostic +
 229                                "</td><td>" + data[i].records +
 230                                "</td><td>" + data[i].state + "</td></tr>";
 231     }
 232     */
 233 }
 234
 235 function refine(field, value)
 236 {
 237     var query = '';
 238     var filter = undefined;
 239
 240     switch(field) {
 241         case "author": query = ' and au="'+value+'"'; break;
 242         case "title": query = ' and ti="'+value+'"'; break;
 243         case "date": query = ' and date="'+value+'"'; break;
 244         case "subject": query = ' and su="'+value+'"'; break;
 245         case "xtarget": filter = 'id='+value; break;
 246     }
 247
 248     my_paz.search(currentQuery + query, currentResultsPerPage, currentSort, filter);
 249 }