You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

ray.tsx 2.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. import { v4 as uuid } from 'uuid'
  2. import * as vec from 'utils/vec'
  3. import { RayShape, ShapeType } from 'types'
  4. import { registerShapeUtils } from './index'
  5. import { boundsContained } from 'utils/bounds'
  6. import { intersectCircleBounds } from 'utils/intersections'
  7. import { DotCircle, ThinLine } from 'components/canvas/misc'
  8. import { translateBounds } from 'utils/utils'
  9. import { defaultStyle } from 'lib/shape-styles'
  10. const ray = registerShapeUtils<RayShape>({
  11. boundsCache: new WeakMap([]),
  12. create(props) {
  13. return {
  14. id: uuid(),
  15. type: ShapeType.Ray,
  16. isGenerated: false,
  17. name: 'Ray',
  18. parentId: 'page0',
  19. childIndex: 0,
  20. point: [0, 0],
  21. direction: [0, 1],
  22. rotation: 0,
  23. isAspectRatioLocked: false,
  24. isLocked: false,
  25. isHidden: false,
  26. ...props,
  27. style: {
  28. ...defaultStyle,
  29. ...props.style,
  30. isFilled: false,
  31. },
  32. }
  33. },
  34. render({ id, direction }) {
  35. const [x2, y2] = vec.add([0, 0], vec.mul(direction, 10000))
  36. return (
  37. <g id={id}>
  38. <ThinLine x1={0} y1={0} x2={x2} y2={y2} />
  39. <DotCircle cx={0} cy={0} r={3} />
  40. </g>
  41. )
  42. },
  43. getRotatedBounds(shape) {
  44. return this.getBounds(shape)
  45. },
  46. getBounds(shape) {
  47. if (!this.boundsCache.has(shape)) {
  48. const bounds = {
  49. minX: 0,
  50. maxX: 1,
  51. minY: 0,
  52. maxY: 1,
  53. width: 1,
  54. height: 1,
  55. }
  56. this.boundsCache.set(shape, bounds)
  57. }
  58. return translateBounds(this.boundsCache.get(shape), shape.point)
  59. },
  60. getCenter(shape) {
  61. return shape.point
  62. },
  63. hitTest(shape, test) {
  64. return true
  65. },
  66. hitTestBounds(this, shape, brushBounds) {
  67. const shapeBounds = this.getBounds(shape)
  68. return (
  69. boundsContained(shapeBounds, brushBounds) ||
  70. intersectCircleBounds(shape.point, 4, brushBounds).length > 0
  71. )
  72. },
  73. transform(shape, bounds) {
  74. shape.point = [bounds.minX, bounds.minY]
  75. return this
  76. },
  77. transformSingle(shape, bounds, info) {
  78. return this.transform(shape, bounds, info)
  79. },
  80. canTransform: false,
  81. canChangeAspectRatio: false,
  82. canStyleFill: false,
  83. })
  84. export default ray