jonafeucht / youtube_plyr_iframe Goto Github PK

Hi,

I noticed a big difference in the player on iOS between 2.0.4 and 2.0.5

2.0.4

2.0.5

Am I missing some change in parameters I need to set?

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 2.2.0, on macOS 11.3 20E232
    darwin-x64, locale en-GB)
[✗] Android toolchain - develop for Android devices
    ✗ Unable to locate Android SDK.
      Install Android Studio from:
      https://developer.android.com/studio/index.html
      On first launch it will assist you in installing the
      Android SDK components.
      (or visit
      https://flutter.dev/docs/get-started/install/macos#an
      droid-setup for detailed instructions).
      If the Android SDK has been installed to a custom
      location, please use
      `flutter config --android-sdk` to update to that
      location.

[✓] Xcode - develop for iOS and macOS
[✓] Chrome - develop for the web
[!] Android Studio (not installed)
[✓] VS Code (version 1.56.2)
[✓] Connected device (3 available)

I am using the simulator.

Describe the bug
Whenever youtube_plyr_iframe is used in together with google_mobile_ads in the same page, the video would either not play properly or it would only plays the audio.

To Reproduce:
Use youtube_plyr_iframe in the same page with google_mobile_ads.

Expected behavior:
The player should be able to work with other plugins

Flutter Doctor:

[✓] Flutter (Channel unknown, 1.22.6, on Mac OS X 10.15.7 19H1217 darwin-x64, locale en-MY)
[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
[✓] Xcode - develop for iOS and macOS (Xcode 12.4)
[✓] Android Studio (version 3.5)
[✓] VS Code (version 1.57.0)
[!] Connected device
    ! No devices available

! Doctor found issues in 1 category.

The audio button doesn't appear in the web version of my app, when used in mobile browsers

YoutubePlayerController(
      initialVideoId: widget.tutorialVideoArgs!.url!,
      params: YoutubePlayerParams(
          showControls: true,
          autoPlay: true,
          showFullscreenButton: true,
          mute: true,
          desktopMode: true,
          enableCaption: true,
          enableJavaScript: true,
));

Video hangs on the navigation bar when scrolling and video scrolls with it.

Flutter dev channel 1.26.0-17.2.pre
Tested on iOS iphone 12 simulator & device

Describe the bug
The player has a white padding/white line underneath it. It's not visible unless you add a container below it as shown in the screenshot. When the list view containing the video is scrolled the white line flickers alot.

To Reproduce:
Steps to reproduce the behavior:
Add a video inside a listview, add a container below it.

Expected behavior:
There should be no white line/ padding below it.

Screenshot:

How can we hide youtube watermark on bottomright side?

Test

Describe the bug
When we have the video player rendered on the screen and another visual element is covering it, the user's "clicks" on the top element cause the video player to play/pause.

To Reproduce:
Place a video player on the screen. Pop-up a modal dialog above it. Click on the a portion of the modal dialog that overlaps the video player.

The video player plays and pauses. It registers the click events as if it was not covered.

Expected behavior:
We expect the click events to not register on the video player and be captured by the overlapping element.

Flutter Doctor:
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 2.0.5, on macOS 11.4 20F71 darwin-x64, locale en-US)
[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.2)
[✓] Xcode - develop for iOS and macOS
[✓] Chrome - develop for the web
[✓] Android Studio (version 4.1)
[✓] VS Code (version 1.57.1)
[✓] Connected device (1 available)

Additional context
none.

Thank you very much for your help and this wonderful widget. It's a huge help to us.

Related Research:
Doing some additional research on the topic, I noticed I could not find reports of this issue with regards to video players, however, I could find them with regards to iframes.

This package seems to be a "shim" that one can wrap around any element that "should" be treated as an overlay on top of an iFrame. It intercepts the clicks and passes them back to the proper element it wraps.

https://pub.dev/packages/pointer_interceptor

Here's the issue as reported to Flutter:
flutter/flutter#54027

Hello,

this library is helping us a lot on one of our projects. The is only a missing function that can really help and improve this library in our opinion showFullScreen().

Is it possible to implement it?

Thanks

How to resolve the following error in web? It came in the original youtube_iplayer_frame package too.

this comes only appear in web version

`
at platform_view$._PlatformViewLinkState.new.[_onPlatformViewCreated] (http://localhost:38095/packages/flutter/src/widgets/platform_view.dart.lib.js:1261:12)
at http://localhost:38095/packages/flutter/src/widgets/platform_view.dart.lib.js:624:12
at _RootZone.runUnary (http://localhost:38095/dart_sdk.js:38889:58)
at _FutureListener.then.handleValue (http://localhost:38095/dart_sdk.js:33875:29)
at handleValueCallback (http://localhost:38095/dart_sdk.js:34435:49)
at Function._propagateToListeners (http://localhost:38095/dart_sdk.js:34473:17)
at _Future.new.[_completeWithValue] (http://localhost:38095/dart_sdk.js:34315:23)
at async._AsyncCallbackEntry.new.callback (http://localhost:38095/dart_sdk.js:34338:35)
at Object._microtaskLoop (http://localhost:38095/dart_sdk.js:39176:13)
at _startMicrotaskLoop (http://localhost:38095/dart_sdk.js:39182:13)
at http://localhost:38095/dart_sdk.js:34689:9

`
here is the flutter doctor

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 2.0.3, on Linux, locale en_US.UTF-8)
[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
[✓] Chrome - develop for the web
[✓] Android Studio
[✓] Connected device (1 available)

When long press on player shows a list of options.

Is there any way to prevent this???

Describe the bug
setVolume not working

To Reproduce:
Can be reproduced in example project by calling setVolume while a video is paused.

Expected behavior:
Video volume to change in response to setVolume

Flutter Doctor:
[✓] Flutter (Channel beta, 2.2.0-10.3.pre, on macOS 11.3.1 20E241 darwin-arm,
locale en-US)
[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
[✓] Xcode - develop for iOS and macOS
[✓] Chrome - develop for the web
[✓] Android Studio (version 4.1)
[✓] VS Code (version 1.53.1)
[✓] Connected device (2 available)

Additional context
N/A

Flutter team is pushing for null safety which is expected to release at #FlutterEngage.

I've started to migrate this package and development can be followed on branch https://github.com/jonatadashi/youtube_plyr_iframe/tree/nullsafety.

How to show subtitles/transcript?
Like this https://codepen.io/n1ghtmaar/embed/Gdbema/?theme-id=modal or subtitle in https://github.com/jhomlala/betterplayer
Thanks

When i use this link https://smalldreams.github.io/Web-Example/#/ from pub dev site, full screen button was working fine.

Same Sample when was in the https://github.com/SmallDreams/youtube_plyr_iframe in local, the full screen button is not working.

The issue occured when i tried your package on our project.

Running this Sample https://github.com/SmallDreams/youtube_plyr_iframe, itself reproduces the issue.(Flutter web)

Do i need to configure any other thing from the package.

There's an error with iOS build.

flutter_inappwebview-5.1.0+4/ios/Cl
    asses/InAppWebView/InAppWebView.swift:674:34: error: value of type 'WKPDFConfiguration' has no
    member 'rect'
                    pdfConfiguration.rect = CGRect(x: rect["x"]!, y: rect["y"]!, width:
                    rect["width"]!, height: rect["height"]!)

xcode Version 12.1

  #51 pc 0000000000003680  /system/bin/app_process64 (main+1592) (BuildId: 4076a8a516172b5372277069ce0546fd)
  #52 pc 000000000008506c  /apex/com.android.runtime/lib64/bionic/libc.so (__libc_init+108) (BuildId: a790cdbd8e44ea8a90802da343cb82ce)

Lost connection to device.
Exited (sigterm)

kindly look into the issue.

Inline player in ios working but there are no fullscreen button

playerController = YoutubePlayerController(
      initialVideoId: youtubeId,
      params: YoutubePlayerParams(
        autoPlay: false,
        desktopMode: false,
        enableCaption: true,
        showFullscreenButton: true,
        showControls: true,
        enableJavaScript: false,
        playsInline: true,
        enableKeyboard: false,
      ),
    );

Describe the bug
The Flutter app crashes when YoutubePlayerIFrame widget is used

To Reproduce:
Steps to reproduce the behavior:
On an iOS 14.5 device

1. (In my case) Create a ListView widget
2. In one of the children of the ListView, have a YoutubePlayerIFrame instance

Expected behavior:
YoutubePlayerIFrame should load and display a Youtube player

Flutter Doctor:

Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 2.0.1, on Microsoft Windows [Version
    10.0.19042.928], locale en-PH)
[√] Android toolchain - develop for Android devices (Android SDK version 30.0.2)
[√] Chrome - develop for the web
[√] Android Studio (version 4.1.0)
[√] VS Code (version 1.55.2)
[√] Connected device (2 available)

Additional context
Observed on both an iPhone 11 Pro and iPhone 7 Plus. I can confirm that before updating to iOS 14.5, the same code works fine. No any special params passed onto the YoutubePlayerIFrame constructor

Hello Sir, I notice that sometimes the video plays in desktop mode even though its default value is false. Please suggest any idea or workaround to fix this issue. Thanks in advance.

Describe the bug
When rotating device, youtubeplayer widget is rebuilding

To Reproduce
open player screen and than rotate phone to change orientation

Expected behavior
widget state should be maintained

Describe the bug
Even after adding IgnorePointer on the iFrame, on tap it shows the pop up menu. Is there a way to disable it?

To Reproduce:
Add IgnorePointer widget on the player, and tap on it.

Expected behavior:
Adding IgnorePointer widget on the player should not allow the pop up menu to be triggered.

Screenshot

Describe the bug
I tried youtube_player_iframe 2.0.0 but it did not work on iOS for me so now I'm trying youtube_plyr_iframe 2.0.3 instead. But first I try in Android and there autoPlay:true works but with youtube_plyr_iframe it does not :)

To Reproduce:
Steps to reproduce the behavior:

Let autoPlay be true. Does not make any difference.

Expected behavior:

Autoplay video.

Flutter Doctor:

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel beta, 2.1.0-12.2.pre, on Linux, locale en_US.UTF-8)
[!] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
✗ Android license status unknown.
Run flutter doctor --android-licenses to accept the SDK licenses.
See https://flutter.dev/docs/get-started/install/linux#android-setup for more details.
[✓] Chrome - develop for the web
[✓] Linux toolchain - develop for Linux desktop
[✓] Android Studio (version 4.1)
[✓] Android Studio
[✓] IntelliJ IDEA Ultimate Edition (version 2020.3)
[✓] Connected device (3 available)

! Doctor found issues in 1 category.

Additional context

I've tried to compare the source codes and the only difference I find is the allow= to the <iframe> but it includes autoplay.

Seems that .listen is still adding new data after .close? I need to dispose and re-creates the youtubeplayer any way to avoid this error?

Error: Bad state: Cannot add new events after calling close
at Object.throw_ [as throw] (http://localhost:64685/dart_sdk.js:5334:11)
at _AsyncBroadcastStreamController.new.add (http://localhost:64685/dart_sdk.js:32891:55)
at controller.YoutubePlayerController.new.add (http://localhost:64685/packages/youtube_plyr_iframe/src/helpers/youtube_value_builder.dart.lib.js:960:32)
at http://localhost:64685/packages/youtube_plyr_iframe/src/helpers/youtube_value_builder.dart.lib.js:562:45
at Object._checkAndCall (http://localhost:64685/dart_sdk.js:5544:16)
at Object.dcall (http://localhost:64685/dart_sdk.js:5549:17)
at http://localhost:64685/dart_sdk.js:105416:21

Describe the bug
Thumbnail not being displayed on flutter web when using the example code on chrome browser

To Reproduce:
Used the example app

Additional context
Failed to load network image. Image URL: https://i3.ytimg.com/vi/B56WXAR7KpM/mqdefault.jpg Trying to load an image from another domain? Find answers at: https://flutter.dev/docs/development/platform-integration/web-images

When I play forward/backward or drag/seek the video, the buffered value always returns 1. The expected value is the current video position. For example, when the video position is at time 00:15, we press the forward button and now video position is at 00:30, then the expected result should be 30:

YoutubePlayerController _controller = YoutubePlayerController(
    initialVideoId: 'K18cpp_-gP8',
    params: YoutubePlayerParams(
        startAt: Duration(seconds: 10),
        showControls: true,
        showFullscreenButton: true,
    ),
)..listen((value) {
    if (value.playerState == PlayerState.buffering) {
        print('bufferedTime is: ${value.buffered.seconds.inSeconds}'); // Always 1.
    }
});

Any idea or workaround? Thanks in advance and please keep evolving this plugin as I see it solves many issues exists in youtube_player_iframe.

hii thanks for this fork it is really awesome but i just notice
in orginal plugin sdk version 20 was supported as it is min sdk support by platform view and flutter_inappwebview
but in this fork is 23
is there other factor ( except platform view , flutter_inappwebview ) effect this choice ?

Any help would be appreciated
Describe the bug
It runs perfectly on iOS devices, but on Android devices, it will throw an error MissingPluginException(No implementation found for method evaluateJavascript on channel com.pichillilorenzo/flutter_inappwebview_1) once dispose of the page, and the number increases every time the page is disposed. For example, if enter the page again and leave, it will display No implementation found for method evaluateJavascript on channel com.pichillilorenzo/flutter_inappwebview_2

To Reproduce:

• Use AVD (Android 11.0, API 30) to run the example in this github
• Enter the Inline demo page
• Click the back button to leave this page

Error log
I/flutter ( 8376): ┌───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): │ ⛔ ---------- ERROR ----------
I/flutter ( 8376): └───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): ┌───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): │ ⛔ MissingPluginException(No implementation found for method evaluateJavascript on channel com.pichillilorenzo/flutter_inappwebview_1)
I/flutter ( 8376): └───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): ┌───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): │ ⛔
I/flutter ( 8376): └───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): ┌───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): │ ⛔ ------- STACK TRACE -------
I/flutter ( 8376): └───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): ┌───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): │ ⛔ #0 MethodChannel._invokeMethod (package:flutter/src/services/platform_channel.dart:156:7)
I/flutter ( 8376): └───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): ┌───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): │ ⛔
I/flutter ( 8376): └───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): ┌───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): │ ⛔ #1 InAppWebViewController.evaluateJavascript (package:flutter_inappwebview/src/in_app_webview/in_app_webview_controller.dart:1375:16)
I/flutter ( 8376): └───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): ┌───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): │ ⛔
I/flutter ( 8376): └───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): ┌───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): │ ⛔
I/flutter ( 8376): └───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): ┌───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
I/flutter ( 8376): │ ⛔ ======================================================================
I/flutter ( 8376): └───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────

Please fix this issue sarbagyastha/youtube_player_flutter#419

Due to Youtube's top menu, the fullscreen controls are hidden under the top menu on some phones ( most IOS )...
If we had a showTopMenu() I could then control the duration the top menu is displayed after transitioning the play state.
Which might help staying within Youtube's TOS.

The README says that it fixes some bugs. Is there a list of differences and maybe rationale why a new package has been created instead of contributing to the original one?

It's possible to force landscape mode when play video?

My mobile app is only with Portrait mode, as exemple: android:screenOrientation="portrait"
When I play the button on iframe to full screen mode, I can't use landscape orientation. Only if entire app is with this possibility (and that's not the intention).

How to proceed?