0.0.1 • Published 6 years ago
transform-helper v0.0.1
/*
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
- customize help's UI
- extends helper's logic, like highlight handler when operating
how to define a customized helper
support touch events
0.0.1
6 years ago