forked from fabricjs/fabric.js
-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
chore(TS): convert controls class and handlers (fabricjs#8400)
- Loading branch information
1 parent
0fb1bc4
commit 3ff8704
Showing
28 changed files
with
1,721 additions
and
1,379 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,7 +1,24 @@ | ||
| import type { Observable } from './mixins/observable.mixin'; | ||
| import type { Point } from './point.class'; | ||
| import { ModifierKey, TMat2D } from './typedefs'; | ||
|
|
||
| /** | ||
| * @todo remove transient | ||
| */ | ||
| export type Shadow = any; | ||
| export type Canvas = any; | ||
| export type Canvas = StaticCanvas & { | ||
| altActionKey: ModifierKey; | ||
| uniScaleKey: ModifierKey; | ||
| uniformScaling: boolean; | ||
| } & Record<string, any>; | ||
| export type StaticCanvas = Record<string, any> & { | ||
| getZoom(): number; | ||
| viewportTransform: TMat2D; | ||
| vptCoords: { | ||
| tl: Point; | ||
| br: Point; | ||
| }; | ||
| getRetinaScaling(): number; | ||
| } & Observable; | ||
| export type Rect = any; | ||
| export type TObject = any; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,71 @@ | ||
| import { fabric } from '../../HEADER'; | ||
| import { changeWidth } from './changeWidth'; | ||
| import { renderCircleControl, renderSquareControl } from './controls.render'; | ||
| import { dragHandler } from './drag'; | ||
| import { rotationStyleHandler, rotationWithSnapping } from './rotate'; | ||
| import { | ||
| scaleCursorStyleHandler, | ||
| scalingEqually, | ||
| scalingX, | ||
| scalingY, | ||
| } from './scale'; | ||
| import { | ||
| scaleOrSkewActionName, | ||
| scaleSkewCursorStyleHandler, | ||
| scalingXOrSkewingY, | ||
| scalingYOrSkewingX, | ||
| } from './scaleSkew'; | ||
| import { skewCursorStyleHandler, skewHandlerX, skewHandlerY } from './skew'; | ||
| import { getLocalPoint, getActionFromCorner } from './util'; | ||
| import { wrapWithFireEvent } from './wrapWithFireEvent'; | ||
| import { wrapWithFixedAnchor } from './wrapWithFixedAnchor'; | ||
|
|
||
| export { | ||
| scaleCursorStyleHandler, | ||
| skewCursorStyleHandler, | ||
| scaleSkewCursorStyleHandler, | ||
| rotationWithSnapping, | ||
| scalingEqually, | ||
| scalingX, | ||
| scalingY, | ||
| scalingYOrSkewingX, | ||
| scalingXOrSkewingY, | ||
| changeWidth, | ||
| skewHandlerX, | ||
| skewHandlerY, | ||
| dragHandler, | ||
| scaleOrSkewActionName, | ||
| rotationStyleHandler, | ||
| wrapWithFixedAnchor, | ||
| wrapWithFireEvent, | ||
| getLocalPoint, | ||
| getActionFromCorner, | ||
| renderCircleControl, | ||
| renderSquareControl, | ||
| }; | ||
|
|
||
| /** | ||
| * @todo remove as unused | ||
| */ | ||
| fabric.controlsUtils = { | ||
| scaleCursorStyleHandler, | ||
| skewCursorStyleHandler, | ||
| scaleSkewCursorStyleHandler, | ||
| rotationWithSnapping, | ||
| scalingEqually, | ||
| scalingX, | ||
| scalingY, | ||
| scalingYOrSkewingX, | ||
| scalingXOrSkewingY, | ||
| changeWidth, | ||
| skewHandlerX, | ||
| skewHandlerY, | ||
| dragHandler, | ||
| scaleOrSkewActionName, | ||
| rotationStyleHandler, | ||
| wrapWithFixedAnchor, | ||
| wrapWithFireEvent, | ||
| getLocalPoint, | ||
| renderCircleControl, | ||
| renderSquareControl, | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,52 @@ | ||
| import { TransformActionHandler } from '../typedefs'; | ||
| import { getLocalPoint, isTransformCentered } from './util'; | ||
| import { wrapWithFireEvent } from './wrapWithFireEvent'; | ||
| import { wrapWithFixedAnchor } from './wrapWithFixedAnchor'; | ||
|
|
||
| /** | ||
| * Action handler to change object's width | ||
| * Needs to be wrapped with `wrapWithFixedAnchor` to be effective | ||
| * @param {Event} eventData javascript event that is doing the transform | ||
| * @param {Object} transform javascript object containing a series of information around the current transform | ||
| * @param {number} x current mouse x position, canvas normalized | ||
| * @param {number} y current mouse y position, canvas normalized | ||
| * @return {Boolean} true if some change happened | ||
| */ | ||
| export const changeObjectWidth: TransformActionHandler = ( | ||
| eventData, | ||
| transform, | ||
| x, | ||
| y | ||
| ) => { | ||
| const localPoint = getLocalPoint( | ||
| transform, | ||
| transform.originX, | ||
| transform.originY, | ||
| x, | ||
| y | ||
| ); | ||
| // make sure the control changes width ONLY from it's side of target | ||
| if ( | ||
| transform.originX === 'center' || | ||
| (transform.originX === 'right' && localPoint.x < 0) || | ||
| (transform.originX === 'left' && localPoint.x > 0) | ||
| ) { | ||
| const { target } = transform, | ||
| strokePadding = | ||
| target.strokeWidth / (target.strokeUniform ? target.scaleX : 1), | ||
| multiplier = isTransformCentered(transform) ? 2 : 1, | ||
| oldWidth = target.width, | ||
| newWidth = Math.ceil( | ||
| Math.abs((localPoint.x * multiplier) / target.scaleX) - strokePadding | ||
| ); | ||
| target.set('width', Math.max(newWidth, 0)); | ||
| // check against actual target width in case `newWidth` was rejected | ||
| return oldWidth !== target.width; | ||
| } | ||
| return false; | ||
| }; | ||
|
|
||
| export const changeWidth = wrapWithFireEvent( | ||
| 'resizing', | ||
| wrapWithFixedAnchor(changeObjectWidth) | ||
| ); |
Oops, something went wrong.