Mercurial > hg > digilib

changeset 1317:cac657d25ba9

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
use vector plugin defineShape method for annotation shapes.
author robcast
date Fri, 23 Jan 2015 12:16:46 +0100
parents 6afc572d63be
children bf94aaa0a2c1
files webapp/src/main/webapp/jquery/jquery.digilib.annotator.js webapp/src/main/webapp/jquery/jquery.digilib.vector.js
diffstat 2 files changed, 75 insertions(+), 31 deletions(-) [+]
line wrap: on
line diff
--- a/webapp/src/main/webapp/jquery/jquery.digilib.annotator.js	Thu Jan 22 18:49:30 2015 +0100
+++ b/webapp/src/main/webapp/jquery/jquery.digilib.annotator.js	Fri Jan 23 12:16:46 2015 +0100
@@ -31,7 +31,7 @@
  */
 (function($) {
     // version of this plugin
-    var version = 'jquery.digilib.annotator.js 1.3.1';
+    var version = 'jquery.digilib.annotator.js 1.3.2';
 
     // affine geometry
     var geom = null;
@@ -116,7 +116,7 @@
         setAnnotationMark : function (data, mpos, text) {
             if (mpos == null) {
                 // interactive
-                setAnnotationMark(data);
+                setAnnotationShape(data, 'Point');
             } else {
                 // use position and text (and user-id)
                 console.error("Sorry, currently only interactive annotations!");
@@ -133,7 +133,7 @@
         setAnnotationRegion : function (data, rect, text) {
             if (rect == null) {
                 // interactive
-                setAnnotationRegion(data);
+                setAnnotationShape(data, 'Rectangle');
             } else {
                 // use position and text (and user-id)
                 console.error("Sorry, currently only interactive annotations!");
@@ -257,6 +257,40 @@
     };
 
     /**
+     * Add a shape-annotation where clicked.
+     */
+    var setAnnotationShape = function (data, type) {
+        var annotator = data.annotator;
+        var shape = {'geometry': {'type': type}};
+        digilib.actions.addShape(data, shape, function (data, newshape) {
+        	console.debug("new annotation shape:", newshape);
+        	var annoShape = null;
+        	var pos = null;
+        	if (type === 'Point') {
+        		pos = geom.position(newshape.geometry.coordinates[0]);
+                // create annotation shape
+                annoShape = {'type': 'point', 'units': 'fraction', 'geometry': pos};
+        	} else if (type === 'Rectangle') {
+        		pos = geom.position(newshape.geometry.coordinates[0]);
+        		var pt2 = geom.position(newshape.geometry.coordinates[1]);
+        		var rect = geom.rectangle(pos, pt2);
+                // create annotation shape
+                annoShape = {'type': 'rectangle', 'units': 'fraction', 'geometry': rect};
+        	} else if (type === 'Polygon') {
+        		pos = geom.position(newshape.geometry.coordinates[0]);
+                // create annotation shape
+                annoShape = {'type': 'polygon', 'units': 'fraction', 'geometry': newshape.geometry.coordinates};
+        	} else {
+        		console.error("Unsupported annotation shape="+type);
+        		return;
+        	}
+            var mpos = data.imgTrafo.transform(pos);
+            createAnnotation(data, annoShape, mpos);        	
+        }, annotationLayer);
+    };
+    
+    
+    /**
      * Show editor and save annotation.
      */
     var createAnnotation = function (data, shape, screenPos) {
@@ -283,7 +317,7 @@
 	    annotator.subscribe('annotationEditorSubmit', save);
 	    annotator.subscribe('annotationEditorHidden', cancel);
 	    annotator.showEditor(annotation, screenPos.getAsCss());
-    }
+    };
     
     /**
      * Render all annotations on the image
@@ -372,7 +406,7 @@
                     	'annotation': annotation
             	};
             } else {
-                console.error("Unsupported shape type: "+type);
+                console.error("Unsupported annotation shape type: "+type);
                 return;
             }
         } else {
--- a/webapp/src/main/webapp/jquery/jquery.digilib.vector.js	Thu Jan 22 18:49:30 2015 +0100
+++ b/webapp/src/main/webapp/jquery/jquery.digilib.vector.js	Fri Jan 23 12:16:46 2015 +0100
@@ -625,18 +625,19 @@
             // setup shape
             var p = data.imgTrafo.invtransform(pt);
             var vtxidx = 1;
-            if (shapeType === 'Line' || shapeType === 'Rectangle' || 
+            if (shapeType === 'Point') {
+                shape.geometry.coordinates = [[p.x, p.y]];
+            } else if (shapeType === 'Line' || shapeType === 'Rectangle' || 
             		shapeType === 'LineString' || shapeType === 'Polygon') {
                 shape.geometry.coordinates = [[p.x, p.y], [p.x, p.y]];
             } else {
-                console.error("unsupported shape type: "+shapeType);
+                console.error("defineShape: unsupported shape type: "+shapeType);
                 $overlayDiv.remove();
                 return false;
             }
             // save editable state and set to non-editable
-            var isShapeEditable = false;
             if (shape.properties != null) {
-            	isShapeEditable = shape.properties.editable;
+            	shape.properties._editable = shape.properties.editable;
             	shape.properties.editable = false;
             } else {
                 shape.properties = {'editable' : false};
@@ -644,53 +645,62 @@
             // draw shape
             renderShape(data, shape, layer);
             // vertex drag end handler
-            var vertexDragDone = function (data, newshape, newevt) {
-                var coords = newshape.geometry.coordinates;
+            var vertexDragDone = function (data, shape, newevt) {
+                var coords = shape.geometry.coordinates;
             	if (shapeType === 'LineString' || shapeType === 'Polygon') {
             		if (newevt.type === 'mouseup') {
 	            		// single click adds line to LineString/Polygon
-	            		unrenderShape(data, newshape);
+	            		unrenderShape(data, shape);
 	            		// copy last vertex as starting point
 	            		coords.push(coords[vtxidx].slice());
 	            		vtxidx += 1;
 	                    // draw shape
-	                    renderShape(data, newshape, layer);            		
+	                    renderShape(data, shape, layer);            		
 	                    // execute vertex drag handler on next vertex
-	            		getVertexDragHandler(data, newshape, vtxidx, vertexDragDone)(newevt);
+	            		getVertexDragHandler(data, shape, vtxidx, vertexDragDone)(newevt);
 	            		return false;
             		} else if (newevt.type === 'dblclick') {
             			// double click ends Linestring/Polygon
 	            		if (coords[vtxidx][0] === coords[vtxidx-1][0] && 
 	            				coords[vtxidx][1] === coords[vtxidx-1][1]) {
-	            			unrenderShape(data, newshape);
+	            			unrenderShape(data, shape);
 	            			// remove duplicate last vertex (from mouseup)
 	            			coords.pop();
-		                    renderShape(data, newshape, layer);            		            			
+		                    renderShape(data, shape, layer);            		            			
 	            		}
             		} else {
             			console.error("unknown event type!");
             			return false;
             		}
             	}
-                // dragging vertex done
-            	if (shape.properties.editable !== isShapeEditable) {
-	            	// re-set editable
-	            	unrenderShape(data, newshape);
-	            	shape.properties.editable = isShapeEditable;
-	            	renderShape(data, newshape, layer);
-            	}
-            	// save shape
-                layer.shapes.push(newshape);
-                $overlayDiv.remove();
-                if (onComplete != null) {
-                    onComplete(data, newshape);
-                }
+            	shapeDone(data, shape);
             };
-            // execute vertex drag handler on second vertex
-            getVertexDragHandler(data, shape, vtxidx, vertexDragDone)(evt);
+            if (shapeType === 'Point') {
+            	// just this one vertex
+            	shapeDone(data, shape);
+            } else {
+            	// execute vertex drag handler on second vertex
+            	getVertexDragHandler(data, shape, vtxidx, vertexDragDone)(evt);
+            }
             return false;
         };
         
+        var shapeDone = function (data, shape) {
+            // defining shape done
+        	if (shape.properties._editable != null) {
+            	// re-set editable
+            	unrenderShape(data, shape);
+            	shape.properties.editable = shape.properties._editable;
+            	delete shape.properties._editable;
+            	renderShape(data, shape, layer);
+        	}
+        	// save shape
+            layer.shapes.push(shape);
+            $overlayDiv.remove();
+            if (onComplete != null) {
+                onComplete(data, shape);
+            }
+        };
         // start by clicking
         $overlayDiv.one('mousedown.dlShape', shapeStart);
     };