SWF converted to HTML canvas publish playback issues

[cmdh]

I am very new to using HTML format and have two main questions. I have 9 AS3/swf projects I want to convert and publish in HTML canvas so I don't lose them completely....! My AS3 project was working perfectly last week but, after coverting from AS3/swf to javascript/HTML canvas, my project will not play in test / animate or on my desktop or in the latest update of Google Chrome or Safari or Firefox. I can't see it at all. I have included the html formatted code below for reference. Also, can somebody please tell me why HTML creates separate files after published (html / js / images) and how I must organize them so Chrome can play my interactive video? I was told that all you need to do is upgrade Chrome - I did that - not working. Also, I read that in order to play HTML media, one must have server access to play it. I have 2 domain names that I can use verified on wix.com & Netlify/GitHub. So, what do I do? Please walk me through the process of "HTML rules". I just bought the book; A Smarter Way to Learn JavaScript.  Myers, Mark. Let me know if this book is a good learning tool. My work log is now backed up so need to get this done ASAP! Any and all support is welcome. Thanks cmdh.

Frame 1

this.stop();

console.log (this);

this.splash1_mc.visible = false;

this.splash2_mc.visible = false;

this.splash3_mc.visible = false;

stage.canvas.style.cursor = "none";

this.ball1_mc.mouseEnabled = false;

this.addEventListener("tick", fl_CustomMouseCursor.bind(this));

function fl_CustomMouseCursor() {

this.ball1_mc.x = stage.mouseX;

this.ball1_mc.y = stage.mouseY;

}

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

function fl_MouseClickHandler()

{

this.jelly1_btn.visible = false;

}

this.jelly1_btn.addEventListener("click", fl_ClickToHide.bind(this));

function fl_ClickToHide()

{

this.jelly1_btn.visible = false;

this.splash1_mc.visible = true;

this.splash1_mc.play();

}

this.jellypink2_btn.addEventListener("click", fl_ClickToHide_2.bind(this));

function fl_ClickToHide_2()

{

this.jellypink2_btn.visible = false;

this.splash2_mc.visible = true;

this.splash2_mc.play();

}

this.next_btn.addEventListener("click", fl_ClickToGoToAndStopAtFrame_2.bind(this));

function fl_ClickToGoToAndStopAtFrame_2()

{

this.gotoAndStop(2);

}

Frame 2

this.stop();

this.jelly3_mc.addEventListener("click", fl_MouseClickHandler_2.bind(this));

function fl_MouseClickHandler_2()

{

this.jelly3_mc.addEventListener("click", fl_ClickToHide_3.bind(this));

function fl_ClickToHide_3()

{

this.jelly3_mc.visible = false;

this.splash3_mc.visible = true;

this.splash3_mc.play();

}

this.jelly4_mc.addEventListener("click", fl_MouseClickHandler_3.bind(this));

function fl_MouseClickHandler_3()

{

}

this.jelly4_mc.addEventListener("click", fl_ClickToHide_4.bind(this));

function fl_ClickToHide_4()

{

this.jelly4_mc.visible = false;

this.splash4_mc.visible = true;

this.splash4_mc.play();

}

Frame 20

if (!this.looped) this.looped = 1;
if (this.looped++ > 2) this.stop();

[kglad]

open your browser's developer console to check for errors.

also your frame numbering looks suspect.  the first frame in an html5 timeline is not 1, it's 0.

[cmdh]

Thank you for the heads up! Will update those frame numbers! Cmdh 

[kglad]

you're welcome.

did you resolve the error?