Skip to main content
henrycramer50858
henrycramer50858
New Participant
February 8, 2018
Answered

html5 coding: start creatjs.tween at a special time (automatically)

  • February 8, 2018
  • 2 replies
  • 689 views

Hi there!

The image „Mov_Image_Inst“  should be visible, scale and rotate between minute 30 to 31 (and this every new hour again).

This is my coding:

var _this = this;

var d = new Date ();

var M = d.getMinutes();

var S = d.getSeconds();

this.Mov_ImageTween_Inst.visible = false;

if (

    M >= 30 && M<31  && S >= 0 && S <59

) {

   this.Mov_ImageTween_Inst.visible = true;

   this.Mov_AffiTween_Inst.alpha = 0;

   createjs.Tween.get(this.Mov_ImageTween_Inst)

   .to({alpha:1, scaleX: 2, scaleY: 2}, 1000)

   .to({rotation: 360}, 5000)

   .to({alpha:0, scaleX: 1, scaleY: 1}, 1000);

};

The code is almost correct, but the tweening doesn´t start automatically between minute 30 to 31, a website refresh is needed.  How can I get the tween to start at the right time automatically? Visiblity scaling and rotation between minute 30 to 31 works after website refresh only but not automatically.

Any help is appreciated.

Thank you in advance.


Cheers. Henry

    This topic has been closed for replies.
    Correct answer ClayUUID

    Hi, thank you for your help so far. I ´ve tried the setInterval() method.

    This works:

    function runTheClock()

    {

    alert("hello");

    }

    var interval = setInterval(runTheClock, 1000);

    And this works:

    createjs.Tween.get(this.Mov_Symbol_Inst).to({rotation: 360}, 2000);  

    But the combination doesn't work:

    function runTheClock()

    {

    createjs.Tween.get(this.Mov_Symbol_Inst).to({rotation: 360}, 2000);  

    }

    var interval = setInterval(runTheClock, 1000);

    Thank you in advance!


    Explanation and solutions here:

    Re: HTML 5 Mouseover button targeting

    2 replies

    albertd9194959
    albertd9194959
    Inspiring
    February 9, 2018

    A more optimal way is using ClayUUID suggestion. Just convert your 30 minutes into 1.8e+6 milliseconds.

    A less optimal way would be to create a ticker event listener that runs through your check, you can probably change the rate to every 5 seconds or something....

    Regards,

    C
    ClayUUID
    Brainiac
    February 9, 2018

    I'm assuming he means every 30 minutes/hour of wall time, not run time, in which case he's have to adjust the initial delay based on time remaining to the next "special" time.

    henrycramer50858
    henrycramer50858Author
    New Participant
    February 16, 2018

    Ah, yes i get you..

    So we would need a new set of variables that record/set the initial time based on launch/initiation.....


    Hi, thank you for your help so far. I ´ve tried the setInterval() method.

    This works:

    function runTheClock()

    {

    alert("hello");

    }

    var interval = setInterval(runTheClock, 1000);

    And this works:

    createjs.Tween.get(this.Mov_Symbol_Inst).to({rotation: 360}, 2000);  

    But the combination doesn't work:

    function runTheClock()

    {

    createjs.Tween.get(this.Mov_Symbol_Inst).to({rotation: 360}, 2000);  

    }

    var interval = setInterval(runTheClock, 1000);

    Thank you in advance!

    C
    ClayUUID
    Brainiac
    February 8, 2018

    Put that code inside a function. Make that function be called once a minute by using setInterval().

    WindowOrWorkerGlobalScope.setInterval() - Web APIs | MDN

    If you need the animation to happen precisely at a certain time, it would probably be okay to set the interval to once a second even.

    henrycramer50858
    henrycramer50858Author
    New Participant
    February 8, 2018

    Thanks. It shouldn´t be an interval, it shoud be a special time in minutes and seconds. Cheers.

    C
    ClayUUID
    Brainiac
    February 8, 2018

    Well, there's no specialTimeInMinutesAndSeconds() function in JavaScript, so you're going to have to use an interval to monitor the current time.

      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices