constructor()

in web/frontend/libs/@deltix/hd.components-multi-app/index.umd.js [683:857]

• 144 lines of code
• 19 McCabe index (conditional complexity)

    constructor(stage, params, renderer, subject) {
      this.stage = stage;
      this.params = params;
      this.renderer = renderer;
      this.subject = subject;
      this.dragging = false;
      this.touchDistance = 0;

      this.onWheel = event => {
        const {
          top: canvasTop,
          left: canvasLeft
        } = event.target.getBoundingClientRect();
        const {
          x: subjectX,
          y: subjectY
        } = this.subject.getGlobalPosition();
        const x = event.clientX - canvasLeft - subjectX;
        const y = event.clientY - canvasTop - subjectY;

        if (!this.params.hitArea.contains(x, y)) {
          return;
        }

        event.preventDefault();
        this.params.onWheel({
          delta: normalizeWheel__default["default"](event).pixelY,
          x,
          y
        });
      };

      this.onDragStart = event => {
        // store a reference to the data
        // the reason for this is because of multitouch
        // we want to track the movement of this particular touch
        this.data = event.data;
        this.dragging = true;
        const position = event.data.getLocalPosition(this.subject);
        this.x = position.x;
        this.y = position.y;
        this.handlePointEvent(event, 'onDragStart');
      };

      this.onDragEnd = event => {
        this.stopDragging();
        this.handlePointEvent(event, 'onDragEnd');
      };

      this.onDragMove = () => {
        if (this.dragging) {
          const newPosition = this.data.getLocalPosition(this.subject);
          const dragX = newPosition.x - this.x;
          const dragY = newPosition.y - this.y;
          const x = this.x = newPosition.x;
          const y = this.y = newPosition.y;
          const {
            left: hitAreaLeft,
            top: hitAreaTop
          } = this.params.hitArea;
          this.params.onDragMove({
            x: x - hitAreaLeft,
            y: y - hitAreaTop,
            dragX,
            dragY
          });
        }
      };

      this.onMove = event => this.handlePointEvent(event, 'onMove');

      this.onPointerDown = event => {
        const {
          x,
          y
        } = event.data.getLocalPosition(this.subject);
        this.startX = x;
        this.startY = y;
        return this.handlePointEvent(event, 'onPointerDown');
      };

      this.onPointerUp = event => {
        this.onClick(event);
        this.startX = null;
        this.startY = null;
        return this.handlePointEvent(event, 'onPointerUp');
      };

      this.onClick = event => {
        if (!this.params.onClick) {
          return;
        }

        const {
          x,
          y
        } = event.data.getLocalPosition(this.subject);

        if (this.startX === x && this.startY === y) {
          this.params.onClick({
            x,
            y
          });
        }
      };

      this.onPointerOut = event => {
        if (this.dragging) {
          this.onDragEnd(event);
        }

        this.call({}, 'onPointerOut');
      };

      this.onTouchMove = event => this.handleTouchEvent(event, false);

      this.onTouchEnd = event => {
        if (this.inTouch) {
          this.inTouch = false;
          this.handleTouchEvent(event, false);
        }
      };

      this.onTouchCancel = event => {
        this.inTouch = false;
      };

      this.onTouchStart = event => {
        if (event.touches.length === 2) {
          this.inTouch = true;
          this.handleTouchEvent(event, true);
        }
      };

      subject.interactive = true;
      subject.hitArea = params.hitArea;

      if (params.onMove) {
        subject.on('pointermove', this.onMove);
      }

      if (params.onPointerDown) {
        subject.on('pointerdown', this.onPointerDown);
      }

      if (params.onPointerUp) {
        subject.on('pointerup', this.onPointerUp);
      }

      if (params.onDragStart || params.onDragMove) {
        subject.on('pointerdown', this.onDragStart);
      }

      if (params.onDragMove) {
        subject.on('pointermove', this.onDragMove);
      }

      if (params.onDragEnd || params.onDragMove) {
        subject.on('pointerup', this.onDragEnd);
      }

      if (params.onPointerOver) {
        subject.on('pointerover', params.onPointerOver);
      }

      subject.on('pointerout', this.onPointerOut);

      if (params.onWheel) {
        renderer.view.addEventListener('wheel', this.onWheel);
        renderer.view.addEventListener('touchstart', this.onTouchStart);
        renderer.view.addEventListener('touchend', this.onTouchEnd);
        renderer.view.addEventListener('touchmove', this.onTouchMove);
        renderer.view.addEventListener('touchcancel', this.onTouchCancel);
      }
    }