Skip to content
This repository was archived by the owner on Oct 18, 2018. It is now read-only.

Commit 5154d90

Browse files
saqibmasoodsaqibmasood
committed
Improve text annotations
1 parent e815c21 commit 5154d90

File tree

1 file changed

+142
-92
lines changed

1 file changed

+142
-92
lines changed

‎src/main/webapp/app.directive.gdxAnnoPage.js‎

Lines changed: 142 additions & 92 deletions
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,7 @@
6363
var ps = paper.PaperScope.get(scope.paperScopeId);
6464

6565
var currentObject = null;
66+
var textRowMouseDown;
6667
ps.tool = new ps.Tool();
6768
ps.tool.minDistance = 3;
6869

@@ -115,53 +116,31 @@
115116
currentObject.strokeWidth = 2;
116117
break;
117118
case 'underline':
118-
var start = new ps.Point(event.point);
119-
$rootScope.startRow = getStartRow($rootScope.docInfo, start, attrs);
120-
$rootScope.startText = $rootScope.startRow[0].characterCoordinates.filter(function (x) {
121-
return Math.floor(x) > Math.floor(start.x);
122-
});
123-
if ($rootScope.startText.length > 1) {
124-
currentObject = new ps.Path.Line(new ps.Point($rootScope.startText[0], $rootScope.startRow[0].lineTop + $rootScope.startRow[0].lineHeight), new ps.Point($rootScope.startText[1], $rootScope.startRow[0].lineTop + $rootScope.startRow[0].lineHeight));
125-
currentObject.strokeColor = 'black';
126-
currentObject.strokeWidth = 2;
127-
}
128-
else if ($rootScope.startText.length > 1) {
129-
currentObject = new ps.Path.Line(new ps.Point($rootScope.startText[0], $rootScope.startRow[0].lineTop + $rootScope.startRow[0].lineHeight), new ps.Point($rootScope.startText[0], $rootScope.startRow[0].lineTop + $rootScope.startRow[0].lineHeight));
130-
currentObject.strokeColor = 'black';
131-
currentObject.strokeWidth = 2;
132-
}
133-
break;
134119
case 'strikeout':
135-
var start = new ps.Point(event.point);
136-
$rootScope.startRow = getStartRow($rootScope.docInfo, start, attrs);
137-
$rootScope.startText = $rootScope.startRow[0].characterCoordinates.filter(function (x) {
138-
return Math.floor(x) > Math.floor(start.x);
139-
});
140-
if ($rootScope.startText.length > 1) {
141-
currentObject = new ps.Path.Line(new ps.Point($rootScope.startText[0], $rootScope.startRow[0].lineTop + $rootScope.startRow[0].lineHeight / 2), new ps.Point($rootScope.startText[1], $rootScope.startRow[0].lineTop + $rootScope.startRow[0].lineHeight / 2));
142-
currentObject.strokeColor = 'black';
143-
currentObject.strokeWidth = 2;
144-
}
145-
else if ($rootScope.startText.length > 1) {
146-
currentObject = new ps.Path.Line(new ps.Point($rootScope.startText[0], $rootScope.startRow[0].lineTop + $rootScope.startRow[0].lineHeight / 2), new ps.Point($rootScope.startText[0], $rootScope.startRow[0].lineTop + $rootScope.startRow[0].lineHeight / 2));
147-
currentObject.strokeColor = 'black';
148-
currentObject.strokeWidth = 2;
149-
}
120+
textRowMouseDown = findRowUnderPoint($rootScope.docInfo, attrs.number, event.point);
121+
currentObject = new ps.Path.Rectangle(new ps.Rectangle(
122+
event.point.x,
123+
textRowMouseDown.lineTop,
124+
1,
125+
textRowMouseDown.lineHeight)
126+
);
127+
currentObject.fillColor = 'black';
128+
currentObject.opacity = 0.3;
150129
break;
151130
}
152131
};
153132

154133
ps.tool.onMouseDrag = function (event) {
155134
switch ($rootScope.selectedDrawingTool) {
156135
case 'select':
157-
angular.forEach(scope.annotationsList, function (item) {
158-
if (currentObject && item.annotation.guid === currentObject.name && item.annotation.type === 4 && item.annotation.type === 8) {
136+
var currentAnnotation = findAnnotationByGuid(scope.annotationsList, $rootScope.selectedAnnotationGuid);
137+
if (currentObject !== null && currentAnnotation !== null) {
138+
if ([3, 4, 8, 11].indexOf(currentAnnotation.annotation.type) < 0) {
139+
currentObject.position.x += event.delta.x;
140+
currentObject.position.y += event.delta.y;
141+
} else {
159142
currentObject = null;
160143
}
161-
});
162-
if (currentObject) {
163-
currentObject.position.x += event.delta.x;
164-
currentObject.position.y += event.delta.y;
165144
}
166145
break;
167146
case 'rectangle':
@@ -176,32 +155,11 @@
176155
currentObject.position.y += event.delta.y;
177156
break;
178157
case 'underline':
179-
if (currentObject) {
180-
var end = new ps.Point(event.point);
181-
var endText = $rootScope.startRow[0].characterCoordinates.filter(function (x) {
182-
return Math.floor(x) > Math.floor(end.x);
183-
});
184-
if (endText.length > 1) {
185-
currentObject.add(new ps.Point(endText[1], $rootScope.startRow[0].lineTop + $rootScope.startRow[0].lineHeight));
186-
}
187-
else if (endText.length > 0) {
188-
currentObject.add(new ps.Point(endText[0], $rootScope.startRow[0].lineTop + $rootScope.startRow[0].lineHeight));
189-
}
190-
}
191-
break;
192158
case 'strikeout':
193-
if (currentObject) {
194-
var end = new ps.Point(event.point);
195-
var endText = $rootScope.startRow[0].characterCoordinates.filter(function (x) {
196-
return Math.floor(x) > Math.floor(end.x);
197-
});
198-
if (endText.length > 1) {
199-
currentObject.add(new ps.Point(endText[1], $rootScope.startRow[0].lineTop + $rootScope.startRow[0].lineHeight / 2));
200-
}
201-
else if (endText.length > 0) {
202-
currentObject.add(new ps.Point(endText[0], $rootScope.startRow[0].lineTop + $rootScope.startRow[0].lineHeight / 2));
159+
if (currentObject !== null) {
160+
if (currentObject.bounds.x + currentObject.bounds.width + event.delta.x <= textRowMouseDown.lineWidth) {
161+
currentObject.bounds.width += event.delta.x;
203162
}
204-
205163
}
206164
break;
207165
case 'arrow':
@@ -324,28 +282,70 @@
324282
};
325283
break;
326284
case 'underline':
327-
ant = {
328-
type: 11,
329-
svgPath: extractSvgPathData(currentObject),
330-
box: {
331-
x: currentObject.bounds.x,
332-
y: currentObject.bounds.y,
333-
width: 0,
334-
height: 0
335-
},
336-
};
337-
break;
338285
case 'strikeout':
339-
ant = {
340-
type: 11,
341-
svgPath: extractSvgPathData(currentObject),
342-
box: {
343-
x: currentObject.bounds.x,
344-
y: currentObject.bounds.y,
345-
width: 0,
346-
height: 0
347-
},
348-
};
286+
if (currentObject !== null) {
287+
ant = angular.merge({}, ant, {
288+
svgPath: JSON.stringify([
289+
{
290+
X: currentObject.bounds.x,
291+
Y: attrs.height - currentObject.bounds.y
292+
},
293+
{
294+
X: currentObject.bounds.x + currentObject.bounds.width,
295+
Y: attrs.height - currentObject.bounds.y
296+
},
297+
{
298+
X: currentObject.bounds.x,
299+
Y: attrs.height - currentObject.bounds.y - currentObject.bounds.height
300+
},
301+
{
302+
X: currentObject.bounds.x + currentObject.bounds.width,
303+
Y: attrs.height - currentObject.bounds.y - currentObject.bounds.height
304+
}
305+
]),
306+
box: {
307+
x: currentObject.bounds.x,
308+
y: attrs.height - currentObject.bounds.y,
309+
width: currentObject.bounds.width,
310+
height: currentObject.bounds.height
311+
},
312+
annotationPosition: {
313+
x: currentObject.bounds.x,
314+
y: attrs.height - currentObject.bounds.y
315+
}
316+
});
317+
currentObject.remove();
318+
switch ($rootScope.selectedDrawingTool) {
319+
case 'underline':
320+
currentObject = new ps.Path.Line({
321+
from: [
322+
currentObject.bounds.x,
323+
currentObject.bounds.y + currentObject.bounds.height
324+
],
325+
to: [
326+
currentObject.bounds.x + currentObject.bounds.width,
327+
currentObject.bounds.y + currentObject.bounds.height
328+
],
329+
strokeColor: 'black'
330+
});
331+
ant = angular.merge({}, ant, {type: 11});
332+
break;
333+
case 'strikeout':
334+
currentObject = new ps.Path.Line({
335+
from: [
336+
currentObject.bounds.x,
337+
currentObject.bounds.y + currentObject.bounds.height / 2.0
338+
],
339+
to: [
340+
currentObject.bounds.x + currentObject.bounds.width,
341+
currentObject.bounds.y + currentObject.bounds.height / 2.0
342+
],
343+
strokeColor: 'black'
344+
});
345+
ant = angular.merge({}, ant, {type: 3});
346+
break;
347+
}
348+
}
349349
break;
350350
}
351351

@@ -371,6 +371,19 @@
371371
}
372372
};
373373

374+
ps.tool.onMouseMove = function (event) {
375+
switch ($rootScope.selectedDrawingTool) {
376+
case 'underline':
377+
case 'strikeout':
378+
var r = findRowUnderPoint($rootScope.docInfo, attrs.number, event.point);
379+
if (typeof(r) !== 'undefined') {
380+
document.body.style.cursor = 'text';
381+
} else {
382+
document.body.style.cursor = 'auto';
383+
}
384+
}
385+
};
386+
374387
ps.tool.onKeyDown = function (event) {
375388
if (event.key === 'delete') {
376389
angular.forEach(ps.project.selectedItems, function (item) {
@@ -449,18 +462,34 @@
449462
arrow.name = item.annotation.guid;
450463
break;
451464
case 11:
452-
var line = new ps.Path();
453-
line.pathData = item.annotation.svgPath;
454-
line.strokeColor = 'black';
455-
line.strokeWidth = 2;
456-
line.name = item.annotation.guid;
465+
var line11 = new ps.Path.Line({
466+
from: [
467+
JSON.parse(item.annotation.svgPath)[2].X,
468+
attrs.height - JSON.parse(item.annotation.svgPath)[2].Y
469+
],
470+
to: [
471+
JSON.parse(item.annotation.svgPath)[3].X,
472+
attrs.height - JSON.parse(item.annotation.svgPath)[3].Y
473+
],
474+
strokeColor: 'black',
475+
strokeWidth: 1,
476+
name: item.annotation.guid
477+
});
457478
break;
458479
case 3:
459-
var line = new ps.Path();
460-
line.pathData = item.annotation.svgPath;
461-
line.strokeColor = 'black';
462-
line.strokeWidth = 2;
463-
line.name = item.annotation.guid;
480+
var line3 = new ps.Path.Line({
481+
from: [
482+
JSON.parse(item.annotation.svgPath)[2].X,
483+
attrs.height - (JSON.parse(item.annotation.svgPath)[0].Y + JSON.parse(item.annotation.svgPath)[2].Y) / 2.0
484+
],
485+
to: [
486+
JSON.parse(item.annotation.svgPath)[3].X,
487+
attrs.height - (JSON.parse(item.annotation.svgPath)[1].Y + JSON.parse(item.annotation.svgPath)[3].Y) / 2.0
488+
],
489+
strokeColor: 'black',
490+
strokeWidth: 1,
491+
name: item.annotation.guid
492+
});
464493
break;
465494
case 12:
466495
var distance = new ps.Group([
@@ -545,6 +574,27 @@
545574
return data;
546575
}
547576

577+
function findRowUnderPoint(docInfo, page, point) {
578+
var currentRow = docInfo.pages[page].rows.filter(function (row) {
579+
return row.lineLeft <= point.x && point.x <= row.lineLeft + row.lineWidth
580+
&& row.lineTop <= point.y && point.y <= row.lineTop + row.lineHeight;
581+
});
582+
583+
return currentRow[0];
584+
}
585+
586+
function findAnnotationByGuid(annotationInfo, guid) {
587+
var a = annotationInfo.filter(function (item) {
588+
return item.annotation.guid === guid;
589+
});
590+
591+
if (a.length > 0) {
592+
return a[0];
593+
}
594+
595+
return null;
596+
}
597+
548598
angular.module('GroupDocsAnnotationApp').directive('gdxAnnoPage', main, ['cfpLoadingBar']);
549599

550600
})();

0 commit comments

Comments
 (0)