Javascript Fadein movieclip

[jamesp81001848]

I want to have a movieClip to fadin after a button has been clicked. My old AS3file used transition class. But I am unsure how to do this in Animate HTML5 format?  My drop box with my files Dropbox

//AS3
var fadeIn:Tween;
function widgitFadeIn():void
{
	fadeIn = new Tween(widgit_mc,"alpha",Strong.easeInOut,0,1,1,true);
}
//Button sample
iNav_mc.play_btn.addEventListener(MouseEvent.CLICK, onNext);

function onNext(e:MouseEvent):void
{
	widgitFadeIn();
	if (widgit_mc.currentFrame >= 1)
	{
		widgit_mc.nextFrame();
		Tools.disableButton(iNav_mc.pause_btn);
		Tools.enableButton(iNav_mc.back_btn);
		direction_txt.text = "Click to advance";
	}

	if (widgit_mc.currentFrame == widgit_mc.totalFrames)
	{
		Tools.enableButton(iNav_mc.back_btn);
		Tools.disableButton(iNav_mc.play_btn);
		direction_txt.text = "Previous view";
	}
}

. This is my current JavaScript code

//JavaScript
stage.on("drawstart", setInt, this, true);
function setInt(){
	this.iNav_mc.back_btn.mouseEnabled = false;
	this.iNav_mc.back_btn.alpha = .5;
	this.direction_txt.textBaseline='top';
}
this.iNav_mc.play_btn.addEventListener("click", onNext.bind(this));
function onNext(){
	if(this.widgit_mc.currentFrame >= 0){
		this.widgit_mc.gotoAndStop(this.widgit_mc.currentFrame + 1);		
	}
	if(this.widgit_mc.currentFrame == this.widgit_mc.timeline.duration -1){
		this.iNav_mc.play_btn.mouseEnabled = false;
		this.iNav_mc.play_btn.alpha = .5;
		this.direction_txt.text = "END of Widgit";
	}else{
		this.iNav_mc.back_btn.mouseEnabled = true;
		this.iNav_mc.back_btn.alpha = 1.0;
	}
}
this.iNav_mc.back_btn.addEventListener("click", onPrev.bind(this));
function onPrev(){
	if(this.widgit_mc.currentFrame == this.widgit_mc.timeline.duration -1 || this.widgit_mc.currentFrame > 0){
		this.widgit_mc.gotoAndStop(this.widgit_mc.currentFrame - 1);
	}
	if (this.widgit_mc.currentFrame == 0){
		this.iNav_mc.back_btn.mouseEnabled = false;
		this.iNav_mc.back_btn.alpha = .5;
		this.iNav_mc.play_btn.mouseEnabled = true;
		this.iNav_mc.play_btn.alpha = 1.0;		
		this.direction_txt.text = "Click to advance";
	}else{
		this.iNav_mc.back_btn.mouseEnabled = true;
		this.iNav_mc.back_btn.alpha = 1.0;
		this.iNav_mc.play_btn.mouseEnabled = true;
		this.iNav_mc.play_btn.alpha = 1.0;		
		this.direction_txt.text = "Click to advance";
	}
}

[ClayUUID]

https://www.createjs.com/docs/tweenjs/classes/Tween.html

[jamesp81001848]

I'm currently using Animate 2015 CC. Will I need to download tweenJS or is it already part of Animate? can I put this code into a funtion and change target to the MC I want to fade "createjs.Tween.get(target) .wait(500) .to({alpha:0, visible:false}, 1000) .call(handleComplete);" ?

[ClayUUID]

Animate Canvas documents use CreateJS. CreateJS is a library suite comprised of EaselJS, TweenJS, SoundJS, and PreloadJS. If you examine the JavaScript generated by Animate, you'll see that it internally uses TweenJS for all animation.

https://createjs.com/

[jamesp81001848]

thank you