widget be subclassed to store the generated widget
definitions in more useful places.
+`button` The search button. Usually generated a `search`
+ widget.
+
`categories` Obtains from the Service Proxy a list of the target
categories associated with the library in use, and
displays them in a drop-down list. When a category
be changed by overriding the `done` template using
`<script class="mkws-template-done" type="text/x-handlebars-template">`.
-`facet` x
-
-`facets` x
-
-`google-image` x
-
-`images` x
-
-`lang` x
-
-`log` x
-
-`lolcat` x
-
-`motd-container` x
-
-`motd` x
-
-`navi` x
-
-`pager` x
-
-`per-page` x
-
-`progress` x
-
-`query` x
-
-`ranking` x
-
-`record` x
-
-`records` x
-
-`reference` x
-
-`results` x
-
-`search-form` x
-
-`search` x
-
-`sort` x
-
-`stat` x
-
-`switch` x
+`facet` A facet that displays the frequency with which a set
+ of terms occur within a specific field. The specific
+ field whose contents are analysed must be specified
+ by the widget's `facet` configuration item, which
+ may conveniently be done by means of the
+ `data-mkws-facet` attribute on the HTML
+ element. The supported facets are "subject",
+ "author" and "xtargets" -- the latter a special case
+ which treats the target providing a record as a
+ facet. Most often, `facet` widgets are generated
+ by a `facets` widget, which knows which facets are
+ required, but they can also be placed individually.
+
+`facets` An area that contains a "Facets" heading and several
+ `facet` widgets. The set of facet widgets generated
+ is specified by the `facets` configuration item,
+ which may be set globally or at the level of the
+ widget or the team. The value of this configuration
+ item is an array of zero or more strings, each
+ naming a facet.
+
+`google-image` A specialisation of the `images` widget which
+ defaults to the `Google_Images` target.
+
+`images` A specialisation of the `records` widget which
+ defaults to the `images` template. Unlike the default
+ summary template, this displays an image from the
+ URL specified by the `md-thumburl` field of each
+ record.
+
+`lang` Provides a selection between the supported set of
+ languages (which defaults to English, German and
+ Danish, but can be configured by the `lang`
+ configuration item, whose value is an array of
+ two-letter language codes).
+
+`log` Initially empty, this widget accumulates a log of
+ messages generated by the widget set, similar to
+ those emitted on the JavaScript console.
+
+`lolcat` A specialisation of the `google-image` widget which
+ defaults to the search-term "kitteh" and
+ auto-executes.
+
+`motd-container` An empty container which the `motd` widget, if any,
+ is moved into for initial display. Usually generated
+ as part of the `results` widget.
+
+`motd` May be provided, containing content to appear in the
+ area where records will later appear. It is moved
+ into this area (the `motd-container` widget) and
+ initially displayed; then hidden when the first
+ search is run. It can be used to provide a "message
+ of the day".
+
+`navi` Shows a list of the facets that have been selected,
+ and allows them to be deselected.
+
+`pager` Shows a list of the available pages of results, and
+ allows the user to navigate to a selected page.
+
+`per-page` Provides a dropdown allowing the user to choose how
+ many records should appear on each page. The
+ available set of page-sizes can be set as the
+ `perpage_options` configuration item, whose value is
+ an array of integers. The initial selected value can
+ be set by the `perpage_default` configuration item.
+
+`progress` Shows a progress bar which indicates how many of the
+ targets have responded to the search.
+
+`query` The input area for a query. Usually generated a `search`
+ widget.
-`targets` x
+`ranking` The result-ranking area, consisting of a `sort`
+ widget and a `per-page` widget. These may instead
+ be specified separately if preferred.
+
+`record` A detailed display of a single record, usually
+ appearing when the user clicks on a summary
+ record. This is generated by the `records` widget.
+
+`records` The area in which summary records appear. (Clicking
+ on a summary record make it pop up as a detailed
+ record.)
+
+`reference` A short summary about a subject specified by the
+ `autosearch` configuration item. This is created by
+ drawing a picture and a paragraph of text from
+ Wikipedia. To work correctly, this widget must be
+ used in a library that provides the
+ `wikimedia_wikipedia_single_result` target.
+
+`results` A large compound widget used to provide the most
+ important results-oriented widgets in a pre-packaged
+ framework: `facets`, `ranking`, `pager`, `navi` and
+ `records`.
+
+`search-form` The search form, containing the query area and the
+ button. Usually generated a `search` widget.
+
+`search` The search box, consisting of a form containing a
+ query area and a button.
+
+`sort` Provides a dropdown allowing the user to choose how
+ the displayed records should be sorted. The
+ available set of sort criteria can be set as the
+ `sort_options` configuration item, whose value is
+ an array of two-element arrays. The first item of
+ each sub-array is a pazpar2 sort-expression such as
+ `data:0` and the second is a human-readable label
+ such as `newest`. The initial selected
+ value can be set by the `sort_default` configuration
+ item.
+
+`stat` A summary line stating how many targets remain
+ active, how many records have been found, and how
+ many of them have been retrieved for display. For
+ most purposes, the `progress` widget may be
+ preferable.
+
+`summary` A short record, included in the list shown when a
+ search is run. When clicked, this generally pops up
+ a detailed `record` widget. This widget is generated
+ by the toolkit in response to search results.
+
+`switch` A pair of buttons allowing the user to switch
+ between viewing the search results (the usual case)
+ or the target list.
+
+`targets` A list of all targets in the present library,
+ showing their ID, the number of records they have
+ found for the current search, any diagnostics they
+ have returned, the number of records that have been
+ returned for display, and the connection state.
----
----
Element Type Default Description
-------- ----- --------- ------------
-log_level int 1 Level of debugging output to emit. 0 = none, 1 = messages, 2 = messages with
- datestamps, 3 = messages with datestamps and stack-traces.
+auth_hostname
+
+autosearch
+
+facet
+
+facet_caption_*
+
+facet_max_*
facets array *Note 1* Ordered list of names of facets to display. Supported facet names are
`xtargets`, `subject` and `author`.
`language_` followed by the code of the language. See the separate section below for
details.
+limit
+
+log_level int 1 Level of debugging output to emit. 0 = none, 1 = messages, 2 = messages with
+ datestamps, 3 = messages with datestamps and stack-traces.
+
+maxrecs
+
+paragraphs
+
pazpar2_url string *Note 2* The URL used to access the metasearch middleware. This service must be configured to
provide search results, facets, etc. It may be either unmediated or Pazpar2 the
MasterKey Service Proxy, which mediates access to an underlying Pazpar2 instance. In
the latter case, `service_proxy_auth` must be provided.
+perpage
+
perpage_default string 20 The initial value for the number of records to show on each page.
perpage_options array *Note 3* A list of candidate page sizes. Users can choose between these to determine how many
records are displayed on each page of results.
+pp2_hostname
+
+pp2_path
+
+query
+
query_width int 50 The width of the query box, in characters.
responsive_design_width int If defined, then the facets display moves between two locations as the screen-width
varies, as described above. The specified number is the threshhold width, in pixels,
at which the facets move between their two locations.
+scan_all_nodes
+
+sentences
+
service_proxy_auth url *Note 4* A URL which, when `use_service_proxy` is true, is fetched once at the beginning of each
session to authenticate the user and establish a session that encompasses a defined set
of targets to search in.
show_switch bool true Indicates whether or not to display the switch menu, for switching between showing
retrieved records and target information.
+sort
+
sort_default string relevance The label of the default sort criterion to use. Must be one of those in the `sort`
array.
the first element of each sublist is a pazpar2 sort-expression such as `data:0` and
the second is a human-readable label such as `newest`.
+sp_auth_credentials
+
+sp_auth_path
+
+sp_auth_query
+
+target
+
+targetfilter
+
+targets
+
+template
+
+text
+
use_service_proxy bool true If true, then a Service Proxy is used to deliver searching services rather than raw
Pazpar2.
----
--- /dev/null
+/* 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-facets {
+ 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-facets {
+ margin-right: 30px;
+ }
+}
+@media screen and (max-width: 900px) {
+ .mkws-pager {
+ margin: 0;
+ }
+ .mkws-pager > div {
+ margin-top: 10px;
+ }
+ .main {
+ flex-wrap: wrap;
+ }
+ .mkws-facets {
+ 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
+}
+
--- /dev/null
+<!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> -->
+ <script type="text/javascript" src="//mkws.local/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-facets"></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>
+
+
}
.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;
}
.mkws-google-image img {
max-width: 100%;
- max-height: 200px;
+ max-height: 180px;
padding: 1em 0 .5em;
}
.list-group-item {
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;
-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;
+ }
+}
<!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>
+
+ <!-- Include Bootstrap. It needs jQuery. -->
<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">
<!-- <link href="//maxcdn.bootstrapcdn.com/bootswatch/3.1.1/amelia/bootstrap.min.css" rel="stylesheet"> -->
<!-- <link href="//maxcdn.bootstrapcdn.com/bootswatch/3.1.1/united/bootstrap.min.css" rel="stylesheet"> -->
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
+
+ <!-- Before including MKWS we can define a configuration object. -->
<script type="text/javascript">
var mkws_config = { sp_auth_credentials: "credo/emu" };
</script>
+
+ <!-- mkws-complete.js includes jQuery and Handlebars. It will co-exist with
+ another copy of jQuery as we have here but you can also use mkws.js
+ if you have included both separately -->
<script type="text/javascript" src="//mkws.indexdata.com/mkws-complete.js"></script>
- <!-- <script type="text/javascript" src="//mkws.local/mkws-complete.js"></script> -->
<link rel="stylesheet" type="text/css" href="topic.css">
+
+ <!-- Handlebars templates can make calls to Javascript functions you
+ define this way. -->
<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>
+
+ <!-- Here we create replacement templates that incorporate bootstrap.
+ The prefix "mkws-template-" makes them available to MKWS -->
<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}}
{{/each}}
</script>
</head>
+
<body>
- <div class='page-header container' autosearch='!param!q'>
+ <div class='page-header container'>
<div class="row">
- <!-- reference entry -->
- <div class="jumbotron panel col-md-8">
+ <!-- mkws-reference - A widget that fetches a Wikipedia entry -->
+ <div class="jumbotron panel col-md-8 col-sm-7">
+ <!-- Note the "autosearch" attribute. It indicates where to get
+ the search term from, in this case a URL parameter. A URL
+ path component or Javascript variable are also possible. -->
<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">
+ <!-- Related topics -->
+ <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>
+ <!-- This mkws-facet widget is particularly illustrative:
+ * the data-mkws-facet attribute specifies a particular facet
+ * data-mkws-config allows configuration override; in this case
+ we employ one of the templates we defined above.
+ * having the class mkws-team-main groups this widget with others
+ on the same team. The mkws-records widget at the bottom of
+ the page shares the same team and is thus working from the same
+ result set. -->
<ul class="panel-body list-group mkws-facet mkws-team-main"
autosearch="!param!q"
data-mkws-facet="subject"
<div class="panel-heading title">
<h3 class="panel-title">Images</h3>
</div>
+ <!-- The "target" config key narrows the search to a list of targets -->
<div class="panel-body mkws-google-image" autosearch="!param!q"
data-mkws-config='{ "maxrecs": 4, "template": "topic-image", "target": "google_images_js" }'></div>
</div></div>
<!-- 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>
+ <!-- The "targetfilter" narrows the search to targets matching some criteria -->
<div class="panel-body mkws-records mkws-team-news" autosearch="!param!q"
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>
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>
</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>
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();
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}}
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>
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.[0]}}"/>
+ </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}}
apache-start:
bin/apache-template-update
- ${APACHE_HTTPD} -f `pwd`/${TMP_DIR}/jasmine-dev-${APACHE_PORT}.conf
+ umask 002; ${APACHE_HTTPD} -f `pwd`/${TMP_DIR}/jasmine-dev-${APACHE_PORT}.conf
APACHE_PID_FILE=${TMP_DIR}/mkws-jasmine-${APACHE_PORT}.pid
apache-stop:
function title_list(prefix) {
var list = [];
- var terms = $("div.mkws-records > div.mkws-summary > a");
+ var terms = $("div.mkws-records > div.mkws-summary");
for (var i = 0; i < terms.length; i++) {
var term = $(terms[i]).text().trim();
list.push(term);
$("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);
});
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);
});
projects / mkws-moved-to-github.git / commitdiff