h

hammerTime () {
    if (this.state.circles.length === 0) return null
    let index = this.state.circles.length - 1
    let image = this.state.circles[index]

    this.state.mc.add(new window.Hammer.Pan())
    this.state.mc.add(new window.Hammer.Pinch())
    let startTop = 0
    let startLeft = 0

    const getXandY = (event) => {
      let container = window.jQuery('#pnlDamagePhoto')
      let mark = window.jQuery('.activemark')
      let markWidth = mark.width()
      let markHeight = mark.height()
      let leftScaleModifier = 0
      let topScaleModifier = 0

      if (startTop === 0) {
        startTop = parseInt(mark.css('top'), 10)
      }
      if (startLeft === 0) {
        startLeft = parseInt(mark.css('left'), 10)
      }

      if (image.scale !== 1) {
        markWidth = markWidth * image.scale
        markHeight = markHeight * image.scale
        leftScaleModifier = (mark.width() - markWidth) / 2
        topScaleModifier = (mark.height() - markHeight) / 2
      }

      // Width bounds
      let x = null
      let leftBound = startLeft + event.deltaX + leftScaleModifier > 0
      let rightBound = startLeft + event.deltaX <= container.width() - markWidth - leftScaleModifier
      if (leftBound && rightBound) {
        x = event.deltaX + startLeft
      }

      // Height bounds
      let y = null
      let topBound = startTop + event.deltaY + topScaleModifier >= 0
      let bottomBound = startTop + event.deltaY <= container.height() - markHeight - topScaleModifier
      if (topBound && bottomBound) {
        y = event.deltaY + startTop
      }

      return {
        x: x,
        y: y
      }
    }
    this.state.mc.on('panmove', (event) => {
      let mark = window.jQuery('.activemark')
      let coordinates = getXandY(event)
      if (coordinates.x !== null) {
        mark.css('left', coordinates.x + 'px')
      }
      if (coordinates.y !== null) {
        mark.css('top', coordinates.y + 'px')
      }
    })

    this.state.mc.on('panend', (event) => {
      let {
        circles
    } = this.state
      let mark = window.jQuery('.activemark')
      circles[index].top = parseInt(mark.css('top'), 10)
      circles[index].left = parseInt(mark.css('left'), 10)
      this.setState({
        mc: undefined,
        circles: circles
      })
    })

    this.state.mc.on('pinchin', (event) => {
      let mark = window.jQuery('.activemark')
      let scale = event.scale
      var transform = 'scale(' + scale + ')'
      mark.style.webkitTransform = transform
      console.log('test')
    })
  }