Highlighted

MP4 doesn't play in Video Component in Animate 2020

Community Beginner ,
Nov 13, 2019

Copy link to clipboard

Copied

When I publish my HTML5 canvas in Animate 2020, the video component on the timeline won't play the linked mp4 file. This worked for me in Animate 2019. I re-downloaded Animate 2019 to try it again, and it does work once again when the HTML5 canvas is published from Animate 2019.

 

Has anyone experienced this, or have a solution for making this work while publishing in 2020?

Hi,

We are currently investigating this issue. In the mean time, can you put the components under a movieclip(select the component on stage and convert it to a movie clip symbol) and see if that helps in your case?

 

Thanks!

Mohan

TOPICS
Product issue

Views

953

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

MP4 doesn't play in Video Component in Animate 2020

Community Beginner ,
Nov 13, 2019

Copy link to clipboard

Copied

When I publish my HTML5 canvas in Animate 2020, the video component on the timeline won't play the linked mp4 file. This worked for me in Animate 2019. I re-downloaded Animate 2019 to try it again, and it does work once again when the HTML5 canvas is published from Animate 2019.

 

Has anyone experienced this, or have a solution for making this work while publishing in 2020?

Hi,

We are currently investigating this issue. In the mean time, can you put the components under a movieclip(select the component on stage and convert it to a movie clip symbol) and see if that helps in your case?

 

Thanks!

Mohan

TOPICS
Product issue

Views

954

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
Nov 13, 2019 1
Engaged ,
Nov 13, 2019

Copy link to clipboard

Copied

Hi,

I found this too. So (if you can) maybe Publish from Animate CC 2019 to see if it works again or in your HTML page change the script line <script src="https://code.createjs.com/1.0.0/createjs.min.js"></script>  to this line <script src="https://code.createjs.com/createjs-2015.11.26.min.js"></script> , as I am wondering if it has something to do with that?

Hope this helps?

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
Reply
Loading...
Nov 13, 2019 0
Community Beginner ,
Nov 13, 2019

Copy link to clipboard

Copied

Thanks for the reply, unfortunately changing the script src line from the html published from 2020 still didn't result in the mp4 file playing.

 

I did download 2019, publish the file, and everything works as it did prior to the 2020 update. But still wondering why it doesn't perfrom as it should when published from 2020.

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
Reply
Loading...
Nov 13, 2019 0
Adobe Community Professional ,
Nov 13, 2019

Copy link to clipboard

Copied

There is zero chance that changing the CreateJS library would fix things. HTML5 Canvas components are implemented as jQuery UI components.

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
Reply
Loading...
Nov 13, 2019 1
Engaged ,
Nov 13, 2019

Copy link to clipboard

Copied

Good to know, cheers!

Any suggestions/solutions that we might be doing wrong or is it possibly another Adobe update bug? To me if it worked in 2019 then it should hopefully work in 2020 and why I am leaning towards an update bug with this component.

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
Reply
Loading...
Nov 13, 2019 0
Community Beginner ,
Nov 14, 2019

Copy link to clipboard

Copied

Hi,

I am having the same problem but with .webm video.  The differences between v19 and v20 are:

 

Generated HTML:

  • createjs - updated from 2015.11.26 to 1.0.0 release
    • includes update from createjs.Ticker.setFPS() to using the framerate property

Generated JS:

  • jquery - updated from 2.2.4 to 3.4.1
  • uses StageGL instead of Stage
  • includes update from exportRoot.getStage() to exportRoot.stage property

Video Component directories:

  • The only differences is the components/lib/jquery library is the newer version

 

The other thing that I noticed is that I can create a new HTML5 canvas project with only a single frame on the timeline, add the video component to the single frame, publish and it works.  If you change anything after that:  add additional frames, move the keyframe around in the timeline, etc, then the video will not play and I never see the video element injected into the timeline like I did for v19.

 

This looks like its an bug that Adobe needs to fix.

 

 

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
Reply
Loading...
Nov 14, 2019 0
Community Beginner ,
Nov 15, 2019

Copy link to clipboard

Copied

I've been doing some more debugging and think that this issue may be due to the change in CreateJS's MovieClip.added event behavior.

 

In v19, the added() event handler is called for every frame which updates $this,_lastAddedFrame to the current frame.  In v20, the added() event handler is only called on frame 0.

 

(lib.an_Video = function(options) {
    this._element = new $.an.Video(options);
    this._el = this._element.create();
    var $this = this;
    this.addEventListener('added', function() {
        $this._lastAddedFrame = $this.parent.currentFrame;
        $this._element.attach($('#dom_overlay_container'));
});
}).prototype = p = new cjs.MovieClip();

 

The this._lastAddedFrame is then checked in the _updateVisibility() function.  If the this._lastAddedFrame is not equal to the currentFrame, then the video element is detached (aka removed from the DOM).

 

function _updateVisibility(evt) {
    if((this.getStage() == null || this._off || this._lastAddedFrame != this.parent.currentFrame) && this._element) {
        this._element.detach();
        stage.removeEventListener('drawstart', this._updateVisibilityCbk);
        this._updateVisibilityCbk = false;
    }
}

 

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
Reply
Loading...
Nov 15, 2019 1
Adobe Employee ,
Nov 25, 2019

Copy link to clipboard

Copied

Hi,

We are currently investigating this issue. In the mean time, can you put the components under a movieclip(select the component on stage and convert it to a movie clip symbol) and see if that helps in your case?

 

Thanks!

Mohan

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
Reply
Loading...
Nov 25, 2019 0
Adobe Employee ,
Nov 25, 2019

Copy link to clipboard

Copied

try adding this in the _tick function of the corresponding js file

 

function _tick(evt) {
	this._lastAddedFrame = this.parent.currentFrame;
        //......
}

 

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
Reply
Loading...
Nov 25, 2019 0
Community Beginner ,
Nov 26, 2019

Copy link to clipboard

Copied

Thanks Mohan, this worked. After I converted the video component to a movieclip the mp4 does play as expected.

 

Thanks!

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
Reply
Loading...
Nov 26, 2019 0