Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/albertjuhe/annotator_view
Plug in to view annotations in a right panel.
https://github.com/albertjuhe/annotator_view
Last synced: 5 days ago
JSON representation
Plug in to view annotations in a right panel.
- Host: GitHub
- URL: https://github.com/albertjuhe/annotator_view
- Owner: albertjuhe
- License: other
- Created: 2014-03-07T11:30:20.000Z (over 10 years ago)
- Default Branch: master
- Last Pushed: 2022-01-20T17:45:29.000Z (almost 3 years ago)
- Last Synced: 2024-08-01T12:35:56.388Z (3 months ago)
- Language: JavaScript
- Size: 1.04 MB
- Stars: 25
- Watchers: 4
- Forks: 13
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- License: license.rst
Awesome Lists containing this project
- awesome-starred - albertjuhe/annotator_view - Plug in to view annotations in a right panel. (others)
README
Margin Viewer for Annotator
==================
##Margin viewer Annotator Plugin
view_annotator.js is a plugin for Annotator to view the current annotations in a panel in the right side.
##Installation
To use the tool you need to install the [Annotator plugin](https://github.com/okfn/annotator/) to annotate text.
```html
jQuery(function ($) {
$.i18n.load(i18n_dict);
var annotator = $('body').annotator().annotator().data('annotator');
var propietary = 'demoUser';
annotator.addPlugin('Permissions', {
user: propietary,
permissions: {
'read': [propietary],
'update': [propietary],
'delete': [propietary],
'admin': [propietary]
},
showViewPermissionsCheckbox: true,
showEditPermissionsCheckbox: false
});
$('body').annotator().annotator('addPlugin', 'RichEditor');
$('body').annotator().annotator('addPlugin', 'Categories',{
errata:'annotator-hl-errata',
destacat:'annotator-hl-destacat',
subratllat:'annotator-hl-subratllat' }
);
$('body').annotator().annotator('addPlugin', 'AnnotatorViewer');
//Annotation scroll
$('#anotacions-uoc-panel').slimscroll({height: '100%'});
});
```
##Usage
The annotations that you create are displayed in the panel. You can delete an anotation, you can acces at the point of text that has been anotated, open an annotation, close an annotation, toggle the panel, scroll the panel if there are several annotations and a little label where you can view how many annotations are currently.
You can filters annotations: My annotations and shared annotations.
#Release 1.10
- Edit text annotation in the panel.
#Release 1.12
- Edit text annotation panel with tinymce
##Development
The view annoator plugin, use the property categorize, to change the annotation color category (default value highligth, defined in the css), and an order property to sort the annotations in the panel.
Each annotation in the right panel needs a unique Id, annotator when use a back end, a unique Id is assigned to each annotation after creation, but in the Viewer panel offline I don have this Id, for this reason we generate the unique Id with a function uniqueId() in the plugin.
Experimenting with a Full Text Search using lunr.js, new plug-in called searh.js that uses this library with the panel viewer to serach inside the annotations.
##Offline Demo
- Demo in demo/anotacions.html
- Demo in demo_tinymce/annotation.html
- Demo in demo_search/annotations.html
##Online Demo
Complete functional demo with MySQL Backend and developed in nodejs
[Demo Frankenstein](http://ec2-35-164-12-68.us-west-2.compute.amazonaws.com:3060/annotation/mary/demo.html) with [https://github.com/albertjuhe/annotator_nodejs_store] (https://github.com/albertjuhe/annotator_nodejs_store)
The panel in this demo is little different, in the red square you can see How many people is reading the document.