{"version":3,"file":"initializeCanvasEvents.min.mjs","sources":["../../../../src/canvas/canvasx/initializeCanvasEvents.ts"],"sourcesContent":["import { Point } from '../../Point';\nimport { ActiveSelection } from '../../shapes/ActiveSelection';\nimport { XCanvas } from './bx-canvas';\n\nexport function initializeCanvasEvents(canvas: XCanvas) {\n  let endX;\n  let endY;\n  let mouseMoveHandler: any = null;\n\n  let timer = null;\n\n  var scale = 1;\n  let rotation = 0;\n  let gestureStartRotation = 0;\n  let gestureStartScale = 0;\n  var scale = 1;\n  let posX = 0;\n  let posY = 0;\n  let sX;\n  let sY;\n\n  function getIsFirefox() {\n    // Check if the current browser is Firefox\n    const isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;\n    return isFirefox;\n  }\n  /**\n   * handle the mouse wheel event\n   */\n  function isTrackpadOrMouse(e: any) {\n    // Check if the current device is a Mac\n    const isMac = /macintosh|mac os x/i.test(navigator.userAgent);\n    // Initialize a default value for the isTrackpad variable\n    let isTrackpad = false;\n\n    if (isMac) {\n      //On a Mac device\n      if (e.wheelDeltaY) {\n        // if the scrolling is in the Y direction\n        // check for equality between wheelDeltaY and deltaY times -3\n        // if they're equal, the input device is a trackpad\n        if (e.wheelDeltaY === e.deltaY * -3) {\n          isTrackpad = true;\n        }\n      } else if (e.deltaMode === 0) {\n        //deltaMode of 0 indicates that the unit of the delta values is in pixels\n        // which means the input device is a trackpad\n        isTrackpad = true;\n      }\n    } else {\n      //On a Non-Mac device\n      if (getIsFirefox()) {\n        // check the deltaY and deltaX values for a Firefox browser\n        isTrackpad =\n          e.deltaY !== 0\n            ? e.wheelDeltaY !== e.deltaY * -3\n            : e.deltaX !== 0\n            ? e.wheelDeltaX !== e.deltaX * -3\n            : false;\n        // If deltaY is equal to wheelDeltaY times -1, it's a trackpad\n      } else if (e.deltaY === e.wheelDeltaY * -1) {\n        isTrackpad = true;\n      }\n    }\n\n    // Return if the input device is a trackpad\n    return isTrackpad;\n  }\n\n  function whiteboardMouseMoveListener(event: any) {\n    // Set mouse moved attribute to true on canvas object\n    // canvas.mouse.moved = true;\n\n    // Return if event exists and event type is 'touchmove'\n    if (event && event.e.type === 'touchmove') return;\n\n    const { e } = event;\n\n    // Define speed for moving\n    const moveSpeeding = 7;\n\n    // Handle moving of active object on the canvas with specified speed\n    if (canvas.getActiveObject() && canvas.getActiveObject()?.isMoving) {\n      handleMoving(e, moveSpeeding);\n    }\n  }\n\n  function handleMoving(e: any, moveSpeeding: any) {\n    /*\n     * This function handles moving an object on the canvas when the object is near canvas edge.\n     * 4 situations are covered:\n     * 1. object is near the bottom edge\n     * 2. object is near the top edge, due to the top-menu, there is a range of 75px rather than the standard 50px\n     * 3. object is near the left edge\n     * 4. object is near the right edge\n     *\n     * The logic uses 4 'if' conditions rather than 'if-elseif' to allow functioning on 4 corners at the same time.\n     */\n\n    if (!canvas.getActiveObject()) return;\n\n    // Handle when object is near bottom edge\n    if (document.documentElement.clientHeight - e.y < 50) {\n      // Move the object down\n      canvas!\n        .getActiveObject()!\n        .set(\n          'top',\n          canvas.getActiveObject()!.top + moveSpeeding / canvas.getZoom()\n        );\n      // Set the object's dirty attribute to true\n      canvas.getActiveObject()!.dirty = true;\n      // Pan the canvas upwards\n      canvas.relativePan({ x: 0, y: -moveSpeeding });\n    }\n\n    // Handle when object is near top edge\n    if (e.y <= 75) {\n      // Move the object up\n      canvas\n        .getActiveObject()!\n        .set(\n          'top',\n          canvas.getActiveObject()!.top - moveSpeeding / canvas.getZoom()\n        );\n      // Set the object's dirty attribute to true\n      canvas.getActiveObject()!.dirty = true;\n      // Pan the canvas downwards\n      canvas.relativePan({ x: 0, y: moveSpeeding });\n    }\n\n    // Handle when object is near left edge\n    if (e.x <= 50) {\n      // Move the object to the left\n      canvas\n        .getActiveObject()!\n        .set(\n          'left',\n          canvas.getActiveObject()!.left - moveSpeeding / canvas.getZoom()\n        );\n      // Set the object's dirty attribute to true\n      canvas.getActiveObject()!.dirty = true;\n      // Pan the canvas to the right\n      canvas.relativePan({ x: moveSpeeding, y: 0 });\n    }\n\n    // Handle when object is near right edge\n    if (document.documentElement.clientWidth - e.x < 50) {\n      // Move the object to the right\n      canvas\n        .getActiveObject()!\n        .set(\n          'left',\n          canvas.getActiveObject()!.left + moveSpeeding / canvas.getZoom()\n        );\n      // Set the object's dirty attribute to true\n      canvas.getActiveObject()!.dirty = true;\n      // Pan the canvas to the left\n      canvas.relativePan({ x: -moveSpeeding, y: 0 });\n    }\n\n    // Redraw all objects on canvas\n    canvas.requestRenderAll();\n  }\n\n  function changeCursorForArrow() {\n    // Change the cursor on the canvas to a crosshair\n    canvas.setCursor('crosshair');\n  }\n\n  /**\n   * canvas mouseup event listener\n   */\n  function whiteboardMouseUpListener(event: any) {\n    // 使用事件服务反注册函`changeCursor`的`CANVAS_MOUSE_MOVE`事件\n\n    canvas.off('mouse:move', changeCursor);\n    // 如果事件类型是'touchend'，则直接返回\n    if (event && event.e.type === 'touchend') {\n      return;\n    }\n    // 如果没有这个鼠标抬起事件，设置鼠标按下状态为假\n    // canvas.mouse.down = false;\n    // 为`panMode`赋值`.board.isPanMode` 或者 null\n    const panMode = false;\n    // 如果处于平移模式，鼠标样式设置为'grabbing'\n    if (panMode) {\n      canvas.setCursor('grabbing');\n    } else {\n      // 否则鼠标样式设置为'default'\n      canvas.setCursor('default');\n    }\n    // 如果mouseMoveHandler不为null，清除鼠标移动事件的定时器\n    if (mouseMoveHandler !== null) {\n      clearInterval(mouseMoveHandler);\n    }\n\n    // 如果没有提供画布就直接返回\n    if (!canvas) {\n      return;\n    }\n\n    // // 使用事件服务取消注册白板的鼠标抬起事件监听器\n    // EventService.getInstance().unregister(\n    //   EventNames.CANVAS_MOUSE_UP,\n    //   whiteboardMouseUpListener,\n    // );\n\n    canvas.off('mouse:up', whiteboardMouseUpListener);\n\n    // // 如果处于箭头模式，保存箭头\n    // if (store.getState().board.arrowMode) {\n    //   saveArrow();\n    // }\n  }\n\n  // function saveArrow() {\n  //   // 如果箭头的起始点X坐标非空\n  //   if (canvas.arrowStartX) {\n  //     // 调用画布上的drawArrowSave方法保存箭头图形，参数包括箭头的起始点和终止点\n  //     canvas.drawArrowSave(canvas.arrowStartX, canvas.arrowStartY, endX, endY);\n  //     // 保存后将箭头的起始点重置为null\n  //     canvas.arrowStartX = null;\n  //     canvas.arrowStartY = null;\n  //   }\n  // }\n\n  function changeCursor() {\n    if (!canvas.getActiveObject()) return;\n    // 如果当前活动的物体存在并且被锁定\n    if (canvas.getActiveObject()!.locked) {\n      // 设置鼠标光标样式为'grabbing'，表示在移动可拖动的物体\n      canvas.setCursor('grabbing');\n    }\n  }\n  /**\n   * canvas mouseout event listener\n   * @param {*} event\n   */\n  function whiteboardMouseOutListener(event: any) {\n    canvas.mouse.down = false;\n  }\n\n  function whiteboardMouseDownListener(event: any) {\n    // If there is an active object on the canvas,\n    // we register an event handler for mouse-move events that changes the cursor.\n    if (canvas.getActiveObject()) {\n      canvas.on('mouse:move', changeCursor);\n      // EventService.getInstance().register(\n      //   EventNames.CANVAS_MOUSE_MOVE,\n      //   changeCursor,\n      // );\n    }\n\n    // If the target of the event is null or undefined, we discard the active object,\n    // set the cursor to the default type, and call the function to show the menu.\n    if (event.target == null || event.target === undefined) {\n      canvas.discardActiveObject();\n      canvas.setCursor('default');\n      canvas.defaultCursor = 'default';\n      canvas.hoverCursor = 'move';\n      canvas.requestRenderAll();\n      // showMenu(canvas);\n    }\n\n    // We flag that the mouse has not moved yet\n    // canvas.mouse.moved = false;\n\n    // If the active object is in edit mode, we return and do nothing.\n    //@ts-ignore\n    if (canvas.getActiveObject() && canvas.getActiveObject()!.isEditing) return;\n\n    //If the shift key was pressed during the event, we add the target to the active selection.\n    if (canvas.getActiveObject() && event.target && event.e.shiftKey) {\n      const objects = canvas.getActiveObjects();\n      const sel = new ActiveSelection(); // canvas.getActiveSelection();\n      sel.add(...objects, event.target);\n      canvas.setActiveObject(sel);\n      canvas.requestRenderAll();\n      return;\n    }\n\n    // If the target of the event is in edit mode, we return true.\n    if (event.target && event.target.isEditing) return true;\n\n    // We check if the whiteboard is in pan mode.\n    const panMode = false; // store.getState().board.isPanMode || null;\n    // We flag that the mouse is down.\n    canvas.mouse.down = true;\n\n    // We register the mouse-up event listener.\n    canvas.on('mouse:up', whiteboardMouseUpListener);\n    // EventService.getInstance().register(\n    //   EventNames.CANVAS_MOUSE_UP,\n    //   whiteboardMouseUpListener,\n    // );\n\n    // // We store the current mouse positions (X and Y coordinates).\n    // canvas.lastPosX = event.e.offsetX;\n    // canvas.lastPosY = event.e.offsetY;\n\n    // // We initialize the mouse delta values.\n    // canvas.mouseDeltaX = 0;\n    // canvas.mouseDeltaY = 0;\n  }\n\n  /**\n   * switch the interaction mode, mouse or trackpad\n   * @param {string} interactionMode\n   */\n  function switchInteractionMode(interactionMode: any) {\n    // Checking if canvas is not available, or the current UI is mobile. If either is true, exit the function.\n    // if (!canvas || store.getState().system.currentUIType === 'mobile')\n    //   return;\n\n    // Removing event handlers for touch:drag and touchend events on the canvas container.\n    // $('#canvasContainer').off('touch:drag');\n    // $('#canvasContainer').off('touchend');\n\n    // Registering a whiteboardMouseOutListener to handle a canvas mouse out event using the EventService register method.\n    canvas.on('mouse:out', whiteboardMouseOutListener);\n    // EventService.getInstance().register(\n    //   EventNames.CANVAS_MOUSE_OUT,\n    //   whiteboardMouseOutListener,\n    // );\n\n    // Registering a whiteboardMouseDownListener to handle a canvas mouse down event.\n    canvas.on('mouse:down', whiteboardMouseDownListener);\n    // EventService.getInstance().register(\n    //   EventNames.CANVAS_MOUSE_DOWN,\n    //   whiteboardMouseDownListener,\n    // );\n\n    // Registering a whiteboardMouseDownListener to handle a canvas mouse down event before the original event.\n    canvas.on('mouse:down:before', whiteboardMouseDownListener);\n    // EventService.getInstance().register(\n    //   EventNames.CANVAS_MOUSE_DOWN_BEFORE,\n    //   whiteboardMouseDownListener,\n    // );\n\n    // Registering a whiteboardMouseMoveListener to handle a canvas mouse move event.\n    canvas.on('mouse:move', whiteboardMouseMoveListener);\n    // EventService.getInstance().register(\n    //   EventNames.CANVAS_MOUSE_MOVE,\n    //   whiteboardMouseMoveListener,\n    // );\n    //todo: need to check\n    // Registering a windowGestureStarthandler to handle a window gesture start event.\n    // canvas.on('gesture:start', windowGestureStarthandler);\n    // EventService.getInstance().register(\n    //   EventNames.WINDOW_GESTURE_START,\n    //   windowGestureStarthandler,\n    // );\n\n    // Registering a windowGestureChangeHandler to handle a window gesture change event.\n    // canvas.on('gesture:change', windowGestureChangeHandler);\n    // EventService.getInstance().register(\n    //   EventNames.WINDOW_GESTURE_CHANGE,\n    //   windowGestureChangeHandler,\n    // );\n  }\n\n  const windowGestureStarthandler = (e: any) => {\n    // Initialize the touch position, rotation and scale at the start of a gesture\n    sX = e.pageX - posX;\n    sY = e.pageY - posY;\n    gestureStartRotation = rotation;\n    gestureStartScale = scale;\n\n    // Prevent the default action and stop the propagation of the event to the parent elements\n    e.preventDefault();\n    e.stopPropagation();\n  };\n\n  function recoverEventsByInteractionMode() {\n    // Fetch the interaction mode that is currently stored in the canvas state\n    const interactionMode = canvas.interactionMode;\n    // Call the function to switch interaction mode with the current interaction mode as the argument\n    // SwitchInteractionMode function will register events based on interaction mode\n    switchInteractionMode(interactionMode);\n  }\n\n  // export async function doubleClickToCreateStickyNote(e) {\n  //   // Exit the function if an inappropriate mode is selected or a file is being dragged or a click is being processed\n  //   if (store.getState().mode.type === 'draw' || store.getState().mode.type === 'line' ||\n  //     canvas.isDrawingMode ||\n  //     (canvas.getActiveObject() && canvas.getActiveObject().objType === 'XFile') ||\n  //     canvas.mouse.moved\n  //   ) {\n  //     return;\n  //   }\n  //   // Find the currently focused object\n  //   const target = canvas.findTarget(e);\n\n  //   // If the target is of a note type and is editable, enter edit mode\n  //   if (\n  //     target &&\n  //     (target.objType === 'WBRectNotes' ||\n  //       target.objType === 'XCircleNotes' ||\n  //       target.objType === 'WBTextbox' ||\n  //       target.objType === 'WBText' ||\n  //       target.objType === 'WBShapeNotes' ||\n  //       target.type === 'textbox') &&\n  //     target.editable &&\n  //     !target.isPanel\n  //   ) {\n  //     target.enterEditing();\n  //     return;\n  //   }\n\n  //   // If the target is of a note or image type and is editable, exit the function\n  //   if (\n  //     target &&\n  //     (target.objType === 'WBRectNotes' ||\n  //       target.objType === 'XCircleNotes' ||\n  //       target.objType === 'WBUrlImage' ||\n  //       target.objType === 'WBTextbox' ||\n  //       target.objType === 'WBText' ||\n  //       target.objType === 'WBShapeNotes') &&\n  //     target.editable\n  //   ) {\n  //     return;\n  //   }\n\n  //   // Define user's default note configuration\n  //   const { defaultNote } = canvas;\n\n  //   // Get the position of the click event\n  //   const positionOfClick = e.pointerType ? e.srcEvent : e.e;\n\n  //   // Calculate the position of the next object on the canvas\n  //   const nextObject = await canvas.getNextObjectByPoint(\n  //     { x: positionOfClick.offsetX, y: positionOfClick.offsetY },\n  //     defaultNote.width * defaultNote.scaleX,\n  //     defaultNote.height * defaultNote.scaleY,\n  //   );\n\n  //   let position = {};\n  //   if (!nextObject) {\n  //     // If there is no next object, get the position on canvas where click event occurred\n  //     position = canvas.getPositionOnCanvas(\n  //       positionOfClick.offsetX,\n  //       positionOfClick.offsetY,\n  //     );\n  //   } else {\n  //     // If there is a next object, set the position and properties of the note to be created similar to the next object\n  //     position.left = nextObject.left;\n  //     position.top = nextObject.top;\n  //     defaultNote.width = nextObject.width;\n  //     defaultNote.height = nextObject.height;\n  //     defaultNote.scaleX = nextObject.scaleX;\n  //     defaultNote.scaleY = nextObject.scaleY;\n  //     defaultNote.fontSize = nextObject.fontSize;\n  //     defaultNote.fontWeight = nextObject.fontWeight;\n  //     defaultNote.fontFamily = nextObject.fontFamily;\n  //     defaultNote.textAlign = nextObject.textAlign;\n  //     defaultNote.backgroundColor = nextObject.backgroundColor;\n  //     defaultNote.fill = nextObject.fill;\n  //     defaultNote.objType = nextObject.objType;\n  //     canvas.changeDefaulNote(defaultNote);\n  //   }\n\n  //   // Set other properties of the note\n  //   const note = {\n  //     // Initialized note properties\n  //   }\n\n  //   note.id = UtilityService.getInstance().generateWidgetID();\n  //   // Create and add widget from note properties\n  //   // Rest of the function\n  // }\n\n  function onTextChanged(e: any) {\n    e.target.changed = true;\n    //syncObjectChangeToRemote\n    // canvas.syncObjectChangeToRemote(e.target.id, { text: e.target.text });\n  }\n\n  function onTextEditingExited(event: any) {\n    return;\n    // Extract target from the event object\n    const { target } = event;\n\n    // Get the widget with the corresponding id from the widget list\n    const widget = canvas.findById(target.id);\n\n    // If the event target hasn't changed, return immediately\n    if (!event.target.changed) return;\n\n    // If the related widget does not exist, return immediately\n    if (!widget) return;\n\n    // Inform the server that the text property of the target has been modified\n    target.saveData('MODIFIED', ['text']);\n    // Reset the 'changed' status of the event target\n    event.target.changed = false;\n\n    // Return to the previous viewpoint in the canvas\n    canvas.gobackToPreviousViewport();\n\n    // Remove the currently active object from the canvas\n    canvas.discardActiveObject();\n\n    // Request the canvas to re-render all of its objects\n    canvas.requestRenderAll();\n  }\n\n  async function onObjectSelectionCleared() {\n    // 获取当前在画布上活动的对象\n    const target = canvas.getActiveObject();\n\n    // 上传被绘制的笔记\n    // uploadTheNotesDraw(target);\n\n    // 显示菜单，该行代码已被注释，如果需要就取消注释\n    // showMenu(canvas);\n\n    // 如果当前处于自定义颜色模式,则关闭自定义颜色模式\n    // if (store.getState().widgets.customColorMode) {\n    //   store.dispatch(handleSetCustomColorMode(false));\n    // }\n\n    // // 如果当前处于自定义颜色边框模式,则关闭自定义颜色边框模式\n    // if (Session.get('customColorBorderMode')) {\n    //   Session.set('customColorBorderMode', false);\n    // }\n  }\n\n  function onSelectionUpdated(e: any) {\n    // If the number of active objects on the canvas are more than one,\n    // then lock the scaling option that keeps the object's aspect ratio fixed.\n    // if (canvas.getActiveObjects().length > 1) {\n    //   canvas.getActiveObject()!.lockUniScaling = true;\n    // }\n    // Display the context menu, this line of code is commented. If required, you can remove the comment.\n    // showMenu(e);\n  }\n\n  function clearCanvasEvent() {\n    // Checks if a mouseMoveHandler exists\n    if (mouseMoveHandler !== null) {\n      // If it exists, clear the timer associated with the mouseMoveHandler\n      // This effectively ends tracking of mouse movement over the canvas\n      clearInterval(mouseMoveHandler);\n    }\n  }\n\n  function checkIsTrackpad(e: any) {\n    const inputDevice = localStorage.getItem('inputDevice');\n    if (inputDevice === 'trackpad') {\n      return true;\n    }\n\n    const isMac = /macintosh|mac os x/i.test(navigator.userAgent);\n    let isTrackpad = false;\n\n    const isFirefox = false; //SystemService.getInstance().getIsFirefox();\n\n    // console.log('isFirefox', isFirefox);\n\n    if (isMac) {\n      isTrackpad = checkMacTrackpad(e);\n    } else {\n      isTrackpad = checkNonMacTrackpad(e, isFirefox);\n    }\n\n    return isTrackpad;\n  }\n\n  function checkMacTrackpad(e: any) {\n    // console.log('checkMacTrackpad', e.deltaY );\n    // Commonly, trackpads will have a non-integer `deltaY` value when scrolling, whereas a mouse will have an integer.\n    // This is not universally true, but it holds up in many cases.\n    const isLikelyTrackpad = e.deltaY !== Math.round(e.deltaY);\n\n    return !isLikelyTrackpad;\n  }\n\n  function checkNonMacTrackpad(e: any, isFirefox: boolean) {\n    if (isFirefox) {\n      return (\n        e.deltaMode === e.DOM_DELTA_PIXEL && e.deltaX === 0 && e.deltaY === 0\n      );\n    }\n\n    return e.deltaY === e.wheelDeltaY * -1;\n  }\n\n  // let timer = null;\n\n  function mouseWheelListener(e: any) {\n    e.preventDefault();\n    e.stopPropagation();\n    const isTrackpad = checkIsTrackpad(e) && !e.ctrlKey;\n\n    if (e.buttons !== 0) {\n      // console.log('e.buttons !== 0', e)\n      return;\n    }\n\n    // if (timer && canvas.getActiveObject()) {\n    //   clearTimeout(timer);\n    //   timer = null;\n    // }\n\n    // timer = setTimeout(() => {\n\n    //   showMenu(canvas)\n\n    // }, 200);\n\n    const isMac = /macintosh|mac os x/i.test(navigator.userAgent);\n    // console.log('isMac', isMac, 'isTrackpad', isTrackpad);;\n\n    // store.dispatch(handleWidgetMenuDisplay(false));\n\n    // const users = store.getState().user.onlineUsers;\n\n    const deltaY = Math.abs(e.deltaY);\n\n    if (isTrackpad) {\n      const delta = { x: 0, y: 0 };\n      delta.x -= e.deltaX;\n\n      delta.y -= e.deltaY;\n      // canvas.mouse.delta.x -= e.deltaX;\n\n      // canvas.mouse.delta.y -= e.deltaY;\n\n      canvas.isEnablePanMoving = true;\n\n      // canvas.relativePan(canvas.mouse.delta);\n      // console.log('delta', delta)\n      canvas.relativePan(delta);\n\n      // canvas.updateViewportToLocalStorage(canvas.viewportTransform);\n\n      canvas.requestRenderAll();\n\n      // canvas.mouse.delta.x = 0;\n\n      // canvas.mouse.delta.y = 0;\n\n      // if (\n      //   store.getState().board.followMe &&\n      //   users.length - 1 > 0\n      // ) {\n\n      //   canvas.updateViewport();\n\n      // }\n\n      return false;\n    }\n\n    const isPanAction =\n      Math.abs(e.deltaX) !== 0 || parseInt(deltaY.toString()) === deltaY;\n\n    if (isMac && isPanAction) {\n      return false;\n    }\n\n    let zoom = canvas.getZoom();\n\n    if (isMac) {\n      zoom *= 0.999 ** (e.deltaY * 10);\n\n      if (deltaY > 100) {\n        zoom = canvas.getZoom() * 0.999 ** (e.deltaY / 6.6);\n      }\n    } else {\n      if (isPanAction) {\n        zoom = canvas.getZoom() * 0.999 ** e.deltaY;\n      } else {\n        zoom = canvas.getZoom() * 1.001 ** (e.wheelDelta / 2);\n      }\n    }\n\n    if (zoom > 4) zoom = 4;\n\n    if (zoom < 0.05) zoom = 0.05;\n\n    // store.dispatch(handleSetZoomFactor(zoom));\n\n    canvas.zoomToPoint(new Point({ x: e.layerX, y: e.layerY }), zoom);\n\n    // canvas.updateViewportToLocalStorage(canvas.viewportTransform);\n\n    canvas.requestRenderAll();\n\n    // if (\n    //   store.getState().board.followMe &&\n    //   users.length - 1 > 0\n    // ) {\n\n    //   // canvas.updateViewport();\n\n    // }\n    const objects = canvas.getObjects();\n\n    if (objects && objects.length > 0) {\n      const zoom = canvas.getZoom();\n      objects.map((obj: any) => {\n        let limitWidth = obj.width * obj.scaleX * zoom;\n        if (limitWidth < 32) {\n          obj.set({\n            hasControls: false,\n          });\n        } else {\n          obj.set({\n            hasControls: true,\n          });\n        }\n        //deal with pic\n        if (obj.objType === 'WBImage' && zoom > 0.4) {\n          if (obj.src) {\n            let pic = obj.src.replace('smallPic/', 'bigPic/');\n            obj.set({ src: pic });\n          }\n        }\n\n        if (obj.objType === 'WBImage' && zoom < 0.4) {\n          if (obj.src) {\n            let pic = obj.src.replace('bigPic/', 'smallPic/');\n            obj.set({ src: pic });\n          }\n        }\n      });\n    }\n  }\n\n  // For all future instances of fabric.Object, transparent corners are disabled\n  // fabric.Object.prototype.transparentCorners = false;\n\n  // Set the cursor style for rotating objects in the canvas to 'alias'\n  // canvas.rotationCursor = 'alias';\n\n  // Register event listener for 'TEXT_EDITING_EXISTED' event, to call the function 'onTextEditingExited'\n  canvas.on('text:editing:exited', onTextEditingExited);\n\n  // EventService.getInstance().register(\n  //   EventNames.TEXT_EDITING_EXISTED,\n  //   onTextEditingExited,\n  // );\n\n  // Register event listener for 'TEXT_CHANGED' event, to call the function 'onTextChanged'\n  canvas.on('text:changed', onTextChanged);\n  // EventService.getInstance().register(\n  //   EventNames.TEXT_CHANGED,\n  //   onTextChanged,\n  // );\n\n  // Register event listener for 'CANVAS_BEFORE_SELECTION_CLEARED' event, to call the function 'onObjectSelectionCleared'\n  // canvas.on('before:selection:cleared', onObjectSelectionCleared);\n  // EventService.getInstance().register(\n  //   EventNames.CANVAS_BEFORE_SELECTION_CLEARED,\n  //   onObjectSelectionCleared,\n  // );\n\n  // Register event listener for 'CANVAS_SELECTION_UPDATED' event, to call the function 'onSelectionUpdated'\n  // canvas.on('selection:updated', onSelectionUpdated);\n  // EventService.getInstance().register(\n  //   EventNames.CANVAS_SELECTION_UPDATED,\n  //   onSelectionUpdated,\n  // );\n\n  // Register event listener for 'CANVAS_BEFORE_SELECTION_CLEARED' event, to call the function 'onBeforeSelectionCleared'\n  // canvas.on('before:selection:cleared', onBeforeSelectionCleared);\n\n  // Registering a windowGestureStarthandler to handle a window gesture start event.\n  // canvas.on('gesture:start', windowGestureStarthandler);\n  // EventService.getInstance().register(\n  //   EventNames.WINDOW_GESTURE_START,\n  //   windowGestureStarthandler,\n  // );\n\n  // Registering a windowGestureChangeHandler to handle a window gesture change event.\n  // canvas.on('gesture:change', windowGestureChangeHandler);\n  // EventService.getInstance().register(\n  //   EventNames.WINDOW_GESTURE_CHANGE,\n  //   windowGestureChangeHandler,\n  // );\n\n  // Filter out specific object types during group selection\n  canvas.on('selection:created', function (e) {\n    var activeSelection = e.selected;\n\n    // if (activeSelection.type === 'activeselection') {\n    // var objects = activeSelection._objects;\n\n    // Filter out the connectors\n    var filteredObjects = activeSelection;\n    // .filter(function (obj) {\n    //   return !(obj instanceof XConnector);\n    // });\n\n    if (filteredObjects.length !== activeSelection.length) {\n      // Create a new active selection with the filtered objects\n      var newActiveSelection = new ActiveSelection(filteredObjects, {\n        canvas: canvas,\n      });\n      canvas.setActiveObject(newActiveSelection);\n    }\n\n    canvas.renderAll();\n    // }\n  });\n\n  canvas.on('object:moving', function (e) {\n    var activeObject = e.target;\n\n    if (canvas.getActiveObjects().length > 1) {\n      // Multiple objects are selected\n      canvas.getActiveObjects().forEach(function (obj) {\n        if (obj !== activeObject) {\n          // Manually trigger the 'moving' event for each selected object\n          //@ts-ignore\n          obj.fire('moving', { e: e.e });\n        }\n      });\n    } else {\n      // Single object is moving\n      //@ts-ignore\n      activeObject.fire('moving', { e: e.e });\n    }\n  });\n\n  canvas.wrapperEl.addEventListener('wheel', mouseWheelListener, true);\n\n  // EventService.getInstance().register(\n  //   EventNames.CANVAS_BEFORE_SELECTION_CLEARED,\n  //   onBeforeSelectionCleared,\n  // );\n\n  // Define function 'onBeforeSelectionCleared' to crop the selected image when selection is about to be cleared\n  function onBeforeSelectionCleared(e: any) {\n    // Get the currently active object on the canvas\n    const target = canvas.getActiveObject();\n    // If the application is in crop mode\n    // if (store.getState().board.cropMode) {\n    // Dispatch an action to set crop mode to false\n    // store.dispatch(handleSetCropMode(false));\n    // Crop the parent image of the object\n    //   target.parentImage.crop(target.parentImage);\n    // }\n  }\n\n  // Register event listener for 'SELECTION_CLEARED' event, to call the function 'showMenu'\n  // canvas.on('selection:cleared', showMenu);\n  // EventService.getInstance().register(\n  //   EventNames.SELECTION_CLEARED,\n  //   showMenu,\n  // );\n}\n\n/**\n * handle the trackpad events\n * @param {*} e\n */\n\n// export function onTrackpadTouch(e) {\n//   // Update the mouse event object information on the canvas\n//   canvas.mouse.e = e;\n//   // Check if the control key was pressed during the event\n//   if (e.ctrlKey) {\n//     // Update the mouse x and y coordinates on the canvas to match the event offsets\n//     canvas.mouse.x = e.offsetX;\n//     canvas.mouse.y = e.offsetY;\n//     // Adjust the zoom level on the canvas based on the scroll direction\n//     canvas.mouse.w = canvas.getZoom() - e.deltaY * 0.007;\n//     // Flag to update the zoom level\n//     canvas.mouse.zoomUpdate = true;\n//   } else {\n//     // If control key was not pressed, change panMovingType to 'trackpad'\n//     canvas.panMovingType = 'trackpad';\n//     // Update the delta x and y coordinates of the mouse on the canvas\n//     canvas.mouse.delta.x -= e.deltaX;\n//     canvas.mouse.delta.y -= e.deltaY;\n//     // Flag to update the mouse movement\n//     canvas.mouse.mouseMoveUpdate = true;\n//     // Enable pan moving on the canvas\n//     // canvas.isEnablePanMoving = true;\n//   }\n// }\n\n// export function mouseWheelListener(e) {\n\n//   // Clears any previously set timeout, if there's any.\n//   if (timer) {\n//     clearTimeout(timer);\n//     timer = null;\n//   }\n\n//   // Sets a delay to show the menu after 200ms.\n//   timer = setTimeout(() => {\n//     showMenu(canvas);\n//   }, 200)\n\n//   // Checks if the system is MacOS.\n//   const isMac = /macintosh|mac os x/i.test(navigator.userAgent);\n\n//   // Dispatches an action to hide the widget menu.\n//   store.dispatch(handleWidgetMenuDisplay(false))\n\n//   // Checks if an event is available, prevents the default behaviour and propagation if true.\n//   if (e != null) {\n//     e.preventDefault();\n//     e.stopPropagation();\n//   }\n\n//   // Measures the vertical scrolling amount.\n//   const deltaY = Math.abs(e.deltaY);\n\n//   // Checks if the event was triggered from a trackpad or mouse, and handles it if true.\n//   if (isTrackpadOrMouse(e)) {\n//     onTrackpadTouch(e);\n//     return false;\n//   }\n\n//   // If the system is MacOS, and the event contains horizontal scrolling or the deltaY is a whole number, then the function exits.\n//   if (\n//     isMac &&\n//     (Math.abs(e.deltaX) !== 0 || parseInt(deltaY.toString()) === deltaY)\n//   ) return false;\n\n//   // Adjusts the zoom factor based on vertical scroll amount.\n//   let zoom = canvas.getZoom() * 0.999 ** (e.deltaY * 10)\n\n//   // Sets maximum and minimum zoom limits.\n//   if (zoom > 4 && !store.getState().slides.slidesMode) zoom = 4;\n//   if (zoom < 0.05) zoom = 0.05;\n\n//   // Dispatches an action to update the zoom factor in store state.\n//   store.dispatch(handleSetZoomFactor(zoom));\n\n//   // Zooms the canvas to the point where the event triggered and updates the viewport.\n//   canvas.zoomToPoint({ x: e.layerX, y: e.layerY }, zoom);\n//   canvas.updateViewportToLocalStorage(canvas.viewportTransform);\n\n//   // Requests a rerender of the canvas.\n//   canvas.requestRenderAll()\n// }\n"],"names":["initializeCanvasEvents","canvas","checkIsTrackpad","e","localStorage","getItem","isTrackpad","test","navigator","userAgent","isLikelyTrackpad","deltaY","Math","round","checkMacTrackpad","isFirefox","deltaMode","DOM_DELTA_PIXEL","deltaX","wheelDeltaY","checkNonMacTrackpad","on","event","target","changed","activeSelection","selected","filteredObjects","length","newActiveSelection","ActiveSelection","setActiveObject","renderAll","activeObject","getActiveObjects","forEach","obj","fire","wrapperEl","addEventListener","preventDefault","stopPropagation","ctrlKey","buttons","isMac","abs","delta","x","y","isEnablePanMoving","relativePan","requestRenderAll","isPanAction","parseInt","toString","zoom","getZoom","wheelDelta","zoomToPoint","Point","layerX","layerY","objects","getObjects","map","width","scaleX","set","hasControls","objType","src","pic","replace"],"mappings":"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"}