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

[robinc56039817]

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!

[kglad]

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);

}

}

[robinc56039817]

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? 

[kglad]

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);
}

[robinc56039817]

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

[robinc56039817 · Accepted solution]

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);
}

[kglad · Accepted solution]

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.

[robinc56039817]

Hi kglad,

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

You are a great asset to the animation world!

[kglad]

you're welcome.