Canvas html5 problem playing timeline forwards and in reverse with two buttons

Community Beginner ,
Mar 10, 2021 Mar 10, 2021

Copy link to clipboard

Copied

I need to raise/lower mast from 0 to 90 degrees with Raise and Lower buttons using mousedown for play currentFrame and pressup for stop on currentFrame for each button to allow raise and lower from any frame with a timeline of 105 frames. The Raise button works OK with mousedown for play current frame and pressup for stop on current frame), but the lower button will not work with mousedown for play current frame -1 to reverse the timeline and lower the mast. 

 

 Any help/code example would be greatly appreciated!

TOPICS
Code

Views

159

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 2 Correct answers

Community Beginner , Mar 11, 2021 Mar 11, 2021
Hi kglad,Sorry html version would not send! Code below!this.NewLower_btn.addEventListener("mousedown",btnReverseF.bind(this)); this.NewLower_btn.addEventListener("mouseup",btnStopF.bind(this)); function btnReverseF(){ startReverseF(this.currentFrame-1); } function btnStopF(){ this.btnReverseF.removeEventListener("tick,this.btnReverse.F); }

Likes

Translate

Translate
Adobe Community Professional , Mar 11, 2021 Mar 11, 2021
use: function startReverseF(mc) { mc.F = reverseF.bind(mc); mc.addEventListener("tick", mc.F); } function reverseF() { this.gotoAndStop(this.currentFrame - 1); if (this.currentFrame == 0) { this.removeEventListener("tick",this.F); } } this.NewLower_btn.addEventListener("mousedown",btnReverseF.bind(this)); this.NewLower_btn.addEventListener("click",btnStopF.bind(this)); function btnReverseF(){ startReverseF(this); } function btnStopF(){ console.log("stop"); this.removeEventListener("tick",this....

Likes

Translate

Translate
Adobe Community Professional ,
Mar 10, 2021 Mar 10, 2021

Copy link to clipboard

Copied

to play a movieclip/timeline in reverse:

 

function startReverseF(mc){

mc.F = reverseF.bind(mc);

mc.addEventListener("tick",mc.F);

}

function reverseF(){

this.gotoAndStop(this.currentFrame-1);

if(this.currentFrame==0){

this.removeEventListener("tick",this.F);

}

}

 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Mar 11, 2021 Mar 11, 2021

Copy link to clipboard

Copied

Hi kglad,

Many thanks for your code example and sorry to trouble you further. But having an issue integrating it into a mousedown button function to play in reverse and a pressup button function to stop on any frame. As the button has both mousedown and pressup event listeners I am not sure if that is the problem? 

 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Mar 11, 2021 Mar 11, 2021

Copy link to clipboard

Copied

 

 

this.btn.addEventListener("mousedown",btnReverseF.bind(this));

this.btn.addEventListener("click",btnStopF.bind(this));

 

function btnReverseF(){

startReverseF(this.mcwhatever);

}

function btnStopF(){
this.mcwhatever.removeEventListener("tick",this.mcwhatever.F);
}

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Mar 11, 2021 Mar 11, 2021

Copy link to clipboard

Copied

Hi kglad,

 

Thanks for your kind help and aplogies, but still have a problem as script will not execute. Original. swf and html versions attached for your  review!

 

Regards, Robin

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Mar 11, 2021 Mar 11, 2021

Copy link to clipboard

Copied

Hi kglad,

Sorry html version would not send! Code below!

this.NewLower_btn.addEventListener("mousedown",btnReverseF.bind(this));
this.NewLower_btn.addEventListener("mouseup",btnStopF.bind(this));

 
function btnReverseF(){
startReverseF(this.currentFrame-1);
}
function btnStopF(){
this.btnReverseF.removeEventListener("tick,this.btnReverse.F);
}

 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Mar 11, 2021 Mar 11, 2021

Copy link to clipboard

Copied

use:

 

function startReverseF(mc) {
mc.F = reverseF.bind(mc);
mc.addEventListener("tick", mc.F);
}

function reverseF() {
this.gotoAndStop(this.currentFrame - 1);
if (this.currentFrame == 0) {
this.removeEventListener("tick",this.F);
}
}

this.NewLower_btn.addEventListener("mousedown",btnReverseF.bind(this));
this.NewLower_btn.addEventListener("click",btnStopF.bind(this));

function btnReverseF(){
startReverseF(this);
}

function btnStopF(){
console.log("stop");
this.removeEventListener("tick",this.F);
}

 

 

p.s.

kglad_0-1615511557343.png

 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Mar 12, 2021 Mar 12, 2021

Copy link to clipboard

Copied

Hi kglad,

Many thanks for your very kind help with the above, now working. 

 

You are a great asset to the animation world!

 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Mar 12, 2021 Mar 12, 2021

Copy link to clipboard

Copied

LATEST

you're welcome.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines