Skip to content
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .circleci/config.yml
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ version: 2.1
defaults: &defaults
working_directory: ~/js-sdk
docker:
- image: cimg/node:16.13.1
- image: cimg/node:18.19.1

commands:
install-dependencies:
Expand Down
3 changes: 1 addition & 2 deletions .tool-versions
Original file line number Diff line number Diff line change
@@ -1,2 +1 @@
nodejs 16.13.1
npm 8.1.2
nodejs 18.19.1
43 changes: 29 additions & 14 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,54 +2,69 @@

[![CircleCI](https://circleci.com/gh/uhlive/javascript-sdk/tree/production.svg?style=svg)](https://circleci.com/gh/uhlive/javascript-sdk/tree/production)

The uh!ive JS SDK provides convenient access to the uh!ive API from applications written in the JavaScript language. Only browsers are supported, not Node.js applications.
The uh!ive JS SDK provides convenient access to the uh!ive API from
applications written in the JavaScript language. Only browsers are supported,
not Node.js applications.

Read the [documentation for the Conversation API](https://docs.allo-media.net/live-api/) and [for the Recognition API (vocal bot toolkit)](https://docs.allo-media.net/stream-api-bots/).
Read the [documentation for the Conversation
API](https://docs.allo-media.net/live-api/) and [for the Recognition API (vocal
bot toolkit)](https://docs.allo-media.net/stream-api-bots/).

## Requirements

As specified in the `.tool-versions` and `package.json` files, you need the following versions of Node and npm:
As specified in the `.tool-versions` and `package.json` files, you need the
following versions of Node and npm:

- nodejs 16.13.1
- npm 8.1.2
- nodejs 18.19.1

Note that you must have a token and an identifier to use this package.

### Installation

```text
```bash
npm install @uhlive/javascript-sdk
```

### Microphone

This SDK needs you to use a microphone as an input for audio. Importation of audio files is not supported.
This SDK needs you to use a microphone as an input for audio. Importation of
audio files is not supported.

## Usage

The easiest way to start is to run the examples provided in the `./node_modules/@uhlive/javascript-sdk/examples/` folder.
You can also find them on the [Github @uhlive/javascript-sdk repository](https://github.com/uhlive/javascript-sdk/tree/production/examples).
The easiest way to start is to run the examples provided in the
`./node_modules/@uhlive/javascript-sdk/examples/` folder.

Note that you **must** create a `settings.js` file, based on `settings.js.dist`, and change the identifier and token to match yours.
You can also find them on the [Github @uhlive/javascript-sdk
repository](https://github.com/uhlive/javascript-sdk/tree/production/examples).

Note that you **must** create a `settings.js` file, based on
`settings.js.dist`, and change the identifier and token to match yours.

Start the example:

```text
```bash
cd ./examples/basic/
npm i
npm run dev
```

It will print a local URL on which the local server is accessible.

The first time your run the example, your browser will ask for your permission to access your microphone. You must accept it for the SDK to work.
The first time your run the example, your browser will ask for your permission
to access your microphone. You must accept it for the SDK to work.

Just speak, and *voilà*!

You can find a more advanced example in `./examples/advanced/`, and go check the [documentation](https://docs.allo-media.net/live-api/javascript/getting-started/#getting-started) for more information and the [API reference](https://docs.allo-media.net/live-api/javascript/api-reference/#api-reference) for technical details.
You can find a more advanced example in `./examples/advanced/`, and go check
the
[documentation](https://docs.allo-media.net/live-api/javascript/getting-started/#getting-started)
for more information and the [API
reference](https://docs.allo-media.net/live-api/javascript/api-reference/#api-reference)
for technical details.

## Tests

```text
```bash
npm test
```
2 changes: 1 addition & 1 deletion dev/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,6 @@
"vite": "^2.7.2"
},
"dependencies": {
"keycloak-js": "^19.0.3"
"keycloak-js": "^25.0.0"
}
}
6 changes: 4 additions & 2 deletions examples/advanced/README.md
Original file line number Diff line number Diff line change
@@ -1,10 +1,12 @@
# uhlive-example-advanced

This example loads the `@uhlive/javascript-sdk` package and let you decide when to start listening. It also doesn't inject the transcript in the DOM, but let you decide what to do with it.
This example loads the `@uhlive/javascript-sdk` package and let you decide when
to start listening. It also doesn't inject the transcript in the DOM, but let
you decide what to do with it.

Try the example with:

```text
```bash
npm ci
npm run dev
```
Expand Down
2 changes: 1 addition & 1 deletion examples/advanced/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,6 @@
},
"dependencies": {
"@uhlive/javascript-sdk": "^0.19.4",
"keycloak-js": "^19.0.3"
"keycloak-js": "^25.0.0"
}
}
11 changes: 7 additions & 4 deletions examples/basic-legacy/README.md
Original file line number Diff line number Diff line change
@@ -1,10 +1,13 @@
# uhlive-example-basic

This example loads the `@uhlive/javascript-sdk` package and immediately starts to listen to your microphone and inject the transcript in the DOM.
This example loads the `@uhlive/javascript-sdk` package and immediately starts
to listen to your microphone and inject the transcript in the DOM.

This is done thanks to the presence of the `<div id="uhlive"></div>` HTML tag.
The id of the tag in which the transcript is injected can be changed with the `wrapper` option when joining a conversation:
The id of the tag in which the transcript is injected can be changed with the
`wrapper` option when joining a conversation:

```js
```javascript
const uhlive = new Uhlive("my-identifier", "my-token");
uhlive
.connect()
Expand All @@ -15,7 +18,7 @@ uhlive

Try the example with:

```text
```bash
npm ci
npm run dev
```
Expand Down
11 changes: 7 additions & 4 deletions examples/basic/README.md
Original file line number Diff line number Diff line change
@@ -1,10 +1,13 @@
# uhlive-example-basic

This example loads the `@uhlive/javascript-sdk` package and immediately starts to listen to your microphone and inject the transcript in the DOM.
This example loads the `@uhlive/javascript-sdk` package and immediately starts
to listen to your microphone and inject the transcript in the DOM.

This is done thanks to the presence of the `<div id="uhlive"></div>` HTML tag.
The id of the tag in which the transcript is injected can be changed with the `wrapper` option when joining a conversation:
The id of the tag in which the transcript is injected can be changed with the
`wrapper` option when joining a conversation:

```js
```javascript
const uhlive = new Uhlive("my-identifier", "my-token");
uhlive
.connect()
Expand All @@ -15,7 +18,7 @@ uhlive

Try the example with:

```text
```bash
npm install
npm run dev
```
Expand Down
2 changes: 1 addition & 1 deletion examples/basic/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,6 @@
},
"dependencies": {
"@uhlive/javascript-sdk": "^1.0.0-rc1",
"keycloak-js": "^19.0.3"
"keycloak-js": "^25.0.0"
}
}
Loading