Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Video stopped when fullscreen mode with viewport #45

Closed
whilemouse opened this issue Oct 11, 2018 · 5 comments
Closed

Video stopped when fullscreen mode with viewport #45

whilemouse opened this issue Oct 11, 2018 · 5 comments

Comments

@whilemouse
Copy link

First, thanks for this good library.

Describe the bug
I used three.js demo and modified. video stopped when fullscreen mode with viewport. Probably it happened where only old iPhone.

To Reproduce
Steps to reproduce the behavior:

  1. Go to source file 'demos/threejs/miel_pops/index.html'
  2. Change Code
  • demos/threejs/miel_pops/index.html
    • add viewport
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
  • demos/threejs/miel_pops/demo.js
    • add isFullScreen: true,
function main(){
    JeelizResizer.size_canvas({
        canvasId: 'jeeFaceFilterCanvas',
        isFullScreen: true,
        callback: function(isError, bestVideoSettings){
            init_faceFilter(bestVideoSettings);
        }
    })
}
  1. open safari -> responsive design mode -> select iPhone SE
  2. open 'demos/threejs/miel_pops/index.html'
  3. Stopped video

Expected behavior
Playing video

Screenshots
I don't upload. because screenshot can't know playing or stopped.

Desktop (please complete the following information):

  • OS: MacOS High Sierra 10.13.3
  • Browser [responsive design mode iPhone SE in safari(11.0.3)]

Smartphone (please complete the following information):

  • Device: [iPhone6s, iPhone SE]
  • OS: [iOS 12.0.1]
  • Browser [safari 11.0.3]

Additional context
My test device

  • Video playing device
    • iPhone 8(responsive design mode in mac os safari) : video playing
    • Mac OS(safari) : video playing
  • Video stopped device
    • iPhone 6s(mobile safari): video stopped
    • iPhone SE(responsive design mode in mac os safari) : video stopped
    • galaxy note 9(mobile chrome): video playing
@whilemouse whilemouse changed the title video stopped when fullscreen mode with viewport Video stopped when fullscreen mode with viewport Oct 11, 2018
@whilemouse
Copy link
Author

whilemouse commented Oct 11, 2018 •
edited

By modifying this code will cause the video to play. It should work with setTimeout

function init_faceFilter(videoSettings){
    JEEFACEFILTERAPI.init({
            ...
        callbackReady: function (errCode, spec) {
            ...
        if( document.querySelector('video') !== null) {
            setTimeout(function () {
                document.querySelector('video').play();
            }, 100);
        }
            init_threeScene(spec);
        }, // end callbackReady()
    ...
}

@xavierjs
Copy link
Member

Yeah, with Safari playing the video from the webcam is a pain in the ass...
The MediaStream API helper needs to append the

Thank you for your detailed bug report, I will add your fix into the video helper included into the main script and commit.

xavierjs added a commit that referenced this issue Oct 11, 2018
@xavierjs
apply #45 modif
87a73cf
@xavierjs
Copy link
Member

It should work now :)

@whilemouse
Copy link
Author

It works. thank you for a quick and accurate response. :)

@xavierjs xavierjs mentioned this issue Oct 17, 2018
Closed
@xavierjs
Copy link
Member

Related to #14

jennifer39barbourtui added a commit to jennifer39barbourtui/reactnative that referenced this issue Feb 3, 2024
@jennifer39barbourtui
apply jeeliz/jeelizFaceFilter#45 modif
bc7b5d1
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@xavierjs @whilemouse