examples/htdocs/topic-bootstrap.html

   1 <!DOCTYPE html>
   2 <html lang="en">
   3 <head>
   4   <meta charset="utf-8">
   5   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   6   <meta name="viewport" content="width=device-width, initial-scale=1">
   7   <title>MKWS demo: Compound reference widget, Bootstrap edition</title>
   8   <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
   9   <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
  10   <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css">
  11   <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
  12   <script type="text/javascript">
  13     var mkws_config = { service_proxy_auth: "//mkws.indexdata.com/service-proxy-credoauth" }
  14   </script>
  15   <!-- <script type="text/javascript" src="//mkws.indexdata.com/mkws&#45;complete.js"></script> -->
  16   <script type="text/javascript" src="//mkws.local/src/mkws-complete.js"></script>
  17   <link rel="stylesheet" type="text/css" href="topic-bootstrap.css">
  18   <script>
  19     // The Google Images database returns links like:
  20     //      http://images.google.com/url?q=http://eofdreams.com/fish.html&sa=U&ei=RAB-U9XNDo2Dqga1o4L4Bw&ved=0CC4Q9QEwAA&usg=AFQjCNFhRtn6GMevHbpITZ6kfx6rsHV2ow
  21     // This Handlebars helper avoids a pointless redirect by transforming
  22     // this to the URL of the underling page, in this case
  23     //      http://eofdreams.com/fish.html
  24     Handlebars.registerHelper('mkws-googleurl', function(obj) {
  25       if (!obj) {
  26         return "obj undefined";
  27       } else if (!obj[0]) {
  28         return "obj[0] undefined, JSON=" + $.toJSON(obj);
  29       } else {
  30         return mkws.getParameterByName('q', obj[0]);
  31       }
  32     });
  33   </script>
  34   <script class="mkwsTemplate_TopicImage" type="text/x-handlebars-template">
  35     {{#each hits}}
  36       <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
  37        <a href="{{mkws-googleurl md-electronic-url}}" target="_blank">
  38         {{#mkws-first md-thumburl}}
  39           <img src="{{this}}" alt="{{../md-title}}"/>
  40         {{/mkws-first}}
  41         <br/>
  42        </a>
  43        <p>{{{md-title}}}</p>
  44       </div>
  45     {{/each}}
  46   </script>
  47   <script class="mkwsTemplate_TopicFacet" type="text/x-handlebars-template">
  48     {{#each terms}}
  49       <li class="list-group-item mkwsTerm">
  50         <span class="badge">{{count}}</span>
  51         <a href="#" {{linkdata}}>{{term}}</a>
  52       </li>
  53     {{/each}}
  54   </script>
  55 </head>
  56 <body>
  57   <div class='page-header container' autosearch='!param!q'>
  58     <div class="row">
  59       <!-- reference entry -->
  60       <div class="jumbotron panel col-md-8">
  61         <div class="panel-body mkwsReference mkwsTeam_ref" autosearch="!param!q"
  62              data-mkws-config='{"paragraphs":1}'></div>
  63       </div>
  64       <!-- related topics -->
  65       <div class="col-lg-offset-1 col-lg-3 col-md-4"><div class="panel panel-default">
  66         <div class="panel-heading title">
  67           <h3 class="panel-title">Related Topics</h3>
  68         </div>
  69         <ul class="panel-body list-group mkwsFacet mkwsTeam_main"
  70             autosearch="!param!q"
  71             data-mkws-facet="subject"
  72             data-mkws-config='{ "template": "TopicFacet" }'></ul>
  73       </div></div>
  74     </div>
  75     <!-- images -->
  76     <div class="row">
  77       <div class="col-md-12"><div class="panel panel-default">
  78         <div class="panel-heading title">
  79           <h3 class="panel-title">Images</h3>
  80         </div>
  81         <div class="panel-body mkwsGoogleImage" autosearch="!param!q"
  82              data-mkws-config='{ "maxrecs": 4, "template": "TopicImage", "target": "google_images_js" }'></div>
  83       </div></div>
  84     </div>
  85
  86     <!-- sources -->
  87     <div class="row">
  88       <div class="col-lg-6 col-md-8 col-sm-6">
  89         <div class="col-md-6 col-sm-12"><div class="panel panel-default">
  90           <div class="panel-heading title">
  91             <h3 class="panel-title">News</h3>
  92           </div>
  93           <div class="panel-body mkwsRecords mkwsTeam_news" autosearch="!param!q"
  94                data-mkws-config='{"targetfilter":"categories=news",
  95                                   "perpage":10}'></div>
  96         </div></div>
  97         <div class="col-md-6 col-sm-12"><div class="panel panel-default">
  98           <div class="panel-heading title">
  99             <h3 class="panel-title">Articles</h3>
 100           </div>
 101           <div class="panel-body mkwsRecords mkwsTeam_articles" autosearch="!param!q"
 102                data-mkws-config='{"targetfilter":"categories=articles",
 103                                   "perpage":10}'></div>
 104         </div></div>
 105         <div class="col-md-6 col-sm-12"><div class="panel panel-default">
 106           <div class="panel-heading title">
 107             <h3 class="panel-title">Books</h3>
 108           </div>
 109           <div class="panel-body mkwsRecords mkwsTeam_books" autosearch="!param!q"
 110                data-mkws-config='{"targetfilter":"categories=books",
 111                                   "perpage":10}'></div>
 112         </div></div>
 113       </div>
 114       <div class="col-lg-6 col-md-4 col-sm-6">
 115           <div class="panel panel-default">
 116           <div class="panel-heading title">
 117             <h3 class="panel-title">Results from all targets</h3>
 118           </div>
 119           <div class="panel-body mkwsRecords mkwsTeam_main"></div>
 120         </div>
 121       </div>
 122     </div>
 123   </div>
 124 </body>
 125 </html>