Set speed rotation with text input filed in html5

[NIna12]

Hi everyone, it's me again😊

How can I make a button rotate another object, like this:

There is an object, button and input text field:

when I put the number in the input text field and then click the button, it will effect on rotation speed.  Higher numbers that user type in the input text will cause faster rotation. But, in other case, i want to set the object rotate only 10 times not continously.

How can I do this using html5? Can anyone tell me the code?

Thanks in advance!

Have a nice day

Sorry, I'm not good in English. Hope you can understand my question😊

[JoãoCésar · Accepted solution]

Hi.

Here is a suggestion to get you started:

var root = this;
var yourRotatingInstance = root.yourRotatingInstance;
var yourButton = root.yourButton;
var rotationSpeed = 1;

createjs.Ticker.on("tick", function()
{
	yourRotatingInstance.rotation += rotationSpeed;
});

yourButton.on("click", function()
{
	yourInput = document.getElementById("yourInput");
	
	if (yourInput.value && !isNaN(yourInput.value))
		rotationSpeed = Number(yourInput.value);
});

I hope this helps.

Regards,

JC

[NIna12]

Sorry it's not working. Whenever I change the number in textinput, the speed rotation is still the same

[JoãoCésar]

You said you wanted the change to be applied when the button is clicked.

[NIna12]

Yes, I want user can control the speed by using text input. But, when I using your code, the speed is still the same even I already change the number in text input. 

[JoãoCésar]

It's because you have to change the input and then click the button, like you requested:

"when I put the number in the input text field and then click the button, it will effect on rotation speed."

If you want to affect the rotation as you type, you can add an input and/or a change event to the input component.

[NIna12]

Thank you so much, it's work. Sorry for wasting your time answering my question:sparkles:

[JoãoCésar]

You're welcome!

Don't worry. We're here to help.