# live-cat-library

> This is a component library for [3DCAT](https://www.3dcat.live/)

Latest version **1.1.7** (published 2024-12-03) · MIT license · 0 weekly downloads

## Install

```sh
npm install live-cat-library
pnpm add live-cat-library
yarn add live-cat-library
bun add live-cat-library
```

## Health

**Score 35/100 (D)** — status: maintenance-mode.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: stale; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.7 |
| Published | 2024-12-03 |
| First published | 2023-06-03 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 3 |
| Unpacked size | 1.1 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | jim |
| Maintainers | jim1874 |
| Keywords | WebRTC, 3DCAT, live-cat, live-cat-library |

## Links

- npm: https://www.npmjs.com/package/live-cat-library
- npm.io page: https://npm.io/package/live-cat-library

## Dependencies (3)

- [live-cat](https://npm.io/package/live-cat.md) ^2.1.6
- [js-base64](https://npm.io/package/js-base64.md) ^3.7.5
- [countup.js](https://npm.io/package/countup.js.md) ^2.6.0

## Recent versions

- 1.1.7 (latest) — 2024-12-03
- 1.1.6 — 2024-11-14
- 1.1.5 — 2024-11-13
- 1.1.4 — 2024-11-11
- 1.1.3 — 2024-10-25
- 1.1.2 — 2024-10-24
- 1.1.1 — 2024-10-11
- 1.1.0 — 2024-09-27
- 1.0.0 — 2024-09-13
- 0.6.12 — 2024-08-05
- 0.6.11 — 2024-08-01
- 0.6.10 — 2024-07-31
- 0.6.9 — 2024-07-30
- 0.6.8 — 2024-07-27
- 0.6.7 — 2024-06-24
- … 31 more at https://npm.io/package/live-cat-library/versions

## README

# live-cat-library

> This is a component library for [3DCAT](https://www.3dcat.live/)

# live-cat Launcher

<p align="center">
<a title="MIT" target="_blank" href="https://opensource.org/licenses/MIT"><img src="https://img.shields.io/badge/license-MIT-orange.svg?style=flat-square"></a>
<a title="npm bundle size" target="_blank" href="https://www.npmjs.com/package/live-cat"><img alt="npm bundle size" src="https://img.shields.io/bundlephobia/minzip/live-cat?style=flat-square&color=blueviolet"></a>
<a title="Version" target="_blank" href="https://www.npmjs.com/package/live-cat"><img src="https://img.shields.io/npm/v/live-cat.svg?style=flat-square"></a><br>
<a title="Downloads" target="_blank" href="https://www.npmjs.com/package/live-cat"><img src="https://img.shields.io/npm/dt/live-cat.svg?style=flat-square&color=97ca00"></a>
<a title="jsdelivr" target="_blank" href="https://www.jsdelivr.com/package/npm/live-cat"><img src="https://data.jsdelivr.com/v1/package/npm/live-cat/badge"/></a>
</p>

# 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

```typescript
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](https://www.npmjs.com/package/live-cat?activeTab=readme)

```typescript
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,
}
```

```typescript
//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', () => launcherUI?.launcher?.resumeVideoStream())
  }
}
```

```typescript
//Microphone

//Start capture audio to node
onPhaseChange: (phase: Phase, deltaTime: number) => {
  if (phase === 'data-channel-open') {
    launcherUI?.launcher?.openMicrophone()
  }
}
//Stop
launcherUI?.launcher?.closeMicrophone()
```

```typescript
//Camera
const baseOptionsType = {
  address: 'xxxx',
  appKey: 'xxxx',
  startType: 1,
  enableVirtualCamera: true,
}
let launcherUI = new LauncherUI(baseOptionsType, container)

//Start capture video to node
onPhaseChange: (phase: Phase, deltaTime: number) => {
  if (phase === 'data-channel-open') {
    launcherUI?.launcher?.openCamera()
  }
}
//Stop
launcherUI?.launcher?.closeCamera()
```

```typescript
// 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 launcherUI = 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()
  }
})
```

```typescript
// 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 launcherUI = 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

---
_Source: https://npm.io/package/live-cat-library · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._