You are not logged in.

videoDOM. srcObject = canvas. captureStream(); The videoplayer can't be used on iOS16. Who can help?

MANJAY

Beginner

  • "MANJAY" started this thread

Posts: 19

  • Send private message

1

Saturday, November 26th 2022, 10:34am

videoDOM. srcObject = canvas. captureStream(); The videoplayer can't be used on iOS16. Who can help?

I want to play canvas animation in krpano through videoplayer. Other systems can do this, but iOS 16 can't.

Source code

 
1
2
3

var videoDOM = hotspot.videoDOM; 
videoDOM.srcObject = canvas.captureStream();
hotspot.play();

MANJAY has attached the following files:
  • example.zip (180.09 kB - 35 times downloaded - latest: May 12th 2023, 5:49pm)
  • msedge_o6SCpXo9h1.gif (293.4 kB - 57 times downloaded - latest: May 12th 2023, 5:49pm)

This post has been edited 2 times, last edit by "MANJAY" (Dec 3rd 2022, 8:01am)

klaus.krpano

Administrator

Posts: 13,432

  • Send private message

2

Saturday, December 10th 2022, 10:43am

Hi,

iOS and html5-video is a topic by its own... *rolleyes*

I don't know why captureStream don't work, but there is an easier solution for using a canvas without the need for videos.

Instead of using a video, the canvas can be added 'videoDOM' element to a krpano plugin element.
Then krpano then thinks this is a video-element and updates its texture every time when its currentTime value changes.

These settings would need to be done, they 'fake' a video-element:

Source code

 
1
2
3
4
5
6
7

plugin.videoDOM = canvas;
plugin.videowidth = canvas_width;
plugin.videoheight = canvas_height;
canvas.readyState = 4;
canvas.videoWidth = canvas_width;
canvas.videoHeight = canvas_height;
canvas.currentTime = 1;


and every time the canvas changes or should be redrawn, modify the currentTime somehow:

Source code

 
1

canvas.currentTime++;


Here a whole plugin source example:
https://krpano.com/viewsource.html?examp…awing/canvas.js

and here the example for trying - click the canvas and draw something:
https://krpano.com/krpano.html?xml=examp…wing/canvas.xml

The example xml:
https://krpano.com/viewsource.html?examp…wing/canvas.xml

Best regards,
Klaus

MANJAY

Beginner

  • "MANJAY" started this thread

Posts: 19

  • Send private message

3

Saturday, December 10th 2022, 12:06pm

Thanks, Klaus.
krpano is so flexible and powerful.

indexofrefraction

Professional

Posts: 1,305

  • Send private message

4

Saturday, December 10th 2022, 1:02pm

tx as well !
thats a neat technique :)
zFilter plugin -- zFlare plugin -- zSnapshot plugin

This post has been edited 1 times, last edit by "indexofrefraction" (Dec 12th 2022, 11:39pm)

MANJAY

Beginner

  • "MANJAY" started this thread

Posts: 19

  • Send private message

5

Saturday, December 10th 2022, 3:08pm

Hi Klaus, support transparent background?

klaus.krpano

Administrator

Posts: 13,432

  • Send private message

6

Tuesday, December 13th 2022, 3:23pm

Hi,

in version 1.20 transparent backgrounds are not possible in this case, there the internal texture for videos is always a RGB one.

But in version 1.21 RGBA textures are used for videos (mainly for better performance in Firefox), then transparent canvas elements will work automatically here.

Best regards,
Klaus

Similar threads