annotorious / annotorious-v1

Project has moved to http://github.com/annotorious/annotorious

Annotorious is dead - long live Annotorious!

I'm rebooting this project. The old version hasn't been maintained for years and is hopelessly outdated. I started a complete, modernized rewrite at https://github.com/recogito/annotorious

annotorious-v1's Issues

"Show all" option to show all popup bubbles

It would be nice to have a (JS API?) option to highlight all annotations on an image, showing popup bubbles for each one.

PS: this will be difficult to implement, since right now, there is only a single popup element that's being shared across all annotations on one image.

.setSelectionEnabled for specific items

Extend the setSelectionEnabled API method, so that selection can be en-/disabled for specific items, not just globally. E.g.

setSelectionEnabled(false, 'http://www.example.com/my-image.jpg');

OKFN Plugin: popup event behavior

The wrapper for the OKFN Annotator "viewer popup" needs an all-new strategy in order to work reliably. In particular, the viewer's own 'hide' event, as well as the start/clearViewerHideTimer methods should not be used.

ElasticSearch Plugin: restrict search to current document URL

The current ElasticSearchStorage plugin will download all annotations in the store. Obviously, this needs to be restricted to the annotations on the current document. The document URL is indexed, but due to ElasticSearch's automatic tokenization, I can't seem to get the required behavior using a standard

_search?query=context:[document URI]

query. Any hints welcome.

OKFN Plugin: MOUSE_OUT_OF_ANNOTATABLE_MEDIA event on edit

When editing an existing annotation, the MOUSE_OUT_OF_ANNOTATABLE_MEDIA fires. Shouldn't happen.

Prevent empty annotations

Don't allow the creation of annotations with no text. (Should display some sort of popup hint.)

Responsive layout

Annotatable images don't work in responsive layouts - investigate & fix!

OKFN Plugin: moving mouse between annotations doesn't update popup

Scenario: there are two annotations on an image. Moving the mouse over one of them will bring up the popup. If the mouse is moved (quickly) into the other annotation, the popup will stay. It will not change to the annotation currently under the mouse.

This behavior seems to be, in fact, the norm for Annotator in general. But for images, I find it rather strange. (And it doesn't happen inYuma standalone.)

Revise/refactor the yuma.okfn.ImagePlugin class

At the moment, there is one yuma.okfn.ImagePlugin class for each image in the page. Each one registers handlers for the OKFN Annotator lifecycle events (annotationCreated, onEdit, etc.) This also means that for N image, N handlers get called, and each handler needs to check the event object whether the event actually pertains to the image it is in charge of.

We need a cleaner solution to this, so that only one handler get registered with the OKFN Annotator, and then delegates the required actions to a lighter manager object in charge of the image the event concerns.

Add a way to force annotation layer fadeout behavior

Currently, the annotation layer will fade out if the mouse is not over the image. This is not always desirable. I.e. in a "guided tour" style application, where annotations are highlighted programmatically (and the user is a "watcher" rather than an annotator), the annotation layer should stay faded-in all the time.

deps.js not found (404) with generated okfn_plugin

I try solved this by defining in okfn_plugin.json:

"define": {
   ..
   "goog.global.CLOSURE_NO_DEPS": true
   }

but doesn't worked.

P.S: Thank you for all

Make links in annotations clickable

In yuma.js, links written in annotations were automatically made clickable. Add this feature to Annotorious!

Loading annotations for multiple images on same page, from remote server.

Hi,
Thank you very much for your hard work. I am using annotorious, to train Tesseract OCR on my regional languages. I am from India.

I have a problem though. I can annotate multiple images from the same page just fine. But when I try to load previous annotations from a server, a weird thing happens.

Whichever image is in front of the screen, only that image loads the annotations.

E.g.

< script language="javascript">anno.addPlugin('ElasticSearch', { base_url: '/annot' }); < /script>

---

| Image1.jpg |

---

---

| Image2.jpg |

---

Annotorious only does either

http://localhost/annot?oldnotes=http://localhost/imgs/image1.jpg
OR
http://localhost/annot?oldnotes=http://localhost/imgs/image2.jpg

depending on which image is on the screen.

How can I make it load the info for both the pages? Maybe forcefully/separately for each image?

I am using annotorious standalone v 0.3.

Thank you.

• Amrutraj Gore

Polygon visual style

The current drawing style for polygons isn't consistent with rectangles. (Rectangles: outer black line + inner white line, polys: thin white line on top of a thicker black line).

This needs to be improved (even though it means I'll code that performs inward polygon offsetting! (Cf. this thread.)

Google Drive as backend

Recently the google drive sdk added annotations. It would be nice to be able to use this as the backend, for storing annotations. https://developers.google.com/drive/v2/reference/comments/get

ElasticSearch Plugin: Internet Explorer

The ElasticSearch plugin doesn't play nice with Internet Explorer yet (surprise). Might be something CORS related.

Annotating resized images?

Currently, YUMA will not recognize/properly handle annotation on images which are rendered on the screen in a resolution that is different from their original (using CSS, HTML width/height attributes). How about supporting this use case?

OKFN Plugin: click on the image stops the plugin

A single click on the annotatable image currently stops the plugin from working...

Support relative coordinates

In addition to unit:'pixel' also support unit:'fraction' (compare Digilib format). unit:'fraction' should be default. This is rather urgent to get the Wordpress plugin working correctly.

Touch Support

Hello All,
Is annotorious is compatible to touch device(IPAD)?

OKFN Plugin: MOUSE_OUT_OF_ANNOTATABLE_MEDIA event fires incorrectly

In the OKFN plugin, the MOUSE_OUT_OF_ANNOTATABLE_MEDIA fires when the editor opens (and the mouse moves over it). Shouldn't happen.

OKFN Plugin: editor orientation when editing existing annotation

When editing an existing annotation, the orientation of the Annotator Editor is not correctly forced to "arrow-up".

'Undo'

It would be nice to have an 'Undo' button, at least for the most recent operation. Primary use case would be to undo an accidential 'delete annotation' operation. (Submitted by @Joorb.)

OKFN Plugin: Initialization failure (primarily Chrome?)

Sometimes the OKFN plugin fails to initialize properly. This can be seen easily, when the layout of the test page is completely messed up. Seems to happen more often in Chrome, but I could also observe it in Firefox occasionally.

My suspicion is that this is due to a race condition when both the OKFN Annotator and Yuma are manipulating the page's DOM at the same time. Could it help to move the instantiation code (now directly in YumaImagePlugin.prototype.pluginInit) into an onload handler?

Click on an annotation shape breaks Annotorious

Clicking on an annotation currently generates a 'SELECTION_STARTED', 'SELECTION_COMPLETED' event sequence, with a 0x0 pixel selection, which may cause Annotorious to get stuck. Should be easy to fix though.

Show Annotations/Hide Annotations

API feature to show/hide the annotation view layer.

OKFN Plugin: editor placement and layout

Currently, we force the Editor to be in "arrow-on-top" alignment by first placing it at (0, 0) and then moving it to it's required position underneath the selection box.

One issue is that (0, 0) is measured relative to the page, not the viewport. Therefore, the page will scroll to the top when annotating; and the placement of the editor will be too high (unless the page was scrolled to the top).

OKFN Plugin: viewport-sensitive placement of popup/editor

To get things up and running quickly, we kicked out auto-orientation of the popup and editor bubbles. Both are currently forced into a 'arrow-at-the-top' orientation. It would be nice to have adaptive orientation back, based on available space in the viewport.

Popup hidden if overlapping a second annotatable image

From Peter: "if [there are] more annotated images on a page, and having an extremely large annotation on the first one (a lot of text), the popup does not overlap but disappears under the second image"

Support for replies

Does annotorius/annotator support replies to an annotation?

Yuma previously did: http://yuma-js.github.com/demos/image-with-replies

I couldn't find a reference to it anywhere in the documentation or source code.

anno.enableSelection()

Add a method (to the global anno object) that en- or disables the selection tool, so that only existing annotations are shown, but no new annotations can be created. Use either something like

anno.setSelectionEnabled(true | false);

or

anno.enableSelection();
anno.disableSelection();

Get rid of closure_uid_* field in annotation objects

The image viewer uses goog.getUid to generate unique IDs for annotations (subsequently used for hashmap-like access). See e.g.:

https://github.com/annotorious/annotorious/blob/master/src/modules/image/image_viewer.js#L111

Unfortunately, the goog.getUid implementation keeps track of this ID by appending a closure_uid* field to the annotation object (see base.js, line 111). Certainly not a showstopper, but it would be better to not 'contaminate' the annotation objects with extra fields that are used internally only.

We need to find an alternative solution (probably based on a structs.Map?)

Annotation layers initially in 'hover' state

The annotation view layers are initially set to high-opacity state. Shouldn't be. Instead they should be in low opacity until the mouse moves over them.

Hidden Popup blocks selection

The annotation popup blocks the selection layer's mousemove events, even when its hidden. Could probably be resolved with either a z-Index issue or by CSS 'hidden' (currently the popup is only set to opacity=0 to enable smooth fade effect).

HTML5 data-original attribute

If present, use the data-original attribute for the image URL/identifier rather than image.src.

Clean up popup event lifecycle

Need to introduce a 'beforePopupHidden' event. Right now things are a little messy

Proper handling of multiple (resized) instances of the same image on one page

From Peter: "if having two instances of an annotated image (e.g. full size and a resized version) on a page, annotations will only be added to the second image."

Editing existing annotations

Make existing annotations editable (not just deletable).

Popup stays on screen when mouse leaves annotation area via popup

When the mouse leaves the annotatable area via a popup, the popup remains on the screen.

Polygon selection: popup placement

The current polygon selection implementation places the popup underneath the polygon bounding box. This doesn't look nice in most cases - improve.

OKFN Plugin: lazy loading

Yuma Standalone lazy loads the annotation layer onto the images. (I.e. drawing canvas is only added once the image scrolls into view.) The OKFN plugin version currently doesn't do this. Should be easy to add, though.

Refactoring of mouseover popup

The way 'Yuma Standalone' vs. 'Yuma Plugin' handle the mouseover text bubble is different, which makes things unnecessarily complicated. We need to align this. Suggested change:

• adopt similar startHideTimer/clearHideTimer approach
• hand the appropriate popup (factory) class to the viewer class on instantiation (ie. either the OKFN wrapper or the standalone popup, depending on the mode of operation)

Switch between overlapping annotations

It is possible that two or more small annotations "hide" a large one => the large one is not accessable.
So providing the possibility to switch between annotations (e.g. by pressing a certain key) would be great.

Handle hyperlinked images

Hyperlinked images are currently not treated correctly. Find a solution, e.g.: remove Hyperlink from image and instead add a clickable 'anchor' icon.

CSS/HTML width and height properties not handled correctly?

From Robin (rizzoma.com): "[...] when image has width and height set and afterwards i make it annotatable then i also had to adjust canvas layers sizes by hand.. is this just not supported to have image with different height/width than original size or is it a bug? :)"

A better name?

We need a better name for our image annotation tool!!!

I'm thinking about sticking to desert names for releases :-) But something catchy is badly needed for the 'product'. Suggestions? :-)

ElasticSearch Plugin: realtime behavior not robust

The realtime behavior of the ElasticSearch plugin needs an overhaul. In particular delete/add need to work more reliably

Make JS API available in the OKFN Annotator version

At the moment, the Annotorious JavaScript (and Plugin) API is only available in the standalone version. Technically, it should be possible to change the OKFN Annotator plugin version, so that it also supports the JavaScript API.

Touch support: eliminate need for 2 <canvas> elements

Currently, display of existing annotations ('viewing') and creation of new ones ('editing') happens on two different HTML5 elements. That causes problems with touch for the following reason:

• In the present setup, a 'mousedown' listener on the view canvas un-hides the editing
  canvas. Mousemove listeners on the editing canvas perform the actual drawing of the
  selection tool (box, poly).#
• In a touch environment, the event target of the 'move' event is always the element
  that received the initating 'touchstart' event. Since the start happend on the viewing
  canvas, the move event never reaches the editing canvas!

Question/favor related to the documentation on the API

Hi,

Firstoff I would like to say that I really like and apreciate the work you guys do.

My programming skills aren't that advanced, so I was wondering if you could update the documentation on the Annotation Javascript API.

I'm working on a custom implementation of the script, but so far I've only succeded in creating an annotation after clicking on a button, however removing it with a remove button or returning the annotation information still remains a mistery to me.

I would really apreciate it, if you could give some more explanation about these functions or maybe a demo in which these functions are demonstrated