mirror of
https://github.com/DerTyp7/react-teamspeak-remote-app-api.git
synced 2025-10-29 12:52:13 +01:00
update readme
This commit is contained in:
284
README.md
284
README.md
@@ -1,27 +1,269 @@
|
||||
# React + TypeScript + Vite
|
||||
# React TeamSpeak5 RemoteApp API
|
||||
|
||||
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
|
||||
This is a ReactJS hook for the TeamSpeak5 RemoteApp API.
|
||||
|
||||
Currently, two official plugins are available:
|
||||
It gathers all the events and methods from the API and makes them available as React states.
|
||||
|
||||
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
|
||||
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
|
||||
## Installation
|
||||
|
||||
## Expanding the ESLint configuration
|
||||
|
||||
If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
|
||||
|
||||
- Configure the top-level `parserOptions` property like this:
|
||||
|
||||
```js
|
||||
parserOptions: {
|
||||
ecmaVersion: 'latest',
|
||||
sourceType: 'module',
|
||||
project: ['./tsconfig.json', './tsconfig.node.json'],
|
||||
tsconfigRootDir: __dirname,
|
||||
},
|
||||
```bash
|
||||
npm install react-ts5-remote-app-api
|
||||
```
|
||||
|
||||
- Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked`
|
||||
- Optionally add `plugin:@typescript-eslint/stylistic-type-checked`
|
||||
- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list
|
||||
## Usage
|
||||
|
||||
```Typescript
|
||||
import useTSRemoteApp, { IClient } from "react-ts5-remote-app-api";
|
||||
|
||||
export default function App() {
|
||||
const {
|
||||
clients,
|
||||
channels,
|
||||
connections,
|
||||
activeConnectionId,
|
||||
currentConnection,
|
||||
currentChannel,
|
||||
currentClient,
|
||||
clientsInChannel,
|
||||
} = useTSRemoteApp({
|
||||
remoteAppPort: 5899
|
||||
});
|
||||
|
||||
...
|
||||
}
|
||||
```
|
||||
|
||||
## Examples
|
||||
|
||||
### Get all clients in the current channel
|
||||
|
||||
```Typescript
|
||||
import useTSRemoteApp, { IClient } from "react-ts5-remote-app-api";
|
||||
|
||||
default function App() {
|
||||
const { clientsInChannel } = useTSRemoteApp({
|
||||
remoteAppPort: 5899,
|
||||
});
|
||||
|
||||
return (
|
||||
<div className="App">
|
||||
{clientsInChannel.map((client) => {
|
||||
return <div key={client.id}>{client.properties.nickname}</div>;
|
||||
})}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
## Types
|
||||
|
||||
The types are based on the TeamSpeak5 message types.
|
||||
|
||||
### IConnection
|
||||
|
||||
```Typescript
|
||||
interface IConnection {
|
||||
channelInfos?: IChannelInfos;
|
||||
clientId: number;
|
||||
clientInfos?: IClientInfo[];
|
||||
id: number;
|
||||
properties?: IServerProperties;
|
||||
}
|
||||
|
||||
interface IServerProperties {
|
||||
antiFloodPointsNeededCommandBlock: number;
|
||||
antiFloodPointsNeededIpBlock: number;
|
||||
antiFloodPointsNeededPluginBlock: number;
|
||||
antiFloodPointsTickReduce: number;
|
||||
askForPrivilegeKeyAfterNickname: boolean;
|
||||
askForPrivilegeKeyForChannelCreation: boolean;
|
||||
askForPrivilegeKeyForModify: boolean;
|
||||
awayMessage: string;
|
||||
badges: string;
|
||||
channelGroupId: string;
|
||||
channelGroupInheritedChannelId: string;
|
||||
clientType: number;
|
||||
connectionBandwidthReceived: number;
|
||||
connectionBandwidthSent: number;
|
||||
connectionClientIp: string;
|
||||
connectionConnectedTime: number;
|
||||
connectionFiletransferBandwidthReceived: number;
|
||||
connectionFiletransferBandwidthSent: number;
|
||||
connectionPacketloss: number;
|
||||
connectionPing: number;
|
||||
connectionPacketsReceived: number;
|
||||
connectionPacketsSent: number;
|
||||
connectionPort: number;
|
||||
connectionQueryBandwidthReceived: number;
|
||||
connectionQueryBandwidthSent: number;
|
||||
connectionServerIp: string;
|
||||
connectionServerPort: number;
|
||||
connectionThrottleBandwidthReceived: number;
|
||||
connectionThrottleBandwidthSent: number;
|
||||
country: string;
|
||||
created: number;
|
||||
defaultChannel: string;
|
||||
defaultChannelPassword: string;
|
||||
defaultServerGroup: string;
|
||||
defaultToken: string;
|
||||
flagAvatar: string;
|
||||
iconId: number;
|
||||
inputHardware: boolean;
|
||||
inputMuted: boolean;
|
||||
isChannelCommander: boolean;
|
||||
isMuted: boolean;
|
||||
isPrioritySpeaker: boolean;
|
||||
isRecording: boolean;
|
||||
isTalker: boolean;
|
||||
isTts: boolean;
|
||||
metaData: string;
|
||||
monthBytesDownloaded: number;
|
||||
monthBytesUploaded: number;
|
||||
myteamspeakAvatar: string;
|
||||
myteamspeakId: string;
|
||||
neededServerQueryViewPower: number;
|
||||
nickname: string;
|
||||
nicknamePhonetic: string;
|
||||
outputHardware: boolean;
|
||||
outputMuted: boolean;
|
||||
outputOnlyMuted: boolean;
|
||||
permissionHints: number;
|
||||
platform: string;
|
||||
serverPassword: string;
|
||||
signedBadges: string;
|
||||
talkPower: number;
|
||||
talkRequest: number;
|
||||
talkRequestMsg: string;
|
||||
totalBytesDownloaded: number;
|
||||
totalBytesUploaded: number;
|
||||
totalConnections: number;
|
||||
type: number;
|
||||
uniqueIdentifier: string;
|
||||
unreadMessages: number;
|
||||
userTag: string;
|
||||
version: string;
|
||||
volumeModificator: number;
|
||||
}
|
||||
```
|
||||
|
||||
### IChannel
|
||||
|
||||
```Typescript
|
||||
interface IChannel {
|
||||
id: number;
|
||||
connection: IConnection;
|
||||
order: string;
|
||||
parentId: string;
|
||||
properties: IChannelProperties;
|
||||
}
|
||||
|
||||
interface IChannelProperties {
|
||||
bannerGfxUrl: string;
|
||||
bannerMode: number;
|
||||
codec: number;
|
||||
codecIsUnencrypted: boolean;
|
||||
codecLatencyFactor: number;
|
||||
codecQuality: number;
|
||||
deleteDelay: number;
|
||||
description: string;
|
||||
flagAreSubscribed: boolean;
|
||||
flagDefault: boolean;
|
||||
flagMaxclientsUnlimited: boolean;
|
||||
flagMaxfamilyclientsInherited: boolean;
|
||||
flagMaxfamilyclientsUnlimited: boolean;
|
||||
flagPassword: boolean;
|
||||
flagPermanent: boolean;
|
||||
flagSemiPermanent: boolean;
|
||||
forcedSilence: boolean;
|
||||
iconId: number;
|
||||
maxclients: number;
|
||||
maxfamilyclients: number;
|
||||
name: string;
|
||||
namePhonetic: string;
|
||||
neededTalkPower: number;
|
||||
order: string;
|
||||
permissionHints: number;
|
||||
storageQuota: number;
|
||||
topic: string;
|
||||
uniqueIdentifier: string;
|
||||
}
|
||||
```
|
||||
|
||||
### IClient
|
||||
|
||||
```Typescript
|
||||
interface IClient {
|
||||
id: number;
|
||||
talkStatus: number;
|
||||
channel: IChannel;
|
||||
properties: IClientProperties;
|
||||
}
|
||||
|
||||
interface IChannelInfos {
|
||||
rootChannels: IChannel[];
|
||||
subChannels: { [key: number]: IChannel[] };
|
||||
}
|
||||
|
||||
interface IClientInfo {
|
||||
channelId: number;
|
||||
id: number;
|
||||
properties: IClientProperties;
|
||||
}
|
||||
|
||||
interface IClientProperties {
|
||||
away: boolean;
|
||||
awayMessage: string;
|
||||
badges: string;
|
||||
channelGroupId: string;
|
||||
channelGroupInheritedChannelId: string;
|
||||
country: string;
|
||||
created: number;
|
||||
databaseId: string;
|
||||
defaultChannel: string;
|
||||
defaultChannelPassword: string;
|
||||
defaultToken: string;
|
||||
description: string;
|
||||
flagAvatar: string;
|
||||
flagTalking: boolean;
|
||||
iconId: number;
|
||||
idleTime: number;
|
||||
inputDeactivated: boolean;
|
||||
inputHardware: boolean;
|
||||
inputMuted: boolean;
|
||||
integrations: string;
|
||||
isChannelCommander: boolean;
|
||||
isMuted: boolean;
|
||||
isPrioritySpeaker: boolean;
|
||||
isRecording: boolean;
|
||||
isTalker: boolean;
|
||||
lastConnected: number;
|
||||
metaData: string;
|
||||
monthBytesDownloaded: number;
|
||||
monthBytesUploaded: number;
|
||||
myteamspeakAvatar: string;
|
||||
myteamspeakId: string;
|
||||
neededServerQueryViewPower: number;
|
||||
nickname: string;
|
||||
nicknamePhonetic: string;
|
||||
outputHardware: boolean;
|
||||
outputMuted: boolean;
|
||||
outputOnlyMuted: boolean;
|
||||
permissionHints: number;
|
||||
platform: string;
|
||||
serverGroups: string;
|
||||
serverPassword: string;
|
||||
signedBadges: string;
|
||||
talkPower: number;
|
||||
talkRequest: number;
|
||||
talkRequestMsg: string;
|
||||
totalBytesDownloaded: number;
|
||||
totalBytesUploaded: number;
|
||||
totalConnections: number;
|
||||
type: number;
|
||||
uniqueIdentifier: string;
|
||||
unreadMessages: number;
|
||||
userTag: string;
|
||||
version: string;
|
||||
volumeModificator: number;
|
||||
}
|
||||
```
|
||||
|
||||
Reference in New Issue
Block a user