6 Replies Latest reply on Sep 19, 2016 11:33 AM by emiejagz

    streaming media plugin - load in canvas not fullscreen

    emiejagz Level 1

      Hello guys, I developed a streaming app that streams multiple events using the StreamingMedia plugin which has been awesome but of recent my employer wants me to add a live text chat feature to the application so when a stream is on, users can interact and send in questions or solutions or their opinion. I do not have a problem creating a live text chat, the issue am faced with is how to load the player being triggered by StreamingMedia plugin in a canvas and not in fullscreen so when it appears, the live chat can be placed below. please can you help.

       

      A second option is triggering a chat overlay on the video on fullscreen just like snapchat does, dont know if that is possible though.

        • 1. Re: streaming media plugin - load in canvas not fullscreen
          emiejagz Level 1

          somebody please be kind enough to reply

          • 2. Re: streaming media plugin - load in canvas not fullscreen
            kerrishotts Adobe Community Professional

            FYI: Weekends tend to be slow. So posting on Friday means you're probably not going to get a quick response. Furthermore, this is about a third-party plugin that not everyone will have experience with, so that will further limit the pool of individuals who will feel like they can respond constructively.

             

            Taking a very quick look at the plugin, I don't think there's a way to use the plugin as-is and do what you're asking -- it uses native controls, not HTML5 to render the video. You could:

            • Fork the plugin and make changes to the UI and API to allow for positioning of the player over content.
            • Contact the plugin developer and suggest the feature -- they may be willing to add support.

             

            Note: I see a full screen option in the documentation for the plugin, but a comment in the example leads me to believe this is iOS only. Furthermore, it would do little good in your case since I see no mechanism for positioning the media player.

             

            Hope that helps.

            • 3. Re: streaming media plugin - load in canvas not fullscreen
              emiejagz Level 1

              Good day

               

               

              • 4. Re: streaming media plugin - load in canvas not fullscreen
                kerrishotts Adobe Community Professional

                You can upload the plugin to a private github repository or to the PGB repository as a private plugin. But that requires a paid PGB account.

                 

                Otherwise, make the fork available publicly on github/npm and you can use it like any other plugin.

                • 5. Re: streaming media plugin - load in canvas not fullscreen
                  julianopessini

                  Hi emiejagz! I have the same problem. What did you do?

                  Can you help me some way? I need to display a streaming video in a windowed canvas.

                   

                  Best regards,

                  Juliano

                  • 6. Re: streaming media plugin - load in canvas not fullscreen
                    emiejagz Level 1

                    i forked the plugin from github and made changes to it, its only available for android now, the ios acts like the original streaming-media plugin itself but my team is currently working on it. i use this now <plugin name="cordova-plugin-streaming-media-mod" spec="" source="npm" /> and here is the repo <repo>https://github.com/donaldepignosis/cordova-plugin-streaming-media.git</repo> from git by donaldson epignosis.

                    <plugin

                            xmlns="http://apache.org/cordova/ns/plugins/1.0"

                            xmlns:android="http://schemas.android.com/apk/res/android"

                            id="me.donaldepignosis.cordova.plugins.streamingmedia.mod"

                            version="1.0.1">

                    <param name="android-package" value="me.donaldepignosis.cordova.plugins.streamingmedia.mod.StreamingMedia" />

                     

                    just replace all i listed above with what ypu have on the original plugin documentation.

                     

                     

                    You can pass parameters like this for your options:

                    var options = {

                      successCallback: function() {

                          console.log("Video was closed without error.");

                        },

                        errorCallback: function(errMsg) {

                          console.log("Error! " + errMsg);

                        },

                        orientation: 'portrait',<--- you can either state it to go landscape or portrait, portrait gives you what you want but landscape acts with what the original plugin gives, if you state portrait and change the orientation of the device, it automatically goes landscape ---->

                        shouldSplitVertically: true, <---- for the shouldSplitVertically set to true so you can have both landscape and portrait, if you state as false you will only get the original feature of the plugin i.e loading the player at fullscreen automatically--->

                        shouldAutoClose: true, <---- for the autoclose, do you want the player closing automatically when a stream or video being played is over, if yes, set to true ---->

                        contentUrl: '#'+" <---- this is the web view part, what would you want to load under the player if splitted in portrait e.g a chat, etc --->

                      };

                     

                    The full documentation isnt available on his account, that is why i explained this long. hope you find my answer helpful. if it isnt clear, you can ask for more info. Good luck.

                     

                    Screenshot_2016-09-19-16-39-18.png

                    1 person found this helpful