live-cat-library
v0.6.3
Published
This is a component library for [3DCAT](https://www.3dcat.live/)
Downloads
313
Maintainers
Readme
live-cat-library
This is a component library for 3DCAT
live-cat Launcher
Features:
- [x] LauncherUI
- [x] LauncherPrivateUI
- [x] Loading Component
- [x] ImeSwitchComponent
- [x] FakeImeInputComponent
- [x] KeepActiveHelper
Technologies
- live-cat v1.1.8
- Svelte v3.57.0
- Rollup v2.78.0
- Typescript v4.9.5
quick start
instantiation parameter
interface BaseOptionsType {
address: string; // address
appId?: string; // appId
appKey?: string; // appKey
appSecret?: string; // appSecret
startType?: StartType;
castScreenMaxQty?: number;
castScreenNickname?: string;
castScreenPwd?: string;
isCastScreenMaster?: boolean;
serverIp?: string; //for coturn server
joinType?: ScreenJoinType; //only screen
optionalParam?: string; // command line parameters
exeParameter?: string; // command line parameters for privatization
enableVirtualCamera?: boolean; // setup camera enable
}
Options detail to see live-cat
type UIOptions = Options & loadingOptions & ExtendUIOptions;
interface loadingOptions {
loadingImage: string | HTMLImageElement;
loadingBgImage: { portrait: string; landscape: string };
loadingBarImage: string | HTMLImageElement;
showDefaultLoading: boolean;
showFakePercent: boolean;
phaseChanged: boolean;
percentChanged: boolean;
}
interface ExtendUIOptions {
onChange: (cb: OnChange) => void;
onQueue: (rank: number) => void;
onLoadingError: (err: LoadingError) => void;
onTaskId: (taskId: number) => void;
onShowUserList: (showCastScreenUsers: boolean) => void;
onRunningOptions: (opt: OnRunningOptions) => void;
}
interface OnChange {
phase: Phase;
fakePercent: number;
deltaTime: number;
}
type Phase =
| 'initial'
| 'signaling-connected'
| 'node-ready'
| 'end-candidate'
| 'peer-connection-connected'
| 'data-channel-open'
| 'streaming-ready'
| 'loaded-metadata'
| 'streaming-playing';
interface LoadingError {
code: number | string;
type: 'app' | 'task' | 'connection' | 'reConnection';
reason: string | ErrorState;
}
type ErrorState = 'disconnect' | 'afk' | 'kick' | 'hangup';
interface OnRunningOptions {
token: string;
coturns: RTCIceServer[];
signaling: string;
}
enum StartType {
NormalMode = 1,
ScreenMode = 3,
}
enum ScreenJoinType {
Secret = 1,
Link,
}
//when terminal is ios and wechat
onPhaseChange: (phase: Phase, deltaTime: number) => {
if (phase === 'data-channel-open') {
/* NOTE: Autoplay video need user activation gesture
* @see https://html.spec.whatwg.org/multipage/interaction.html#user-activation-processing-model
*/
someTriggerElement.addEventListener('click', () =>
launcher?.launcherBase?.resumeVideoStream(),
);
}
};
//Microphone
//Start capture audio to node
onPhaseChange: (phase: Phase, deltaTime: number) => {
if (phase === 'data-channel-open') {
launcher?.launcherBase?.openMicrophone();
}
};
//Stop
launcher?.launcherBase?.closeMicrophone();
//Camera
const baseOptionsType = {
address: 'xxxx',
appKey: 'xxxx',
startType: 1,
enableVirtualCamera: true,
};
let launcher = new LauncherUI(baseOptionsType, container);
//Start capture video to node
onPhaseChange: (phase: Phase, deltaTime: number) => {
if (phase === 'data-channel-open') {
launcher?.launcherBase?.openCamera();
}
};
//Stop
launcher?.launcherBase?.closeCamera();
// Public Cloud
import { LauncherUI } from 'live-cat-library';
const container = document.querySelector('body');
document.querySelector('body').style.width = '100%';
document.querySelector('body').style.height = '100%';
const baseOptionsType = {
address: 'https://app.3dcat.live',
appKey: 'xxxx',
startType: 1,
};
const uiOptions = {
loadingImage: '',
};
let launcher = new LauncherUI(baseOptionsType, container, uiOptions);
window.addEventListener('DOMContentLoaded', () => {
if (
navigator.userAgent.includes('miniProgram') ||
navigator.userAgent.includes('MicroMessenger')
) {
//wechat
document.addEventListener('WeixinJSBridgeReady', bootstrap, false);
} else {
bootstrap();
}
});
// Private Cloud
import { LauncherPrivateUI } from 'live-cat-library';
const container = document.querySelector('body');
document.querySelector('body').style.width = '100%';
document.querySelector('body').style.height = '100%';
const baseOptionsType = {
address: 'xxxxx',
appKey: 'xxxx',
startType: 1,
};
const uiOptions = {
loadingImage: '',
};
let launcher = new LauncherPrivateUI(baseOptionsType, container, uiOptions);
window.addEventListener('DOMContentLoaded', () => {
if (
navigator.userAgent.includes('miniProgram') ||
navigator.userAgent.includes('MicroMessenger')
) {
//wechat
document.addEventListener('WeixinJSBridgeReady', bootstrap, false);
} else {
bootstrap();
}
});
License
MIT