[annotator-dev] Plugin Methods

Thu Jun 12 06:41:37 UTC 2014

I have deal with my own annotation server (with a little different format)
and I implemented a plugin on top of Store Plugin. I used Store Plugin,
overwriting where needed. Here's the code of MyAnnotatorPlugin.js:

var queryForAnnotations = function(annotator) {
  var user = getCurrentUser();
var dynamicSearchURL = someFunction(annotator, user);
 $.ajax({
type : 'GET',
contentType : 'application/json',
 dataType : "json",
url : dynamicSearchURL,
success : function(data) {
 var annotations = myFormatToAnnotator(data);
annotator.loadAnnotations(annotations);
 },
error : function(jqXHR, textStatus, errorThrown) {
console.log("error on retrieving annotations")
 }
});
};

Annotator.Plugin.MyAnnotatorPlugin = function (element) {
  return {
    pluginInit: function () {
 queryForAnnotations(this.annotator);
 this.annotator
.subscribe("annotationDeleted", function (annotation) {
  $.ajax({
 type : 'DELETE',
contentType : 'application/json',
dataType : "json",
 url : myDeleteURL + annotation.id,
success : function(data) {
 console.log("annotation deleted");
},
error : function(jqXHR, textStatus, errorThrown) {
 console.log("error on deleting annotation");
}
});
 });
 this.annotator
.subscribe("annotationUpdated", function (annotation) {
  var data = annotationToMyDataFormat(annotation);
  $.ajax({
type : 'PUT',
 contentType : 'application/json',
dataType : "json",
data : JSON.stringify(data),
 url : myUpdateURL,
success : function(data) {
console.log("annotation updated");
 },
error : function(jqXHR, textStatus, errorThrown) {
console.log("error on updating annotation");
 }
});
});
   },
  destroy: function () {
  }
  }
};

When I need to load annotator on my page the code is as follows:

var annotator = new Annotator(text);
text.data('annotator', annotator);

annotator.addPlugin('MyAnnotatorPlugin');

annotator.addPlugin('Store', {
    urls : {
        create : myCreateURL,
        read : "",
        update : myUpdateURL,
        destroy : myDeleteURL,
        search : 'mock/emptyList.json'  // this is a placeholder
    },
    prefix : '',
    loadFromSearch : {
        'begin' : 0,
        'end' : 0
    }

});

I know it's a bit custom spaghetti code, but I hope it can help you
starting your task.
Comments are appreciated.

Riccardo

2014-06-12 7:47 GMT+02:00 Prateek Narendra <prateek.narendra at ieee.org>:

> I see a lot of Annotator events such as
> 1 )beforeAnnotationCreated(annotation),
> 2) annotationCreated(annotation),
>
> I actually wanted some method like this which is called when
> annotations are just about to load (in simple terms, I want to send an
> AJAX request on my own to get annotations by sending a POST instead of
> the GET (i cant have query string parameters in my project))
>
> I'm really a n00b in JavaScript and just started working with it 2 weeks
> back
> _______________________________________________
> annotator-dev mailing list
> annotator-dev at lists.okfn.org
> https://lists.okfn.org/mailman/listinfo/annotator-dev
> Unsubscribe: https://lists.okfn.org/mailman/options/annotator-dev
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.okfn.org/pipermail/annotator-dev/attachments/20140612/b6b8fb5e/attachment-0004.html>