src/mkws-popup.js

   1 /*! jQuery plugin for MKWS, the MasterKey Widget Set.
   2  *  Copyright (C) 2013-2014 Index Data
   3  *  See the file LICENSE for details
   4  */
   5
   6 "use strict";
   7
   8
   9 /*
  10  * implement jQuery plugin $.pazpar2({})
  11  */
  12 function _mkws_jquery_plugin($) {
  13   function debug(string) {
  14     mkws.log("jQuery.pazpar2: " + string);
  15   }
  16
  17   function init_popup(obj) {
  18     var config = obj ? obj : {};
  19
  20     var height = config.height || 760;
  21     var width = config.width || 880;
  22     var id_button = config.id_button || "input.mkwsButton";
  23     var id_popup = config.id_popup || ".mkwsPopup";
  24
  25     debug("popup height: " + height + ", width: " + width);
  26
  27     // make sure that jquery-ui was loaded afte jQuery core lib, e.g.:
  28     // <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
  29     if (!$.ui) {
  30       debug("Error: jquery-ui.js is missing, did you include it after jQuery core in the HTML file?");
  31       return;
  32     }
  33
  34     $(id_popup).dialog({
  35       closeOnEscape: true,
  36       autoOpen: false,
  37       height: height,
  38       width: width,
  39       modal: true,
  40       resizable: true,
  41       buttons: {
  42         Cancel: function() {
  43           $(this).dialog("close");
  44         }
  45       },
  46       close: function() { }
  47     });
  48
  49     $(id_button)
  50       .button()
  51       .click(function() {
  52         $(id_popup).dialog("open");
  53       });
  54   };
  55
  56   $.extend({
  57
  58     // service-proxy or pazpar2
  59     pazpar2: function(config) {
  60       if (config == null || typeof config != 'object') {
  61         config = {};
  62       }
  63       var id_popup = config.id_popup || ".mkwsPopup";
  64       id_popup = id_popup.replace(/^[#\.]/, "");
  65
  66       // simple layout
  67       var div = '\
  68 <div class="mkwsSwitch"></div>\
  69 <div class="mkwsLang"></div>\
  70 <div class="mkwsSearch"></div>\
  71 <div class="mkwsResults"></div>\
  72 <div class="mkwsTargets"></div>\
  73 <div class="mkwsStat"></div>';
  74
  75       // new table layout
  76       var table = '\
  77 <style type="text/css">\
  78   .mkwsTermlists div.facet {\
  79   float:left;\
  80   width: 30%;\
  81   margin: 0.3em;\
  82   }\
  83   .mkwsStat {\
  84   text-align: right;\
  85   }\
  86 </style>\
  87     \
  88 <table width="100%" border="0">\
  89   <tr>\
  90     <td>\
  91       <div class="mkwsSwitch"></div>\
  92       <div class="mkwsLang"></div>\
  93       <div class="mkwsSearch"></div>\
  94     </td>\
  95   </tr>\
  96   <tr>\
  97     <td>\
  98       <div style="height:500px; overflow: auto">\
  99         <div class="mkwsPager"></div>\
 100         <div class="mkwsNavi"></div>\
 101         <div class="mkwsRecords"></div>\
 102         <div class="mkwsTargets"></div>\
 103         <div class="mkwsRanking"></div>\
 104       </div>\
 105     </td>\
 106   </tr>\
 107   <tr>\
 108     <td>\
 109       <div style="height:300px; overflow: hidden">\
 110         <div class="mkwsTermlists"></div>\
 111       </div>\
 112     </td>\
 113   </tr>\
 114   <tr>\
 115     <td>\
 116       <div class="mkwsStat"></div>\
 117     </td>\
 118   </tr>\
 119 </table>';
 120
 121       var popup = '\
 122 <div class="mkwsSearch"></div>\
 123 <div class="' + id_popup + '">\
 124   <div class="mkwsSwitch"></div>\
 125   <div class="mkwsLang"></div>\
 126   <div class="mkwsResults"></div>\
 127   <div class="mkwsTargets"></div>\
 128   <div class="mkwsStat"></div>\
 129 </div>'
 130
 131       if (config && config.layout == 'div') {
 132         debug("jquery plugin layout: div");
 133         document.write(div);
 134       } else if (config && config.layout == 'popup') {
 135         debug("jquery plugin layout: popup with id: " + id_popup);
 136         document.write(popup);
 137         $(document).ready(function() { init_popup(config); });
 138       } else {
 139         debug("jquery plugin layout: table");
 140         document.write(table);
 141       }
 142     }
 143   });
 144 };
 145
 146
 147 // XXX: enable before page load, so we could call it before mkws() runs
 148 _mkws_jquery_plugin(mkws.$);
 149