diff --git a/images/border_type_4.png b/images/border_type_4.png
new file mode 100644
index 0000000000000000000000000000000000000000..4a581bb46b0610f4555dd8d8cabc364f6eaf33fb
Binary files /dev/null and b/images/border_type_4.png differ
diff --git a/images/border_type_5.png b/images/border_type_5.png
new file mode 100644
index 0000000000000000000000000000000000000000..544e018cdc474a32e5d646e1a74a89bc77687fe2
Binary files /dev/null and b/images/border_type_5.png differ
diff --git a/js/src/annotations/osd-region-draw-tool.js b/js/src/annotations/osd-region-draw-tool.js
index 9f044dea1958b56063248f225ffdcd93f496b7d3..1145c2864bc62c7d2c6a26dd13c2f8f864bb6864 100644
--- a/js/src/annotations/osd-region-draw-tool.js
+++ b/js/src/annotations/osd-region-draw-tool.js
@@ -26,7 +26,7 @@
enterDisplayAnnotations: function() {
this.svgOverlay.setMouseTool();
-
+
// if a user selected the pointer mode but is still actively
// working on an annotation, don't re-render
if (!this.svgOverlay.inEditOrCreateMode) {
@@ -114,7 +114,7 @@
}
if (j === strategies.length) continue;
}
-
+
_this.svgOverlay.restoreLastView(shapeArray);
_this.annotationsToShapesMap[annotation['@id']] = shapeArray;
}
@@ -161,17 +161,18 @@
var shapeArray = _this.annotationsToShapesMap[key];
for (var idx = 0; idx < shapeArray.length; idx++) {
var shapeTool = this.svgOverlay.getTool(shapeArray[idx]);
+ var hoverWidth = shapeArray[idx].data.strokeWidth / this.svgOverlay.paperScope.view.zoom;
if (shapeArray[idx].hitTest(location, hitOptions)) {
annotations.push(shapeArray[idx].data.annotation);
if(shapeTool.onHover){
for(var k=0;k<shapeArray.length;k++){
- shapeTool.onHover(true,shapeArray[k],hoverColor);
+ shapeTool.onHover(true,shapeArray[k],hoverWidth,hoverColor);
}
}
break;
}else{
if(shapeTool.onHover){
- shapeTool.onHover(false,shapeArray[idx]);
+ shapeTool.onHover(false,shapeArray[idx],hoverWidth);
}
}
}
@@ -252,18 +253,15 @@
_this.eventEmitter.publish('SET_OVERLAY_TOOLTIP.' + _this.windowId, {"tooltip" : null, "visible" : false, "paths" : []});
}
jQuery.each(paths, function(index, path) {
- //just in case, force the shape to be non hovered
- var tool = _this.svgOverlay.getTool(path);
- tool.onHover(false, path);
-
path.data.editable = options.isEditable;
if (options.isEditable) {
- path.data.currentStrokeValue = path.data.editStrokeValue;
- path.strokeWidth = path.data.currentStrokeValue / _this.svgOverlay.paperScope.view.zoom;
+ path.strokeWidth = (path.data.strokeWidth + 5) / _this.svgOverlay.paperScope.view.zoom;
} else {
- path.data.currentStrokeValue = path.data.defaultStrokeValue;
- path.strokeWidth = path.data.currentStrokeValue / _this.svgOverlay.paperScope.view.zoom;
+ path.strokeWidth = path.data.strokeWidth / _this.svgOverlay.paperScope.view.zoom;
}
+ //just in case, force the shape to be non hovered
+ var tool = _this.svgOverlay.getTool(path);
+ tool.onHover(false, path, path.strokeWidth);
});
} else {
jQuery.each(paths, function(index, path) {
diff --git a/js/src/annotations/osd-svg-ellipse.js b/js/src/annotations/osd-svg-ellipse.js
index 98a3c41878368834a71fdc841eeafe14235a475b..20ac563cc7319c4eda7a9a7f888128251b1156bb 100644
--- a/js/src/annotations/osd-svg-ellipse.js
+++ b/js/src/annotations/osd-svg-ellipse.js
@@ -43,10 +43,8 @@
name: overlay.getName(_this)
});
shape.dashArray = overlay.dashArray;
- shape.data.defaultStrokeValue = 1;
- shape.data.editStrokeValue = 5;
- shape.data.currentStrokeValue = shape.data.defaultStrokeValue;
- shape.strokeWidth = shape.data.currentStrokeValue / overlay.paperScope.view.zoom;
+ shape.data.strokeWidth = overlay.strokeWidth;
+ shape.strokeWidth = shape.data.strokeWidth / overlay.paperScope.view.zoom;
shape.strokeColor = overlay.strokeColor;
shape.fillColor = overlay.fillColor;
shape.fillColor.alpha = overlay.fillColorAlpha;
@@ -185,17 +183,19 @@
}
},
- onHover: function (activate, shape, hoverColor) {
+ onHover: function (activate, shape, hoverWidth, hoverColor) {
+ shape.strokeWidth = hoverWidth;
+
// shape needs to have hovered styles
if (activate && !shape.data.hovered) {
- shape.data.nonHoverStroke = shape.strokeColor.clone();
+ shape.data.nonHoverStrokeColor = shape.strokeColor.clone();
shape.data.hovered = true;
shape.strokeColor = hoverColor;
}
// shape is not longer hovered
if (!activate && shape.data.hovered) {
- shape.strokeColor = shape.data.nonHoverStroke.clone();
- delete shape.data.nonHoverStroke;
+ shape.strokeColor = shape.data.nonHoverStrokeColor.clone();
+ delete shape.data.nonHoverStrokeColor;
delete shape.data.hovered;
}
},
diff --git a/js/src/annotations/osd-svg-freehand.js b/js/src/annotations/osd-svg-freehand.js
index 920d6e829d9aea9bb275f256e4a9902b74a444ef..571a50a3fee771f79afe559885f59f570eb0ae4b 100644
--- a/js/src/annotations/osd-svg-freehand.js
+++ b/js/src/annotations/osd-svg-freehand.js
@@ -23,10 +23,8 @@
strokeColor: overlay.strokeColor,
name: overlay.getName(_this)
});
- shape.data.defaultStrokeValue = 1;
- shape.data.editStrokeValue = 5;
- shape.data.currentStrokeValue = shape.data.defaultStrokeValue;
- shape.strokeWidth = shape.data.currentStrokeValue / overlay.paperScope.view.zoom;
+ shape.data.strokeWidth = overlay.strokeWidth;
+ shape.strokeWidth = shape.data.strokeWidth / overlay.paperScope.view.zoom;
return shape;
},
@@ -112,17 +110,19 @@
};
},
- onHover:function(activate,shape,hoverColor){
+ onHover:function(activate,shape,hoverWidth,hoverColor){
+ shape.strokeWidth = hoverWidth;
+
// shape needs to have hovered styles
if(activate && !shape.data.hovered){
- shape.data.nonHoverStroke = shape.strokeColor.clone();
+ shape.data.nonHoverStrokeColor = shape.strokeColor.clone();
shape.data.hovered = true;
shape.strokeColor = hoverColor;
}
// shape is not longer hovered
if(!activate && shape.data.hovered){
- shape.strokeColor = shape.data.nonHoverStroke.clone();
- delete shape.data.nonHoverStroke;
+ shape.strokeColor = shape.data.nonHoverStrokeColor.clone();
+ delete shape.data.nonHoverStrokeColor;
delete shape.data.hovered;
}
},
diff --git a/js/src/annotations/osd-svg-overlay.js b/js/src/annotations/osd-svg-overlay.js
index 80b4bd49f42a35b40a17dfa04e57438d60ed2757..820eff04989430d3d4b9300ffbfa3d46c831c646 100644
--- a/js/src/annotations/osd-svg-overlay.js
+++ b/js/src/annotations/osd-svg-overlay.js
@@ -36,6 +36,7 @@
availableAnnotationDrawingTools: availableAnnotationDrawingTools,
availableExternalCommentsPanel: availableExternalCommentsPanel,
dashArray: [],
+ strokeWidth: 1,
fixedShapeSize: drawingToolsSettings.fixedShapeSize,
selectedColor: drawingToolsSettings.selectedColor || '#004c66',
shapeHandleSize:drawingToolsSettings.shapeHandleSize,
@@ -52,6 +53,7 @@
this.currentTool = null;
// Default colors.
this.dashArray = [];
+ this.strokeWidth = 1;
this.strokeColor = drawingToolsSettings.strokeColor;
this.fillColor = drawingToolsSettings.fillColor;
this.fillColorAlpha = drawingToolsSettings.fillColorAlpha;
@@ -99,7 +101,8 @@
center: _this.path.segments[0].point,
radius: _this.hitOptions.tolerance / _this.paperScope.view.zoom,
fillColor: _this.path.strokeColor,
- strokeColor: _this.path.strokeColor
+ strokeColor: _this.path.strokeColor,
+ strokeWidth: _this.path.strokeWidth
});
}
}
@@ -121,7 +124,7 @@
setMouseTool: function() {
this.removeMouseTool();
this.paperScope.activate();
-
+
this.mouseTool = new this.paperScope.Tool();
this.mouseTool.overlay = this;
this.mouseTool.onMouseUp = this.onMouseUp;
@@ -239,13 +242,23 @@
this.eventsSubscriptions.push(_this.eventEmitter.subscribe('toggleBorderType.' + _this.windowId, function (event, type) {
if (type == 'solid') {
_this.dashArray = [];
+ _this.strokeWidth = 1;
+ } else if (type == 'thick') {
+ _this.dashArray = [];
+ _this.strokeWidth = 3;
+ } else if (type == 'thickest') {
+ _this.dashArray = [];
+ _this.strokeWidth = 6;
} else if (type == 'dashed') {
_this.dashArray = [5, 5];
+ _this.strokeWidth = 1;
} else if (type == 'dotdashed') {
_this.dashArray = [2, 5, 7, 5];
+ _this.strokeWidth = 1;
}
if (_this.hoveredPath) {
_this.hoveredPath.dashArray = _this.dashArray;
+ _this.hoveredPath.strokeWidth = _this.strokeWidth;
_this.paperScope.view.draw();
}
}));
@@ -339,8 +352,7 @@
//should remove the styles added for newly created annotation
for(var i=0;i<_this.draftPaths.length;i++){
if(_this.draftPaths[i].data && _this.draftPaths[i].data.newlyCreated){
- _this.draftPaths[i].strokeWidth /= _this.draftPaths[i].data.newlyCreatedStrokeFactor;
- _this.draftPaths[i].data.currentStrokeValue /= _this.draftPaths[i].data.newlyCreatedStrokeFactor;
+ _this.draftPaths[i].strokeWidth = _this.draftPaths[i].data.strokeWidth; // TODO: removed newlyCreatedStrokeFactor stuff here
delete _this.draftPaths[i].data.newlyCreated;
delete _this.draftPaths[i].data.newlyCreatedStrokeFactor;
}
@@ -693,9 +705,9 @@
if(this.getTool(allItems[j]).onResize){
this.getTool(allItems[j]).onResize(allItems[j],this);
}
- allItems[j].strokeWidth = allItems[j].data.currentStrokeValue / this.paperScope.view.zoom;
+ allItems[j].strokeWidth = allItems[j].data.strokeWidth / this.paperScope.view.zoom;
if (allItems[j].style) {
- allItems[j].style.strokeWidth = allItems[j].data.currentStrokeValue / this.paperScope.view.zoom;
+ allItems[j].style.strokeWidth = allItems[j].data.strokeWidth / this.paperScope.view.zoom;
}
}
}
@@ -791,10 +803,8 @@
name: shape.name
});
- cloned.data.defaultStrokeValue = 1;
- cloned.data.editStrokeValue = 5;
- cloned.data.currentStrokeValue = cloned.data.defaultStrokeValue;
- cloned.strokeWidth = cloned.data.currentStrokeValue / this.paperScope.view.zoom;
+ cloned.data.strokeWidth = shape.data.strokeWidth || 1;
+ cloned.strokeWidth = cloned.data.strokeWidth / this.paperScope.view.zoom;
cloned.strokeColor = shape.strokeColor;
cloned.dashArray = shape.dashArray;
if (shape.fillColor) {
@@ -830,6 +840,7 @@
};
var currentMode = this.mode;
var currentPath = this.path;
+ var strokeWidth = this.strokeWidth;
var strokeColor = this.strokeColor;
var fillColor = this.fillColor;
var fillColorAlpha = this.fillColorAlpha || FILL_COLOR_ALPHA_WORKAROUND;
@@ -849,6 +860,7 @@
paperItems[0].data.annotation = annotation;
this.updateSelection(false, paperItems[0]);
this.strokeColor = strokeColor;
+ this.strokeWidth = strokeWidth;
this.fillColor = fillColor;
this.fillColorAlpha = fillColorAlpha;
this.path = currentPath;
@@ -888,7 +900,7 @@
if (shapeArray[idx].name == this.editedPaths[i].name) {
shapeArray[idx].segments = this.editedPaths[i].segments;
shapeArray[idx].name = this.editedPaths[i].name;
- shapeArray[idx].strokeWidth = shapeArray[idx].data.currentStrokeValue / this.paperScope.view.zoom;
+ shapeArray[idx].strokeWidth = this.editedPaths[i].strokeWidth; // TODO: removed --> / this.paperScope.view.zoom;
shapeArray[idx].strokeColor = this.editedPaths[i].strokeColor;
shapeArray[idx].dashArray = this.editedPaths[i].dashArray;
if (this.editedPaths[i].fillColor) {
@@ -899,7 +911,7 @@
}
if (this.editedPaths[i].style) {
shapeArray[idx].style = this.editedPaths[i].style;
- shapeArray[idx].style.strokeWidth = shapeArray[idx].data.currentStrokeValue / this.paperScope.view.zoom;
+ shapeArray[idx].style.strokeWidth = shapeArray[idx].data.strokeWidth / this.paperScope.view.zoom;
}
shapeArray[idx].closed = this.editedPaths[i].closed;
shapeArray[idx].data.rotation = this.editedPaths[i].data.rotation;
@@ -1019,8 +1031,7 @@
var newlyCreatedStrokeFactor = this.drawingToolsSettings.newlyCreatedShapeStrokeWidthFactor || 5;
shape.data.newlyCreatedStrokeFactor = newlyCreatedStrokeFactor;
shape.data.newlyCreated = true;
- shape.data.currentStrokeValue *= newlyCreatedStrokeFactor;
- shape.strokeWidth *= newlyCreatedStrokeFactor;
+ shape.strokeWidth = shape.data.strokeWidth * newlyCreatedStrokeFactor;
this.hoveredPath = shape;
this.segment = null;
diff --git a/js/src/annotations/osd-svg-pin.js b/js/src/annotations/osd-svg-pin.js
index 2e3ba1d83ba6c1c45c8acc18e26000553f32f58c..5be52978732cf40aa19cb70178a3381c20dae139 100644
--- a/js/src/annotations/osd-svg-pin.js
+++ b/js/src/annotations/osd-svg-pin.js
@@ -29,10 +29,8 @@
var shape = new overlay.paperScope.Path(pathData);
shape.name = overlay.getName(_this);
shape.dashArray = overlay.dashArray;
- shape.data.defaultStrokeValue = 1;
- shape.data.editStrokeValue = 5;
- shape.data.currentStrokeValue = shape.data.defaultStrokeValue;
- shape.strokeWidth = shape.data.currentStrokeValue / overlay.paperScope.view.zoom;
+ shape.data.strokeWidth = overlay.strokeWidth;
+ shape.strokeWidth = shape.data.strokeWidth / overlay.paperScope.view.zoom;
shape.strokeColor = overlay.strokeColor;
shape.fillColor = overlay.fillColor;
shape.fillColor.alpha = overlay.fillColorAlpha;
@@ -82,18 +80,19 @@
}
}
},
-
- onHover:function(activate,shape,hoverColor){
+
+ onHover:function(activate,shape,hoverWidth,hoverColor){
+ shape.strokeWidth = hoverWidth;
// shape needs to have hovered styles
if(activate && !shape.data.hovered){
- shape.data.nonHoverStroke = shape.strokeColor.clone();
+ shape.data.nonHoverStrokeColor = shape.strokeColor.clone();
shape.data.hovered = true;
shape.strokeColor = hoverColor;
}
// shape is not longer hovered
if(!activate && shape.data.hovered){
- shape.strokeColor = shape.data.nonHoverStroke.clone();
- delete shape.data.nonHoverStroke;
+ shape.strokeColor = shape.data.nonHoverStrokeColor.clone();
+ delete shape.data.nonHoverStrokeColor;
delete shape.data.hovered;
}
},
@@ -171,4 +170,4 @@
// Empty block.
}
};
-}(Mirador));
\ No newline at end of file
+}(Mirador));
diff --git a/js/src/annotations/osd-svg-polygon.js b/js/src/annotations/osd-svg-polygon.js
index e58ec7482cd6cf4b158ce74201bd58d73fdc9b52..55e9c7ce1e285376a128420ca58b82e71eac0bf9 100644
--- a/js/src/annotations/osd-svg-polygon.js
+++ b/js/src/annotations/osd-svg-polygon.js
@@ -23,10 +23,8 @@
strokeColor: overlay.strokeColor,
name: overlay.getName(_this)
});
- shape.data.defaultStrokeValue = 1;
- shape.data.editStrokeValue = 5;
- shape.data.currentStrokeValue = shape.data.defaultStrokeValue;
- shape.strokeWidth = shape.data.currentStrokeValue / overlay.paperScope.view.zoom;
+ shape.data.strokeWidth = overlay.strokeWidth;
+ shape.strokeWidth = shape.data.strokeWidth / overlay.paperScope.view.zoom;
return shape;
},
@@ -109,17 +107,19 @@
};
},
- onHover:function(activate,shape,hoverColor){
+ onHover:function(activate,shape,hoverWidth,hoverColor){
+ shape.strokeWidth = hoverWidth;
+
// shape needs to have hovered styles
if(activate && !shape.data.hovered){
- shape.data.nonHoverStroke = shape.strokeColor.clone();
+ shape.data.nonHoverStrokeColor = shape.strokeColor.clone();
shape.data.hovered = true;
shape.strokeColor = hoverColor;
}
// shape is not longer hovered
if(!activate && shape.data.hovered){
- shape.strokeColor = shape.data.nonHoverStroke.clone();
- delete shape.data.nonHoverStroke;
+ shape.strokeColor = shape.data.nonHoverStrokeColor.clone();
+ delete shape.data.nonHoverStrokeColor;
delete shape.data.hovered;
}
},
diff --git a/js/src/annotations/osd-svg-rectangle.js b/js/src/annotations/osd-svg-rectangle.js
index 218e8238177ce06ca6034623c6f2684ffaf686eb..9fd28887ef80ffc6b65226f2edd40de372a0d9ec 100644
--- a/js/src/annotations/osd-svg-rectangle.js
+++ b/js/src/annotations/osd-svg-rectangle.js
@@ -23,10 +23,8 @@
name: overlay.getName(this)
});
shape.dashArray = overlay.dashArray;
- shape.data.defaultStrokeValue = 1;
- shape.data.editStrokeValue = 5;
- shape.data.currentStrokeValue = shape.data.defaultStrokeValue;
- shape.strokeWidth = shape.data.currentStrokeValue / overlay.paperScope.view.zoom;
+ shape.data.strokeWidth = overlay.strokeWidth;
+ shape.strokeWidth = shape.data.strokeWidth / overlay.paperScope.view.zoom;
shape.strokeColor = overlay.strokeColor;
shape.fillColor = overlay.fillColor;
shape.fillColor.alpha = overlay.fillColorAlpha;
@@ -154,17 +152,19 @@
}
},
- onHover:function(activate,shape,hoverColor){
+ onHover:function(activate,shape,hoverWidth,hoverColor){
+ shape.strokeWidth = hoverWidth;
+
// shape needs to have hovered styles
if(activate && !shape.data.hovered){
- shape.data.nonHoverStroke = shape.strokeColor.clone();
+ shape.data.nonHoverStrokeColor = shape.strokeColor.clone();
shape.data.hovered = true;
shape.strokeColor = hoverColor;
}
// shape is not longer hovered
if(!activate && shape.data.hovered){
- shape.strokeColor = shape.data.nonHoverStroke.clone();
- delete shape.data.nonHoverStroke;
+ shape.strokeColor = shape.data.nonHoverStrokeColor.clone();
+ delete shape.data.nonHoverStrokeColorColor;
delete shape.data.hovered;
}
},
diff --git a/js/src/widgets/contextControls.js b/js/src/widgets/contextControls.js
index 203316f4323501c3b88fef9ffcbdbede4830004b..07604974ff0081ff445c98e0e187909bfa35dd32 100644
--- a/js/src/widgets/contextControls.js
+++ b/js/src/widgets/contextControls.js
@@ -34,14 +34,20 @@
});
this.setBackground = {
'solid':function(el){
- _this.setBackgroundImage(el,'border_type_1.png');
+ _this.setBackgroundImage(el, 'border_type_1.png');
},
'dashed':function(el){
_this.setBackgroundImage(el, 'border_type_2.png');
},
'dotdashed':function(el){
- _this.setBackgroundImage(el, 'border_type_3.png');
- }
+ _this.setBackgroundImage(el, 'border_type_3.png');
+ },
+ 'thick':function(el){
+ _this.setBackgroundImage(el, 'border_type_4.png');
+ },
+ 'thickest':function(el){
+ _this.setBackgroundImage(el, 'border_type_5.png');
+ },
};
var annotationProperties = this.canvasControls.annotations;
@@ -118,6 +124,8 @@
addStrokeStylePicker:function(){
this.setBackground.solid(this.container.find('.mirador-line-type .solid'));
+ this.setBackground.thick(this.container.find('.mirador-line-type .thick'));
+ this.setBackground.thickest(this.container.find('.mirador-line-type .thickest'));
this.setBackground.dashed(this.container.find('.mirador-line-type .dashed'));
this.setBackground.dotdashed(this.container.find('.mirador-line-type .dotdashed'));
},
@@ -264,6 +272,8 @@
'<i class="fa fa-caret-down dropdown-icon"></i>',
'<ul class="dropdown type-list">',
'<li><i class="fa solid"></i> {{t "solid"}}</li>',
+ '<li><i class="fa thick"></i> {{t "thick"}}</li>',
+ '<li><i class="fa thickest"></i> {{t "thickest"}}</li>',
'<li><i class="fa dashed"></i> {{t "dashed"}}</li>',
'<li><i class="fa dotdashed"></i> {{t "dotDashed"}}</li>',
'</ul>',
diff --git a/locales/en/translation.json b/locales/en/translation.json
index 84fb5d8b561e59cf1b86a56cb5fbfcf3d623fdfa..414f0089f91ef5461fe481a31ea11d38974684c9 100644
--- a/locales/en/translation.json
+++ b/locales/en/translation.json
@@ -74,6 +74,8 @@
"selectGrid": "Select a grid below",
"sidePanelTooltip": "Toggle the side panel",
"solid":"Solid",
+ "thick":"Thick",
+ "thickest":"Thickest",
"thumbnailsView": "Gallery View",
"unspecified": "Unspecified",
"url": "URL",
diff --git a/spec/annotations/mirador21Strategy.test.js b/spec/annotations/mirador21Strategy.test.js
index eea538bce39a9b3de173e17685dd1295f3cb2932..881cc3224d606ead51557978f816a5598609bfa0 100644
--- a/spec/annotations/mirador21Strategy.test.js
+++ b/spec/annotations/mirador21Strategy.test.js
@@ -1,6 +1,6 @@
describe('Mirador 2.1.x Annotation Strategy', function() {
var subject;
-
+
beforeEach(function() {
jasmine.getJSONFixtures().fixturesPath = 'spec/fixtures';
subject = new Mirador.Mirador21Strategy();
@@ -15,7 +15,7 @@ describe('Mirador 2.1.x Annotation Strategy', function() {
expect(true).toBe(true);
});
});
-
+
describe('isThisType', function() {
it('should not recognize a legacy OA annotation', function() {
expect(subject.isThisType(this.legacyOa)).toBe(false);
@@ -30,10 +30,10 @@ describe('Mirador 2.1.x Annotation Strategy', function() {
expect(subject.isThisType(this.miradorDualOa)).toBe(false);
});
});
-
+
describe('buildAnnotation', function() {
var annotation, window, overlay;
-
+
beforeEach(function() {
// Generate mocks
annotation = {
@@ -56,11 +56,11 @@ describe('Mirador 2.1.x Annotation Strategy', function() {
loadedManifest: "https://oculus-dev.harvardx.harvard.edu/manifests/huam:320567"
};
overlay = {
- getSVGString: jasmine.createSpy('getSVGString').and.returnValue("<svg xmlns='http://www.w3.org/2000/svg'><path xmlns=\"http://www.w3.org/2000/svg\" d=\"M1000.24213,219.15375l98.78935,0l0,0l98.78935,0l0,74.09201l0,74.09201l-98.78935,0l-98.78935,0l0,-74.09201z\" data-paper-data=\"{"defaultStrokeValue":1,"editStrokeValue":5,"currentStrokeValue":5,"rotation":0,"annotation":null,"editable":true}\" id=\"rectangle_7e2b56fa-b18b-4d09-a575-0bb19f560b56\" fill-opacity=\"0\" fill=\"#00bfff\" fill-rule=\"nonzero\" stroke=\"#00bfff\" stroke-width=\"30.87167\" stroke-linecap=\"butt\" stroke-linejoin=\"miter\" stroke-miterlimit=\"10\" stroke-dasharray=\"\" stroke-dashoffset=\"0\" font-family=\"sans-serif\" font-weight=\"normal\" font-size=\"12\" text-anchor=\"start\" style=\"mix-blend-mode: normal\"/></svg>"),
- draftPaths: [{bounds: { x: 1000, y: 219, width: 198, height: 148 }}]
+ getSVGString: jasmine.createSpy('getSVGString').and.returnValue("<svg xmlns='http://www.w3.org/2000/svg'><path xmlns=\"http://www.w3.org/2000/svg\" d=\"M1000.24213,219.15375l98.78935,0l0,0l98.78935,0l0,74.09201l0,74.09201l-98.78935,0l-98.78935,0l0,-74.09201z\" data-paper-data=\"{"strokeWidth":1,"rotation":0,"annotation":null,"editable":true}\" id=\"rectangle_7e2b56fa-b18b-4d09-a575-0bb19f560b56\" fill-opacity=\"0\" fill=\"#00bfff\" fill-rule=\"nonzero\" stroke=\"#00bfff\" stroke-width=\"30.87167\" stroke-linecap=\"butt\" stroke-linejoin=\"miter\" stroke-miterlimit=\"10\" stroke-dasharray=\"\" stroke-dashoffset=\"0\" font-family=\"sans-serif\" font-weight=\"normal\" font-size=\"12\" text-anchor=\"start\" style=\"mix-blend-mode: normal\"/></svg>"),
+ draftPaths: [{bounds: { x: 1000, y: 219, width: 198, height: 148 }}]
};
});
-
+
it('should build the on attribute in the annotation', function() {
expect(subject.buildAnnotation({
"annotation": annotation,
@@ -69,10 +69,10 @@ describe('Mirador 2.1.x Annotation Strategy', function() {
})).toEqual(this.mirador21Oa);
});
});
-
+
describe('parseRegion', function() {
var result, osdRegionDrawTool;
-
+
beforeEach(function() {
osdRegionDrawTool = {
svgOverlay: {
@@ -103,4 +103,4 @@ describe('Mirador 2.1.x Annotation Strategy', function() {
expect(osdRegionDrawTool.svgOverlay.parseSVG).not.toHaveBeenCalled();
});
});
-});
\ No newline at end of file
+});
diff --git a/spec/annotations/miradorDualStrategy.test.js b/spec/annotations/miradorDualStrategy.test.js
index 7c7a2484a70652d104ede514f8d8fc7e52039ccd..7d7df09265a790ab6c4a9dfe3e8c12c0334b66a9 100644
--- a/spec/annotations/miradorDualStrategy.test.js
+++ b/spec/annotations/miradorDualStrategy.test.js
@@ -1,6 +1,6 @@
describe('Mirador SVG-xywh Open Annotation Strategy', function() {
var subject;
-
+
beforeEach(function() {
jasmine.getJSONFixtures().fixturesPath = 'spec/fixtures';
subject = new Mirador.MiradorDualStrategy();
@@ -15,7 +15,7 @@ describe('Mirador SVG-xywh Open Annotation Strategy', function() {
expect(true).toBe(true);
});
});
-
+
describe('isThisType', function() {
it('should not recognize a legacy OA annotation', function() {
expect(subject.isThisType(this.legacyOa)).toBe(false);
@@ -30,10 +30,10 @@ describe('Mirador SVG-xywh Open Annotation Strategy', function() {
expect(subject.isThisType(this.miradorDualOa)).toBe(true);
});
});
-
+
describe('buildAnnotation', function() {
var annotation, window, overlay;
-
+
beforeEach(function() {
// Generate mocks
annotation = {
@@ -56,11 +56,11 @@ describe('Mirador SVG-xywh Open Annotation Strategy', function() {
loadedManifest: "https://oculus-dev.harvardx.harvard.edu/manifests/huam:320567"
};
overlay = {
- getSVGString: jasmine.createSpy('getSVGString').and.returnValue("<svg xmlns='http://www.w3.org/2000/svg'><path xmlns=\"http://www.w3.org/2000/svg\" d=\"M1000.24213,219.15375l98.78935,0l0,0l98.78935,0l0,74.09201l0,74.09201l-98.78935,0l-98.78935,0l0,-74.09201z\" data-paper-data=\"{"defaultStrokeValue":1,"editStrokeValue":5,"currentStrokeValue":5,"rotation":0,"annotation":null,"editable":true}\" id=\"rectangle_7e2b56fa-b18b-4d09-a575-0bb19f560b56\" fill-opacity=\"0\" fill=\"#00bfff\" fill-rule=\"nonzero\" stroke=\"#00bfff\" stroke-width=\"30.87167\" stroke-linecap=\"butt\" stroke-linejoin=\"miter\" stroke-miterlimit=\"10\" stroke-dasharray=\"\" stroke-dashoffset=\"0\" font-family=\"sans-serif\" font-weight=\"normal\" font-size=\"12\" text-anchor=\"start\" style=\"mix-blend-mode: normal\"/></svg>"),
- draftPaths: [{bounds: { x: 1000, y: 219, width: 198, height: 148 }}]
+ getSVGString: jasmine.createSpy('getSVGString').and.returnValue("<svg xmlns='http://www.w3.org/2000/svg'><path xmlns=\"http://www.w3.org/2000/svg\" d=\"M1000.24213,219.15375l98.78935,0l0,0l98.78935,0l0,74.09201l0,74.09201l-98.78935,0l-98.78935,0l0,-74.09201z\" data-paper-data=\"{"strokeWidth":1,"rotation":0,"annotation":null,"editable":true}\" id=\"rectangle_7e2b56fa-b18b-4d09-a575-0bb19f560b56\" fill-opacity=\"0\" fill=\"#00bfff\" fill-rule=\"nonzero\" stroke=\"#00bfff\" stroke-width=\"30.87167\" stroke-linecap=\"butt\" stroke-linejoin=\"miter\" stroke-miterlimit=\"10\" stroke-dasharray=\"\" stroke-dashoffset=\"0\" font-family=\"sans-serif\" font-weight=\"normal\" font-size=\"12\" text-anchor=\"start\" style=\"mix-blend-mode: normal\"/></svg>"),
+ draftPaths: [{bounds: { x: 1000, y: 219, width: 198, height: 148 }}]
};
});
-
+
it('should build the on attribute in the annotation', function() {
expect(subject.buildAnnotation({
"annotation": annotation,
@@ -69,10 +69,10 @@ describe('Mirador SVG-xywh Open Annotation Strategy', function() {
})).toEqual(this.miradorDualOa);
});
});
-
+
describe('parseRegion', function() {
var result, osdRegionDrawTool;
-
+
beforeEach(function() {
osdRegionDrawTool = {
svgOverlay: {
@@ -103,4 +103,4 @@ describe('Mirador SVG-xywh Open Annotation Strategy', function() {
expect(osdRegionDrawTool.svgOverlay.parseSVG).toHaveBeenCalled();
});
});
-});
\ No newline at end of file
+});
diff --git a/spec/annotations/osd-svg-ellipse.test.js b/spec/annotations/osd-svg-ellipse.test.js
index b5f9113dd51892da5056f0e370261db68dca991b..7ede91f5a718582a36db912fe2e7e45fa2dbf058 100644
--- a/spec/annotations/osd-svg-ellipse.test.js
+++ b/spec/annotations/osd-svg-ellipse.test.js
@@ -452,7 +452,7 @@ describe('Ellipse', function() {
g:0,
b:0
};
- this.ellipse.onHover(true,this.shape,'red');
+ this.ellipse.onHover(true,this.shape,1,'red');
expect(this.shape.data.hovered).toBe(true);
expect(this.shape.strokeColor.red).toBe(red.r);
@@ -465,11 +465,11 @@ describe('Ellipse', function() {
var oldColor = this.shape.strokeColor;
this.ellipse.onHover(true,this.shape,'red');
- expect(this.shape.data.nonHoverStroke.red).toBe(oldColor.red);
- expect(this.shape.data.nonHoverStroke.green).toBe(oldColor.green);
- expect(this.shape.data.nonHoverStroke.blue).toBe(oldColor.blue);
+ expect(this.shape.data.nonHoverStrokeColor.red).toBe(oldColor.red);
+ expect(this.shape.data.nonHoverStrokeColor.green).toBe(oldColor.green);
+ expect(this.shape.data.nonHoverStrokeColor.blue).toBe(oldColor.blue);
- this.ellipse.onHover(false,this.shape);
+ this.ellipse.onHover(false,this.shape,1);
expect(this.shape.data.hovered).toBe(undefined);
expect(this.shape.strokeColor.red).toBe(oldColor.red);
expect(this.shape.strokeColor.green).toBe(oldColor.green);
@@ -564,4 +564,4 @@ describe('Ellipse', function() {
});
});
-});
\ No newline at end of file
+});
diff --git a/spec/annotations/osd-svg-freehand.test.js b/spec/annotations/osd-svg-freehand.test.js
index 4795bb3fecfa914f7ff975c9c86a3a0bcba1f744..f3dbbb7ecbb3e36787c4d20198399c46b921f870 100644
--- a/spec/annotations/osd-svg-freehand.test.js
+++ b/spec/annotations/osd-svg-freehand.test.js
@@ -87,7 +87,7 @@ describe('Freehand', function() {
g:0,
b:0
};
- this.freehand.onHover(true,this.shape,'red');
+ this.freehand.onHover(true,this.shape,1,'red');
expect(this.shape.data.hovered).toBe(true);
expect(this.shape.strokeColor.red).toBe(red.r);
@@ -98,13 +98,13 @@ describe('Freehand', function() {
it('should change stroke back to original when not hovering freehand',function(){
var oldColor = this.shape.strokeColor;
- this.freehand.onHover(true,this.shape,'red');
+ this.freehand.onHover(true,this.shape,1,'red');
- expect(this.shape.data.nonHoverStroke.red).toBe(oldColor.red);
- expect(this.shape.data.nonHoverStroke.green).toBe(oldColor.green);
- expect(this.shape.data.nonHoverStroke.blue).toBe(oldColor.blue);
+ expect(this.shape.data.nonHoverStrokeColor.red).toBe(oldColor.red);
+ expect(this.shape.data.nonHoverStrokeColor.green).toBe(oldColor.green);
+ expect(this.shape.data.nonHoverStrokeColor.blue).toBe(oldColor.blue);
- this.freehand.onHover(false,this.shape);
+ this.freehand.onHover(false,this.shape,1);
expect(this.shape.data.hovered).toBe(undefined);
expect(this.shape.strokeColor.red).toBe(oldColor.red);
expect(this.shape.strokeColor.green).toBe(oldColor.green);
@@ -495,4 +495,4 @@ describe('Freehand', function() {
});
});
-});
\ No newline at end of file
+});
diff --git a/spec/annotations/osd-svg-pin.test.js b/spec/annotations/osd-svg-pin.test.js
index b68b5284a5fb93d4ffbab9f791577834e3e934ac..05782c109db5222495e8acd94c5f9d161e81b2c0 100644
--- a/spec/annotations/osd-svg-pin.test.js
+++ b/spec/annotations/osd-svg-pin.test.js
@@ -116,7 +116,7 @@ describe('Pin', function() {
g:0,
b:0
};
- this.pin.onHover(true,this.shape,'red');
+ this.pin.onHover(true,this.shape,1,'red');
expect(this.shape.data.hovered).toBe(true);
expect(this.shape.strokeColor.red).toBe(red.r);
@@ -127,13 +127,13 @@ describe('Pin', function() {
it('should change stroke back to original when not hovering pin',function(){
var oldColor = this.shape.strokeColor;
- this.pin.onHover(true,this.shape,'red');
+ this.pin.onHover(true,this.shape,1,'red');
- expect(this.shape.data.nonHoverStroke.red).toBe(oldColor.red);
- expect(this.shape.data.nonHoverStroke.green).toBe(oldColor.green);
- expect(this.shape.data.nonHoverStroke.blue).toBe(oldColor.blue);
+ expect(this.shape.data.nonHoverStrokeColor.red).toBe(oldColor.red);
+ expect(this.shape.data.nonHoverStrokeColor.green).toBe(oldColor.green);
+ expect(this.shape.data.nonHoverStrokeColor.blue).toBe(oldColor.blue);
- this.pin.onHover(false,this.shape);
+ this.pin.onHover(false,this.shape,1);
expect(this.shape.data.hovered).toBe(undefined);
expect(this.shape.strokeColor.red).toBe(oldColor.red);
expect(this.shape.strokeColor.green).toBe(oldColor.green);
@@ -305,4 +305,4 @@ describe('Pin', function() {
});
-});
\ No newline at end of file
+});
diff --git a/spec/annotations/osd-svg-polygon.test.js b/spec/annotations/osd-svg-polygon.test.js
index 85494e82bcd3a3c33031c5cb35c2d75d0cd6a9eb..e1f77b93604a0fc47124e54be07e4601463fe117 100644
--- a/spec/annotations/osd-svg-polygon.test.js
+++ b/spec/annotations/osd-svg-polygon.test.js
@@ -1,7 +1,7 @@
paper.install(window);
describe('Polygon', function() {
-
+
beforeAll(function() {
this.canvas = jQuery('<canvas></canvas>');
this.canvas.attr('id', 'paperId');
@@ -103,7 +103,7 @@ describe('Polygon', function() {
g:0,
b:0
};
- this.polygon.onHover(true,this.shape,'red');
+ this.polygon.onHover(true,this.shape,1,'red');
expect(this.shape.data.hovered).toBe(true);
expect(this.shape.strokeColor.red).toBe(red.r);
@@ -114,13 +114,13 @@ describe('Polygon', function() {
it('should change stroke back to original when not hovering polygon',function(){
var oldColor = this.shape.strokeColor;
- this.polygon.onHover(true,this.shape,'red');
+ this.polygon.onHover(true,this.shape,1,'red');
- expect(this.shape.data.nonHoverStroke.red).toBe(oldColor.red);
- expect(this.shape.data.nonHoverStroke.green).toBe(oldColor.green);
- expect(this.shape.data.nonHoverStroke.blue).toBe(oldColor.blue);
+ expect(this.shape.data.nonHoverStrokeColor.red).toBe(oldColor.red);
+ expect(this.shape.data.nonHoverStrokeColor.green).toBe(oldColor.green);
+ expect(this.shape.data.nonHoverStrokeColor.blue).toBe(oldColor.blue);
- this.polygon.onHover(false,this.shape);
+ this.polygon.onHover(false,this.shape,1);
expect(this.shape.data.hovered).toBe(undefined);
expect(this.shape.strokeColor.red).toBe(oldColor.red);
expect(this.shape.strokeColor.green).toBe(oldColor.green);
@@ -545,4 +545,4 @@ describe('Polygon', function() {
});
-});
\ No newline at end of file
+});
diff --git a/spec/annotations/osd-svg-rectangle.test.js b/spec/annotations/osd-svg-rectangle.test.js
index 9f91864f3f6ff4909a6bf827c7d740f9d1ed8501..9d612e3a2f1365169fd572800e7b3be36c79a920 100644
--- a/spec/annotations/osd-svg-rectangle.test.js
+++ b/spec/annotations/osd-svg-rectangle.test.js
@@ -111,7 +111,7 @@ describe('Rectangle', function() {
g:0,
b:0
};
- this.rectangle.onHover(true,this.shape,'red');
+ this.rectangle.onHover(true,this.shape,1,'red');
expect(this.shape.data.hovered).toBe(true);
expect(this.shape.strokeColor.red).toBe(red.r);
@@ -120,15 +120,14 @@ describe('Rectangle', function() {
});
it('should change stroke back to original when not hovering rectangle',function(){
-
var oldColor = this.shape.strokeColor;
- this.rectangle.onHover(true,this.shape,'red');
- expect(this.shape.data.nonHoverStroke.red).toBe(oldColor.red);
- expect(this.shape.data.nonHoverStroke.green).toBe(oldColor.green);
- expect(this.shape.data.nonHoverStroke.blue).toBe(oldColor.blue);
+ this.rectangle.onHover(true,this.shape,1,'red');
+ expect(this.shape.data.nonHoverStrokeColor.red).toBe(oldColor.red);
+ expect(this.shape.data.nonHoverStrokeColor.green).toBe(oldColor.green);
+ expect(this.shape.data.nonHoverStrokeColor.blue).toBe(oldColor.blue);
- this.rectangle.onHover(false,this.shape);
+ this.rectangle.onHover(false,this.shape,1);
expect(this.shape.data.hovered).toBe(undefined);
expect(this.shape.strokeColor.red).toBe(oldColor.red);
expect(this.shape.strokeColor.green).toBe(oldColor.green);
@@ -601,5 +600,5 @@ describe('Rectangle', function() {
});
});
-
-});
\ No newline at end of file
+
+});
diff --git a/spec/fixtures/annotationMirador21.json b/spec/fixtures/annotationMirador21.json
index 997e25102e626606351d8d0dc6f5b37f1c566bb0..4dfaedb845577d5fdc516b71a2c0b98a2a0e85fb 100644
--- a/spec/fixtures/annotationMirador21.json
+++ b/spec/fixtures/annotationMirador21.json
@@ -16,7 +16,7 @@
"full": "https://oculus-dev.harvardx.harvard.edu/manifests/huam:320567/canvas/canvas-10466656.json",
"selector": {
"@type": "oa:SvgSelector",
- "value": "<svg xmlns='http://www.w3.org/2000/svg'><path xmlns=\"http://www.w3.org/2000/svg\" d=\"M1000.24213,219.15375l98.78935,0l0,0l98.78935,0l0,74.09201l0,74.09201l-98.78935,0l-98.78935,0l0,-74.09201z\" data-paper-data=\"{"defaultStrokeValue":1,"editStrokeValue":5,"currentStrokeValue":5,"rotation":0,"annotation":null,"editable":true}\" id=\"rectangle_7e2b56fa-b18b-4d09-a575-0bb19f560b56\" fill-opacity=\"0\" fill=\"#00bfff\" fill-rule=\"nonzero\" stroke=\"#00bfff\" stroke-width=\"30.87167\" stroke-linecap=\"butt\" stroke-linejoin=\"miter\" stroke-miterlimit=\"10\" stroke-dasharray=\"\" stroke-dashoffset=\"0\" font-family=\"sans-serif\" font-weight=\"normal\" font-size=\"12\" text-anchor=\"start\" style=\"mix-blend-mode: normal\"/></svg>"
+ "value": "<svg xmlns='http://www.w3.org/2000/svg'><path xmlns=\"http://www.w3.org/2000/svg\" d=\"M1000.24213,219.15375l98.78935,0l0,0l98.78935,0l0,74.09201l0,74.09201l-98.78935,0l-98.78935,0l0,-74.09201z\" data-paper-data=\"{"strokeWidth":1,"rotation":0,"annotation":null,"editable":true}\" id=\"rectangle_7e2b56fa-b18b-4d09-a575-0bb19f560b56\" fill-opacity=\"0\" fill=\"#00bfff\" fill-rule=\"nonzero\" stroke=\"#00bfff\" stroke-width=\"30.87167\" stroke-linecap=\"butt\" stroke-linejoin=\"miter\" stroke-miterlimit=\"10\" stroke-dasharray=\"\" stroke-dashoffset=\"0\" font-family=\"sans-serif\" font-weight=\"normal\" font-size=\"12\" text-anchor=\"start\" style=\"mix-blend-mode: normal\"/></svg>"
},
"within": {
"@id": "https://oculus-dev.harvardx.harvard.edu/manifests/huam:320567",
@@ -24,4 +24,4 @@
}
},
"@id": "d2eda2e2-951a-4f88-b4ec-03a7b25a5d07"
-}
\ No newline at end of file
+}
diff --git a/spec/fixtures/annotationMiradorDual.json b/spec/fixtures/annotationMiradorDual.json
index 3b74df992380c9bedb775f380e9e299e50accdd3..6d2997713341fe4d90ccf295ddd49a692f6b61a6 100644
--- a/spec/fixtures/annotationMiradorDual.json
+++ b/spec/fixtures/annotationMiradorDual.json
@@ -22,7 +22,7 @@
},
"item": {
"@type": "oa:SvgSelector",
- "value": "<svg xmlns='http://www.w3.org/2000/svg'><path xmlns=\"http://www.w3.org/2000/svg\" d=\"M1000.24213,219.15375l98.78935,0l0,0l98.78935,0l0,74.09201l0,74.09201l-98.78935,0l-98.78935,0l0,-74.09201z\" data-paper-data=\"{"defaultStrokeValue":1,"editStrokeValue":5,"currentStrokeValue":5,"rotation":0,"annotation":null,"editable":true}\" id=\"rectangle_7e2b56fa-b18b-4d09-a575-0bb19f560b56\" fill-opacity=\"0\" fill=\"#00bfff\" fill-rule=\"nonzero\" stroke=\"#00bfff\" stroke-width=\"30.87167\" stroke-linecap=\"butt\" stroke-linejoin=\"miter\" stroke-miterlimit=\"10\" stroke-dasharray=\"\" stroke-dashoffset=\"0\" font-family=\"sans-serif\" font-weight=\"normal\" font-size=\"12\" text-anchor=\"start\" style=\"mix-blend-mode: normal\"/></svg>"
+ "value": "<svg xmlns='http://www.w3.org/2000/svg'><path xmlns=\"http://www.w3.org/2000/svg\" d=\"M1000.24213,219.15375l98.78935,0l0,0l98.78935,0l0,74.09201l0,74.09201l-98.78935,0l-98.78935,0l0,-74.09201z\" data-paper-data=\"{"strokeWidth":1,"rotation":0,"annotation":null,"editable":true}\" id=\"rectangle_7e2b56fa-b18b-4d09-a575-0bb19f560b56\" fill-opacity=\"0\" fill=\"#00bfff\" fill-rule=\"nonzero\" stroke=\"#00bfff\" stroke-width=\"30.87167\" stroke-linecap=\"butt\" stroke-linejoin=\"miter\" stroke-miterlimit=\"10\" stroke-dasharray=\"\" stroke-dashoffset=\"0\" font-family=\"sans-serif\" font-weight=\"normal\" font-size=\"12\" text-anchor=\"start\" style=\"mix-blend-mode: normal\"/></svg>"
}
},
"within": {