Always on top

[liorshk]

Hi,

Do you have any idea of a workaround to enable that the plugin will not be always on top?
I tryed putting inside an iframe but it doesn't work.
Only in windowless mode it works but all the great features are not included in windowless mode.

Thanks!

[RSATom]

Could you make some screenshot? I'm little not understand how it could be... Do you use fbvlc compatibility mode?

[liorshk]

What I mean is that html z-index is not affecting the player.
What is fbvlc compatibility mode?

[RSATom]

https://github.com/RSATom/WebChimera/wiki/HTML-page-embedding#fbvlc-mode (from WebChimera 0.2.0 it could be used instead of fbvlc)

do you mean some items on your page drawn over plugin window? or you need place plugin window under some html item (div for example)?

[liorshk]

I need to place plugin window under some other html item.
It works in windowless mode but not in Native Mode.
But I need native mode for the stretch option.

[RSATom]

I don't know any way to do it, but one guy told me he know way. I've sent link to this issue to him, hope he will answer.

[RSATom]

btw, why you don't use Qml for it? WebChimera was created exactly to solve task with placing some items above video.

[liorshk]

Thanks, I will wait for his response.
The thing is that I have for example drop down menu or a modal that needs to be over the plugin.
It is not specifically related to the video.

[RSATom]

Yes, it has a meaning then...

[gyzerok]

Hello, @lshkiller!

You should wrap embed element into a div with overflow hidden.
Then behind this div you can place whatever you want.
After reducing div's size you'll see the underlying elements.

This solution works for me with FBVLC to draw custom player controls.

If want to draw something over the player window, you need to give visibility hidden to embed or it's wrapper element. I suppose this is the only solution.

[liorshk]

Hi,

Thanks! It actually works.
The only problem now is that after I set the visibility back to visible - the video doesn't start playing again.

[RSATom]

@lshkiller, could you please make some test html for me? - I'll try to fix it.

[jaruba]

You could also try the Iframe Shim Technique:

http://editor.webchimera.org/iframe_shim

[liorshk]

@RSATom I sent you a demo

If you didn't get it - do this:
Change the html of the default skin demo to:

<div id="player_wrapper" style="height:50%;"></div>

  <div id="dialog" title="Basic dialog" >
      <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
    </div>


 <div id="target">
  <p>Click Here</p>
</div>

and add to the javascript this:

$( "#dialog" ).hide()
$( "#target" ).click(function() {
      $( "#dialog" ).dialog({
          position: { my: "left top", at: "left top", of: window },
          modal: true,
          buttons: {
            Ok: function() {
              $( this ).dialog( "close" );
            }
          }
        });
    });

[liorshk]

Anyway, I tested on Internet Explorer 11 and the player does start playing. The only problem is in chrome I guess. So its fine for me :)

[gyzerok]

@lshkiller are you sure you change visibility to hidden but not display to none?

[jaruba]

@lshkiller I got the demo that you sent, but the modal isn't on top of the video, and I can't imagine how it works for you.

To simplify your demo, I added a div with text to try to get it on top of the video with gyzerok's method, but I can't manage to do it.

@gyzerok Do you think you could look at the demo here: http://editor.webchimera.org/ishkiller and try to make it work with your method then click "Suggest Demo" ?

I thought I understood your method so I made a wrapper div to the object tag, set it to height 100px and overflow: hidden, then set the object to height 400px. But the video only shows in the wrapper's 100px height, and if I set visibility hidden to the wrapper or object tag, the video disappears.

Also, please tell me what DOCTYPE you set on the pages that this worked on, your method might require a specific doctype to work as expected.

[gyzerok]

@jaruba the trick with it is that setting visibility to hidden for the plugin object do not stop the playback process, while setting display to none do.

Its a bit hard for me to play with editor since I'm using linux and plugin doesnt work on the virtual machine because of some Qt issues. I'll try to play with demo ishkiller provided as soon as possible.

[jaruba]

@gyzerok I think I finally understood what your method is, I thought it implied positioning objects over the plugin space on the page. But your explanations are for hiding part of the video by modifying width and height to see the objects behind it and hiding the plugin object all together while keeping playback.

If this is the case, I think the Iframe Shim technique seems to be a better choice because it actually cuts through the plugin object with an iframe and lets you see the html elements underneath. This lets you create more complex shapes and cut even from the middle of the video surface.

I will try to add a function to webchimera.js that will add an iframe shim to any html element as a pure javascript alternative to webchimera plugin windowless.