www/demo/index.html

<!doctype html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
    <title>annotator-store-lite front-end demo</title>
    <link rel="stylesheet" href="bower_components/annotator/annotator.min.css" type="text/css"/>
  </head>

  <body>
    <h1>Lorem ipsum</h1>

    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>

    <h1>Fortune cmd quotes</h1>

    <ul>
      <li>Cerebus:	I'd love to lick apricot brandy out of your navel.
Jaka:		Look, Cerebus-- Jaka has to tell you ... something
Cerebus:	If Cerebus had a navel, would you lick apricot brandy out of it?
Jaka:		Ugh!
Cerebus:	You don't like apricot brandy?
		-- Cerebus #6, "The Secret"
</li>

      <li>One friend in a lifetime is much; two are many; three are hardly possible.
Friendship needs a certain parallelism of life, a community of thought,
a rivalry of aim.
		-- Henry Brook Adams
</li>

      <li>QOTD: All I want is a little more than I'll ever get.</li>

      <li>Conceit causes more conversation than wit. -- LaRouchefoucauld </li>

      <li>This file will self-destruct in five minutes. </li>

      <li>Please ignore previous fortune.</li>

      <li>Those who in quarrels interpose, must often wipe a bloody nose.</li>

      <li>Blast medicine anyway!  We've learned to tie into every organ in the
human body but one.  The brain!  The brain is what life is all about.
		-- McCoy, "The Menagerie", stardate 3012.4
</li>

      <li>For every problem there is one solution which is simple, neat, and wrong.
-- H. L. Mencken
</li>
    </ul>

    <h1>Talk is cheap; show me the cats</h1>

    <img src="http://lorempixel.com/g/101/100/cats"/>
    <img src="http://lorempixel.com/g/99/100/cats"/>
    <img src="http://lorempixel.com/g/103/100/cats"/>
    <img src="http://lorempixel.com/g/98/100/cats"/>

    <script src="bower_components/jquery/jquery.min.js"></script>
    <script src="bower_components/annotator/annotator.min.js"></script>
    <script src="bower_components/annotator/annotator.store.min.js"></script>

    <script>
      $(function () {
        'use strict';

        var content = $(document.body).annotator();

        content.annotator('addPlugin', 'Store', {
          prefix: '/annotator-store-lite',
          annotationData: {uri: window.location.href}
        });
      });
    </script>
  </body>
</html>