@arcware-cloud/pixelstreaming-websdk 0.1.0-beta → 0.1.1-beta
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +108 -131
- package/index.cjs.js +3 -3
- package/index.esm.js +3 -3
- package/index.umd.js +3 -3
- package/package.json +1 -1
- package/types/lib/ArcwareApplication.d.ts +12 -0
- package/types/lib/ArcwareConfig.d.ts +3 -1
- package/types/lib/ArcwareInit.d.ts +15 -0
- package/types/lib/ArcwarePixelStreaming.d.ts +9 -0
- package/types/lib/MessageTypes.d.ts +4 -0
- package/types/lib/domain/ArcwareSettingsSchema.d.ts +17 -4
- package/types/lib/domain/ConnectionIdentifier.d.ts +27 -0
- package/types/lib/index.d.ts +2 -0
- package/types/lib/ui/StopButton/index.d.ts +12 -0
- package/types/lib/ui/StopIcon/index.d.ts +5 -0
- package/types/shared/lib/Messages/Version.d.ts +12 -0
- package/types/shared/lib/Messages/index.d.ts +1 -0
package/README.md
CHANGED
|
@@ -1,70 +1,138 @@
|
|
|
1
|
-
#
|
|
1
|
+
# Arcware CloudRT Pixel Streaming WebSDK
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
## Introduction
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
Welcome to the `@arcware-cloud/pixelstreaming-websdk`, a robust solution tailored for integrating Unreal Engine's Pixel Streaming technology into web applications via Arcware CloudRT. This SDK is an extension of Epic Games' "PixelStreamingInfrastructure", enriching it with functionalities specifically designed for Arcware CloudRT. It empowers developers to deliver interactive 3D experiences of exceptional quality directly to modern web browsers, eliminating the need for any plugins or downloads.
|
|
6
6
|
|
|
7
|
-
|
|
7
|
+
If you are not familiar with Arcware CloudRT yet, check it out on [www.arcware.com](https://arcware.com/cloudrt).
|
|
8
8
|
|
|
9
|
-
|
|
9
|
+
The WebSDK is designed to bring immersive experiences, similar to those found in native applications, to the web. It's enabled for a range of applications, from gaming and architectural visualization to interactive training. Bringing high quality real-time and ensures a seamless user experience.
|
|
10
10
|
|
|
11
|
-
|
|
12
|
-
- Access to Unreal Engine's Pixel Streaming setup.
|
|
13
|
-
- A web application where you wish to implement the SDK.
|
|
11
|
+
This README offers an initial guide to integrating the WebSDK into your application. For comprehensive instructions, including setup, configuration, advanced features, and best practices, please refer to our detailed documentation: [Arcware Pixel Streaming WebSDK Documentation](https://docs.arcware.cloud/web-integration/web-sdk-plugin).
|
|
14
12
|
|
|
15
|
-
|
|
13
|
+
For an in-depth understanding of the underlying technology and infrastructure, you can explore the original "PixelStreamingInfrastructure" repository by Epic Games on GitHub: [EpicGames/PixelStreamingInfrastructure](https://github.com/EpicGames/PixelStreamingInfrastructure).
|
|
16
14
|
|
|
17
|
-
|
|
15
|
+
## Getting Started
|
|
18
16
|
|
|
19
|
-
|
|
17
|
+
### Prerequisites
|
|
20
18
|
|
|
21
|
-
|
|
19
|
+
Before integrating the `@arcware-cloud/pixelstreaming-websdk` into your project, please ensure the following prerequisites are met:
|
|
22
20
|
|
|
23
|
-
|
|
21
|
+
1. **Share ID**: You must have a valid Share ID set up for your project. This ID is crucial for establishing the connection between your application and the Arcware CloudRT pixel streaming service. If you need assistance in setting up your Share ID, please refer to our detailed guide: [Setting up Share ID](https://docs.arcware.cloud/cloudrt-user-portal/getting-started/07.-preview-and-share-the-stream#share-your-project).
|
|
24
22
|
|
|
25
|
-
|
|
23
|
+
2. **Web Application Development Environment**: Ensure that your web application development environment is set up with either `yarn` or `npm`. These package managers are required for installing the WebSDK.
|
|
26
24
|
|
|
27
|
-
|
|
25
|
+
3. **TypeScript Recommendation**: While the SDK can be used with JavaScript, we strongly recommend using TypeScript in your development process. TypeScript offers enhanced code quality, readability, and will provide you with more intrinsic information during development, often surpassing what traditional documentation can offer.
|
|
28
26
|
|
|
29
|
-
Import the necessary classes from the SDK and create a new `ArcwareConfig` object to configure your Pixel Streaming instance.
|
|
30
27
|
|
|
31
|
-
import { ArcwareConfig, ArcwarePixelStreaming } from "@arcware-cloud/pixelstreaming-websdk";
|
|
32
28
|
|
|
33
|
-
|
|
34
|
-
useUrlParams: false,
|
|
35
|
-
initialSettings: {
|
|
36
|
-
// Your initial settings here
|
|
37
|
-
},
|
|
38
|
-
settings: {
|
|
39
|
-
// Your custom settings here
|
|
40
|
-
},
|
|
41
|
-
});`
|
|
29
|
+
### Installation
|
|
42
30
|
|
|
43
|
-
|
|
31
|
+
To integrate the Arcware CloudRT Pixel Streaming WebSDK into your project, you can use either npm or yarn. Run one of the following commands in your project directory:
|
|
44
32
|
|
|
45
|
-
|
|
33
|
+
```bash
|
|
34
|
+
npm install @arcware-cloud/pixelstreaming-websdk --save
|
|
35
|
+
```
|
|
36
|
+
```bash
|
|
37
|
+
yarn add @arcware-cloud/pixelstreaming-websdk
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
We recommend keeping the WebSDK up to date to ensure you have the latest features and bug fixes. Regularly check for and install updates.
|
|
41
|
+
|
|
42
|
+
### Basic Usage
|
|
43
|
+
Below is a simple example demonstrating how to use the WebSDK in an HTML file to set up pixel streaming. This example imports the SDK and initializes it with a share ID and initial settings. It then attaches the streaming application to a div element in your HTML.
|
|
44
|
+
```html
|
|
45
|
+
<html>
|
|
46
|
+
<head>
|
|
47
|
+
<title>Arcware CloudRT - Pixel Streaming</title>
|
|
48
|
+
<script type="module">
|
|
49
|
+
import * as PixelStreamingWebSdkCore from "https://unpkg.com/@arcware-cloud/pixelstreaming-websdk@latest/index.esm.js";
|
|
50
|
+
|
|
51
|
+
const { ArcwareInit } = PixelStreamingWebSdkCore;
|
|
52
|
+
|
|
53
|
+
const { Config, PixelStreaming, Application } = ArcwareInit(
|
|
54
|
+
{
|
|
55
|
+
// Replace with your actual share ID
|
|
56
|
+
shareId: "share-0be4620b-77aa-42b1-98cb-f7ee61be443?",
|
|
57
|
+
},
|
|
58
|
+
{
|
|
59
|
+
initialSettings: {
|
|
60
|
+
AutoConnect: false
|
|
61
|
+
// additional initial settings
|
|
62
|
+
},
|
|
63
|
+
settings: {
|
|
64
|
+
// additional settings
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
);
|
|
68
|
+
|
|
69
|
+
document.getElementById("videoContainer").appendChild(Application.rootElement);
|
|
70
|
+
</script>
|
|
71
|
+
</head>
|
|
72
|
+
<body>
|
|
73
|
+
<div id="videoContainer" style="height: 1000px; width: 1000px;"></div>
|
|
74
|
+
</body>
|
|
75
|
+
</html>
|
|
76
|
+
```
|
|
77
|
+
|
|
78
|
+
For more detailed examples and advanced usage, please refer to our documentation: [Arcware CloudRT Pixelstreaming WebSDK Documentation](https://docs.arcware.cloud/web-integration/web-sdk-plugin).
|
|
79
|
+
|
|
80
|
+
|
|
81
|
+
# Changelog
|
|
82
|
+
|
|
83
|
+
### 0.1.* (Initial Release)
|
|
84
|
+
<!-- - Upcoming changes or improvements that are currently in development can be listed here.
|
|
85
|
+
|
|
86
|
+
### [Version Number] - Release Date
|
|
87
|
+
|
|
88
|
+
#### Added
|
|
89
|
+
- List of new features or additions to the WebSDK in this release.
|
|
90
|
+
|
|
91
|
+
#### Changed
|
|
92
|
+
- Updates to existing features or overall improvements to the WebSDK.
|
|
93
|
+
|
|
94
|
+
#### Deprecated
|
|
95
|
+
- Features that are planned to be removed in future releases.
|
|
46
96
|
|
|
47
|
-
|
|
97
|
+
#### Removed
|
|
98
|
+
- Features or functionalities that have been removed from the WebSDK.
|
|
48
99
|
|
|
49
|
-
|
|
100
|
+
#### Fixed
|
|
101
|
+
- Bug fixes and corrections made in this release.
|
|
50
102
|
|
|
51
|
-
|
|
103
|
+
### [Previous Version Number] - Previous Release Date
|
|
104
|
+
- Changes for previous versions follow the same format. -->
|
|
52
105
|
|
|
53
|
-
document.getElementById('your-container-id').appendChild(pixelStreamingInstance.rootElement);
|
|
54
106
|
|
|
55
|
-
|
|
107
|
+
# LICENSE
|
|
108
|
+
|
|
109
|
+
MIT License
|
|
110
|
+
|
|
111
|
+
Copyright 2023 Arcware GmbH
|
|
112
|
+
|
|
113
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
|
114
|
+
|
|
115
|
+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
|
116
|
+
|
|
117
|
+
THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
|
118
|
+
|
|
119
|
+
## Dependency Licenses
|
|
56
120
|
|
|
57
|
-
|
|
121
|
+
This software inherits code from several other libraries, namely:
|
|
58
122
|
|
|
59
|
-
|
|
123
|
+
- [zod](https://github.com/colinhacks/zod/blob/master/LICENSE)
|
|
124
|
+
- [moment.js](https://github.com/moment/moment/blob/develop/LICENSE)
|
|
125
|
+
- [loadash](https://github.com/lodash/lodash/blob/main/LICENSE)
|
|
126
|
+
- [lottie-web](https://github.com/airbnb/lottie-web/blob/master/LICENSE.md)
|
|
127
|
+
- [@epicgames-ps/lib-pixelstreamingfrontend-ue5.2](https://github.com/EpicGames/PixelStreamingInfrastructure/blob/master/LICENSE.md)
|
|
128
|
+
- [@epicgames-ps/lib-pixelstreamingfrontend-ui-ue5.2](https://github.com/EpicGames/PixelStreamingInfrastructure/blob/master/LICENSE.md)
|
|
60
129
|
|
|
61
|
-
|
|
130
|
+
Here's a summary of these [Dependency Licenses](DEPENDENCY_LICENSE.md).
|
|
62
131
|
|
|
63
|
-
|
|
132
|
+
We appreciate the contributions of these libraries, as they are essential in supporting our development efforts.
|
|
64
133
|
|
|
65
|
-
Below, we'll explain the configuration options and initialization process based on the provided React code example.
|
|
66
134
|
|
|
67
|
-
|
|
135
|
+
<!-- # Configuration Options
|
|
68
136
|
|
|
69
137
|
When creating a new instance of `ArcwareConfig`, you provide an object with two main properties: `initialSettings` and `settings`.
|
|
70
138
|
|
|
@@ -110,95 +178,4 @@ Once initialized, `pixelStreamingInstance` can be used to interact with the stre
|
|
|
110
178
|
});
|
|
111
179
|
|
|
112
180
|
- ` application.getApplicationResponse(``string``) `: This method can be called to get a response from the application, which might include status updates or other messages.
|
|
113
|
-
- `application.emitUIInteraction(descriptor:` ` object | string``) `: This method allows you to send UI interaction events to the streaming application, such as button presses or command inputs.
|
|
114
|
-
|
|
115
|
-
# Implementation Examples
|
|
116
|
-
|
|
117
|
-
## Plain HTML
|
|
118
|
-
|
|
119
|
-
Please ensure in the following examples, to use
|
|
120
|
-
|
|
121
|
-
### index.esm.js (recommended)
|
|
122
|
-
|
|
123
|
-
```html
|
|
124
|
-
<html>
|
|
125
|
-
<head>
|
|
126
|
-
<title>Arcware CloudRT - Pixel Streaming</title>
|
|
127
|
-
<script type="module">
|
|
128
|
-
import * as PixelStreamingWebSdkCore from "https://unpkg.com/@arcware-cloud/pixelstreaming-websdk@0.0.2-beta/index.esm.js";
|
|
129
|
-
|
|
130
|
-
const { ArcwareConfig, ArcwarePixelStreaming, ArcwareApplication } = PixelStreamingWebSdkCore;
|
|
131
|
-
|
|
132
|
-
const application = new ArcwareApplication({
|
|
133
|
-
stream: new ArcwarePixelStreaming(
|
|
134
|
-
new ArcwareConfig({
|
|
135
|
-
useUrlParams: true,
|
|
136
|
-
initialSettings: {
|
|
137
|
-
ss: "wss://signalling-client.ragnarok.arcware.cloud/",
|
|
138
|
-
StartVideoMuted: true,
|
|
139
|
-
AutoConnect: true,
|
|
140
|
-
AutoPlayVideo: true,
|
|
141
|
-
},
|
|
142
|
-
settings: {
|
|
143
|
-
// If you figure out the last digit of the id, feel free to try :)
|
|
144
|
-
shareId: "share-0be4620b-77aa-42b1-98cb-f7ee61be443?",
|
|
145
|
-
audioButton: true,
|
|
146
|
-
fullscreenButton: true,
|
|
147
|
-
},
|
|
148
|
-
})
|
|
149
|
-
),
|
|
150
|
-
});
|
|
151
|
-
|
|
152
|
-
document.getElementById("videoContainer").appendChild(application.rootElement);
|
|
153
|
-
</script>
|
|
154
|
-
</head>
|
|
155
|
-
<body>
|
|
156
|
-
<div id="videoContainer" style="height: 1000px; width: 1000px;"></div>
|
|
157
|
-
</body>
|
|
158
|
-
</html>
|
|
159
|
-
```
|
|
160
|
-
|
|
161
|
-
### index.esm.js
|
|
162
|
-
|
|
163
|
-
```html
|
|
164
|
-
<script src="https://unpkg.com/@arcware-cloud/pixelstreaming-websdk@0.0.2-beta/index.umd.js"></script>
|
|
165
|
-
<script type="module">
|
|
166
|
-
const { ArcwareConfig, ArcwarePixelStreaming, ArcwareApplication } = window.arcware; // Module name, subject to change.
|
|
167
|
-
// Rest of the script as above (esm).
|
|
168
|
-
</script>
|
|
169
|
-
```
|
|
170
|
-
|
|
171
|
-
## Library implementation examples
|
|
172
|
-
|
|
173
|
-
### React
|
|
174
|
-
|
|
175
|
-
coming soon
|
|
176
|
-
|
|
177
|
-
### Other
|
|
178
|
-
|
|
179
|
-
coming soon
|
|
180
|
-
|
|
181
|
-
# LICENSE
|
|
182
|
-
|
|
183
|
-
MIT License
|
|
184
|
-
|
|
185
|
-
Copyright 2023 Arcware GmbH
|
|
186
|
-
|
|
187
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
|
188
|
-
|
|
189
|
-
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
|
190
|
-
|
|
191
|
-
THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
|
192
|
-
|
|
193
|
-
## Dependency Licenses
|
|
194
|
-
|
|
195
|
-
This software inherits code from several other libraries, namely:
|
|
196
|
-
|
|
197
|
-
- [zod](https://github.com/colinhacks/zod/blob/master/LICENSE)
|
|
198
|
-
- [moment.js](https://github.com/moment/moment/blob/develop/LICENSE)
|
|
199
|
-
- [loadash](https://github.com/lodash/lodash/blob/main/LICENSE)
|
|
200
|
-
- [lottie-web](https://github.com/airbnb/lottie-web/blob/master/LICENSE.md)
|
|
201
|
-
- [@epicgames-ps/lib-pixelstreamingfrontend-ue5.2](https://github.com/EpicGames/PixelStreamingInfrastructure/blob/master/LICENSE.md)
|
|
202
|
-
- [@epicgames-ps/lib-pixelstreamingfrontend-ui-ue5.2](https://github.com/EpicGames/PixelStreamingInfrastructure/blob/master/LICENSE.md)
|
|
203
|
-
|
|
204
|
-
Here's a summary of these [Dependency Licenses](DEPENDENCY_LICENSE.md).
|
|
181
|
+
- `application.emitUIInteraction(descriptor:` ` object | string``) `: This method allows you to send UI interaction events to the streaming application, such as button presses or command inputs. -->
|