Need help - Basic buttons to control animation/movieclips

I am trying to make some basic buttons to control animation/timelines.

All I need is a play button, pause button and replay button.

I would like all the code to be on the first frame of the main timeline. So far this is all I have...

this.stop();
this.ani.stop();

this.playBtn.addEventListener("click", fl_MouseClickHandler.bind(this));

function fl_MouseClickHandler() {
	this.ani.play();
}

The names of the objects are...

• animation = ani
• play button = playBtn
• pause button = pauseBtn
• replay button = replayBtn

I have the file setup as such...

• layer 1 = code
• layer 2 = buttons
• layer 3 = animation

All the animation is in one movie clip that is on the third layer. If possible I would like to tell the animation to stop playing from the root timeline, when it gets to the last frame, not by putting a stop in the movie clip of the animation. I want to control everything from the code in the root timeline if possible.

Any help would be much appreciated. 😃

ps... I tried to upload my .fla but everytime I try to post I get an error saying my file's content doesn't match its extention.