@leafer-ui/core 1.0.0-rc.19 → 1.0.0-rc.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/core.cjs +211 -89
- package/lib/core.esm.js +200 -78
- package/lib/core.esm.min.js +1 -1
- package/lib/core.min.cjs +1 -1
- package/package.json +7 -7
package/lib/core.cjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var draw
|
|
3
|
+
var draw = require('@leafer-ui/draw');
|
|
4
4
|
var core = require('@leafer/core');
|
|
5
5
|
|
|
6
6
|
/******************************************************************************
|
|
@@ -32,7 +32,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
|
|
|
32
32
|
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
33
33
|
};
|
|
34
34
|
|
|
35
|
-
exports.App = class App extends draw
|
|
35
|
+
exports.App = class App extends draw.Leafer {
|
|
36
36
|
get __tag() { return 'App'; }
|
|
37
37
|
get isApp() { return true; }
|
|
38
38
|
constructor(userConfig, data) {
|
|
@@ -88,7 +88,7 @@ exports.App = class App extends draw$1.Leafer {
|
|
|
88
88
|
this.children.forEach(leafer => leafer.forceRender(bounds));
|
|
89
89
|
}
|
|
90
90
|
addLeafer(merge) {
|
|
91
|
-
const leafer = new draw
|
|
91
|
+
const leafer = new draw.Leafer(merge);
|
|
92
92
|
this.add(leafer);
|
|
93
93
|
return leafer;
|
|
94
94
|
}
|
|
@@ -123,7 +123,8 @@ exports.App = class App extends draw$1.Leafer {
|
|
|
123
123
|
if (this.viewReady)
|
|
124
124
|
this.renderer.update();
|
|
125
125
|
}
|
|
126
|
-
__render(canvas,
|
|
126
|
+
__render(canvas, options) {
|
|
127
|
+
canvas.setWorld(options.matrix || this.__world);
|
|
127
128
|
this.children.forEach(leafer => canvas.copyWorld(leafer.canvas));
|
|
128
129
|
}
|
|
129
130
|
__onResize(event) {
|
|
@@ -156,11 +157,6 @@ exports.App = __decorate([
|
|
|
156
157
|
core.registerUI()
|
|
157
158
|
], exports.App);
|
|
158
159
|
|
|
159
|
-
function draw(leafer) {
|
|
160
|
-
const { config } = leafer;
|
|
161
|
-
config.move.dragOut = false;
|
|
162
|
-
}
|
|
163
|
-
|
|
164
160
|
const downKeyMap = {};
|
|
165
161
|
const Keyboard = {
|
|
166
162
|
isHoldSpaceKey() {
|
|
@@ -355,21 +351,16 @@ exports.KeyEvent = __decorate([
|
|
|
355
351
|
core.registerUIEvent()
|
|
356
352
|
], exports.KeyEvent);
|
|
357
353
|
|
|
358
|
-
function
|
|
354
|
+
function addInteractionWindow(leafer) {
|
|
359
355
|
if (leafer.isApp)
|
|
360
356
|
return;
|
|
361
357
|
leafer.__eventIds.push(leafer.on_(exports.MoveEvent.BEFORE_MOVE, (e) => {
|
|
362
|
-
|
|
363
|
-
if (
|
|
364
|
-
|
|
365
|
-
moveY = 0;
|
|
366
|
-
else
|
|
367
|
-
moveX = 0;
|
|
368
|
-
}
|
|
369
|
-
leafer.zoomLayer.move(moveX, moveY);
|
|
358
|
+
const { x, y } = leafer.getValidMove(e.moveX, e.moveY);
|
|
359
|
+
if (x || y)
|
|
360
|
+
leafer.zoomLayer.move(x, y);
|
|
370
361
|
}), leafer.on_(exports.ZoomEvent.BEFORE_ZOOM, (e) => {
|
|
371
362
|
const { zoomLayer } = leafer;
|
|
372
|
-
const changeScale = leafer.
|
|
363
|
+
const changeScale = leafer.getValidScale(e.scale);
|
|
373
364
|
if (changeScale !== 1) {
|
|
374
365
|
core.PointHelper.scaleOf(zoomLayer, e, changeScale);
|
|
375
366
|
zoomLayer.scale = zoomLayer.__.scaleX * changeScale;
|
|
@@ -377,6 +368,12 @@ function design(leafer) {
|
|
|
377
368
|
}));
|
|
378
369
|
}
|
|
379
370
|
|
|
371
|
+
function document(leafer) {
|
|
372
|
+
addInteractionWindow(leafer);
|
|
373
|
+
leafer.config.move.scroll = 'limit';
|
|
374
|
+
leafer.config.zoom.min = 1;
|
|
375
|
+
}
|
|
376
|
+
|
|
380
377
|
const debug$1 = core.Debug.get('LeaferTypeCreator');
|
|
381
378
|
const LeaferTypeCreator = {
|
|
382
379
|
list: {},
|
|
@@ -399,12 +396,51 @@ const LeaferTypeCreator = {
|
|
|
399
396
|
}
|
|
400
397
|
};
|
|
401
398
|
const { list, register } = LeaferTypeCreator;
|
|
402
|
-
register('draw',
|
|
403
|
-
register('design',
|
|
399
|
+
register('draw', () => { });
|
|
400
|
+
register('design', addInteractionWindow);
|
|
401
|
+
register('document', document);
|
|
404
402
|
|
|
405
|
-
draw
|
|
403
|
+
draw.Leafer.prototype.initType = function (type) {
|
|
406
404
|
LeaferTypeCreator.run(type, this);
|
|
407
405
|
};
|
|
406
|
+
draw.Leafer.prototype.getValidMove = function (moveX, moveY) {
|
|
407
|
+
const { scroll, disabled } = this.app.config.move;
|
|
408
|
+
if (scroll) {
|
|
409
|
+
if (Math.abs(moveX) > Math.abs(moveY))
|
|
410
|
+
moveY = 0;
|
|
411
|
+
else
|
|
412
|
+
moveX = 0;
|
|
413
|
+
if (scroll === 'limit') {
|
|
414
|
+
const { x, y, width, height } = new core.Bounds(this.__world).addPoint(this.zoomLayer);
|
|
415
|
+
const right = x + width - this.width, bottom = y + height - this.height;
|
|
416
|
+
if (x >= 0 && right <= 0)
|
|
417
|
+
moveX = 0;
|
|
418
|
+
else if (moveX > 0) {
|
|
419
|
+
if (x + moveX > 0)
|
|
420
|
+
moveX = -x;
|
|
421
|
+
}
|
|
422
|
+
else if (moveX < 0 && right + moveX < 0)
|
|
423
|
+
moveX = -right;
|
|
424
|
+
if (y >= 0 && bottom <= 0)
|
|
425
|
+
moveY = 0;
|
|
426
|
+
else if (moveY > 0) {
|
|
427
|
+
if (y + moveY > 0)
|
|
428
|
+
moveY = -y;
|
|
429
|
+
}
|
|
430
|
+
else if (moveY < 0 && bottom + moveY < 0)
|
|
431
|
+
moveY = -bottom;
|
|
432
|
+
}
|
|
433
|
+
}
|
|
434
|
+
return { x: disabled ? 0 : moveX, y: disabled ? 0 : moveY };
|
|
435
|
+
};
|
|
436
|
+
draw.Leafer.prototype.getValidScale = function (changeScale) {
|
|
437
|
+
const { scaleX } = this.zoomLayer.__, { min, max, disabled } = this.app.config.zoom, absScale = Math.abs(scaleX * changeScale);
|
|
438
|
+
if (absScale < min)
|
|
439
|
+
changeScale = min / scaleX;
|
|
440
|
+
else if (absScale > max)
|
|
441
|
+
changeScale = max / scaleX;
|
|
442
|
+
return disabled ? 1 : changeScale;
|
|
443
|
+
};
|
|
408
444
|
|
|
409
445
|
class Transformer {
|
|
410
446
|
constructor(interaction) {
|
|
@@ -576,7 +612,7 @@ class Dragger {
|
|
|
576
612
|
return;
|
|
577
613
|
}
|
|
578
614
|
if (!this.moving && canDrag) {
|
|
579
|
-
if (this.moving = interaction.canMove(this.downData) || interaction.isHoldRightKey)
|
|
615
|
+
if (this.moving = interaction.canMove(this.downData) || interaction.isHoldRightKey || interaction.isMobileDragEmpty)
|
|
580
616
|
interaction.emit(exports.MoveEvent.START, this.dragData);
|
|
581
617
|
}
|
|
582
618
|
if (!this.moving) {
|
|
@@ -625,7 +661,7 @@ class Dragger {
|
|
|
625
661
|
const list = this.getList();
|
|
626
662
|
if (list.length && running) {
|
|
627
663
|
const { moveX, moveY } = this.dragData;
|
|
628
|
-
list.forEach(leaf => leaf.moveWorld(moveX, moveY));
|
|
664
|
+
list.forEach(leaf => leaf.draggable && leaf.moveWorld(moveX, moveY));
|
|
629
665
|
}
|
|
630
666
|
}
|
|
631
667
|
dragOverOrOut(data) {
|
|
@@ -652,7 +688,7 @@ class Dragger {
|
|
|
652
688
|
this.dragEnterPath = path;
|
|
653
689
|
}
|
|
654
690
|
dragEnd(data, speed) {
|
|
655
|
-
if (!this.
|
|
691
|
+
if (!this.dragging && !this.moving)
|
|
656
692
|
return;
|
|
657
693
|
const { moveX, moveY } = this.dragData;
|
|
658
694
|
if (this.interaction.config.move.dragAnimate && this.canAnimate && this.moving && (Math.abs(moveX) > 1 || Math.abs(moveY) > 1)) {
|
|
@@ -675,12 +711,16 @@ class Dragger {
|
|
|
675
711
|
if (throughPath)
|
|
676
712
|
endDragData.throughPath = throughPath;
|
|
677
713
|
endDragData.path = path;
|
|
678
|
-
if (this.moving)
|
|
714
|
+
if (this.moving) {
|
|
715
|
+
this.moving = false;
|
|
679
716
|
interaction.emit(exports.MoveEvent.END, endDragData);
|
|
717
|
+
}
|
|
680
718
|
if (this.dragging) {
|
|
719
|
+
const dropList = this.getList();
|
|
720
|
+
this.dragging = false;
|
|
681
721
|
interaction.emit(exports.DragEvent.END, endDragData);
|
|
682
|
-
this.swipe(data, endDragData);
|
|
683
|
-
this.drop(data);
|
|
722
|
+
this.swipe(data, downData, dragData, endDragData);
|
|
723
|
+
this.drop(data, dropList, this.dragEnterPath);
|
|
684
724
|
}
|
|
685
725
|
this.autoMoveCancel();
|
|
686
726
|
this.dragReset();
|
|
@@ -692,22 +732,21 @@ class Dragger {
|
|
|
692
732
|
this.interaction.target.nextRender(animateWait, null, off);
|
|
693
733
|
this.animateWait = func;
|
|
694
734
|
}
|
|
695
|
-
swipe(data, endDragData) {
|
|
696
|
-
const { interaction
|
|
735
|
+
swipe(data, downData, dragData, endDragData) {
|
|
736
|
+
const { interaction } = this;
|
|
697
737
|
if (core.PointHelper.getDistance(downData, data) > interaction.config.pointer.swipeDistance) {
|
|
698
|
-
const swipeData = getSwipeEventData(downData,
|
|
738
|
+
const swipeData = getSwipeEventData(downData, dragData, endDragData);
|
|
699
739
|
this.interaction.emit(swipeData.type, swipeData);
|
|
700
740
|
}
|
|
701
741
|
}
|
|
702
|
-
drop(data) {
|
|
703
|
-
const dropData = getDropEventData(data,
|
|
704
|
-
dropData.path =
|
|
742
|
+
drop(data, dropList, dragEnterPath) {
|
|
743
|
+
const dropData = getDropEventData(data, dropList, exports.DragEvent.data);
|
|
744
|
+
dropData.path = dragEnterPath;
|
|
705
745
|
this.interaction.emit(exports.DropEvent.DROP, dropData);
|
|
706
|
-
this.interaction.emit(exports.DragEvent.LEAVE, data,
|
|
746
|
+
this.interaction.emit(exports.DragEvent.LEAVE, data, dragEnterPath);
|
|
707
747
|
}
|
|
708
748
|
dragReset() {
|
|
709
749
|
exports.DragEvent.list = exports.DragEvent.data = this.dragableList = this.dragData = this.downData = this.dragOverPath = this.dragEnterPath = null;
|
|
710
|
-
this.dragging = this.moving = false;
|
|
711
750
|
}
|
|
712
751
|
checkDragOut(data) {
|
|
713
752
|
const { interaction } = this;
|
|
@@ -795,8 +834,8 @@ function emitEvent(leaf, type, data, capture, excludePath) {
|
|
|
795
834
|
if (leaf.destroyed)
|
|
796
835
|
return true;
|
|
797
836
|
if (leaf.__.hitSelf && !exclude(leaf, excludePath)) {
|
|
798
|
-
if (draw
|
|
799
|
-
draw
|
|
837
|
+
if (draw.State.updateEventStyle)
|
|
838
|
+
draw.State.updateEventStyle(leaf, type);
|
|
800
839
|
if (leaf.hasEvent(type, capture)) {
|
|
801
840
|
data.phase = capture ? 1 : ((leaf === data.target) ? 2 : 3);
|
|
802
841
|
const event = core.EventCreator.get(type, data);
|
|
@@ -839,6 +878,7 @@ const config = {
|
|
|
839
878
|
tapTime: 120,
|
|
840
879
|
longPressTime: 800,
|
|
841
880
|
transformTime: 500,
|
|
881
|
+
hover: true,
|
|
842
882
|
dragHover: true,
|
|
843
883
|
dragDistance: 2,
|
|
844
884
|
swipeDistance: 20,
|
|
@@ -850,9 +890,12 @@ const config = {
|
|
|
850
890
|
const { pathHasEventType, getMoveEventData, getZoomEventData, getRotateEventData } = InteractionHelper;
|
|
851
891
|
class InteractionBase {
|
|
852
892
|
get dragging() { return this.dragger.dragging; }
|
|
893
|
+
get moveMode() { return this.config.move.drag || this.isHoldSpaceKey || this.isHoldMiddleKey || (this.isHoldRightKey && this.dragger.moving) || this.isDragEmpty; }
|
|
853
894
|
get isDragEmpty() { return this.config.move.dragEmpty && this.isRootPath(this.hoverData) && (!this.downData || this.isRootPath(this.downData)); }
|
|
895
|
+
get isMobileDragEmpty() { return this.config.move.dragEmpty && !this.config.pointer.hover && this.downData && this.isTreePath(this.downData); }
|
|
896
|
+
get isHoldMiddleKey() { return this.config.move.holdMiddleKey && this.downData && PointerButton.middle(this.downData); }
|
|
854
897
|
get isHoldRightKey() { return this.config.move.holdRightKey && this.downData && PointerButton.right(this.downData); }
|
|
855
|
-
get
|
|
898
|
+
get isHoldSpaceKey() { return this.config.move.holdSpaceKey && Keyboard.isHoldSpaceKey(); }
|
|
856
899
|
get hitRadius() { return this.config.pointer.hitRadius; }
|
|
857
900
|
constructor(target, canvas, selector, userConfig) {
|
|
858
901
|
this.config = config;
|
|
@@ -894,7 +937,8 @@ class InteractionBase {
|
|
|
894
937
|
this.waitMenuTap = true;
|
|
895
938
|
}
|
|
896
939
|
this.dragger.setDragData(data);
|
|
897
|
-
this.
|
|
940
|
+
if (!this.isHoldRightKey)
|
|
941
|
+
this.updateCursor(data);
|
|
898
942
|
}
|
|
899
943
|
pointerMove(data) {
|
|
900
944
|
if (!data)
|
|
@@ -912,9 +956,10 @@ class InteractionBase {
|
|
|
912
956
|
}
|
|
913
957
|
}
|
|
914
958
|
pointerMoveReal(data) {
|
|
959
|
+
const { dragHover, dragDistance } = this.config.pointer;
|
|
915
960
|
this.emit(exports.PointerEvent.BEFORE_MOVE, data, this.defaultPath);
|
|
916
961
|
if (this.downData) {
|
|
917
|
-
const canDrag = core.PointHelper.getDistance(this.downData, data) >
|
|
962
|
+
const canDrag = core.PointHelper.getDistance(this.downData, data) > dragDistance;
|
|
918
963
|
if (canDrag) {
|
|
919
964
|
if (this.waitTap)
|
|
920
965
|
this.pointerWaitCancel();
|
|
@@ -926,7 +971,7 @@ class InteractionBase {
|
|
|
926
971
|
this.updateHoverData(data);
|
|
927
972
|
this.checkPath(data);
|
|
928
973
|
this.emit(exports.PointerEvent.MOVE, data);
|
|
929
|
-
if (!(this.dragging && !
|
|
974
|
+
if (!(this.dragging && !dragHover))
|
|
930
975
|
this.pointerHover(data);
|
|
931
976
|
if (this.dragger.dragging) {
|
|
932
977
|
this.dragger.dragOverOrOut(data);
|
|
@@ -942,20 +987,25 @@ class InteractionBase {
|
|
|
942
987
|
if (!downData)
|
|
943
988
|
return;
|
|
944
989
|
PointerButton.defaultLeft(data);
|
|
945
|
-
this.downData = null;
|
|
946
990
|
this.findPath(data);
|
|
991
|
+
const upData = Object.assign(Object.assign({}, data), { path: data.path.clone() });
|
|
947
992
|
data.path.addList(downData.path.list);
|
|
948
993
|
this.checkPath(data);
|
|
994
|
+
this.downData = null;
|
|
949
995
|
this.emit(exports.PointerEvent.BEFORE_UP, data);
|
|
950
996
|
this.emit(exports.PointerEvent.UP, data);
|
|
951
997
|
this.touchLeave(data);
|
|
952
|
-
|
|
953
|
-
|
|
998
|
+
if (!data.isCancel) {
|
|
999
|
+
this.tap(data);
|
|
1000
|
+
this.menuTap(data);
|
|
1001
|
+
}
|
|
954
1002
|
this.dragger.dragEnd(data);
|
|
955
|
-
this.updateCursor(
|
|
1003
|
+
this.updateCursor(upData);
|
|
956
1004
|
}
|
|
957
1005
|
pointerCancel() {
|
|
958
|
-
|
|
1006
|
+
const data = Object.assign({}, this.dragger.dragData);
|
|
1007
|
+
data.isCancel = true;
|
|
1008
|
+
this.pointerUp(data);
|
|
959
1009
|
}
|
|
960
1010
|
multiTouch(data, list) {
|
|
961
1011
|
const { move, angle, scale, center } = MultiTouchHelper.getData(list);
|
|
@@ -1005,8 +1055,10 @@ class InteractionBase {
|
|
|
1005
1055
|
this.updateCursor();
|
|
1006
1056
|
}
|
|
1007
1057
|
pointerHover(data) {
|
|
1008
|
-
this.
|
|
1009
|
-
|
|
1058
|
+
if (this.config.pointer.hover) {
|
|
1059
|
+
this.pointerOverOrOut(data);
|
|
1060
|
+
this.pointerEnterOrLeave(data);
|
|
1061
|
+
}
|
|
1010
1062
|
}
|
|
1011
1063
|
pointerOverOrOut(data) {
|
|
1012
1064
|
const { path } = data;
|
|
@@ -1087,6 +1139,12 @@ class InteractionBase {
|
|
|
1087
1139
|
isRootPath(data) {
|
|
1088
1140
|
return data && data.path.list[0].isLeafer;
|
|
1089
1141
|
}
|
|
1142
|
+
isTreePath(data) {
|
|
1143
|
+
const app = this.target.app;
|
|
1144
|
+
if (!app || !app.isApp)
|
|
1145
|
+
return false;
|
|
1146
|
+
return app.editor && (!data.path.has(app.editor) && data.path.has(app.tree));
|
|
1147
|
+
}
|
|
1090
1148
|
checkPath(data, useDefaultPath) {
|
|
1091
1149
|
if (useDefaultPath || this.canMove(data))
|
|
1092
1150
|
data.path = this.defaultPath;
|
|
@@ -1133,7 +1191,7 @@ class InteractionBase {
|
|
|
1133
1191
|
this.hoverData = data;
|
|
1134
1192
|
}
|
|
1135
1193
|
updateCursor(data) {
|
|
1136
|
-
if (this.config.cursor.stop)
|
|
1194
|
+
if (this.config.cursor.stop || !this.config.pointer.hover)
|
|
1137
1195
|
return;
|
|
1138
1196
|
if (!data) {
|
|
1139
1197
|
this.updateHoverData();
|
|
@@ -1243,22 +1301,25 @@ Cursor.custom = {};
|
|
|
1243
1301
|
class HitCanvasManager extends core.CanvasManager {
|
|
1244
1302
|
constructor() {
|
|
1245
1303
|
super(...arguments);
|
|
1246
|
-
this.
|
|
1247
|
-
this.
|
|
1304
|
+
this.maxTotal = 1000;
|
|
1305
|
+
this.pathList = new core.LeafList();
|
|
1306
|
+
this.pixelList = new core.LeafList();
|
|
1248
1307
|
}
|
|
1249
|
-
|
|
1250
|
-
this.
|
|
1251
|
-
|
|
1308
|
+
getPixelType(leaf, config) {
|
|
1309
|
+
this.__autoClear();
|
|
1310
|
+
this.pixelList.add(leaf);
|
|
1311
|
+
return core.Creator.hitCanvas(config);
|
|
1252
1312
|
}
|
|
1253
1313
|
getPathType(leaf) {
|
|
1254
|
-
this.
|
|
1314
|
+
this.__autoClear();
|
|
1315
|
+
this.pathList.add(leaf);
|
|
1255
1316
|
return core.Creator.hitCanvas();
|
|
1256
1317
|
}
|
|
1257
1318
|
clearImageType() {
|
|
1258
|
-
this.__clearLeafList(this.
|
|
1319
|
+
this.__clearLeafList(this.pixelList);
|
|
1259
1320
|
}
|
|
1260
1321
|
clearPathType() {
|
|
1261
|
-
this.__clearLeafList(this.
|
|
1322
|
+
this.__clearLeafList(this.pathList);
|
|
1262
1323
|
}
|
|
1263
1324
|
__clearLeafList(leafList) {
|
|
1264
1325
|
if (leafList.length) {
|
|
@@ -1271,56 +1332,117 @@ class HitCanvasManager extends core.CanvasManager {
|
|
|
1271
1332
|
leafList.reset();
|
|
1272
1333
|
}
|
|
1273
1334
|
}
|
|
1335
|
+
__autoClear() {
|
|
1336
|
+
if (this.pathList.length + this.pixelList.length > this.maxTotal)
|
|
1337
|
+
this.clear();
|
|
1338
|
+
}
|
|
1274
1339
|
clear() {
|
|
1275
1340
|
this.clearPathType();
|
|
1276
1341
|
this.clearImageType();
|
|
1277
1342
|
}
|
|
1278
1343
|
}
|
|
1279
1344
|
|
|
1345
|
+
const canvas = core.LeaferCanvasBase.prototype;
|
|
1346
|
+
canvas.hitFill = function (point, fillRule) {
|
|
1347
|
+
return fillRule ? this.context.isPointInPath(point.x, point.y, fillRule) : this.context.isPointInPath(point.x, point.y);
|
|
1348
|
+
};
|
|
1349
|
+
canvas.hitStroke = function (point, strokeWidth) {
|
|
1350
|
+
this.strokeWidth = strokeWidth;
|
|
1351
|
+
return this.context.isPointInStroke(point.x, point.y);
|
|
1352
|
+
};
|
|
1353
|
+
canvas.hitPixel = function (radiusPoint, offset, scale = 1) {
|
|
1354
|
+
let { x, y, radiusX, radiusY } = radiusPoint;
|
|
1355
|
+
if (offset)
|
|
1356
|
+
x -= offset.x, y -= offset.y;
|
|
1357
|
+
core.tempBounds.set(x - radiusX, y - radiusY, radiusX * 2, radiusY * 2).scale(scale).ceil();
|
|
1358
|
+
const { data } = this.context.getImageData(core.tempBounds.x, core.tempBounds.y, core.tempBounds.width, core.tempBounds.height);
|
|
1359
|
+
for (let i = 0, len = data.length; i < len; i += 4) {
|
|
1360
|
+
if (data[i + 3] > 0)
|
|
1361
|
+
return true;
|
|
1362
|
+
}
|
|
1363
|
+
return data[3] > 0;
|
|
1364
|
+
};
|
|
1365
|
+
|
|
1280
1366
|
const { toInnerRadiusPointOf, copy, setRadius } = core.PointHelper;
|
|
1281
1367
|
const inner = {};
|
|
1282
|
-
core.Leaf.prototype
|
|
1283
|
-
|
|
1284
|
-
this.__updateHitCanvas();
|
|
1285
|
-
if (!this.__layout.boundsChanged)
|
|
1286
|
-
this.__layout.hitCanvasChanged = false;
|
|
1287
|
-
}
|
|
1368
|
+
const leaf = core.Leaf.prototype;
|
|
1369
|
+
leaf.__hitWorld = function (point) {
|
|
1288
1370
|
if (this.__.hitRadius) {
|
|
1289
1371
|
copy(inner, point), point = inner;
|
|
1290
1372
|
setRadius(point, this.__.hitRadius);
|
|
1291
1373
|
}
|
|
1292
1374
|
toInnerRadiusPointOf(point, this.__world, inner);
|
|
1293
|
-
|
|
1375
|
+
const { width, height } = this.__world;
|
|
1376
|
+
const isSmall = width < 10 && height < 10;
|
|
1377
|
+
if (this.__.hitBox || isSmall) {
|
|
1294
1378
|
if (core.BoundsHelper.hitRadiusPoint(this.__layout.boxBounds, inner))
|
|
1295
1379
|
return true;
|
|
1380
|
+
if (isSmall)
|
|
1381
|
+
return false;
|
|
1382
|
+
}
|
|
1383
|
+
if (this.__layout.hitCanvasChanged || !this.__hitCanvas) {
|
|
1384
|
+
this.__updateHitCanvas();
|
|
1385
|
+
if (!this.__layout.boundsChanged)
|
|
1386
|
+
this.__layout.hitCanvasChanged = false;
|
|
1296
1387
|
}
|
|
1297
1388
|
return this.__hit(inner);
|
|
1298
1389
|
};
|
|
1390
|
+
leaf.__hitFill = function (inner) { var _a; return (_a = this.__hitCanvas) === null || _a === void 0 ? void 0 : _a.hitFill(inner, this.__.windingRule); };
|
|
1391
|
+
leaf.__hitStroke = function (inner, strokeWidth) { var _a; return (_a = this.__hitCanvas) === null || _a === void 0 ? void 0 : _a.hitStroke(inner, strokeWidth); };
|
|
1392
|
+
leaf.__hitPixel = function (inner) { var _a; return (_a = this.__hitCanvas) === null || _a === void 0 ? void 0 : _a.hitPixel(inner, this.__layout.renderBounds, this.__hitCanvas.hitScale); };
|
|
1393
|
+
leaf.__drawHitPath = function (canvas) { if (canvas)
|
|
1394
|
+
this.__drawRenderPath(canvas); };
|
|
1299
1395
|
|
|
1300
|
-
|
|
1396
|
+
const matrix = new core.Matrix();
|
|
1397
|
+
const ui$1 = draw.UI.prototype;
|
|
1398
|
+
ui$1.__updateHitCanvas = function () {
|
|
1399
|
+
const data = this.__, { hitCanvasManager } = this.leafer;
|
|
1400
|
+
const isHitPixelFill = data.__pixelFill && data.hitFill === 'pixel';
|
|
1401
|
+
const isHitPixelStroke = data.__pixelStroke && data.hitStroke === 'pixel';
|
|
1402
|
+
const isHitPixel = isHitPixelFill || isHitPixelStroke;
|
|
1301
1403
|
if (!this.__hitCanvas)
|
|
1302
|
-
this.__hitCanvas = this
|
|
1404
|
+
this.__hitCanvas = isHitPixel ? hitCanvasManager.getPixelType(this, { contextSettings: { willReadFrequently: true } }) : hitCanvasManager.getPathType(this);
|
|
1303
1405
|
const h = this.__hitCanvas;
|
|
1406
|
+
if (isHitPixel) {
|
|
1407
|
+
const { renderBounds } = this.__layout;
|
|
1408
|
+
const size = core.Platform.image.hitCanvasSize;
|
|
1409
|
+
const scale = h.hitScale = core.tempBounds.set(0, 0, size, size).getFitMatrix(renderBounds, 0.5).a;
|
|
1410
|
+
const { x, y, width, height } = core.tempBounds.set(renderBounds).scale(scale);
|
|
1411
|
+
h.resize({ width, height, pixelRatio: 1 });
|
|
1412
|
+
h.clear();
|
|
1413
|
+
draw.ImageManager.patternLocked = true;
|
|
1414
|
+
this.__renderShape(h, { matrix: matrix.setWith(this.__world).scaleWith(1 / scale).invertWith().translate(-x, -y) }, !isHitPixelFill, !isHitPixelStroke);
|
|
1415
|
+
draw.ImageManager.patternLocked = false;
|
|
1416
|
+
h.resetTransform();
|
|
1417
|
+
data.__isHitPixel = true;
|
|
1418
|
+
}
|
|
1419
|
+
else {
|
|
1420
|
+
data.__isHitPixel && (data.__isHitPixel = false);
|
|
1421
|
+
}
|
|
1304
1422
|
this.__drawHitPath(h);
|
|
1305
|
-
h.setStrokeOptions(
|
|
1423
|
+
h.setStrokeOptions(data);
|
|
1306
1424
|
};
|
|
1307
|
-
|
|
1425
|
+
ui$1.__hit = function (inner) {
|
|
1308
1426
|
if (core.Platform.name === 'miniapp')
|
|
1309
1427
|
this.__drawHitPath(this.__hitCanvas);
|
|
1310
|
-
const
|
|
1311
|
-
|
|
1312
|
-
const isHitFill = this.__hitFill(inner, windingRule);
|
|
1313
|
-
if (needHitFill && isHitFill)
|
|
1428
|
+
const data = this.__;
|
|
1429
|
+
if (data.__isHitPixel && this.__hitPixel(inner))
|
|
1314
1430
|
return true;
|
|
1315
|
-
const {
|
|
1316
|
-
const
|
|
1431
|
+
const { hitFill } = data;
|
|
1432
|
+
const needHitFillPath = ((data.fill && hitFill == 'path') || hitFill === 'all');
|
|
1433
|
+
if (needHitFillPath && this.__hitFill(inner))
|
|
1434
|
+
return true;
|
|
1435
|
+
const { hitStroke, __strokeWidth } = data;
|
|
1436
|
+
const needHitStrokePath = ((data.stroke && hitStroke == 'path') || hitStroke === 'all');
|
|
1437
|
+
if (!needHitFillPath && !needHitStrokePath)
|
|
1438
|
+
return false;
|
|
1317
1439
|
const radiusWidth = inner.radiusX * 2;
|
|
1318
1440
|
let hitWidth = radiusWidth;
|
|
1319
|
-
if (
|
|
1320
|
-
switch (strokeAlign) {
|
|
1441
|
+
if (needHitStrokePath) {
|
|
1442
|
+
switch (data.strokeAlign) {
|
|
1321
1443
|
case 'inside':
|
|
1322
1444
|
hitWidth += __strokeWidth * 2;
|
|
1323
|
-
if (!
|
|
1445
|
+
if (!needHitFillPath && this.__hitFill(inner) && this.__hitStroke(inner, hitWidth))
|
|
1324
1446
|
return true;
|
|
1325
1447
|
hitWidth = radiusWidth;
|
|
1326
1448
|
break;
|
|
@@ -1329,8 +1451,8 @@ draw$1.UI.prototype.__hit = function (inner) {
|
|
|
1329
1451
|
break;
|
|
1330
1452
|
case 'outside':
|
|
1331
1453
|
hitWidth += __strokeWidth * 2;
|
|
1332
|
-
if (!
|
|
1333
|
-
if (!
|
|
1454
|
+
if (!needHitFillPath) {
|
|
1455
|
+
if (!this.__hitFill(inner) && this.__hitStroke(inner, hitWidth))
|
|
1334
1456
|
return true;
|
|
1335
1457
|
hitWidth = radiusWidth;
|
|
1336
1458
|
}
|
|
@@ -1340,22 +1462,22 @@ draw$1.UI.prototype.__hit = function (inner) {
|
|
|
1340
1462
|
return hitWidth ? this.__hitStroke(inner, hitWidth) : false;
|
|
1341
1463
|
};
|
|
1342
1464
|
|
|
1343
|
-
const ui = new draw
|
|
1344
|
-
draw
|
|
1465
|
+
const ui = new draw.UI();
|
|
1466
|
+
draw.Rect.prototype.__updateHitCanvas = function () {
|
|
1345
1467
|
if (this.stroke || this.cornerRadius)
|
|
1346
1468
|
ui.__updateHitCanvas.call(this);
|
|
1347
1469
|
};
|
|
1348
|
-
draw
|
|
1349
|
-
return this.__hitCanvas ? ui.__hitFill.call(this, inner
|
|
1470
|
+
draw.Rect.prototype.__hitFill = function (inner) {
|
|
1471
|
+
return this.__hitCanvas ? ui.__hitFill.call(this, inner) : core.BoundsHelper.hitRadiusPoint(this.__layout.boxBounds, inner);
|
|
1350
1472
|
};
|
|
1351
1473
|
|
|
1352
|
-
draw
|
|
1474
|
+
draw.UI.prototype.find = function (condition, options) {
|
|
1353
1475
|
return this.leafer ? this.leafer.selector.getBy(condition, this, false, options) : [];
|
|
1354
1476
|
};
|
|
1355
|
-
draw
|
|
1477
|
+
draw.UI.prototype.findOne = function (condition, options) {
|
|
1356
1478
|
return this.leafer ? this.leafer.selector.getBy(condition, this, true, options) : null;
|
|
1357
1479
|
};
|
|
1358
|
-
draw
|
|
1480
|
+
draw.Group.prototype.pick = function (hitPoint, options) {
|
|
1359
1481
|
this.__layout.update();
|
|
1360
1482
|
if (!options)
|
|
1361
1483
|
options = {};
|
|
@@ -1371,9 +1493,9 @@ exports.LeaferTypeCreator = LeaferTypeCreator;
|
|
|
1371
1493
|
exports.MultiTouchHelper = MultiTouchHelper;
|
|
1372
1494
|
exports.PointerButton = PointerButton;
|
|
1373
1495
|
exports.UIEvent = UIEvent;
|
|
1374
|
-
Object.keys(draw
|
|
1496
|
+
Object.keys(draw).forEach(function (k) {
|
|
1375
1497
|
if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
|
|
1376
1498
|
enumerable: true,
|
|
1377
|
-
get: function () { return draw
|
|
1499
|
+
get: function () { return draw[k]; }
|
|
1378
1500
|
});
|
|
1379
1501
|
});
|