Merge pull request #1002 from moonrailgun/moonrailgun/export-box

export type box and others type complement
This commit is contained in:
Anton Lavrenov 2020-10-25 13:24:44 -05:00 committed by GitHub
commit 229032bd15
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 59 additions and 41 deletions

View File

@ -369,7 +369,17 @@ export class Context {
* @method * @method
* @name Konva.Context#drawImage * @name Konva.Context#drawImage
*/ */
drawImage(a0, a1, a2, a3?, a4?, a5?, a6?, a7?, a8?) { drawImage(
a0: CanvasImageSource,
a1: number,
a2: number,
a3?: number,
a4?: number,
a5?: number,
a6?: number,
a7?: number,
a8?: number
) {
var a = arguments, var a = arguments,
_context = this._context; _context = this._context;
@ -386,7 +396,16 @@ export class Context {
* @method * @method
* @name Konva.Context#ellipse * @name Konva.Context#ellipse
*/ */
ellipse(a0, a1, a2, a3, a4, a5, a6, a7) { ellipse(
a0: number,
a1: number,
a2: number,
a3: number,
a4: number,
a5: number,
a6: number,
a7?: boolean
) {
this._context.ellipse(a0, a1, a2, a3, a4, a5, a6, a7); this._context.ellipse(a0, a1, a2, a3, a4, a5, a6, a7);
} }
/** /**

View File

@ -326,9 +326,7 @@ export class Layer extends Container<Group | Shape> {
* // or if you interested in shape parent: * // or if you interested in shape parent:
* var group = layer.getIntersection({x: 50, y: 50}, 'Group'); * var group = layer.getIntersection({x: 50, y: 50}, 'Group');
*/ */
getIntersection(pos: Vector2d, selector?: string) { getIntersection(pos: Vector2d, selector?: string): Node | null {
var obj, i, intersectionOffset, shape;
if (!this.isListening() || !this.isVisible()) { if (!this.isListening() || !this.isVisible()) {
return null; return null;
} }
@ -337,13 +335,13 @@ export class Layer extends Container<Group | Shape> {
var spiralSearchDistance = 1; var spiralSearchDistance = 1;
var continueSearch = false; var continueSearch = false;
while (true) { while (true) {
for (i = 0; i < INTERSECTION_OFFSETS_LEN; i++) { for (let i = 0; i < INTERSECTION_OFFSETS_LEN; i++) {
intersectionOffset = INTERSECTION_OFFSETS[i]; const intersectionOffset = INTERSECTION_OFFSETS[i];
obj = this._getIntersection({ const obj = this._getIntersection({
x: pos.x + intersectionOffset.x * spiralSearchDistance, x: pos.x + intersectionOffset.x * spiralSearchDistance,
y: pos.y + intersectionOffset.y * spiralSearchDistance, y: pos.y + intersectionOffset.y * spiralSearchDistance,
}); });
shape = obj.shape; const shape = obj.shape;
if (shape && selector) { if (shape && selector) {
return shape.findAncestor(selector, true); return shape.findAncestor(selector, true);
} else if (shape) { } else if (shape) {
@ -365,21 +363,20 @@ export class Layer extends Container<Group | Shape> {
} }
} }
} }
_getIntersection(pos) { _getIntersection(pos: Vector2d): { shape?: Shape; antialiased?: boolean } {
var ratio = this.hitCanvas.pixelRatio; const ratio = this.hitCanvas.pixelRatio;
var p = this.hitCanvas.context.getImageData( const p = this.hitCanvas.context.getImageData(
Math.round(pos.x * ratio), Math.round(pos.x * ratio),
Math.round(pos.y * ratio), Math.round(pos.y * ratio),
1, 1,
1 1
).data, ).data;
p3 = p[3], const p3 = p[3];
colorKey,
shape;
// fully opaque pixel // fully opaque pixel
if (p3 === 255) { if (p3 === 255) {
colorKey = Util._rgbToHex(p[0], p[1], p[2]); const colorKey = Util._rgbToHex(p[0], p[1], p[2]);
shape = shapes[HASH + colorKey]; const shape = shapes[HASH + colorKey];
if (shape) { if (shape) {
return { return {
shape: shape, shape: shape,

View File

@ -21,6 +21,9 @@ export type ShapeConfigHandler<TTarget> = {
bivarianceHack(ctx: Context, shape: TTarget): void; bivarianceHack(ctx: Context, shape: TTarget): void;
}['bivarianceHack']; }['bivarianceHack'];
export type LineJoin = 'round' | 'bevel' | 'miter';
export type LineCap = 'butt' | 'round' | 'square';
export interface ShapeConfig extends NodeConfig { export interface ShapeConfig extends NodeConfig {
fill?: string; fill?: string;
fillPatternImage?: HTMLImageElement; fillPatternImage?: HTMLImageElement;
@ -58,8 +61,8 @@ export interface ShapeConfig extends NodeConfig {
strokeScaleEnabled?: boolean; strokeScaleEnabled?: boolean;
strokeHitEnabled?: boolean; strokeHitEnabled?: boolean;
strokeEnabled?: boolean; strokeEnabled?: boolean;
lineJoin?: string; lineJoin?: LineJoin;
lineCap?: string; lineCap?: LineCap;
sceneFunc?: (con: Context, shape: Shape) => void; sceneFunc?: (con: Context, shape: Shape) => void;
hitFunc?: (con: Context, shape: Shape) => void; hitFunc?: (con: Context, shape: Shape) => void;
shadowColor?: string; shadowColor?: string;
@ -98,7 +101,7 @@ function getDummyContext(): CanvasRenderingContext2D {
return dummyContext; return dummyContext;
} }
export const shapes = {}; export const shapes: { [key: string]: Shape } = {};
// TODO: idea - use only "remove" (or destroy method) // TODO: idea - use only "remove" (or destroy method)
// how? on add, check that every inner shape has reference in konva store with color // how? on add, check that every inner shape has reference in konva store with color
@ -179,7 +182,7 @@ export class Shape<Config extends ShapeConfig = ShapeConfig> extends Node<
constructor(config?: Config) { constructor(config?: Config) {
super(config); super(config);
// set colorKey // set colorKey
var key; let key: string;
while (true) { while (true) {
key = Util.getRandomColor(); key = Util.getRandomColor();
@ -795,8 +798,8 @@ export class Shape<Config extends ShapeConfig = ShapeConfig> extends Node<
fillPatternY: GetSet<number, this>; fillPatternY: GetSet<number, this>;
fillPriority: GetSet<string, this>; fillPriority: GetSet<string, this>;
hitFunc: GetSet<ShapeConfigHandler<this>, this>; hitFunc: GetSet<ShapeConfigHandler<this>, this>;
lineCap: GetSet<string, this>; lineCap: GetSet<LineCap, this>;
lineJoin: GetSet<string, this>; lineJoin: GetSet<LineJoin, this>;
perfectDrawEnabled: GetSet<boolean, this>; perfectDrawEnabled: GetSet<boolean, this>;
sceneFunc: GetSet<ShapeConfigHandler<this>, this>; sceneFunc: GetSet<ShapeConfigHandler<this>, this>;
shadowColor: GetSet<string, this>; shadowColor: GetSet<string, this>;

View File

@ -360,7 +360,7 @@ export class Stage extends Container<Layer> {
layer.draw(); layer.draw();
}); });
} }
add(layer) { add(layer: Layer) {
if (arguments.length > 1) { if (arguments.length > 1) {
for (var i = 0; i < arguments.length; i++) { for (var i = 0; i < arguments.length; i++) {
this.add(arguments[i]); this.add(arguments[i]);

View File

@ -5,6 +5,7 @@ import { getNumberValidator } from '../Validators';
import { _registerNode } from '../Global'; import { _registerNode } from '../Global';
import { GetSet, IRect } from '../types'; import { GetSet, IRect } from '../types';
import { Context } from '../Context';
export interface ImageConfig extends ShapeConfig { export interface ImageConfig extends ShapeConfig {
image: CanvasImageSource | undefined; image: CanvasImageSource | undefined;
@ -38,17 +39,15 @@ export class Image extends Shape<ImageConfig> {
_useBufferCanvas() { _useBufferCanvas() {
return super._useBufferCanvas(true); return super._useBufferCanvas(true);
} }
_sceneFunc(context) { _sceneFunc(context: Context) {
var width = this.getWidth(), const width = this.getWidth();
height = this.getHeight(), const height = this.getHeight();
image = this.attrs.image, const image = this.attrs.image;
cropWidth, let params;
cropHeight,
params;
if (image) { if (image) {
cropWidth = this.attrs.cropWidth; const cropWidth = this.attrs.cropWidth;
cropHeight = this.attrs.cropHeight; const cropHeight = this.attrs.cropHeight;
if (cropWidth && cropHeight) { if (cropWidth && cropHeight) {
params = [ params = [
image, image,

View File

@ -11,7 +11,7 @@ import { _registerNode } from '../Global';
import { GetSet, IRect, Vector2d } from '../types'; import { GetSet, IRect, Vector2d } from '../types';
interface Box extends IRect { export interface Box extends IRect {
rotation: number; rotation: number;
} }
@ -1208,7 +1208,7 @@ export class Transformer extends Group {
keepRatio: GetSet<boolean, this>; keepRatio: GetSet<boolean, this>;
centeredScaling: GetSet<boolean, this>; centeredScaling: GetSet<boolean, this>;
ignoreStroke: GetSet<boolean, this>; ignoreStroke: GetSet<boolean, this>;
boundBoxFunc: GetSet<(oldBox: IRect, newBox: IRect) => IRect, this>; boundBoxFunc: GetSet<(oldBox: Box, newBox: Box) => Box, this>;
shouldOverdrawWholeArea: GetSet<boolean, this>; shouldOverdrawWholeArea: GetSet<boolean, this>;
} }

View File

@ -43,7 +43,7 @@ export enum KonvaNodeEvent {
dbltap = 'dbltap', dbltap = 'dbltap',
dragstart = 'dragstart', dragstart = 'dragstart',
dragmove = 'dragmove', dragmove = 'dragmove',
dragend = 'dragend' dragend = 'dragend',
} }
export interface RGB { export interface RGB {