0.0.1 • Published 6 years ago

transform-helper v0.0.1

Weekly downloads
2
License
MIT
Repository
github
Last release
6 years ago

/*

const transformHelper = new TransformHelper({
  classPrefix: 'th-helper',
  renderer: {
    bottomRightResizeHandle: () => {},
    rotateHandle: () => {},
    boxHandle: () => {}
  }
})

transformHelper.add(new CustomedHelper())

transformHelper.enable(['translate', 'rotate', 'scale', 'resize'])
// each helper has its own helper UI (and event handling), and a transform method

transformHelper.wrap(el, options)
transformHelper.link(el, options)
transformHelper.cover(el, options)

transformHelper.on('', () => {})

// getter & setter

// rotation
transformHelper.rotate.deg
transformHelper.rotate.origin = { x, y }

transformHelper.rotateTo(deg)
transformHelper.rotateBy(deg)

// size
transformHelper.keepRatio
transformHelper.scale = { x, y }
transformHelper.width
transformHelper.height

transformHelper.scale(x, y)
transformHelper.scaleX(x, keepRatio)
transformHelper.scaleY(y, keepRatio)

// position
transformHelper.x
transformHelper.y

transformHelper.moveTo()
transformHelper.moveBy()


transformHelper.enableRotate()
transformHelper.disableRotate()
transformHelper.rotateEnabled

how to extends helpers

  1. customize help's UI
  2. extends helper's logic, like highlight handler when operating

how to define a customized helper

support touch events