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