# HG changeset patch # User robcast # Date 1338406964 -7200 # Node ID bab0bdac6d929018078d6673eca066a9a73ec2a6 # Parent 6407c33355a26b93899b6da66b5b3846dfb5e6ec first version of annotations plugin. moved mark background image. diff -r 6407c33355a2 -r bab0bdac6d92 webapp/src/main/webapp/jquery/img/annotationmark-bg-16.png Binary file webapp/src/main/webapp/jquery/img/annotationmark-bg-16.png has changed diff -r 6407c33355a2 -r bab0bdac6d92 webapp/src/main/webapp/jquery/img/fullscreen/32/annotation-mark.png Binary file webapp/src/main/webapp/jquery/img/fullscreen/32/annotation-mark.png has changed diff -r 6407c33355a2 -r bab0bdac6d92 webapp/src/main/webapp/jquery/img/fullscreen/32/annotations.png Binary file webapp/src/main/webapp/jquery/img/fullscreen/32/annotations.png has changed diff -r 6407c33355a2 -r bab0bdac6d92 webapp/src/main/webapp/jquery/img/fullscreen/old/mark-bg-16.png Binary file webapp/src/main/webapp/jquery/img/fullscreen/old/mark-bg-16.png has changed diff -r 6407c33355a2 -r bab0bdac6d92 webapp/src/main/webapp/jquery/img/fullscreen/old/mark-bg.png Binary file webapp/src/main/webapp/jquery/img/fullscreen/old/mark-bg.png has changed diff -r 6407c33355a2 -r bab0bdac6d92 webapp/src/main/webapp/jquery/img/fullscreen3.svg --- a/webapp/src/main/webapp/jquery/img/fullscreen3.svg Wed May 30 15:26:49 2012 +0200 +++ b/webapp/src/main/webapp/jquery/img/fullscreen3.svg Wed May 30 21:42:44 2012 +0200 @@ -76,9 +76,9 @@ inkscape:pageopacity="0.0" inkscape:pageshadow="2" inkscape:zoom="14.74" - inkscape:cx="15.247365" + inkscape:cx="3.1713813" inkscape:cy="15.995577" - inkscape:current-layer="layer1" + inkscape:current-layer="g4128" showgrid="true" inkscape:grid-bbox="true" inkscape:document-units="px" @@ -122,7 +122,7 @@ image/svg+xml - + @@ -149,7 +149,7 @@ sodipodi:insensitive="true"> 1 + + ' + (i + 1) + ''; + var $annotation = $(html); + // set text as tooltip TODO: have real popup with editing + $annotation.attr('title', "Annotation: " + annotation.text); + $elem.append($annotation); + mpos.adjustDiv($annotation); + } + } + }; + + var loadAnnotationToken = function(data) { + var settings = data.settings; + var url = settings.annotationTokenUrl; + // TODO: better error handling + $.get(url, function(authToken, authStatus) { + console.debug("got auth token data=", authToken); + data.annotationToken = authToken; + loadAnnotations(data); + }); + }; + + var loadAnnotations = function(data) { + var settings = data.settings; + var url = settings.annotationServerUrl + '/search'; + var pageUrl = data.digilibBaseUrl + '/jquery/digilib.html?'; + pageUrl += digilib.fn.getParamString(settings, ['fn', 'pn'], digilib.defaults); + // send authentication token in header + headers = { + 'x-annotator-auth-token' : data.annotationToken + }; + // get only annotations with this url + var query = { + limit : 20, + uri : pageUrl + }; + $.ajax(url, { + dataType : 'json', + data : query, + headers : headers, + success : function(annotData, annotStatus) { + console.debug("got annotation data=", annotData); + data.annotationData = annotData; + parseAnnotations(data, annotData); + renderAnnotations(data); + } + }); + }; + + var parseAnnotations = function(data, annotationData) { + var annotations = []; + for (var i = 0; i < annotationData.rows.length; ++i) { + var ann = annotationData.rows[i]; + var annot = parseAnnotation(ann) + if (annot != null) { + annotations.push(annot); + } + } + data.annotations = annotations; + }; + + var parseAnnotation = function(ann) { + // TODO: check validity of annotation data + if (ann.area != null) { + var pos = geom.position(ann.area.x, ann.area.y); + return newAnnotation(pos, ann.text, ann.id, ann.uri, ann.user); + } + return null; + }; + + var storeAnnotation = function(data, annotation) { + console.debug("storeAnnotation:", annotation); + var settings = data.settings; + var url = settings.annotationServerUrl + '/annotations'; + var pageUrl = getAnnotationPageUrl(data); + // send authentication token in header + headers = { + 'x-annotator-auth-token' : data.annotationToken + }; + // create annotation object to send + var annotData = { + area : {x : annotation.pos.x, y : annotation.pos.y}, + text : annotation.text, + uri : pageUrl, + user : settings.annotationUser + }; + var dataString = JSON.stringify(annotData); + $.ajax(url, { + type : 'POST', + dataType : 'json', + contentType : 'application/json', + data : dataString, + headers : headers, + success : function(annotData, annotStatus) { + console.debug("sent annotation data, got=", annotData, " status="+annotStatus); + var annot = parseAnnotation(annotData); + // TODO: we have to add the returned data to the real annotation! + //renderAnnotations(data); + } + }); + + } + /** install additional buttons */ + var installButtons = function(data) { + var settings = data.settings; + var mode = settings.interactionMode; + var buttonSettings = settings.buttonSettings[mode]; + // configure buttons through digilib "annotationSet" option + var buttonSet = settings.annotationSet || annotationSet; + // set annotationSet to [] or '' for no buttons (when showing annotations only) + if (buttonSet.length && buttonSet.length > 0) { + buttonSettings.annotationSet = buttonSet; + buttonSettings.buttonSets.push('annotationSet'); + } + }; + + /** plugin installation called by digilib on plugin object. */ + var install = function(plugin) { + digilib = plugin; + console.debug('installing annotations plugin. digilib:', digilib); + // import geometry classes + geom = digilib.fn.geometry; + FULL_AREA = geom.rectangle(0, 0, 1, 1); + // add defaults, actins, buttons + $.extend(digilib.defaults, defaults); + $.extend(digilib.actions, actions); + $.extend(digilib.buttons, buttons); + }; + + /** plugin initialization */ + var init = function(data) { + console.debug('initialising annotations plugin. data:', data); + var $data = $(data); + // set up + data.annotations = []; + if (digilib.plugins.buttons != null) { + installButtons(data); + } + // install event handler + $data.bind('setup', handleSetup); + $data.bind('update', handleUpdate); + }; + + var handleSetup = function(evt) { + console.debug("annotations: handleSetup"); + var data = this; + // load annotations from server + loadAnnotationToken(data); + }; + + var handleUpdate = function(evt) { + console.debug("annotations: handleUpdate"); + var data = this; + if (data.marks != null) { + renderAnnotations(data); + } + }; + + // plugin object with name and init + // shared objects filled by digilib on registration + var plugin = { + name : 'annotations', + install : install, + init : init, + buttons : {}, + actions : {}, + fn : {}, + plugins : {} + }; + + if ($.fn.digilib == null) { + $.error("jquery.digilib.annotations must be loaded after jquery.digilib!"); + } else { + $.fn.digilib('plugin', plugin); + } +})(jQuery); diff -r 6407c33355a2 -r bab0bdac6d92 webapp/src/main/webapp/jquery/jquery.digilib.css --- a/webapp/src/main/webapp/jquery/jquery.digilib.css Wed May 30 15:26:49 2012 +0200 +++ b/webapp/src/main/webapp/jquery/jquery.digilib.css Wed May 30 21:42:44 2012 +0200 @@ -42,17 +42,32 @@ div.dl-digilib div.dl-mark { position: absolute; color: white; - background: url('../greyskin/mark-bg-16.png'); + background: url('img/mark-bg-16.png'); font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; font-size: 11px; - height: 15px; + height: 16px; width: 16px; padding-top: 1px; text-align: center; z-index: 10; } +div.dl-digilib div.dl-annotationmark { + position: absolute; + color: black; + background: url('img/annotationmark-bg-16.png'); + /* background-color: yellow; */ + font-family: Verdana, Arial, Helvetica, sans-serif; + font-weight: bold; + font-size: 11px; + height: 16px; + width: 16px; + padding-top: 1px; + text-align: center; + z-index: 10; +} + div.dl-digilib div.dl-about { position: absolute; padding: 10px; diff -r 6407c33355a2 -r bab0bdac6d92 webapp/src/main/webapp/jquery/jquery.digilib.marks.js --- a/webapp/src/main/webapp/jquery/jquery.digilib.marks.js Wed May 30 15:26:49 2012 +0200 +++ b/webapp/src/main/webapp/jquery/jquery.digilib.marks.js Wed May 30 21:42:44 2012 +0200 @@ -1,5 +1,5 @@ /** - * digilib plugin stub + * digilib marks plugin */ (function($) { @@ -38,7 +38,7 @@ setMark(data); } else { // use position - data.marks.push(pos); + data.marks.push(mpos); digilib.fn.redisplay(data); } },