tools/htdocs/index.html

   1 <html>
   2   <head>
   3     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   4     <title>MKWS: the MasterKey Widget Set</title>
   5     <style type="text/css">
   6       body {
   7       font-family: Gill Sans, "Gillius ADF", Gillius, GilliusADF, Sans-Serif;
   8       }
   9       h1, h3 { font-weight: normal; color: #606060 }
  10       .pane { padding: 0em 1em; margin: 0.75em;
  11               border: 0.5em solid #eee;
  12               border-radius: 1em;
  13               background-image: url('images/mkws-logo-48x48-light.png');
  14               background-repeat: no-repeat;
  15               background-position: right top;
  16               background-color: #eee;
  17             }
  18       .nologo { background-image: none }
  19       pre { background: #ddd; padding: 0.5em; }
  20     </style>
  21   </head>
  22   <body>
  23     <img src="images/mkws-logo-300px.png" alt="MKWS logo" =
  24          style="float:right; margin: 1.5em"/>
  25     <h1>MKWS: the MasterKey Widget Set</h1>
  26
  27     <div class="pane nologo">
  28       <h2>Add metasearching to your web-site painlessly</h2>
  29       <p>
  30         The MasterKey Widget Set provides the easiest possible way to
  31         enhance an existing web-site with customised searching across
  32         multiple sources, ranking and merging the results.
  33       </p>
  34       <p>
  35         All you need to do is pull in our JavaScript and optional
  36         stylesheet, then add <tt>&lt;div&gt;</tt>s to your page that
  37         have special <tt>id</tt> attributes. We do the rest.
  38       </p>
  39     </div>
  40
  41     <div class="pane">
  42       <h2>A minimal example</h2>
  43       <p>
  44         Here is a completely functional (though ugly) MKWS-based
  45         searching application:
  46       </p>
  47       <blockquote>
  48         <pre>
  49 &lt;script type="text/javascript"
  50         src="http://mkws.indexdata.com/mkws-complete.js">&lt;/script>
  51 &lt;div id="mkwsSearch">&lt;/div>
  52 &lt;div id="mkwsResults">&lt;/div></pre>
  53       </blockquote>
  54       <p>
  55         That's it. A complete metasearching application. Everything
  56         else is refinement.
  57       </p>
  58     </div>
  59
  60     <div class="pane">
  61       <h2>Documentation</h2>
  62       <ul>
  63         <li>
  64           The <a href="README.html">README</a> -- mostly technical details.
  65         </li>
  66         <li>
  67           The <a href="whitepaper.html">whitepaper, including a
  68           reference section.</a>
  69           This is a much better introduction.
  70         </li>
  71       </ul>
  72     </div>
  73
  74     <div class="pane">
  75       <h2>Tools</h2>
  76       <p>
  77         Here are the files that this web-site provides:
  78       </p>
  79       <ul>
  80         <li>
  81           <a href="mkws.js">mkws.js</a>
  82           --
  83           JavaScript code that powers the MasterKey Widget Set
  84         </li>
  85         <li>
  86           <a href="pazpar2/js/pz2.js">pazpar2/js/pz2.js</a>
  87           --
  88           Low-level JavaScript library for access to the MasterKey web
  89           service.
  90         </li>
  91         <li>
  92           <a href="handlebars-v1.1.2.js">handlebars-v1.1.2.js</a>
  93           --
  94           A local copy of
  95           <a href="http://handlebarsjs.com/"
  96              >the Handlebars templating library</a>,
  97           since it doesn't like to be hotlinked.
  98         </li>
  99         <li>
 100           <a href="mkws-complete.js"
 101              >mkws-complete.js</a>
 102           --
 103           A single large JavaScript file containing everything needed for
 104           MKWS to work: the widget-set itself, the API library, and
 105           the prerequisites jQuery and Handlebars.
 106         </li>
 107         <li>
 108           <a href="mkws.css">mkws.css</a>
 109           --
 110           A stylesheet which styles only MasterKey widgets, and does not
 111           otherwise interfere with application-site's styles.
 112         </li>
 113       </ul>
 114       <p>
 115         (This domain also hosts two web-service endpoints that are used by
 116         running MKWS-based applications:
 117         <tt>/service-proxy-auth</tt>
 118         is used to authenticate new sessions and
 119         <code>/service-proxy/</code>
 120         is the main endpoint for searching and retrieval. But there is
 121         no need to use these directly: the widgets take care of that.)
 122         </li>
 123       </ul>
 124     </div>
 125
 126     <div class="pane">
 127       <h2>Examples using the widget-set</h2>
 128       <p>
 129         It's worth viewing the source of these to see how small they
 130         are and how various things are done.
 131       </p>
 132       <h3>Simple examples</h3>
 133       <ul>
 134         <li>
 135           A very simple application at
 136           <a href="http://example.indexdata.com/"
 137              >http://example.indexdata.com/</a>.
 138         </li>
 139         <li>
 140           <a href="http://example.indexdata.com/minimal.html"
 141              >The absolutely minimal application</a>
 142           listed above.
 143         </li>
 144         <li>
 145           <a href="http://example.indexdata.com/language.html"
 146              >A more detailed version</a>
 147           that contains a configuration structure instead of accepting
 148           the defaults. Includes a custom translation option to present
 149           the application in Arabic.
 150         </li>
 151         <li>
 152           <a href="http://example.indexdata.com/mobile.html"
 153              >A version suitable for mobile devices</a>,
 154           with a responsive design that moves components around
 155           depending on the screen size.
 156         </li>
 157       </ul>
 158
 159       <h3>Advanced examples</h3>
 160       <ul>
 161         <li>
 162           An application that
 163           <a href="http://example.indexdata.com/lowlevel.html"
 164              >uses lower-level MKWS components</a>
 165           rather than the all-in-one <tt>#mkwsResults</tt> division,
 166           allowing it to use a rather different layout.
 167         </li>
 168         <li>
 169           An application that specifies how to display brief and full records
 170           <a href="http://example.indexdata.com/templates.html"
 171              >using Handlebar templates</a>.
 172           (Read about
 173           <a href="http://handlebarsjs.com/"
 174              >the templating language</a>.)
 175         </li>
 176         <li>
 177           <a href="http://example.indexdata.com/localauth.html"
 178              >An application that uses a local authentication regime</a>,
 179           and the corresponding
 180           <a href="http://example.indexdata.com/apache-config.txt"
 181              >Apache2 configuration stanza</a>.
 182         </li>
 183         <li>
 184           The
 185           <a href="http://example.indexdata.com/jquery.html"
 186              >jQuery plugin</a>
 187           version, consisting of a single JavaScript statement.
 188         </li>
 189         <li>
 190           <a href="http://example.indexdata.com/popup.html"
 191              >A version that uses a jQuery popup</a>.
 192         </li>
 193       </ul>
 194
 195       <h3>Non-standard interfaces</h3>
 196       <ul>
 197         <li>
 198           <a href="http://example.indexdata.com/dict.html"
 199              >An application that uses MKWS to find dictionary
 200             definitions of words when you highlight them</a>.
 201         </li>
 202         <li>
 203           <a href="http://example.indexdata.com/auto.html"
 204              >An application that runs an automatic search on load</a>.
 205         </li>
 206         <li>
 207           An existing web-site,
 208           <a href="http://sagp.miketaylor.org.uk/"
 209              >The Self-Appointed Grammar Police</a>,
 210           which has been fitted with an MKWS searching widget.
 211           (See also the MKWS-widget customisations in
 212           <a href="http://sagp.miketaylor.org.uk/style.css"
 213              >that site's stylesheet</a>.)
 214         </li>
 215 <!--
 216         <li>
 217           Another existing web-site,
 218           <a href="http://zthes.z3950.org/"
 219              >The Zthes specifications</a>,
 220           which has been fitted with a popup MKWS search-box.
 221         </li>
 222 -->
 223       </ul>
 224     </div>
 225
 226     <div class="pane">
 227       <h2>Target selection</h2>
 228       <p>
 229         MKWS comes pre-configured to search in a set of a dozen or so
 230         open-access targets, as a proof of concept. But you'll want
 231         to use it to search your own selection of targets -- some open
 232         access, some subscription.
 233       </p>
 234       <p>
 235         We can set that up for you: email us on
 236         <a href="mailto:info@indexdata.com"
 237                        >info@indexdata.com</a>.
 238       </p>
 239     </div>
 240
 241     <p style="text-align: right; font-size: small">
 242       Copyright © 2013 IndexData ApS.
 243       <a href="http://indexdata.com"><code>http://indexdata.com</code></a>
 244     </p>
 245   </body>
 246 </html>