From: Jason Skomorowski <jason@indexdata.com>
Date: Tue, 4 Nov 2014 17:16:28 +0000 (-0500)
Subject: Merge branch 'master' into prettysimple
X-Git-Tag: 1.0.0~83^2~5
X-Git-Url: http://git.indexdata.com/?p=mkws-moved-to-github.git;a=commitdiff_plain;h=5fce8c968981efbd7fc063faa833f7d8093dd630;hp=7b8f519897c9b6ac4da2b83080ecd0fb6127b802

Merge branch 'master' into prettysimple

Conflicts:
	src/templates/facets.handlebars
---

diff --git a/examples/htdocs/prettysimple.css b/examples/htdocs/prettysimple.css
new file mode 100644
index 0000000..10c2f9f
--- /dev/null
+++ b/examples/htdocs/prettysimple.css
@@ -0,0 +1,386 @@
+/* General styling */
+html {
+  height: 100%;
+  margin: 0;
+}
+body {
+  display: flex;
+  align-content: space-between;
+  align-items: center;
+  flex-wrap: wrap;
+  height: 100%;
+  width: 100%;
+  max-width: 1100px;
+  margin: auto;
+  font-family: "Open Sans", sans-serif;
+}
+a {
+ text-decoration: none;
+ color: black;
+}
+
+/* Top level layout */
+.header {
+  width: 100%;
+  display: flex;
+  margin: .5em;
+  margin-bottom: 1em;
+}
+.mkws-switch {
+  margin-left: auto;
+}
+.main {
+  width: 100%;
+  display: flex;
+  align-items: flex-start;
+  margin: 1em;
+  margin-bottom: auto;
+}
+.forms {
+  width: 100%;
+  margin: 1em;
+}
+.mkws-termlists {
+  margin-right: 66px;
+  flex: 1;
+}
+.results {
+  flex: 3;
+}
+
+/* Search form */
+/* heavily inspired by: */
+/* https://github.com/philipwalton/solved-by-flexbox/blob/master/_sass/components/_input-add-on.scss */
+.mkws-search {
+  margin-left: auto;
+  margin-bottom: 0;
+}
+.mkws-search-form {
+  display: flex;
+  margin-left: auto;
+  max-width: 30em;
+}
+.mkws-search-form .mkws-query {
+  flex: 1;
+  border-right: 0 !important;
+  border-radius: 2px 0 0 2px;
+  font-size: 1.1em;
+}
+.mkws-search-form .mkws-button {
+  border-radius: 0 2px 2px 0;
+  background-color: hsla(31, 15%, 50%, 0.1);
+  font: inherit;
+  font-weight: normal;
+}
+.mkws-search-form .mkws-query, .mkws-search-form .mkws-button {
+  border: 1px solid hsla(31, 15%, 50%, 0.25);
+  padding: 0.5em 0.75em;
+  margin: 0;
+}
+.mkws-ranking {
+  font-family: "Open Sans Light", sans-serif;
+  border-top: none;
+  border-bottom-left-radius: 5em 100%;
+  margin-top: 0;
+  margin-left: auto;
+  font-size: .9em;
+  text-align: right;
+  max-width: 25em;
+}
+.mkws-ranking select {
+ font-size: 1.0em;
+ font-family: "Open Sans", sans-serif;
+ border: none;
+ background: none;
+}
+
+/* Misc. elements */
+.mkws-lang {
+  color: gray;
+  font-family: "Open Sans Light", sans-serif;
+}
+.mkws-lang > span {
+  color: black;
+  font-family: "Open Sans", sans-serif;
+}
+.mkws-switch {
+  color: gray;
+  font-family: "Open Sans Light", sans-serif;
+}
+.mkws-switch > a {
+  color: black;
+}
+.mkws-pager {
+  width: 100%;
+}
+.mkws-current-page {
+  background: gray;
+  border-radius: 3em;
+  padding: 0 .5em;
+  color: white;
+}
+.mkws-navi {
+  margin-top: 10px;
+  width: 100%;
+  
+}
+.mkws-removable:after {
+  content: " X";
+  color: DarkRed; 
+}
+.mkws-removable:hover {
+  text-decoration: line-through;
+}
+.mkws-records {
+  width: 100%;
+}
+
+
+/* Facets */
+.mkws-facet {
+  padding-bottom: 1em;
+}
+.mkws-facet-title {
+  border-left: 5px solid #7d8187;
+  padding: .5em 10px;
+  text-transform: uppercase;
+}
+.mkws-facet:nth-child(1)>.mkws-facet-title {
+  border-color: #2980b9;
+}
+.mkws-facet:nth-child(2)>.mkws-facet-title {
+  border-color: #68a863;
+}
+.mkws-facet:nth-child(3)>.mkws-facet-title {
+  border-color: #b45b47;
+}
+
+.mkws-facet:last-child {
+  padding-bottom: initial;
+}
+.mkws-term {
+  display: flex;
+  padding-left: 15px;
+  font-size: .9em;
+}
+.mkws-term a {
+  flex: 1;
+  overflow: hidden; 
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.mkws-term span {
+  flex: 0 0 min-content;
+  float: right;
+  margin-left: .7em;
+}
+.mkws-stat {
+  font-family: "Open Sans Light", sans-serif;
+  text-align: right;
+  font-size: .9em;
+}
+
+
+/* Result containers */
+.mkws-summary {
+  padding: 40px 20px;
+  min-height: 120px;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
+}
+.mkws-summary:last-child {
+  border: none;
+}
+.mkws-field-data {
+  min-height: 120px;
+  display: flex;
+  flex-direction: column;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  align-content: flex-start;
+  justify-content: space-around;
+}
+
+/* Result fields */
+.mkws-field-data > * {
+  flex 1;
+}
+.mkws-field-date {
+  order: 1;
+  font-size: 14px;
+  color: rgba(0, 0, 0, 0.3);
+}
+.mkws-field-title {
+  order: 2;
+  font-family: "Open Sans Light", sans-serif;
+  font-size: 24px;
+  line-height: 1.2;
+  letter-spacing: -0.02em;
+  margin-bottom: 4px;
+}
+.mkws-field-title-remainder {
+  order: 3;
+  font-family: "Open Sans Light", sans-serif;
+  font-size: 12px;
+  margin-top: -4px;
+  margin-bottom: 4px;
+  overflow: hidden; 
+  text-overflow: ellipsis;
+}
+.mkws-field-description {
+  order: 4;
+  font-family: "Open Sans Light", sans-serif;
+  font-size: 18px;
+  line-height: 1.2;
+  max-height: 44px;
+  overflow: hidden;
+}
+.mkws-field-author {
+  order: 5;
+  font-weight: bold;
+  font-size: 12px;
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+}
+.mkws-field-thumb {
+  float: left;
+  margin-right: 25px;
+}
+.mkws-field-thumb > img {
+  width: 140px;
+  height: 120px;
+  object-fit: contain;
+}
+.mkws-details {
+  margin-top: 25px;
+}
+.mkws-prev, .mkws-next {
+  text-transform: uppercase;
+  font-size: .75em;
+} 
+
+
+/* Responsive */
+@media screen and (max-width: 1020px) {
+  .mkws-termlists {
+    margin-right: 30px;
+  }
+}
+@media screen and (max-width: 900px) {
+  .mkws-pager {
+    margin: 0;
+  }
+  .mkws-pager > div {
+    margin-top: 10px;
+  }
+  .main {
+    flex-wrap: wrap;
+  }
+  .mkws-termlists {
+    order: 99;
+    width: 100%;
+    margin-top: 40px;
+    margin-right: 0;
+    flex: none;
+  }
+  .results {
+    width: 100%;
+    order 1;
+    flex: none;
+  }
+  .mkws-ranking {
+    width: 100%;
+  }
+  .mkws-search {
+    width: 100%;
+  }
+  .mkws-summary {
+    min-height: 60px;
+    padding: 20px 10px;
+  }
+  .mkws-field-data {
+    min-height: 60px;
+  }
+  .mkws-field-date {
+    font-size: 12px;
+  }
+  .mkws-field-title {
+    font-size: 18px;
+  }
+  .mkws-field-description {
+    font-size: 14px;
+    max-height: 34px;
+  }
+  .mkws-field-author {
+    font-size: 11px;
+  }
+  .mkws-field-thumb {
+    order: -1;
+    margin-right: 10px;
+  }
+  .mkws-field-thumb > img {
+    width: 70px;
+    height: 60px;
+    object-fit: contain;
+  }
+  .mkws-pager > div {
+    float: none !important;
+  }
+}
+
+/* Font (from mozilla.org) */
+@font-face{
+  font-family:'Open Sans Light';
+  src:url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Light-webfont.eot);
+  src:url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Light-webfont.eot?#iefix) format('embedded-opentype'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Light-webfont.woff) format('woff'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Light-webfont.ttf) format('truetype'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Light-webfont.svg#OpenSansLight) format('svg');
+  font-weight:400;
+  font-style:normal
+}
+
+@font-face{
+  font-family:'Open Sans Light';
+  src:url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Regular-webfont.eot);
+  src:url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Regular-webfont.eot?#iefix) format('embedded-opentype'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Regular-webfont.woff) format('woff'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Regular-webfont.ttf) format('truetype'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Regular-webfont.svg#OpenSansRegular) format('svg');
+  font-weight:700;
+  font-style:normal
+}
+
+@font-face{
+  font-family:'Open Sans Light';
+  src:url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-LightItalic-webfont.eot);
+  src:url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-LightItalic-webfont.eot?#iefix) format('embedded-opentype'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-LightItalic-webfont.woff) format('woff'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-LightItalic-webfont.ttf) format('truetype'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-LightItalic-webfont.svg#OpenSansRegular) format('svg');
+  font-weight:400;
+  font-style:italic
+}
+
+@font-face{
+  font-family:'Open Sans';
+  src:url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Regular-webfont.eot);
+  src:url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Regular-webfont.eot?#iefix) format('embedded-opentype'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Regular-webfont.woff) format('woff'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Regular-webfont.ttf) format('truetype'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Regular-webfont.svg#OpenSansRegular) format('svg');
+  font-weight:400;
+  font-style:normal
+}
+
+@font-face{
+  font-family:'Open Sans';
+  src:url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Semibold-webfont.eot);
+  src:url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Semibold-webfont.eot?#iefix) format('embedded-opentype'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Semibold-webfont.woff) format('woff'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Semibold-webfont.ttf) format('truetype'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Semibold-webfont.svg#OpenSansSemibold) format('svg');
+  font-weight:700;
+  font-style:normal
+}
+
+@font-face{
+  font-family:'Open Sans';
+  src:url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Italic-webfont.eot);
+  src:url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Italic-webfont.eot?#iefix) format('embedded-opentype'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Italic-webfont.woff) format('woff'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Italic-webfont.ttf) format('truetype'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-Italic-webfont.svg#OpenSansItalic) format('svg');
+  font-weight:400;
+  font-style:italic
+}
+
+@font-face{
+  font-family:'Open Sans Extra Bold';
+  src:url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-ExtraBold-webfont.eot);
+  src:url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-ExtraBold-webfont.eot?#iefix) format('embedded-opentype'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-ExtraBold-webfont.woff) format('woff'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-ExtraBold-webfont.ttf) format('truetype'),url(//mozorg.cdn.mozilla.net/media/fonts/OpenSans-ExtraBold-webfont.svg#OpenSansSemibold) format('svg');
+  font-weight:700;
+  font-style:normal
+}
+
diff --git a/examples/htdocs/prettysimple.html b/examples/htdocs/prettysimple.html
new file mode 100644
index 0000000..fd0ddb8
--- /dev/null
+++ b/examples/htdocs/prettysimple.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>MKWS demo</title>
+    <script type="text/javascript" src="//mkws.indexdata.com/mkws-complete.js"></script>
+    <link rel="stylesheet" href="prettysimple.css" />
+  </head>
+  <body>
+    <div class="header">
+      <div class="mkws-lang"></div>
+      <div class="mkws-switch"></div>
+    </div>
+    <div class="forms">
+      <div class="mkws-search"></div>
+      <div class="mkws-ranking"></div>
+    </div>
+    <div class="main">
+      <div class="mkws-termlists"></div>
+      <div class="results">
+        <div class="mkws-pager"></div>
+        <div class="mkws-navi"></div>
+        <div class="mkws-records"></div>
+        <div class="mkws-targets"></div>
+        <div class="mkws-stat"></div>
+      </div>
+    </div>
+  </body>
+</html>
+
+
diff --git a/examples/htdocs/topic.css b/examples/htdocs/topic.css
index 47da435..9e0e181 100644
--- a/examples/htdocs/topic.css
+++ b/examples/htdocs/topic.css
@@ -50,8 +50,15 @@ b, strong {
   }
 
 .mkws-summary {
-  padding: .5em 0;
+  margin: .5em 0;
   line-height: 1.35;
+  min-height: 60px;
+}
+.articles .mkws-summary, .alltargets .mkws-summary {
+  min-height: 0;
+}
+.articles .mkws-field-thumb, .alltargets .mkws-field-thumb {
+  display: none;
 }
 .mkws-summary:last-child {
   padding-bottom: 0;
@@ -80,7 +87,7 @@ b, strong {
 }
   .mkws-google-image img {
     max-width: 100%;
-    max-height: 200px;
+    max-height: 180px;
     padding: 1em 0 .5em;
   }
 .list-group-item {
@@ -90,6 +97,25 @@ b, strong {
   box-shadow: none;
   -webkit-box-shadow: none;
 }
+
+/* Fields */
+.mkws-field-thumb {
+  height: 60px;
+  width: 80px;
+  overflow: hidden;
+  margin-right: 1em;
+  float: left;
+}
+.mkws-field-thumb > img {
+  height: 60px;
+  max-width: 80px;
+} 
+.mkws-field-description {
+  overflow: hidden; 
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 @media screen and (min-width:700px) {
   .multicol {
     column-count: 2;
@@ -100,3 +126,13 @@ b, strong {
     -webkit-column-gap: 20px;
   }
 }
+@media screen and (min-width:900px) {
+  .multicol {
+    column-count: 3;
+    column-gap: 20px;
+    -moz-column-count: 3;
+    -moz-column-gap: 20px;
+    -webkit-column-count: 3;
+    -webkit-column-gap: 20px;
+  }
+}
diff --git a/examples/htdocs/topic.html b/examples/htdocs/topic.html
index 642941b..34bf452 100644
--- a/examples/htdocs/topic.html
+++ b/examples/htdocs/topic.html
@@ -1,10 +1,9 @@
 <!DOCTYPE html>
-<html lang="en">
-<head>
+<html lang="en"><head>
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>MKWS demo: Compound reference widget, Bootstrap edition</title>
+  <title>MKWS demo</title>
   <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
   <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
   <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css">
@@ -17,31 +16,17 @@
     var mkws_config = { sp_auth_credentials: "credo/emu" };
   </script>
   <script type="text/javascript" src="//mkws.indexdata.com/mkws-complete.js"></script>
-  <!-- <script type="text/javascript" src="//mkws.local/mkws&#45;complete.js"></script> -->
   <link rel="stylesheet" type="text/css" href="topic.css">
   <script>
-    // The Google Images database returns links like:
-    //      http://images.google.com/url?q=http://eofdreams.com/fish.html&sa=U&ei=RAB-U9XNDo2Dqga1o4L4Bw&ved=0CC4Q9QEwAA&usg=AFQjCNFhRtn6GMevHbpITZ6kfx6rsHV2ow
-    // This Handlebars helper avoids a pointless redirect by transforming
-    // this to the URL of the underling page, in this case
-    //      http://eofdreams.com/fish.html
-    Handlebars.registerHelper('mkws-googleurl', function(obj) {
-      if (!obj) {
-        return "obj undefined";
-      } else if (!obj[0]) {
-        return "obj[0] undefined, JSON=" + $.toJSON(obj);
-      } else {
-        return mkws.getParameterByName('q', obj[0]);
-      }
-    });
     Handlebars.registerHelper('mkws-topicurl', function(topic) {
+      /* Creates a link back to this page with the topic as a parameter */
       return window.location.pathname + "?q=" + encodeURIComponent(topic);
     });
   </script>
   <script class="mkws-template-topic-image" type="text/x-handlebars-template">
     {{#each hits}}
       <div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
-       <a href="{{mkws-googleurl md-electronic-url}}" target="_blank">
+       <a href="{{md-electronic-url}}" target="_blank">
         {{#mkws-first md-thumburl}}
           <img src="{{this}}" alt="{{../md-title}}"/>
         {{/mkws-first}}
@@ -64,12 +49,12 @@
   <div class='page-header container' autosearch='!param!q'>
     <div class="row">
       <!-- reference entry -->
-      <div class="jumbotron panel col-md-8">
+      <div class="jumbotron panel col-md-8 col-sm-7">
         <div class="panel-body mkws-reference mkws-team-ref" autosearch="!param!q"
              data-mkws-config='{"paragraphs":1}'></div>
       </div>
       <!-- related topics -->
-      <div class="col-md-offset-1 col-md-3"><div class="panel panel-default">
+      <div class="col-md-offset-1 col-md-3 col-sm-5"><div class="panel panel-default">
         <div class="panel-heading title">
           <h3 class="panel-title">Related Topics</h3>
         </div>
@@ -92,7 +77,7 @@
 
     <!-- sources -->
     <div class="row">
-        <div class="col-md-4 col-sm-6"><div class="panel panel-default">
+        <div class="news col-md-4 col-sm-6"><div class="panel panel-default">
           <div class="panel-heading title">
             <h3 class="panel-title">News</h3>
           </div>
@@ -100,7 +85,7 @@
                data-mkws-config='{"targetfilter":"categories=news",
                                   "perpage":7}'></div>
         </div></div>
-        <div class="col-md-4 col-sm-6"><div class="panel panel-default">
+        <div class="articles col-md-4 col-sm-6"><div class="panel panel-default">
           <div class="panel-heading title">
             <h3 class="panel-title">Articles</h3>
           </div>
@@ -108,7 +93,7 @@
                data-mkws-config='{"targetfilter":"categories=articles",
                                   "perpage":7}'></div>
         </div></div>
-        <div class="col-md-4 col-sm-6"><div class="panel panel-default">
+        <div class="books col-md-4 col-sm-6"><div class="panel panel-default">
           <div class="panel-heading title">
             <h3 class="panel-title">Books</h3>
           </div>
@@ -118,7 +103,7 @@
         </div></div>
     </div>
     <div class="row">
-        <div class="col-md-12"><div class="panel panel-default">
+        <div class="alltargets col-md-12"><div class="panel panel-default">
           <div class="panel-heading title">
             <h3 class="panel-title">Results from all targets</h3>
           </div>
diff --git a/src/mkws-widget-main.js b/src/mkws-widget-main.js
index 8a51a4d..0fe9d90 100644
--- a/src/mkws-widget-main.js
+++ b/src/mkws-widget-main.js
@@ -56,7 +56,7 @@ mkws.registerWidgetType('pager', function() {
     output.found = data.total;
 
     //client indexes pages from 1 but pz2 from 0
-    var onsides = 6;
+    var onsides = 5;
     var pages = Math.ceil(that.team.totalRecordCount() / that.team.perpage());
     var currentPage = that.team.currentPage();
 
diff --git a/src/templates/facets.handlebars b/src/templates/facets.handlebars
index 8ebc91f..3ca13a6 100644
--- a/src/templates/facets.handlebars
+++ b/src/templates/facets.handlebars
@@ -4,8 +4,6 @@ Facets, a container of all configured facets.
 team - the current team
 facets - array of facet names
 }}
-
-<div class="mkws-facets-title mkwsTermlistsTitle">{{mkws-translate "Facets"}}</div>
 {{#each facets}}
   <div class="mkws-facet mkwsFacet mkws-team-{{../team}}" data-mkws-facet="{{this}}"></div>
 {{/each}}
diff --git a/src/templates/search.handlebars b/src/templates/search.handlebars
index 82cbd15..446ba16 100644
--- a/src/templates/search.handlebars
+++ b/src/templates/search.handlebars
@@ -2,10 +2,9 @@
 Search form
 
 team - MKWS team
-queryWidth - configured width for search box
 }}
 <form name="mkws-search-form" class="mkws-search-form mkws-team-{{team}}" action="">
-  <input class="mkws-query mkws-query mkwsQuery mkws-team-{{team}}" type="text" size="{{queryWidth}}">
+  <input class="mkws-query mkws-query mkwsQuery mkws-team-{{team}}" type="text">
   <input class="mkws-button mkws-button mkwsButton mkws-team-{{team}}" type="submit" value="{{{mkws-translate "Search"}}}">
 </form>
 
diff --git a/src/templates/summary.handlebars b/src/templates/summary.handlebars
index aa2ed10..8b65174 100644
--- a/src/templates/summary.handlebars
+++ b/src/templates/summary.handlebars
@@ -10,15 +10,34 @@ detailClick - a click event handler for details
 renderedDetails - active record details rendered from the details template
 md-* - metadata fields passed through from backend
 }}
-<a href="#" id="{{detailLinkId}}" onclick="{{detailClick}}">
-  <b>{{md-title}}</b>
-</a>
-{{#if md-title-remainder}}
-  <span>{{md-title-remainder}}</span>
-{{/if}}
-{{#if md-title-responsibility}}
-  <span><i>{{md-title-responsibility}}</i></span>
+{{#if md-thumburl}}
+  <a class="mkws-field-thumb" href="#" onclick="{{detailClick}}">
+    <img src="{{md-thumburl}}"/>
+  </a>
 {{/if}}
+<div class="mkws-field-data">
+  <span class="mkws-field-title">
+  <a href="#" id="{{detailLinkId}}" onclick="{{detailClick}}">
+    {{md-title}}
+  </a>
+  </span>
+  {{#if md-title-remainder}}
+    <span class="mkws-field-title-remainder">{{md-title-remainder}}</span>
+  {{/if}}
+  {{#if md-author}}
+    <span class="mkws-field-author">{{md-author}}</span>
+  {{else}}
+    {{#if md-title-responsibility}}
+      <span class="mkws-field-author">{{md-title-responsibility}}</span>
+    {{/if}}
+  {{/if}}
+  {{#if md-description}}
+    <div class="mkws-field-description">{{md-description}}</div>
+  {{/if}}
+  {{#if md-date}}
+    <span class="mkws-field-date">{{md-date}}</span>
+  {{/if}}
+</div>
 {{#if renderedDetails}}
   {{{renderedDetails}}}
 {{/if}}
diff --git a/test/spec/mkws-pazpar2.js b/test/spec/mkws-pazpar2.js
index ccc161e..2cfe93d 100644
--- a/test/spec/mkws-pazpar2.js
+++ b/test/spec/mkws-pazpar2.js
@@ -707,7 +707,7 @@ describe("Check SortBy options", function () {
             $("div.mkws-records").unbind("DOMNodeInserted DOMNodeRemoved propertychange");
             debug("unbind by sort");
 
-            var records = $("div.mkws-records > div.mkws-summary > a");
+            var records = $("div.mkws-records > div.mkws-summary");
             debug("Sort by got now " + records.length + " records");
             expect(records.length).toBe(per_page_number);
         });
@@ -740,7 +740,7 @@ describe("Check async widget discovery", function () {
       var numInput = $("div.mkws-search input").length;
       debug("Input elements present: " + numInput);
       expect(numInput).toBe(4);
-      var numRec = $("div.mkws-records > div.mkws-summary > a").length;
+      var numRec = $("div.mkws-records > div.mkws-summary").length;
       debug("Records should still be present. There are: " + numRec);
       expect(numRec).toBeGreaterThan(0);
     });