Weave video chat into your web ( and now mobile! ) application.
Make sure 'use automatic reference counting' is not selected when you create the project.
Before you proceed, make sure you have run the application and 'www' is linked in your project. If not, please look at the Cordova docs again!
The Easiest way is to do this: take a working Opentok app and clone Opentok Framework and all the dependencies to your project. Here's how to do that.
-
Clone from https://github.com/opentok/OpenTok-iOS-Hello-World.git and open the Hello-World xcode project.
Be sure to git clone with --recursive to grab the required OpenTok iOS SDK submodule!
git clone --recursive https://github.com/opentok/OpenTok-iOS-Hello-World.git
-
Drag the Opentok.framework and all dependencies from Hello-World in xcode into your project's Frameworks folder.
Make sureCopy items into destination group's folder
is not selected
-
click on your project in Project Manager and select Build Settings
Make sure Standard (armv7) is selected for Architectures
Make sure armv7 is the ONLY option selected for Valid ArchitecturesSometimes xcode doesn't update immediately. Click outside on the white box and your change will appear!
Note When testing, please run your app in your device, NOT the simulator. Opentok SDK require access to camera, and simulator does not have camera and will therefore give you errors.
-
Copy
OpentokPlugin.h
,OpentokPlugin.m
,OpentokStreamInfo.h
, andOpentokStreamInfo.h
into your Classes folder
Make sure
Copy items into destination group's folder
is selected
-
Copy
Opentok.iOS.js
into yourwww
folder, the file will automatically appear in your xcode project manager
-
In project manager, under
Supporting Files
folder, selectCordova.plist
Under
Plugins
, add a new entry:Tokbox
,OpentokPlugin
Make sure your drag your entry to the bottom. Sometimes, the entry does not update immediately. Click on another file, then click on plist again.
All your editing will be done in your www folder.
To use the opentok library, make sure you include Opentok.iOS.js file in your HTML document.
<script type="text/javascript" charset="utf-8" src="Opentok.iOS.js"></script>
For smoother experience with video, you should prevent dragging. Uncomment the following lines in the HTML:
function preventBehavior(e)
{
e.preventDefault();
};
document.addEventListener("touchmove", preventBehavior, false);
All code should be written in onDeviceReady
function because it is executed after all the devices/libraries DOM has loaded.
function onDeviceReady()
{
// do your thing!
}
Go through our 15 minute tutorial! After that, try implementing the same thing on your cordova app.
Included in the repo is a sample.html that you can copy/paste that is modeled after the getting started tutorial. Have Fun!
Copyright (c) 2012 TokBox, Inc.
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
The software complies with Terms of Service for the OpenTok platform described in http://www.tokbox.com/termsofservice
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.