Skip to content
This repository has been archived by the owner on Jan 18, 2023. It is now read-only.

Commit

Permalink
#10 fix
Browse files Browse the repository at this point in the history
  • Loading branch information
@wolfenrain
wolfenrain committed Mar 1, 2018
1 parent 01a21f3 commit 309cb62
Show file tree
Hide file tree
Showing 10 changed files with 313 additions and 180 deletions.
1 change: 0 additions & 1 deletion build-extras.gradle
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,5 +22,4 @@ dependencies {
compile 'com.android.support:appcompat-v7:23.1.0'
compile 'com.android.support:design:23.0.0'
compile 'com.android.volley:volley:1.1.0'
compile 'com.github.ksoichiro:android-observablescrollview:1.6.0'
}
11 changes: 8 additions & 3 deletions plugin.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,10 +9,12 @@
<license>Apache 2.0</license>
<keywords>opentok,tokbox</keywords>

<dependency id="cordova-plugin-wkwebview-engine" version="1.1.4"/>

<platform name="android">
<framework src="build-extras.gradle" custom="true" type="gradleReference" />
<asset src="www/opentok.js" target="opentok.js" />
<source-file src="src/android/OpenTokAndroidPlugin.java" target-dir="src/com/tokbox/cordova/" />
<source-file src="src/android/OpenTokAndroidPlugin.java" target-dir="src/com/tokbox/cordova/" />

<config-file target="AndroidManifest.xml" parent="/manifest">
<uses-permission android:name="android.permission.CAMERA" />
Expand Down Expand Up @@ -78,11 +80,14 @@

<!-- Adopts project's config.xml to include the OpenTokPlugin and domain whitelists -->
<config-file target="config.xml" parent="/*">
<access origin="*" />
<feature name="OpenTokPlugin">
<param name="ios-package" value="OpenTokPlugin"/>
<param name="onload" value="true"/>
</feature>
<feature name="CDVWKWebViewEngine">
<param name="ios-package" value="CDVWKWebViewEngine" />
</feature>
<preference name="CordovaWebViewEngine" value="CDVWKWebViewEngine" />
</config-file>

<!-- add required entries into plist file -->
Expand All @@ -97,5 +102,5 @@
<platform name="browser">
<hook type="before_plugin_install" src="scripts/downloadJSSDK.js" />
<asset src="node_modules/@opentok/client/dist/js/opentok.min.js" target="opentok.js"/>
</platform>
</platform>
</plugin>
68 changes: 41 additions & 27 deletions src/android/OpenTokAndroidPlugin.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,8 +46,6 @@
import com.opentok.android.SubscriberKit;
import com.opentok.android.BaseVideoRenderer;

import com.github.ksoichiro.android.observablescrollview.ObservableScrollView;

public class OpenTokAndroidPlugin extends CordovaPlugin
implements Session.SessionListener,
Session.ConnectionListener,
Expand All @@ -73,12 +71,15 @@ public class OpenTokAndroidPlugin extends CordovaPlugin
public static final String[] perms = {Manifest.permission.INTERNET, Manifest.permission.CAMERA, Manifest.permission.RECORD_AUDIO};
public CallbackContext permissionsCallback;


public class RunnableUpdateViews implements Runnable {
public JSONArray mProperty;
public View mView;
public ArrayList<RunnableUpdateViews> allStreamViews;

// Used for setting the camera views.
public float widthRatio;
public float heightRatio;

public class CustomComparator implements Comparator<RunnableUpdateViews> {
@Override
public int compare(RunnableUpdateViews object1, RunnableUpdateViews object2) {
Expand Down Expand Up @@ -119,15 +120,25 @@ public int getZIndex() {
}
}

public void setPosition() {
try {
mView.setX(mProperty.getInt(2) * widthRatio);
mView.setY(mProperty.getInt(1) * heightRatio);

ViewGroup.LayoutParams params = mView.getLayoutParams();
params.width = (int) (mProperty.getInt(3) * widthRatio);
params.height = (int) (mProperty.getInt(4) * heightRatio);
mView.setLayoutParams(params);
} catch (Exception e) {}
}

@SuppressLint("NewApi")
@Override
public void run() {
try {
Log.i(TAG, "updating view in ui runnable" + mProperty.toString());
Log.i(TAG, "updating view in ui runnable " + mView.toString());

float widthRatio, heightRatio;

// Ratios are index 6 & 7 on TB.updateViews, 8 & 9 on subscribe event, and 9 & 10 on TB.initPublisher
int ratioIndex;
if (mProperty.get(6) instanceof Number) {
Expand All @@ -143,12 +154,7 @@ public void run() {

widthRatio = (float) mProperty.getDouble(ratioIndex) * metrics.density;
heightRatio = (float) mProperty.getDouble(ratioIndex + 1) * metrics.density;
mView.setY(mProperty.getInt(1) * heightRatio);
mView.setX(mProperty.getInt(2) * widthRatio);
ViewGroup.LayoutParams params = mView.getLayoutParams();
params.height = (int) (mProperty.getInt(4) * heightRatio);
params.width = (int) (mProperty.getInt(3) * widthRatio);
mView.setLayoutParams(params);
setPosition();
updateZIndices();
} catch (Exception e) {
Log.i(TAG, "error when trying to retrieve properties while resizing properties");
Expand Down Expand Up @@ -421,22 +427,6 @@ public void initialize(CordovaInterface cordova, CordovaWebView webView) {
// Make the web view transparent.
_webView.getView().setBackgroundColor(Color.argb(1, 0, 0, 0));


cordova.getActivity().runOnUiThread(new Runnable() {
@Override
public void run() {
// original layout
ViewGroup frameLayout = (ViewGroup) _webView.getView().getParent();
ViewGroup layoutParent = (ViewGroup) frameLayout.getParent();
layoutParent.removeView(frameLayout);

// Observable scroll view with webView and cameraViews as children
ObservableScrollView scrollView = new ObservableScrollView(_cordova.getActivity().getApplicationContext());
scrollView.addView(frameLayout);
layoutParent.addView(scrollView);
}
});

Log.d(TAG, "Initialize Plugin");
// By default, get a pointer to mainView and add mainView to the viewList as it always exists (hold cordova's view)
if (!viewList.has("mainView")) {
Expand Down Expand Up @@ -586,6 +576,30 @@ public void run() {
cordova.getActivity().runOnUiThread(runsub);
}
}
} else if (action.equals("hasStatusBarPlugin")) {
// Currently only needed for iOS, but for the sake of sanity we include it here aswell.
} else if (action.equals("updateCamera")) {
int top = args.getInt(1);
int left = args.getInt(2);
int width = args.getInt(3);
int height = args.getInt(4);

if (args.getString(0).equals("TBPublisher") && myPublisher != null && sessionConnected) {
myPublisher.mProperty.put(1, top);
myPublisher.mProperty.put(2, left);
myPublisher.mProperty.put(3, width);
myPublisher.mProperty.put(4, height);

myPublisher.setPosition();
} else {
RunnableSubscriber runsub = subscriberCollection.get(args.getString(0));
runsub.mProperty.put(1, top);
runsub.mProperty.put(2, left);
runsub.mProperty.put(3, width);
runsub.mProperty.put(4, height);

runsub.setPosition();
}
} else if (action.equals("exceptionHandler")) {

}
Expand Down
48 changes: 41 additions & 7 deletions src/ios/OpenTokPlugin.m
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ @implementation OpenTokPlugin{
NSMutableDictionary *callbackList;
NSString *apiKey;
NSString *sessionId;
Boolean statusBarPlugin;
}

@synthesize exceptionId;
Expand All @@ -28,6 +29,7 @@ -(void) pluginInitialize{
[self.webView setOpaque:false];
[self.webView setBackgroundColor:UIColor.clearColor];

statusBarPlugin = true;
callbackList = [[NSMutableDictionary alloc] init];
}
- (void)addEvent:(CDVInvokedUrlCommand*)command{
Expand Down Expand Up @@ -164,8 +166,9 @@ - (void)initPublisher:(CDVInvokedUrlCommand *)command{
[_publisher setPublishAudio:bpubAudio];
[_publisher setPublishVideo:bpubVideo];
[_publisher setAudioFallbackEnabled:baudioFallbackEnabled];
[self.webView.scrollView addSubview:_publisher.view];
[_publisher.view setFrame:CGRectMake(left, top, width, height)];
[self.webView.superview addSubview:_publisher.view];

[self setPosition: @"TBPublisher" top: top left: left width: width height: height];

// Set depth location of camera view based on CSS z-index.
_publisher.view.layer.zPosition = zIndex;
Expand All @@ -187,17 +190,19 @@ - (void)updateView:(CDVInvokedUrlCommand*)command{
int width = [[command.arguments objectAtIndex:3] intValue];
int height = [[command.arguments objectAtIndex:4] intValue];
int zIndex = [[command.arguments objectAtIndex:5] intValue];

if ([sid isEqualToString:@"TBPublisher"]) {
NSLog(@"The Width is: %d", width);
_publisher.view.frame = CGRectMake(left, top, width, height);
// Reposition the video feeds!
[self setPosition: sid top: top left: left width: width height: height];

// Set depth location of camera view based on CSS z-index.
_publisher.view.layer.zPosition = zIndex;

// If the zIndex is 0(default) bring the view to the top, last one wins.
// See: https://github.com/saghul/cordova-plugin-iosrtc/blob/5b6a180b324c8c9bac533fa481a457b74183c740/src/PluginMediaStreamRenderer.swift#L191
if(zIndex == 0) {
[self.webView.scrollView bringSubviewToFront:_publisher.view];
[self.webView.superview bringSubviewToFront:_publisher.view];
}
}

Expand All @@ -206,15 +211,15 @@ - (void)updateView:(CDVInvokedUrlCommand*)command{

if (streamInfo) {
// Reposition the video feeds!
streamInfo.view.frame = CGRectMake(left, top, width, height);
[self setPosition: sid top: top left: left width: width height: height];

// Set depth location of camera view based on CSS z-index.
streamInfo.view.layer.zPosition = zIndex;

// If the zIndex is 0(default) bring the view to the top, last one wins.
// See: https://github.com/saghul/cordova-plugin-iosrtc/blob/5b6a180b324c8c9bac533fa481a457b74183c740/src/PluginMediaStreamRenderer.swift#L191
if(zIndex == 0) {
[self.webView.scrollView bringSubviewToFront:_publisher.view];
[self.webView.superview bringSubviewToFront:_publisher.view];
}
}

Expand All @@ -223,6 +228,35 @@ - (void)updateView:(CDVInvokedUrlCommand*)command{
//[self.commandDelegate sendPluginResult:callbackResult toSuccessCallbackString:command.callbackId];
[self.commandDelegate sendPluginResult:callbackResult callbackId:command.callbackId];
}
- (void)hasStatusBarPlugin:(CDVInvokedUrlCommand*)command{
statusBarPlugin = [[command.arguments objectAtIndex:0] boolValue];
}
- (void)updateCamera:(CDVInvokedUrlCommand*)command{
NSString* sid = [command.arguments objectAtIndex:0];
int top = [[command.arguments objectAtIndex:1] intValue];
int left = [[command.arguments objectAtIndex:2] intValue];
int width = [[command.arguments objectAtIndex:3] intValue];
int height = [[command.arguments objectAtIndex:4] intValue];

[self setPosition: sid top: top left: left width: width height: height];
}
- (void)setPosition:(NSString*)sid top:(int)top left:(int)left width:(int)width height:(int)height {
int offsetTop = 20;
if (statusBarPlugin) {
// We set the offsetTop to the top position of the webView because the StatusBarPlugin changes the top position to the proper offset.
offsetTop = self.webView.frame.origin.y;
} else if ([UIApplication sharedApplication].isStatusBarHidden) {
offsetTop = 0;
}

CGRect frame = CGRectMake(left, top + offsetTop, width, height);
if ([sid isEqualToString:@"TBPublisher"]) {
_publisher.view.frame = frame;
} else {
OTSubscriber* streamInfo = [subscriberDictionary objectForKey:sid];
streamInfo.view.frame = frame;
}
}

#pragma mark Publisher Methods
- (void)publishAudio:(CDVInvokedUrlCommand*)command{
Expand Down Expand Up @@ -331,7 +365,7 @@ - (void)subscribe:(CDVInvokedUrlCommand*)command{
// Set depth location of camera view based on CSS z-index.
sub.view.layer.zPosition = zIndex;

[self.webView.scrollView addSubview:sub.view];
[self.webView.superview addSubview:sub.view];

// Return to JS event handler
CDVPluginResult* pluginResult = [CDVPluginResult resultWithStatus:CDVCommandStatus_OK];
Expand Down
3 changes: 3 additions & 0 deletions src/js/OT.coffee
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,3 +59,6 @@ window.addEventListener "orientationchange", (->
), 1000
return
), false
document.addEventListener "ondeviceready", (->
Cordova.exec(TBSuccess, TBError, OTPlugin, "hasStatusBarPlugin", [window.hasOwnProperty("StatusBar")] )
), false
64 changes: 34 additions & 30 deletions src/js/OTHelpers.coffee
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,35 +7,25 @@ streamElements = {} # keep track of DOM elements for each stream
#
# Helper methods
#
getPosition = (divName) ->
getPosition = (pubDiv) ->
# Get the position of element
pubDiv = document.getElementById(divName)
if !pubDiv then return {}
computedStyle = if window.getComputedStyle then getComputedStyle(pubDiv, null) else {}
width = pubDiv.offsetWidth
height = pubDiv.offsetHeight
curtop = pubDiv.offsetTop
curleft = pubDiv.offsetLeft
while(pubDiv = pubDiv.offsetParent)
curleft += pubDiv.offsetLeft
curtop += pubDiv.offsetTop
return {
top:curtop
left:curleft
width:width
height:height
}

replaceWithVideoStream = (divName, streamId, properties) ->
return pubDiv.getBoundingClientRect()

replaceWithVideoStream = (element, streamId, properties) ->
typeClass = if streamId == PublisherStreamId then PublisherTypeClass else SubscriberTypeClass
element = document.getElementById(divName)
element.setAttribute( "class", "OT_root #{typeClass}" )
element.setAttribute( "data-streamid", streamId )
element.style.width = properties.width+"px"
element.style.height = properties.height+"px"
element.style.overflow = "hidden"
element.style['background-color'] = "#000000"
streamElements[ streamId ] = element
if (properties.insertMode == "replace")
newElement = element
else
newElement = document.createElement( "div" )
newElement.setAttribute( "class", "OT_root #{typeClass}" )
newElement.setAttribute( "data-streamid", streamId )
newElement.setAttribute( "data-insertMode", properties.insertMode )
newElement.style.width = properties.width+"px"
newElement.style.height = properties.height+"px"
newElement.style.overflow = "hidden"
newElement.style['background-color'] = "#000000"
streamElements[ streamId ] = newElement

internalDiv = document.createElement( "div" )
internalDiv.setAttribute( "class", VideoContainerClass)
Expand All @@ -50,8 +40,15 @@ replaceWithVideoStream = (divName, streamId, properties) ->
# todo: js change styles or append css stylesheets? Concern: users will not be able to change via css

internalDiv.appendChild( videoElement )
element.appendChild( internalDiv )
return element
newElement.appendChild( internalDiv )

if (properties.insertMode == "append")
element.appendChild(newElement)
if (properties.insertMode == "before")
element.parentNode.insertBefore(newElement, element)
if (properties.insertMode == "after")
element.parentNode.insertBefore(newElement, element.nextSibling)
return newElement

TBError = (error) ->
console.log("Error: ", error)
Expand All @@ -76,8 +73,7 @@ TBUpdateObjects = ()->
console.log("JS: Object updated")
streamId = e.dataset.streamid
console.log("JS sessionId: " + streamId )
id = e.id
position = getPosition(id)
position = getPosition(e)
Cordova.exec(TBSuccess, TBError, OTPlugin, "updateView", [streamId, position.top, position.left, position.width, position.height, TBGetZIndex(e), ratios.widthRatio, ratios.heightRatio] )
return
TBGenerateDomHelper = ->
Expand Down Expand Up @@ -123,3 +119,11 @@ OTReplacePublisher = ()->

pdebug = (msg, data) ->
console.log "JS Lib: #{msg} - ", data

OTOnScrollEvent = (e) ->
target = e.target;
videos = target.querySelectorAll('[data-streamid]')
if(videos)
for video in videos
position = getPosition(video)
Cordova.exec(TBSuccess, TBError, OTPlugin, "updateCamera", [video.getAttribute('data-streamid'), position.top, position.left, position.width, position.height] )
Loading

0 comments on commit 309cb62

Please sign in to comment.