AddAnnotation not working when using data-original

[carlos-sarmiento]

When using the 'data-original' attribute to identify an image, the method anno.AddAnnotation doesn't work (aka no new annotation is added).

Here is a repro on JSFiddle http://jsfiddle.net/bz6fLa5a/3/

[rsimon]

Hi!

Thanks for setting up the JSFiddle. Hm - indeed it seems this only works if the data-original contains a URI(-like) identifier. If you just use http://id-of-image for the attribute, rather than id-of-image it works. That, of course, is kindof a stupid constraint - don't know how that got in. I'll see to get a fix for this in as soon as possible.

Cheers, R

[carlos-sarmiento]

I downloaded the code, eliminated line 112 in annotorious.js, recompiled and now the code works.

Line 112 was

annotation.src = annotorious.dom.toAbsoluteURL(annotation.src);

I'm not comfortable making a pull request because I'm not sure if eliminating the line could cause side-effects but for my test, it worked

[rsimon]

That won't work across all cases. But at least I can now see what the issue is :-) (Annotorious starts treating the data-original property as a relative URL, which messes it up.) I'll see that I take care of this bug soon.

Cheers, R

[kolier]

I suggest add a direct 'url' support.

annotorious.Annotorious.prototype.addAnnotation = function(annotation, opt_replace) {
  // Support 'url' property to do 'data-origional' item a favor.
  var url;
  if (goog.isDefAndNotNull(annotation.url)) {
    url = annotation.url;
    annotation.src = url;
  }
  else {
    annotation.src = annotorious.dom.toAbsoluteURL(annotation.src);
    url = annotation.src;
  }
  var module = this._getModuleForItemSrc(url);
  if (module)
    module.addAnnotation(annotation, opt_replace);
}

[ravishivt]

This also is a problem for Data URI sourced images. We should not be converting these src's to absolute either, src="data:image/gif;base64,R0lGODlhEA(...)".

@kolier's suggestion would fix this but another solution that just fixes Data URI would be:

annotorious.dom.toAbsoluteURL = function(url) {
  if (url.indexOf('://') > 0 || url.indexOf('data:') === 0) {  // ADDED SECOND CONDITION TO SKIP DATA URIs.
    return url;
  } else {
        var link = document.createElement('a');
    link.href = url;
    return link.protocol + '//' + link.host + link.pathname;
  }
}

[bgth]

Is it possible to include the fix by @ravishivt into the main code? This made sure addAnnotation works without the data-original tag. All else works fine..