mirror of
https://github.com/konvajs/konva.git
synced 2025-04-05 20:48:28 +08:00
typescript fixes, id warning template
This commit is contained in:
Anton Lavrenov
parent
22eee6530f
commit
973e7932e4
143
konva.d.ts
vendored
143
konva.d.ts
vendored
@ -6,7 +6,12 @@ declare namespace Konva {
|
||||
var DD: any;
|
||||
|
||||
type HandlerFunc = (
|
||||
e: { target: Konva.Shape; evt: Event; currentTarget: Konva.Node; cancelBubble: boolean }
|
||||
e: {
|
||||
target: Konva.Shape;
|
||||
evt: Event;
|
||||
currentTarget: Konva.Node;
|
||||
cancelBubble: boolean;
|
||||
}
|
||||
) => void;
|
||||
|
||||
enum KonvaNodeEvent {
|
||||
@ -28,7 +33,7 @@ declare namespace Konva {
|
||||
dbltap = 'dbltap',
|
||||
dragstart = 'dragstart',
|
||||
dragmove = 'dragmove',
|
||||
dragend = 'dragend',
|
||||
dragend = 'dragend'
|
||||
}
|
||||
|
||||
enum KonvaStageEvent {
|
||||
@ -45,7 +50,7 @@ declare namespace Konva {
|
||||
contentTouchmove = 'contentTouchmove',
|
||||
contentTouchend = 'contentTouchend',
|
||||
contentTap = 'contentTap',
|
||||
contentDblTap = 'contentDblTap',
|
||||
contentDblTap = 'contentDblTap'
|
||||
}
|
||||
|
||||
type KonvaEvent = KonvaNodeEvent & KonvaStageEvent;
|
||||
@ -139,48 +144,48 @@ declare namespace Konva {
|
||||
start(): Animation;
|
||||
stop(): Animation;
|
||||
}
|
||||
|
||||
|
||||
interface KonvaNodeEventMap extends KonvaStageEventMap {
|
||||
'mouseover': MouseEvent,
|
||||
'mouseout': MouseEvent,
|
||||
'mousemove': MouseEvent,
|
||||
'mouseleave': MouseEvent,
|
||||
'mouseenter': MouseEvent,
|
||||
'mousedown': MouseEvent,
|
||||
'mouseup': MouseEvent,
|
||||
'wheel': WheelEvent,
|
||||
'contextmenu': PointerEvent,
|
||||
'click': MouseEvent,
|
||||
'dblclick': MouseEvent,
|
||||
'touchstart': TouchEvent,
|
||||
'touchmove': TouchEvent,
|
||||
'touchend': TouchEvent,
|
||||
'tap': Event,
|
||||
'dbltap': Event,
|
||||
'dragstart': DragEvent,
|
||||
'dragmove': DragEvent,
|
||||
'dragend': DragEvent,
|
||||
'dragover': DragEvent,
|
||||
'drop': DragEvent,
|
||||
mouseover: MouseEvent;
|
||||
mouseout: MouseEvent;
|
||||
mousemove: MouseEvent;
|
||||
mouseleave: MouseEvent;
|
||||
mouseenter: MouseEvent;
|
||||
mousedown: MouseEvent;
|
||||
mouseup: MouseEvent;
|
||||
wheel: WheelEvent;
|
||||
contextmenu: PointerEvent;
|
||||
click: MouseEvent;
|
||||
dblclick: MouseEvent;
|
||||
touchstart: TouchEvent;
|
||||
touchmove: TouchEvent;
|
||||
touchend: TouchEvent;
|
||||
tap: Event;
|
||||
dbltap: Event;
|
||||
dragstart: DragEvent;
|
||||
dragmove: DragEvent;
|
||||
dragend: DragEvent;
|
||||
dragover: DragEvent;
|
||||
drop: DragEvent;
|
||||
}
|
||||
|
||||
interface KonvaStageEventMap {
|
||||
'contentMouseover': MouseEvent,
|
||||
'contentMousemove': MouseEvent,
|
||||
'contentMouseout': MouseEvent,
|
||||
'contentMousedown': MouseEvent,
|
||||
'contentMouseup': MouseEvent,
|
||||
'contentWheel': WheelEvent,
|
||||
'contentContextmenu': PointerEvent,
|
||||
'contentClick': MouseEvent,
|
||||
'contentDblclick': MouseEvent,
|
||||
'contentTouchstart': TouchEvent,
|
||||
'contentTouchmove': TouchEvent,
|
||||
'contentTouchend': TouchEvent,
|
||||
'contentTap': Event,
|
||||
'contentDblTap': Event,
|
||||
contentMouseover: MouseEvent;
|
||||
contentMousemove: MouseEvent;
|
||||
contentMouseout: MouseEvent;
|
||||
contentMousedown: MouseEvent;
|
||||
contentMouseup: MouseEvent;
|
||||
contentWheel: WheelEvent;
|
||||
contentContextmenu: PointerEvent;
|
||||
contentClick: MouseEvent;
|
||||
contentDblclick: MouseEvent;
|
||||
contentTouchstart: TouchEvent;
|
||||
contentTouchmove: TouchEvent;
|
||||
contentTouchend: TouchEvent;
|
||||
contentTap: Event;
|
||||
contentDblTap: Event;
|
||||
}
|
||||
|
||||
|
||||
interface NodeConfig {
|
||||
x?: number;
|
||||
y?: number;
|
||||
@ -296,7 +301,10 @@ declare namespace Konva {
|
||||
// CHECK
|
||||
getCanvas(): Canvas;
|
||||
getClassName(): string;
|
||||
getClientRect(attrs? : { skipTransform?: boolean, relativeTo?: object }): SizeConfig;
|
||||
getClientRect(attrs?: {
|
||||
skipTransform?: boolean;
|
||||
relativeTo?: object;
|
||||
}): SizeConfig;
|
||||
getContent(): HTMLDivElement;
|
||||
getDepth(): number;
|
||||
getHeight(): number;
|
||||
@ -353,7 +361,17 @@ declare namespace Konva {
|
||||
offsetX(offsetX: number): this;
|
||||
offsetY(): number;
|
||||
offsetY(offsetY: number): this;
|
||||
on<K extends keyof KonvaNodeEventMap>(evtStr: K, handler: (e: { target: Konva.Shape; evt: KonvaNodeEventMap[K]; currentTarget: Konva.Node; cancelBubble: boolean }) => void): this;
|
||||
on<K extends keyof KonvaNodeEventMap>(
|
||||
evtStr: K,
|
||||
handler: (
|
||||
e: {
|
||||
target: Konva.Shape;
|
||||
evt: KonvaNodeEventMap[K];
|
||||
currentTarget: Konva.Node;
|
||||
cancelBubble: boolean;
|
||||
}
|
||||
) => void
|
||||
): this;
|
||||
on(evtStr: KonvaEventString, handler: HandlerFunc): this;
|
||||
opacity(): number;
|
||||
opacity(opacity: number): this;
|
||||
@ -1145,10 +1163,17 @@ declare namespace Konva {
|
||||
resizeEnabled?: boolean;
|
||||
rotateEnabled?: boolean;
|
||||
rotationSnaps?: Array<number>;
|
||||
rotateHandlerOffset?: number;
|
||||
lineEnabled?: number;
|
||||
rotateAnchorOffset?: number;
|
||||
borderEnabled?: number;
|
||||
borderStroke?: string;
|
||||
borderStrokeWidth?: number;
|
||||
borderDash?: Array<number>;
|
||||
anchorFill?: string;
|
||||
anchorStroke?: string;
|
||||
anchorStrokeWidth?: number;
|
||||
anchorSize?: number;
|
||||
keepRatio?: boolean;
|
||||
enabledHandlers?: Array<string>;
|
||||
enabledAnchors?: Array<string>;
|
||||
node?: Rect;
|
||||
boundBoxFunc?: (oldBox: SizeConfig, newBox: SizeConfig) => SizeConfig;
|
||||
}
|
||||
@ -1160,7 +1185,33 @@ declare namespace Konva {
|
||||
getNode(): Node;
|
||||
detach(): void;
|
||||
forceUpdate(): void;
|
||||
update(): void;
|
||||
|
||||
resizeEnabled(): boolean;
|
||||
resizeEnabled(enabled: boolean): this;
|
||||
rotateEnabled(): boolean;
|
||||
rotateEnabled(enabled: boolean): this;
|
||||
rotationSnaps(): Array<number>;
|
||||
rotationSnaps(snaps: Array<number>): this;
|
||||
rotateAnchorOffset(): number;
|
||||
rotateAnchorOffset(offset: number): this;
|
||||
borderEnabled(): boolean;
|
||||
borderEnabled(enabled: boolean): this;
|
||||
borderStroke(): string;
|
||||
borderStroke(color: string): this;
|
||||
borderStrokeWidth(): number;
|
||||
borderStrokeWidth(width: number): this;
|
||||
borderDash(): Array<number>;
|
||||
borderDash(snaps: Array<number>): this;
|
||||
anchorFill(): string;
|
||||
anchorFill(color: string): this;
|
||||
anchorStroke(): string;
|
||||
anchorStroke(color: string): this;
|
||||
anchorStrokeWidth(): number;
|
||||
anchorStrokeWidth(width: number): this;
|
||||
anchorSize(): number;
|
||||
anchorSize(width: number): this;
|
||||
enabledAnchors(): Array<string>;
|
||||
enabledAnchors(names: Array<string>): this;
|
||||
}
|
||||
|
||||
interface Vector2d {
|
||||
|
||||
15
konva.js
15
konva.js
@ -2,7 +2,7 @@
|
||||
* Konva JavaScript Framework v2.2.1
|
||||
* http://konvajs.github.io/
|
||||
* Licensed under the MIT
|
||||
* Date: Thu Aug 16 2018
|
||||
* Date: Tue Aug 21 2018
|
||||
*
|
||||
* Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS)
|
||||
* Modified work Copyright (C) 2014 - present by Anton Lavrenov (Konva)
|
||||
@ -122,9 +122,18 @@
|
||||
return false;
|
||||
},
|
||||
_addId: function(node, id) {
|
||||
if (id !== undefined) {
|
||||
this.ids[id] = node;
|
||||
if (!id) {
|
||||
return;
|
||||
}
|
||||
// do we need this warning?
|
||||
// if (this.ids[id]) {
|
||||
// Konva.Util.warn(
|
||||
// 'Duplicate id "' +
|
||||
// id +
|
||||
// '". Please don not use same id several times. It may break find() method look up.'
|
||||
// );
|
||||
// }
|
||||
this.ids[id] = node;
|
||||
},
|
||||
_removeId: function(id) {
|
||||
if (id !== undefined) {
|
||||
|
||||
4
konva.min.js
vendored
4
konva.min.js
vendored
File diff suppressed because one or more lines are too long
@ -122,9 +122,18 @@
|
||||
return false;
|
||||
},
|
||||
_addId: function(node, id) {
|
||||
if (id !== undefined) {
|
||||
this.ids[id] = node;
|
||||
if (!id) {
|
||||
return;
|
||||
}
|
||||
// do we need this warning?
|
||||
// if (this.ids[id]) {
|
||||
// Konva.Util.warn(
|
||||
// 'Duplicate id "' +
|
||||
// id +
|
||||
// '". Please don not use same id several times. It may break find() method look up.'
|
||||
// );
|
||||
// }
|
||||
this.ids[id] = node;
|
||||
},
|
||||
_removeId: function(id) {
|
||||
if (id !== undefined) {
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
suite.only('Node', function() {
|
||||
suite('Node', function() {
|
||||
// ======================================================
|
||||
test('getType and getClassName', function() {
|
||||
var stage = addStage();
|
||||
@ -118,6 +118,22 @@ suite.only('Node', function() {
|
||||
assert.equal(layer.getAbsoluteOpacity(), 0.5);
|
||||
});
|
||||
|
||||
test.skip('warn on duplicate id', function() {
|
||||
var oldWarn = Konva.Util.warn;
|
||||
var called = false;
|
||||
Konva.Util.warn = function() {
|
||||
called = true;
|
||||
}
|
||||
var circle = new Konva.Circle({
|
||||
id: 'circle'
|
||||
});
|
||||
var circle = new Konva.Circle({
|
||||
id: 'circle'
|
||||
});
|
||||
assert.equal(called, true);
|
||||
Konva.Util.warn = oldWarn;
|
||||
})
|
||||
|
||||
// ======================================================
|
||||
test('transform cache', function() {
|
||||
var stage = addStage();
|
||||
@ -1650,7 +1666,6 @@ suite.only('Node', function() {
|
||||
var stage = addStage();
|
||||
var layer = new Konva.Layer({
|
||||
name: 'layerName',
|
||||
id: 'layerId'
|
||||
});
|
||||
var group = new Konva.Group({
|
||||
name: 'groupName',
|
||||
@ -1667,7 +1682,6 @@ suite.only('Node', function() {
|
||||
height: side,
|
||||
fill: 'red',
|
||||
name: 'rectName',
|
||||
id: 'rectId'
|
||||
});
|
||||
var marker = new Konva.Rect({
|
||||
x: side,
|
||||
@ -1709,13 +1723,11 @@ suite.only('Node', function() {
|
||||
var stage = addStage();
|
||||
var layer = new Konva.Layer({
|
||||
name: 'layerName',
|
||||
id: 'layerId',
|
||||
x: 100,
|
||||
y: 100
|
||||
});
|
||||
var group = new Konva.Group({
|
||||
name: 'groupName',
|
||||
id: 'groupId',
|
||||
x: 100,
|
||||
y: 100
|
||||
});
|
||||
@ -1726,7 +1738,6 @@ suite.only('Node', function() {
|
||||
height: 50,
|
||||
fill: 'red',
|
||||
name: 'rectName',
|
||||
id: 'rectId'
|
||||
});
|
||||
|
||||
group.add(rect);
|
||||
@ -1745,7 +1756,6 @@ suite.only('Node', function() {
|
||||
var stage = addStage();
|
||||
var layer1 = new Konva.Layer({
|
||||
name: 'layerName',
|
||||
id: 'layerId',
|
||||
x: 90,
|
||||
y: 110,
|
||||
offsetX: 50,
|
||||
@ -1754,7 +1764,6 @@ suite.only('Node', function() {
|
||||
});
|
||||
var group1 = new Konva.Group({
|
||||
name: 'groupName',
|
||||
id: 'groupId',
|
||||
x: 30,
|
||||
y: 30,
|
||||
offsetX: -60,
|
||||
@ -2642,11 +2651,11 @@ suite.only('Node', function() {
|
||||
context.fillStrokeShape(this);
|
||||
};
|
||||
var json =
|
||||
'{"attrs":{"width":578,"height":200},"className":"Stage","children":[{"attrs":{},"className":"Layer","children":[{"attrs":{},"className":"Group","children":[{"attrs":{"fill":"#00D2FF","stroke":"black","strokeWidth":4,"id":"myTriangle","customAttrObj":{"x":1,"y":5,"size":{"width":10,"height":20}}},"className":"Shape"}]}]}]}';
|
||||
'{"attrs":{"width":578,"height":200},"className":"Stage","children":[{"attrs":{},"className":"Layer","children":[{"attrs":{},"className":"Group","children":[{"attrs":{"fill":"#00D2FF","stroke":"black","strokeWidth":4,"id":"myTriangle1","customAttrObj":{"x":1,"y":5,"size":{"width":10,"height":20}}},"className":"Shape"}]}]}]}';
|
||||
|
||||
var stage = Konva.Node.create(json, container);
|
||||
|
||||
stage.find('#myTriangle').each(function(node) {
|
||||
stage.find('#myTriangle1').each(function(node) {
|
||||
node.sceneFunc(drawTriangle);
|
||||
});
|
||||
|
||||
@ -2690,11 +2699,11 @@ suite.only('Node', function() {
|
||||
var container = addContainer();
|
||||
imageObj.onload = function() {
|
||||
var json =
|
||||
'{"attrs":{"width":578,"height":200},"className":"Stage","children":[{"attrs":{},"className":"Layer","children":[{"attrs":{"x":200,"y":60,"offsetX":50,"offsetY":150,"id":"darth"},"className":"Image"}]}]}';
|
||||
'{"attrs":{"width":578,"height":200},"className":"Stage","children":[{"attrs":{},"className":"Layer","children":[{"attrs":{"x":200,"y":60,"offsetX":50,"offsetY":150,"id":"darth1"},"className":"Image"}]}]}';
|
||||
var stage = Konva.Node.create(json, container);
|
||||
|
||||
assert.equal(stage.toJSON(), json);
|
||||
stage.find('#darth').each(function(node) {
|
||||
stage.find('#darth1').each(function(node) {
|
||||
node.setImage(imageObj);
|
||||
});
|
||||
stage.draw();
|
||||
@ -3459,7 +3468,7 @@ suite.only('Node', function() {
|
||||
|
||||
test('toObject with property in attrs and instanse', function() {
|
||||
var node = new Konva.Circle({
|
||||
id: 'foo',
|
||||
id: 'foo1',
|
||||
radius: 10,
|
||||
filled: true
|
||||
});
|
||||
|
||||
Loading…
Reference in New Issue
Block a user