[annotator-dev] colored notes

Thu Dec 5 17:00:36 UTC 2013

I know there were a bunch of later responses regarding this, but I 
thought I'd chime in on my work.

First off, I had to make some modifications to the annotator core to 
allow the user to select a color for new layers. This involved changes 
to the "addField" method. I also had to add a hook in my annotator 
plugin to assign layers category classes (e.g. .category-one, 
.category-two).

After the user has selected the category, the jQuery plugins xColor and 
jQuery.Rule are used to adjust the background colors:

               var current_hex = '#FFFFFF';
	      var opacity = 0.4 / total_number_of_colored_highlights;
	      jQuery.each(unique_layers, function(key, value) {
	        var color_combine = jQuery.xcolor.opacity(current_hex, *some_hex_for_the_current_layer*, opacity);
	        current_hex = color_combine.getHex();
	      });
	      jQuery.rule(selector + ' { background-color: ' + current_hex + '; }').appendTo('#adhoc_stylesheet');

Essentially, this loops through all the applicable colors to a specific 
set of categories tied to a node (e.g. .category-one.category-two, 
.category-one, .category-two), and builds the hex by using 
jQuery.xcolors color combine method.

This is a lot more complex than just the code above, because the site 
has a lot more functionality built on top of the annotator plugin. I'm 
not planning on releasing this as a plugin for annotator, but the code 
will be / is open source. Now it lives in the annotator branch here: 
https://github.com/berkmancenter/h2o/tree/annotator

I'm not necessarily pointing to this as a solution, but rather to give 
an idea of the tools I used to combine colored highlights and mention 
that I did have to override the annotator core to accomplish this.

Steph

On 12/05/2013 03:43 AM, Riccardo Tasso wrote:
> What is the behaviour when, for example, a blue annotation is 
> overlayed on a yellow one? Is it possibile to sum their colors?
>
> Thanks,
>    Riccardo
>
>
> 2013/12/5 Ewald Zietsman <ewald at siyavula.com <mailto:ewald at siyavula.com>>
>
>     That plugin is one I wrote, but I changed the annotator core code
>     to make it work (I didn't know any coffee/javascript then), so it
>     is woefully outdated. It basically adds an extra input field on
>     the annotator widget that lets you select a 'type' and depending
>     on the type it saves a 'type' field into the annotation object
>     that goes to the database. Other than that you need a line or two
>     of css (and add a class to the annotation spans) to make the
>     colours work.
>
>
>     On Thu, Dec 5, 2013 at 12:43 AM, Riccardo Tasso
>     <riccardo.tasso at gmail.com <mailto:riccardo.tasso at gmail.com>> wrote:
>
>         I've found this plugin:
>         https://github.com/ezietsman/annotator/blob/master/src/plugin/categories.coffee
>
>         Do you think it can still be used, or maybe is it outdated?
>
>         Cheers,
>            Riccardo
>
>
>         2013/11/29 Riccardo Tasso <riccardo.tasso at gmail.com
>         <mailto:riccardo.tasso at gmail.com>>
>
>             Hi, I'd like to know if it's possibile, or maybe already
>             exists, a plugin to make the user choose a color during
>             the insertion of a note, such that also the highlighted
>             text respects this choice.
>
>             Cheers,
>                Riccardo
>
>
>
>         _______________________________________________
>         annotator-dev mailing list
>         annotator-dev at lists.okfn.org <mailto:annotator-dev at lists.okfn.org>
>         http://lists.okfn.org/mailman/listinfo/annotator-dev
>         Unsubscribe: http://lists.okfn.org/mailman/options/annotator-dev
>
>
>
>
>     -- 
>     *
>     **Ewald Zietsman**
>     *
>     *
>     Technical Coor**dinator*
>
>     Website: www.siyavula.com <http://www.siyavula.com/>
>     The Open Innovation Studio, 27 Buitenkant Street, Cape Town, 8001
>
>
>
>
> _______________________________________________
> annotator-dev mailing list
> annotator-dev at lists.okfn.org
> http://lists.okfn.org/mailman/listinfo/annotator-dev
> Unsubscribe: http://lists.okfn.org/mailman/options/annotator-dev

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.okfn.org/pipermail/annotator-dev/attachments/20131205/fea67115/attachment-0004.html>