ES6/ES7 development roadmap
thednp opened this issue · comments
thednp commented
Hello there.
I'm working on a new ES6/ES7 version of KUTE.js, some changes so far:
- massive code changes, some objects re-purposed, others renamed or removed, but we can have it all delivered nicely via rollup, for any configuration and purpose. warning this can potentially break your custom properties, the documentation will be updated to help you fix them
- massive code simplification in terms of value processing, especially for transform
scroll
property have been reworked so that when bundled, it will include all it's component required functions in order to work; addedsupportPassive
forscroll
eventHandler, the component also won't require additional CSS styling for the body, it will just work- the library now features
Components
, the old plugins have been split in pieces for a more modular bundle potential; for instance theboxModel
model which includes all possible box-model CSS properties, ortransformFunctions
to handle your regular CSS3 transform (translate,rotate,scale,skew) animations - added an
Animation
class to register new components into the library, coming in 3 variations: a class with minimal (works with pre-made tween objects), standard (provides all input value processing functionality required by components' properties) and development (provides helpful and sometimes critical information developing new components), the last two will also make sure you can't register same property multiple times; also these two variations allow you to register newdefaultOptions
,defaultValues
and even newinterpolate
functions - added a new
TweenCollection
class to take care ofallTo
andallFromTo
animations, totally revamped and made it able to handle array of elements not justHTMLCollection
orNodeList
- renamed callback options, EG
complete
=>onComplete
- all important objects are grouped and contained in an
objects.js
file - added support for new properties:
transformMatrix
,filter
,boxShadow
, as well as a new and powerfulsvgMorphCubic
component to do some specific SVG morph animation - current
morphSVG
have been reworked for easier usage and more accurate value processing - KUTE.js comes with 3 flavors
->index-base.js
with basic functionality, lightest in size, with included properties:scroll
,transform
,left
,top
,width
,height
,opacity
, default easing functions, includesTweenBase
constructor withstart()
,stop
methods and onlyduration
,easing
, andstart
,stop
,update
,complete
callback options
->index.js
with similar functionality as in core KUTE.js v1.6.2, except in v2.0.0 we've included allboxModel
,borderRadius
,textProperties
,textWrite
,clip
,backgroundPosition
and 2 new properties: CSS3filter
andboxShadow
, thensvgTransform
,svgMorph
,svgDraw
,htmlAttr
, also additions to prototype viaTween
with added methods:pause()
,resume()
andyoyo
,repeat
,repeatDelay
,chain
,pause
andresume
callback options, as well asallTo()
andallFromTo
forTweenCollection
class, this build also includes CubicBezier
->index.extra
includes all inindex.js
plus additions to prototype viaTweenExtra
class having additional methods.to()
,.easing()
,.option()
,.callback()
, as well as a new and upgraded.update()
method with per property options so that you can either do basic tween objects or timelines all with the same class (this one is a work in progress and will require changes to some interpolate functions); text
property has some improvements and reworks- added a
Time.now()
kind of polyfill to enable KUTE.js in node.js environment, thanks to new Tween.js versions, this stuff will need to be tested and confirmed by third party devs :)
This is a draft, expect changes