README
zipcan-video
To implement Zipcan video chat into your website or application, sign up for an account at https://zipcan.com, then follow the steps to embed video with this package.
This webcomponent follows the open-wc recommendation.
Installation with npm
npm i zipcan-video
Usage with Vanilla JS
Install the package, then copy the file node_modules/zipcan-video/dist/zipcan-video.js
to your project folder and import it into your HTML:
<script src="./PROJECT_FOLDER/zipcan-video.js"></script>
<zipcan-video token="VIDEO_TOKEN" [options]></zipcan-video>
Usage for React, Angular and other frameworks
import "zipcan-video/zipcan-video.js";
<zipcan-video token="VIDEO_TOKEN" [options]></zipcan-video>
Options
token
Use the token shown in the code under the Advanced Embed option in the Zipcan admin.
is-popup
Set this to 'true' to automatically show a button, affixed on screen, that pops up the video when clicked.
If set to 'false' the <zipcan-video>
component can be placed anywhere in your HTML.
width
iFrame width if is-popup=false Popup width if is-popup=true
height
iFrame height if is-popup=false Popup height if is-popup=true
id
Pass any unique ID into this option to start a unique chat room. For example, you could use a property in your web app or generate a UUID. Anyone with access to the video component using same ID can join.
name
Pass any user name into this option to auto-populate the Name field for users in the lobby. For example, you could use a username or credential property in your web app.
host-token
Use the Host Token to grant a specific user host privileges for a room. The token is specific to a chat space. It can be found under Embed Options in the chat space Settings panel in the Zipcan Admin Console.