Video not resized after class change

[gaetancollaud]

Hi,

To manage multiple video streams we have an angularJS application. If we have one stream, it takes all the space, if we have two streams, we split the screen in 2 col, if we have three or four streams we split the screen in 2 row, 2 col, and so one. Everything is done by adding and removing CSS class (which define the layout).

We have the issue that the locomote does not resize the stream when our layout change. I took some screenshots. The first one shows two camera streams. Then we deselect the second one. The fist one should take all the space left (it worked with flowplayer).

The normal behavior would be this one. To have this, I went fullscreen and back to normal to force the video resize.

I don't know if you can detect when the flash element is resized. If not, is it possible to expose the videoResize method of the player, so I can call it manually.

Best regards

Gaétan Collaud

[noseglid]

The stage is listening to changes in the flash element and should resize the video accordingly, see: https://github.com/AxisCommunications/locomote-video-player/blob/master/src/Player.as#L111-L113

I'm a little confused as to why it doesn't resize for you. Which version of locomote are you using? This should be available in 0.1.0.

[gaetancollaud]

I think I was using an old one, because I updated to the one the master branch and I works more or less.

Now the behaviour is a bit different. The camera stream always takes the full size of the player and ignore the ratio of the stream. See screenshot below. I just added the camera on the right. Again if I go fullscreen and back, the size is back to normal.

Alternatively, I can use the videoResize() method that I just exposed in my pull request when the stream start (onstreamStarted) and everything is back to normal. Maybe you invoke the videoResize too fast and didn't wait for the stream to be available.

If you fixed it, you can ignore my pull request #98.

Regards

Gaétan

[noseglid]

Locomote always take aspect ratio into account (see: https://github.com/AxisCommunications/locomote-video-player/blob/master/src/Player.as#L153-L172).

Could you provide an SSCCE which demonstrate the behavior you see above?

[gaetancollaud]

I don't have the time today, but I will try to reproduce this in a small example.

[gaetancollaud]

Luckily I reproduce this bug in a small example. It seems to be linked to CSS and not angular.

https://mega.co.nz/#!SgZBXSZY!lUiBsSncfrBiX_Au7qFtRXRK7FHIl0g3vkCsQG8u5x4

Use the parameter url to se the stream url (cf Readme).

Again, if you go fullscreen and back, the player size is ok.

[noseglid]

Thanks. I'll see if I can reproduce and hopefully narrow down why the event is not transmitted as it should·

[noseglid]

I managed to reproduce this (I think) and it was an issue when the new metadata (e.g. the video dimensions) was set and when resize was called. I think b044a8a should fix it. Would you mind testing if it works? It is available on master

[gaetancollaud]

Wow ! Not only you solve the bug but the player is much more reactive now !

Before, when you played a stream and you switched to another stream the first one was still displayed for some seconds (just a freeze on the last image). Now the new stream is directly played without freeze or anything.

Maybe it's due to another commit but nice work anyway ! 👍

[noseglid]

I'm glad to hear it. I'm not sure why you're experiencing better responsiveness from the player though.. Might be that the resizing somehow makes it look and feel better.