examples/htdocs/topic-bootstrap-reorganise.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-6 col-md-12 col-sm-6">
  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-7">
  61         <div class="panel-body mkwsReference mkwsTeam_ref" autosearch="!param!q"
  62              data-mkws-config='{"paragraphs":1}'></div>
  63       </div>
  64       <!-- images -->
  65       <div class="col-md-5"><div class="panel panel-default">
  66         <div class="panel-heading title">
  67           <h3 class="panel-title">Images</h3>
  68         </div>
  69         <div class="panel-body mkwsGoogleImage" autosearch="!param!q"
  70              data-mkws-config='{ "maxrecs": 4, "template": "TopicImage", "target": "google_images_js" }'></div>
  71       </div></div>
  72     </div>
  73
  74     <!-- sources -->
  75     <div class="row">
  76       <div class="col-md-4 col-sm-6"><div class="panel panel-default">
  77         <div class="panel-heading title">
  78           <h3 class="panel-title">News</h3>
  79         </div>
  80         <div class="panel-body mkwsRecords mkwsTeam_news" autosearch="!param!q"
  81              data-mkws-config='{"targetfilter":"categories=news",
  82                                 "perpage":5}'></div>
  83       </div></div>
  84       <div class="col-md-4 col-sm-6"><div class="panel panel-default">
  85         <div class="panel-heading title">
  86           <h3 class="panel-title">Articles</h3>
  87         </div>
  88         <div class="panel-body mkwsRecords mkwsTeam_articles" autosearch="!param!q"
  89              data-mkws-config='{"targetfilter":"categories=articles",
  90                                 "perpage":5}'></div>
  91       </div></div>
  92       <div class="col-md-4 col-sm-6"><div class="panel panel-default">
  93         <div class="panel-heading title">
  94           <h3 class="panel-title">Books</h3>
  95         </div>
  96         <div class="panel-body mkwsRecords mkwsTeam_books" autosearch="!param!q"
  97              data-mkws-config='{"targetfilter":"categories=books",
  98                                 "perpage":5}'></div>
  99       </div></div>
 100     </div>
 101
 102     <div class="row">
 103       <!-- all targets -->
 104       <div class="col-md-9"><div class="panel panel-default">
 105         <div class="panel-heading title">
 106           <h3 class="panel-title">Results from all targets</h3>
 107         </div>
 108         <div class="panel-body mkwsRecords mkwsTeam_main"></div>
 109       </div></div>
 110       <!-- related topics -->
 111       <div class="col-md-3"><div class="panel panel-default">
 112         <div class="panel-heading title">
 113           <h3 class="panel-title">Related Topics</h3>
 114         </div>
 115         <ul class="panel-body list-group mkwsFacet mkwsTeam_main"
 116             autosearch="!param!q"
 117             data-mkws-facet="subject"
 118             data-mkws-config='{ "template": "TopicFacet" }'></ul>
 119       </div></div>
 120     </div>
 121   </div>
 122 </body>
 123 </html>