Store and publish annotations on the web, as described in the Web Annotation Discovery proposal.

web-annotation-discovery-se.../views/ user.hbs
51 lines
1.8 KiB

  1. <p class='small' style='margin-bottom: 3em;'>
  2. <a class='plainlink' href='..'>← Back to all users</a>
  3. </p>
  4. <h1>Annotation collections of {{name}}</h1>
  5. <details class="infobox">
  6. <summary>
  7. How to use/create an annotation collection
  8. </summary>
  9. <h2>Subscribe to a collection</h2>
  10. <p>With an annotation-capable browser (extension), you can view annotations from the collections below while you visit the pages they target.</p>
  11. <p>Each collection is an annotation ‘feed’: Choose a collection below, and your browser should give you the option to import/subscribe to this collection, and then update it periodically.</p>
  12. <h2>Create a collection</h2>
  13. <p>
  14. If you are {{name}}, you can add and edit annotations from your annotation-capable browser.
  15. </p>
  16. <p>
  17. Create a collection below. Keep your password at hand (perhaps your browser has remembered it for you).
  18. </p>
  19. <form method="POST">
  20. <div>
  21. <input required name='label' placeholder='Name of collection' oninput="generateSlug(event)" style="font-size: 1em;"/>
  22. <button style="font-size: large;">Create</button>
  23. </div>
  24. <p style="margin-top: .2em;">
  25. /{{name}}/<input required name='name' placeholder='' style="color: grey; background: none; border: none; font-size: 1em;" />
  26. </p>
  27. </form>
  28. <script>
  29. function generateSlug(event) {
  30. const slug =\s+/g, '_');
  31. = slug;
  32. }
  33. </script>
  34. <h2>Start creating annotations</h2>
  35. <p>
  36. Open a collection, then ‘subscribe’ to it in your annotation-enabled browser. You can then choose to create new annotations in this collection.
  37. </p>
  38. </details>
  39. {{#each collections}}
  40. <p>
  41. <a href='{{name}}/'>{{#if label}}{{label}}{{else}}{{name}}{{/if}}</a>
  42. </p>
  43. {{/each}}