• Dear Cerberus X User!

    As we prepare to transition the forum ownership from Mike to Phil (TripleHead GmbH), we need your explicit consent to transfer your user data in accordance with our amended Terms and Rules in order to be compliant with data protection laws.

    Important: If you accept the amended Terms and Rules, you agree to the transfer of your user data to the future forum owner!

    Please read the new Terms and Rules below, check the box to agree, and click "Accept" to continue enjoying your Cerberus X Forum experience. The deadline for consent is April 5, 2024.

    Do not accept the amended Terms and Rules if you do not wish your personal data to be transferred to the future forum owner!

    Accepting ensures:

    - Continued access to your account with a short break for the actual transfer.

    - Retention of your data under the same terms.

    Without consent:

    - You don't have further access to your forum user account.

    - Your account and personal data will be deleted after April 5, 2024.

    - Public posts remain, but usernames indicating real identity will be anonymized. If you disagree with a fictitious name you have the option to contact us so we can find a name that is acceptable to you.

    We hope to keep you in our community and see you on the forum soon!

    All the best

    Your Cerberus X Team

easing function needs conversion

Dubbsta

Active member
Joined
Jul 13, 2017
Messages
208
if anyone is interested in helping me convert this to cx. i tried not working 100% though
here is source if you want to take a look at original

https://ridiculoid.itch.io/ezpz click "dont say i never did nothin for ya"


Code:
Function ease:Float(_type:String,_curr_time:Float,_start_pos:Float,_end_pos:Float ,_end_time:Float)





Local type:String        = _type


Local curr_time:Float        = _curr_time


Local start_pos    :Float    = _start_pos


Local end_pos:Float        = _end_pos


Local end_time:Float        = _end_time


Local output:Float         = 0


Local reversed:Bool        = False


Local range_shIft:Float    = 0


Local end_og:Float


Local start_og:Float


        ' If start position is higher than end position,


        ' reverse them and remember that we did so.


        '


        ' for example:


        '        start_pos = 30


        '        end_pos = 5


        ' becomes:


        '        start_pos = 5


        '        end_pos = 30


        '        reversed = True


        '


        If end_pos < start_pos


            end_og            = end_pos


            start_og            = start_pos


            start_pos            = end_og


            end_pos            = start_og


            reversed            = True


        End


        


        ' If range doesn't begin at zero, slide it over to do so.


        ' save this shIft in range_shIft.


        '


        ' for example:


        '        start_pos = 10


        '        end_pos = 25


        ' becomes:


        '        start_pos = 0


        '        end_pos = 15


        '        range_shIft = -10


        '


        If Not start_pos        = 0


            range_shIft    = start_pos


            end_pos        -= start_pos


            start_pos        = 0


        End


        


        ' If, for some reason, you've coded things in such a way


        ' that the current time has exceed the end time, fear not.


        '


        If curr_time > end_time


            curr_time = end_time


        End


        


        Select type


            


            Case "linear"


                output = end_pos * curr_time / end_time + start_pos


                'break


                


            Case "in-quad"


                curr_time /= end_time


                output = end_pos * curr_time * curr_time + start_pos


                'break


                


            Case "out-quad"


                curr_time /= end_time


                output = -end_pos * curr_time * (curr_time - 2) + start_pos


                'break


                


            Case "in-out-quad"


                curr_time /= end_time * 0.5


                If (curr_time < 1)


                    output = end_pos * 0.5 * curr_time * curr_time + start_pos


                


                Else


                    output = end_pos * -0.5 * (--curr_time * (curr_time - 2) - 1) + start_pos


                End


                'break


                


            Case "in-cubic"


                output = end_pos * Pow(curr_time/end_time, 3) + start_pos


                'break


                


            Case "out-cubic"


                output = end_pos * (Pow(curr_time/end_time - 1, 3) + 1) + start_pos


                'break


                


            Case "in-out-cubic"


                curr_time /= end_time * 0.5


                If (curr_time < 1)


                    output = end_pos * 0.5 * Pow(curr_time, 3) + start_pos


                


                Else


                    output = end_pos * 0.5 * (Pow(curr_time - 2, 3) + 2) + start_pos


                End


                'break


                


            Case "in-quart"


                output = end_pos * Pow(curr_time / end_time, 4) + start_pos


                'break


                


            Case "out-quart"


                output = -end_pos * (Pow(curr_time / end_time - 1, 4) - 1) + start_pos


                'break


                


            Case "in-out-quart"


                curr_time /= end_time * 0.5


                If (curr_time < 1)


                    output = end_pos * 0.5 * Pow(curr_time, 4) + start_pos


                


                Else


                    output = end_pos * -0.5 * (Pow(curr_time - 2, 4) - 2) + start_pos


                End


                ''break


                


            Case "in-quint"


                output = end_pos * Pow(curr_time / end_time, 5) + start_pos


                ''break


                


            Case "out-quint"


                output = end_pos * (Pow(curr_time / end_time - 1, 5) + 1) + start_pos


                ''break


                


            Case "in-out-quint"


                curr_time /= end_time * 0.5


                If (curr_time < 1)


                    output = end_pos * 0.5 * Pow(curr_time, 5) + start_pos


                


                Else


                    output = end_pos * 0.5 * (Pow(curr_time - 2, 5) + 2) + start_pos


                End


                'break


                


            Case "in-Sine"


                output = end_pos * (1 - Cos(curr_time / end_time * (PI / 2))) + start_pos


                'break


                


            Case "out-Sine"


                output = end_pos * Sin(curr_time / end_time * (PI / 2)) + start_pos


                'break


                


            Case "in-out-Sine"


                output = end_pos * 0.5 * (1 - Cos(PI * curr_time / end_time)) + start_pos


                'break


            


            Case "in-circ"


                curr_time /= end_time;


                output = end_pos * (1 - Sqrt(1 - curr_time * curr_time)) + start_pos


                'break


            


            Case "out-circ"


                curr_time = curr_time / end_time - 1


                output = end_pos * Sqrt(1 - curr_time * curr_time) + start_pos


                'break


            


            Case "in-out-circ"


                curr_time /= end_time * 0.5


                If (curr_time < 1)


                    output = end_pos * 0.5 * (1 - Sqrt(1 - curr_time * curr_time)) + start_pos


                


                Else     


                    curr_time -= 2


                    output = end_pos * 0.5 * (Sqrt(1 - curr_time * curr_time) + 1) + start_pos


                End


                'break


            


            Case "in-expo"


                output = end_pos * Pow(2, 10 * (curr_time / end_time - 1)) + start_pos


                'break


            


            Case "out-expo"


                output = end_pos * (-Pow(2, -10 * curr_time / end_time) + 1) + start_pos


                'break


            


            Case "in-out-expo"


                curr_time /= end_time * 0.5


                If (curr_time < 1)


                    curr_time -= 1


                    output = end_pos * 0.5 * Pow(2, 10 * curr_time) + start_pos


                


                Else


                     curr_time -= 1


                    output = end_pos * 0.5 * (-Pow(2, -10 * curr_time ) + 2) + start_pos


                End


                'break


            


            Case "in-elastic"


                Local _s:Float     = 1.70158


                Local _p:Float    = 0


                Local _a:Float    = end_pos


                If (curr_time    = 0 Or _a = 0)


                    output     = start_pos


                End


                curr_time /= end_time


                If (curr_time = 1)


                    output = start_pos+end_pos


                End


                If (_p = 0)


                    _p = end_time*0.3


                End    


                If (_a < Abs(end_pos))


                    _a = end_pos


                    _s = _p*0.25


                


                Else


                    _s = _p / (2 * PI) * ASin (end_pos / _a)


                End


                curr_time -= 1


                output = -(_a * Pow(2,10 * (curr_time )) * Sin((curr_time * end_time - _s) * (2 * PI) / _p)) + start_pos


                'break


                


            Case "out-elastic"


                Local _s:Float         = 1.70158


                Local _p:Float         = 0


                Local _a:Float         = end_pos


                If (curr_time = 0 Or _a = 0)


                    output         = start_pos


                End


                curr_time /= end_time


                If (curr_time = 1)


                    output = start_pos + end_pos


                End


                If (_p = 0)


                    _p = end_time * 0.3


                End


                If (_a < Abs(end_pos))


                    _a = end_pos


                    _s = _p * 0.25


                


                Else


                    _s = _p / (2 * PI) * ASin (end_pos / _a)


                End


                output = _a * Pow(2, -10 * curr_time) * Sin((curr_time * end_time - _s) * (2 * PI) / _p ) + end_pos + start_pos


                'break


            


            Case "in-out-elastic"


                Local _s:Float = 1.70158


                Local _p:Float = 0


                Local _a:Float = end_pos


                If (curr_time = 0 Or _a = 0)


                    output = start_pos


                End


                curr_time /= end_time*0.5


                If (curr_time = 2)


                    output = start_pos+end_pos


                End


                


                If (_p = 0)


                    _p = end_time * (0.3 * 1.5)


                End


                


                If (_a < Abs(end_pos))


                    _a = end_pos


                    _s = _p * 0.25


                


                Else


                    _s = _p / (2 * PI) * ASin (end_pos / _a)


                End


                


                If (curr_time < 1)


                    curr_time -=1


                    output = -0.5 * (_a * Pow(2, 10 * (curr_time)) * Sin((curr_time * end_time - _s) * (2 * PI) / _p)) + start_pos


                End


                curr_time -=1


                output = _a * Pow(2, -10 * (curr_time)) * Sin((curr_time * end_time - _s) * (2 * PI) / _p) * 0.5 + end_pos + start_pos


                'break


                


            Case "in-back"


                Local _s:Float = 1.70158


                curr_time /= end_time


                output = end_pos * curr_time * curr_time * ((_s + 1) * curr_time - _s) + start_pos


                'break


                


            Case "out-back"


                Local _s:Float = 1.70158


                curr_time = curr_time/end_time - 1


                output = end_pos * (curr_time * curr_time * ((_s + 1) * curr_time + _s) + 1) + start_pos


                'break


            


            Case "in-out-back"


                Local _s:Float = 1.70158;


                curr_time = curr_time/end_time*2


                If (curr_time < 1)


                    _s *= 1.525


                    output = end_pos * 0.5 * (curr_time * curr_time * ((_s + 1) * curr_time - _s)) + start_pos


                


                Else


                    curr_time -= 2


                    _s *= 1.525


                    output = end_pos * 0.5 * (curr_time * curr_time * ((_s + 1) * curr_time + _s) + 2) + start_pos


                End


                'break


            


            Case "in-bounce"


                output = end_pos - ease("out-bounce", end_time - curr_time, 0, end_pos, end_time) + start_pos


                'break


                


            Case "out-bounce"


                curr_time /= end_time


                If (curr_time < 1/2.75)


                    output = end_pos * 7.5625 * curr_time * curr_time + start_pos


                


                Else If (curr_time < 2/2.75)    


                    curr_time -= 1.5/2.75


                    output = end_pos * (7.5625 * curr_time * curr_time + 0.75) + start_pos


                


                Else If (curr_time < 2.5/2.75)


                    curr_time -= 2.25/2.75


                    output = end_pos * (7.5625 * curr_time * curr_time + 0.9375) + start_pos


                


                Else


                    curr_time -= 2.625/2.75


                    output = end_pos * (7.5625 * curr_time * curr_time + 0.984375) + start_pos


                End


                'break


            


            Case "in-out-bounce"


                If (curr_time < end_time*0.5)


                    output = (ease("in-bounce", curr_time*2, 0, end_pos, end_time)*0.5 + start_pos)


                


                Else


                    output = (ease("out-bounce", curr_time*2 - end_time, 0, end_pos, end_time)*0.5 + end_pos*0.5 + start_pos)


                End


                'break


        End


        


        ' un-reverse


        If reversed


            Local  range_output_to_end := end_pos - output


            output = end_og + range_output_to_end - range_shIft


        End


        


        ' un-shIft


        output += range_shIft


        


        ' ezpz


        Return output





End
 
the things even I am still finding out... i must look through the examples more ;-)

@MikeHart IMO, this class shouldnt be in examples, it should be more public in the main docs (Id be happy to document this)
 
There is also the cubic bezier tweening module by @Holzchopf. Maybe it is a good idea to put them together somehow to have tweening as a basic module.
Finding things that are already there in CX is one reason that I started rewriting the docs.
 
An official documented module would be nice. See Holzchopf's response down later.
 
Last edited:
If everyone is happy, I'd be fine combining the 2 classes into a single tweening class, giving the appropriate credit, testing for mojo1 and mojo2, and creating some documentation.
 
been playing while writing docs...
tween.jpg
 
Looking at it again, it could use some extra stuff. The overshooting, which you can see with over tweening solutions is not possible, or?
 
Well found @Holzchopf ;-)
Again something I wasn't aware of.

I can take a look at the interpolate module and add more of the examples found in skn3 tween demo. Ie, bounce, back, circ etc and also add the bezier tween. Ive also added a custom tween and fade tween.

The advantage of the Tween class is that it had timings, loops and yoyoing built in.

Maybe the "new" tween class could control timings but use the interpolate module commands

Just tell me what you need and I'll add to it...
 
@Holzchopf I see you've already added the bezier code
 
Looking at it again, it could use some extra stuff. The overshooting, which you can see with over tweening solutions is not possible, or?
I just checked again in the live demo. It is possible.

The advantage of the Tween class is that it had timings, loops and yoyoing built in.

Maybe the "new" tween class could control timings but use the interpolate module commands
That sounds like a plan.
 
I'll add some more interpolate functions to cerberus.interpolate and also add them to the applet_demo
I'll then look at at a new tweening class. These functions will make the class a lot easier
 
Ive added more Interpolation functions to the module, docs and demo...
@Holzchopf Ive not created the images for the new documentation. Do you have a tool to create them as yours are very clean? Itd be nice to stick to the same style
 
Last edited:
The overshooting, which you can see with over tweening solutions is not possible, or?
You are talking about the bouncing stuff, right? I guess this is not possible with a simple cubic bezier curve.

It could be interesting, if you could emulate those curves with multiple bezierpoints combined like in vector paths
and how the performance is with this, regarding practical usage.
Because if it is possible you could fine tune all curves for your needs or even create a tweening editor.

As the user api I would like something without having to deal with the inner structure as it is now.

something like myTween = New Tween(PresetTweenTypeConst:Int, startValue:Float, endValue:Float, duration:Int )
Where PresetTweenTypeConst:Int is just a Number to get one of the premade curves.

and an overloaded Constructor with myTween = New Tween(BezierPointsArray:Float[], startValue:Float, endValue:Float, duration:Int )
to create custom curves with multiple bezier points.
 
Last edited:
@Phil7 now that I've added the extra jnterpolation, that's exactly how I've started the Tween class. It will just reference an interpolation based on a const.
 
@Holzchopf Ive not created the images for the new documentation. Do you have a tool to create them as yours are very clean? Itd be nice to stick to the same style
Yes, kinda. I drew them in Inkscape and I think I still have the .svg file, so it should be easy to draw the new curves. However, this requires me to pull your changes from github, do my work, and push it again. No big deal, but currently my workstation is not set up for that. I'll have to do that from my working computer in a free minute, which could be somewhen between next week and in an eternity o_O
 
Yes, kinda. I drew them in Inkscape and I think I still have the .svg file, so it should be easy to draw the new curves. However, this requires me to pull your changes from github, do my work, and push it again. No big deal, but currently my workstation is not set up for that. I'll have to do that from my working computer in a free minute, which could be somewhen between next week and in an eternity o_O
No rush, maybe its something you could improve in a later release. In the meantime Ive created some graphs (screenshots from your tweening demo) for the docs. Theyre not as good as yours though ;-)

InterpolateBounceEaseInOut.png
 
Back
Top Bottom