perPixelTargetFind not working in nested group. #5287
Conversation
|
So we would search target with the normalized pointer for bounding box, but the per pixel target would work with the non normalized one. That would make sense. I wonder if a nicer fix is possible. And tests, we need tests to ensure it works. |
|
Would you please indicate which part of code can be improved. Thanks. I'll add some test cases soon. |
src/canvas.class.js
Outdated
| @@ -1196,13 +1199,14 @@ | |||
| /** | |||
| * @private | |||
| */ | |||
| _checkTarget: function(pointer, obj) { | |||
| _checkTarget: function(pointer, obj, globalPointer) { | |||
| globalPointer = globalPointer || pointer; | |||
There was a problem hiding this comment.
is this check necessary? it looks like that we always pass in globalPointer.
There was a problem hiding this comment.
I wonder if someone might call this private method directly.
Should I remove this check or just document this method?
There was a problem hiding this comment.
Document the method is enough, is a private method.
If someone call it directly is gonna have problems anyway since those methods get changed with no information to devs.
We can put this check in searchPossibleTargets that while being private too, is at least one level up of this.
what do you think?
There was a problem hiding this comment.
That make sense to me.
src/canvas.class.js
Outdated
| @@ -1216,18 +1220,18 @@ | |||
| /** | |||
| * @private | |||
| */ | |||
| _searchPossibleTargets: function(objects, pointer) { | |||
There was a problem hiding this comment.
even if those 2 methods are private, we could still document them
Function used to search inside objects an object that contains pointer in bounding box or that contains pointerOnCanvas when painted
@param [fabric.Object] objects array to look into
...
can you complete the JSDOC information for _searchPossibleTargets and checkTarget ?
|
If address the comments looks good. |
test/unit/canvas.js
Outdated
| subTargetCheck: true | ||
| }); | ||
|
|
||
| canvas.add(group2); |
There was a problem hiding this comment.
While this test is ok, the generated group is too simple.
can we use something like this:
var circle = new fabric.Circle({ radius: 30, top: 30, left: 30, fill: 'yellow'});
var circle2 = new fabric.Ellipse({ rx: 10, ry: 20, top: 40, left: 0, fill: 'blue'});
var circle3 = new fabric.Circle({ scaleX: 2, scaleY: 2, radius: 10, top: 120, left: -20, fill: 'red'});
var rect = new fabric.Rect({ width: 100, height: 80, top: 50, left: 60, fill: 'purple' });
var group = new fabric.Group([circle, circle2], { scaleX: 3, angle: 45, opacity: 0.5 });
var group2 = new fabric.Group([group, rect, circle3], { opacity: 0.5, top: 20, left: 20, scaleX: 0.8, scaleY: 1.2 });
canvas.add(group2);that looks like this:
and test edge cases? we should be able to succesfully target all the shapes.
|
It seems that object in nested group should normalize the pointer just once or we will get wrong result when calling containsPoint. Please check over the test cases I just added :). |
test/unit/canvas.js
Outdated
| assert.equal(canvas.targets.length, 2, 'Subtargets length should be 2'); | ||
| assert.equal(canvas.targets[0], circle2, 'The deepest target should be circle2'); | ||
| canvas.perPixelTargetFind = false; | ||
| canvas.remove(triangle); |
There was a problem hiding this comment.
Sorry about that. I will fix it soon.
|
yes i think t his is because normalizePointer will normalize everything up to the canvas level, so everytime you normalize starting from absolute. Those changes are less invasive, i need some time to download and test the branch, but i think we are good. We still avoided angle and skew in the test case, i do not understand why |
|
Please let me know if there's any problem. |
|
Hey, thank you. |
* fix perPixelTargetFind in nested object * fix: lint * add methods doc * doc: update _serachPossibleTarget doc * test: add test case * fix: remove pointer check * fix: object in nested group should normalize just once * test: add test case * restore to previous code style * fix: update test case descriptions * fix: test case * test: add skew and angle test case
perPixelTargetFind property is not working with object in nested group. When I replace isTargetTransparent methods params with pointer relative to canvas, everything works fine.