Action html block z-index top of the video

[hesrun]

We have made sure that the video falls over HTML WebView. I make to big video z-index: -1 and make transparent body and html. Block with actions btns i make with high z-index 10, 99, 1000 and 9999 and 99999.... (((( But the block with the buttons is not active, but they are visible. Clicks on it are not processed.

What could be the problem?

I can show styles, screenshots.

We using framework7...

[wolfenrain]

Could you supply some HTML/CSS(maybe JS). I wonder if your camera HTML element is above the buttons and therefore your buttons wont be triggerd..

[hesrun]

@wolfenrain this screens from files...

[hesrun]

@wolfenrain if .OT_subscriber make z-index: -1 and bottom 0px; video go to back of page, then we make transparent bg for other blocks, do OT.updateViews(), And i see fullscr video and action buttons, but they dont clicked...

[hesrun]

I make a simple app, with my problem. https://drive.google.com/open?id=1df8BXPHK7kmasHGGEnV6k25CkjZ0RwNY At this app i have two blocks, one with video, one with buttons...

And again this problem, i can see buttons, but the not clickable

[sagivf]

If it helps anyone this fork solved the issue for me: https://github.com/talkspiritlab/cordova-plugin-opentok

[rafialikhan]

@hesrun Were you able to solve this problem?

Edit: Got this working for iOS. Look for the updateView function in OpenTokPlugin.m file and add the following line just after this statement _publisher.view.userInteractionEnabled = YES;

 if(zIndex < 0) {
      _publisher.view.userInteractionEnabled = NO;
 }

and also after streamInfo.view.userInteractionEnabled = YES;

if(zIndex < 0) {
            streamInfo.view.userInteractionEnabled = NO;
}

[Shtibel]

Hi @rafialikhan I see you are talking about this plugin: https://github.com/talkspiritlab/cordova-plugin-opentok

But as I can see this code is already implemented

We tried this plugin but the html layer are not visible. What can be the problem ?

[rafialikhan]

@Shtibel We are using https://github.com/opentok/cordova-plugin-opentok but applied the same idea used in https://github.com/talkspiritlab/cordova-plugin-opentok. This solution is to solve the problem of html actions button not triggering the click events.

For overlaying the HTML control elements above the camera view we are using the negative z-index workaround as mentioned in the beginning of this thread.

[bijanmmarkes]

@rafialikhan Are you able to have clickable html over the video using this repository? Could you share some sample code?